/* ==========================================================================
   PrintIT Universal Light / Dark Theme Stylesheet
   ========================================================================== */

/* Universal Theme Toggle Button */
.theme-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid var(--border, rgba(255, 255, 255, 0.1));
    background: var(--glass, rgba(255, 255, 255, 0.04));
    color: var(--text, var(--text-main, #e9edef));
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
}

.theme-toggle-btn:hover {
    border-color: var(--primary, #25D366);
    color: var(--primary, #25D366);
    background: var(--glass-hover, rgba(255, 255, 255, 0.08));
    transform: translateY(-1px);
}

.theme-toggle-btn:active {
    transform: translateY(0);
}

/* ==========================================================================
   Light Mode Overrides [data-theme="light"]
   ========================================================================== */

[data-theme="light"] {
    color-scheme: light;
    
    /* Common Semantic Tokens */
    --bg: #f8fafc;
    --surface: #ffffff;
    --surface2: #f1f5f9;
    --surface-hover: #f1f5f9;
    --glass: rgba(0, 0, 0, 0.025);
    --glass-hover: rgba(0, 0, 0, 0.05);
    --glass-heavy: rgba(0, 0, 0, 0.08);
    --glass-card: rgba(255, 255, 255, 0.98);
    --border: #e2e8f0;
    --border-highlight: #cbd5e1;
    --text: #0f172a;
    --text-dim: #475569;
    --muted: #64748b;
    --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.06);

    /* Logistics Theme Tokens */
    --bg-dark: #f8fafc;
    --card-bg: #ffffff;
    --card-border: #e2e8f0;
    --text-main: #0f172a;
    --text-muted: #64748b;
}

/* Body & Base Backgrounds */
[data-theme="light"] body {
    background: #f8fafc !important;
    background-color: #f8fafc !important;
    background-image: 
        radial-gradient(circle at 10% 0%, rgba(37, 211, 102, 0.05) 0%, transparent 40%),
        radial-gradient(circle at 90% 100%, rgba(52, 183, 241, 0.05) 0%, transparent 40%) !important;
    color: #0f172a !important;
}

/* Headings & General Text */
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4,
[data-theme="light"] h5,
[data-theme="light"] h6 {
    color: #0f172a !important;
}

[data-theme="light"] p {
    color: #334155;
}

/* Headers, Sidebars & Navigation */
[data-theme="light"] header,
[data-theme="light"] .navbar {
    background: rgba(255, 255, 255, 0.95) !important;
    border-bottom: 1px solid #e2e8f0 !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
}

[data-theme="light"] .sidebar {
    background: rgba(255, 255, 255, 0.98) !important;
    border-right: 1px solid #e2e8f0 !important;
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.03) !important;
}

[data-theme="light"] .nav-item {
    color: #64748b !important;
}

[data-theme="light"] .nav-item:hover,
[data-theme="light"] .nav-item.active {
    background: rgba(37, 211, 102, 0.08) !important;
    color: #059669 !important;
}

/* Cards, Panels & Modals */
[data-theme="light"] .panel,
[data-theme="light"] .card,
[data-theme="light"] .stat-card,
[data-theme="light"] .job-card,
[data-theme="light"] .setting-card,
[data-theme="light"] .modal-content,
[data-theme="light"] .modal-box,
[data-theme="light"] .table-card,
[data-theme="light"] .horizontal-card,
[data-theme="light"] .routing-item-card,
[data-theme="light"] .panel-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
}

/* Stats Values & Labels */
[data-theme="light"] .stat-val,
[data-theme="light"] .stat-value,
[data-theme="light"] .stat-num,
[data-theme="light"] #leadStatTotal,
[data-theme="light"] #map-stat-total,
[data-theme="light"] #pending-count,
[data-theme="light"] #completed-count,
[data-theme="light"] #today-completed-count,
[data-theme="light"] #today-revenue,
[data-theme="light"] #total-revenue {
    color: #0f172a !important;
}

[data-theme="light"] .stat-label {
    color: #64748b !important;
}

/* Center Portal Job Cards & Sections */
[data-theme="light"] .job-num {
    color: #0f172a !important;
}

[data-theme="light"] .panel-title,
[data-theme="light"] .section-head h2,
[data-theme="light"] .routing-item-header,
[data-theme="light"] .agent-text h3 {
    color: #0f172a !important;
    border-bottom-color: #e2e8f0 !important;
}

[data-theme="light"] .otp-box {
    background: rgba(37, 211, 102, 0.07) !important;
    border: 1px solid rgba(37, 211, 102, 0.25) !important;
}

[data-theme="light"] .otp-code {
    color: #0f172a !important;
}

[data-theme="light"] .otp-label {
    color: #475569 !important;
}

[data-theme="light"] .api-key-box {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
}

[data-theme="light"] .api-key-label {
    color: #64748b !important;
}

[data-theme="light"] .api-key-val {
    color: #059669 !important;
}

[data-theme="light"] .spec-row {
    border-bottom: 1px dashed #e2e8f0 !important;
}

[data-theme="light"] .spec-row .spec-key {
    color: #64748b !important;
}

[data-theme="light"] .spec-row .spec-val {
    color: #0f172a !important;
}

[data-theme="light"] .capability-toggle-box {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
}

[data-theme="light"] .capability-toggle-box:hover {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}

[data-theme="light"] .capability-toggle-box span {
    color: #0f172a !important;
}

[data-theme="light"] #settlement-display,
[data-theme="light"] #center-coords-display,
[data-theme="light"] #center-wallet-available,
[data-theme="light"] #center-wallet-earned,
[data-theme="light"] #center-wallet-withdrawn,
[data-theme="light"] #modalCenterAccName,
[data-theme="light"] #modalCenterAvailBal,
[data-theme="light"] #centerSummaryRequested,
[data-theme="light"] #centerWithdrawalsTableBody td {
    color: #0f172a !important;
}

[data-theme="light"] #centerCashoutModal .modal-card {
    background: #ffffff !important;
    border-color: #e2e8f0 !important;
    box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.15) !important;
}

[data-theme="light"] #centerWithdrawalHistoryPanel table thead th {
    color: #64748b !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

[data-theme="light"] #centerWithdrawalHistoryPanel table tbody tr {
    border-bottom: 1px solid #f1f5f9 !important;
}

/* Queue Tab Switcher in Center Portal */
[data-theme="light"] .queue-tab-btn {
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    color: #64748b !important;
}

[data-theme="light"] .queue-tab-btn:hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
}

[data-theme="light"] .queue-tab-btn.active {
    background: rgba(37, 211, 102, 0.12) !important;
    border-color: #059669 !important;
    color: #059669 !important;
    box-shadow: 0 2px 10px rgba(37, 211, 102, 0.15) !important;
}

[data-theme="light"] .tab-badge {
    background: #e2e8f0 !important;
    color: #334155 !important;
}

[data-theme="light"] .queue-tab-btn.active .tab-badge {
    background: #059669 !important;
    color: #ffffff !important;
}

[data-theme="light"] .tab-badge-completed {
    background: rgba(52, 183, 241, 0.15) !important;
    color: #0284c7 !important;
}

[data-theme="light"] .queue-tab-btn.active .tab-badge-completed {
    background: #059669 !important;
    color: #ffffff !important;
}

/* Tables */
[data-theme="light"] table {
    color: #0f172a !important;
}

[data-theme="light"] table th,
[data-theme="light"] .table-header {
    background: #f8fafc !important;
    color: #334155 !important;
    border-bottom: 2px solid #e2e8f0 !important;
}

[data-theme="light"] th.sortable.sorted-asc,
[data-theme="light"] th.sortable.sorted-desc {
    color: #059669 !important;
    background: rgba(37, 211, 102, 0.08) !important;
    border-bottom-color: #059669 !important;
}

[data-theme="light"] table td {
    border-bottom: 1px solid #f1f5f9 !important;
    color: #0f172a !important;
}

[data-theme="light"] table tbody tr:hover td {
    background: #f8fafc !important;
}

/* Preserve table cells contrast */
[data-theme="light"] table td span:not(.badge):not(.status-pill):not(.status-pill-small):not([class*="color-"]):not([style*="background:#"]):not([style*="background: #"]):not([style*="background: rgb"]):not([style*="background:rgb"]) {
    color: #0f172a !important;
}

[data-theme="light"] table td strong,
[data-theme="light"] table td b {
    color: #0f172a !important;
}

/* Inputs, Selects & Textareas */
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
}

[data-theme="light"] select option {
    background-color: #ffffff !important;
    color: #0f172a !important;
}

[data-theme="light"] label {
    color: #334155 !important;
}

[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus {
    border-color: var(--primary, #25D366) !important;
    box-shadow: 0 0 0 3px rgba(37, 211, 102, 0.15) !important;
}

/* Status Pills & Indicators */
[data-theme="light"] .status-pill {
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
}

/* Badges & Secondary Elements */
[data-theme="light"] .badge,
[data-theme="light"] .chip {
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
    color: #334155 !important;
}

/* Secondary & Action Buttons in Light Mode */
[data-theme="light"] .btn-secondary,
[data-theme="light"] .btn-action {
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
}

[data-theme="light"] .btn-secondary:hover,
[data-theme="light"] .btn-action:hover {
    background: #e2e8f0 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}

[data-theme="light"] .btn-outline {
    border-color: #cbd5e1 !important;
    color: #475569 !important;
    background: transparent !important;
}

[data-theme="light"] .btn-outline:hover {
    border-color: var(--accent) !important;
    color: #0284c7 !important;
    background: rgba(52, 183, 241, 0.08) !important;
}

/* Dropdown Menus */
[data-theme="light"] .dropdown-menu,
[data-theme="light"] .tools-dropdown,
[data-theme="light"] .dropdown-content {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
    color: #0f172a !important;
}

[data-theme="light"] .dropdown-item {
    color: #334155 !important;
}

[data-theme="light"] .dropdown-item:hover {
    background: #f1f5f9 !important;
    color: #0f172a !important;
}

/* Empty State */
[data-theme="light"] .empty-state p {
    color: #64748b !important;
}

/* Universal Light Mode Fallback for Hardcoded White Text */
[data-theme="light"] [style*="color: #fff"]:not(.btn-primary):not(.btn-primary-launch):not(.btn-blue):not([style*="background: #"]):not([style*="background:#"]):not([style*="background: rgb"]):not([style*="background:rgb"]):not([style*="background: linear-gradient"]):not([style*="background:linear-gradient"]),
[data-theme="light"] [style*="color:#fff"]:not(.btn-primary):not(.btn-primary-launch):not(.btn-blue):not([style*="background: #"]):not([style*="background:#"]):not([style*="background: rgb"]):not([style*="background:rgb"]):not([style*="background: linear-gradient"]):not([style*="background:linear-gradient"]),
[data-theme="light"] [style*="color: #ffffff"]:not(.btn-primary):not(.btn-primary-launch):not(.btn-blue):not([style*="background: #"]):not([style*="background:#"]):not([style*="background: rgb"]):not([style*="background:rgb"]):not([style*="background: linear-gradient"]):not([style*="background:linear-gradient"]),
[data-theme="light"] [style*="color:#ffffff"]:not(.btn-primary):not(.btn-primary-launch):not(.btn-blue):not([style*="background: #"]):not([style*="background:#"]):not([style*="background: rgb"]):not([style*="background:rgb"]):not([style*="background: linear-gradient"]):not([style*="background:linear-gradient"]),
[data-theme="light"] [style*="color: white"]:not(.btn-primary):not(.btn-primary-launch):not(.btn-blue):not([style*="background: #"]):not([style*="background:#"]):not([style*="background: rgb"]):not([style*="background:rgb"]):not([style*="background: linear-gradient"]):not([style*="background:linear-gradient"]),
[data-theme="light"] [style*="color:white"]:not(.btn-primary):not(.btn-primary-launch):not(.btn-blue):not([style*="background: #"]):not([style*="background:#"]):not([style*="background: rgb"]):not([style*="background:rgb"]):not([style*="background: linear-gradient"]):not([style*="background:linear-gradient"]),
[data-theme="light"] [style*="color: #e9edef"]:not(.btn),
[data-theme="light"] [style*="color:#e9edef"]:not(.btn),
[data-theme="light"] [style*="color: #f8fafc"]:not(.btn),
[data-theme="light"] [style*="color:#f8fafc"]:not(.btn) {
    color: #0f172a !important;
}

/* Leaflet Map Controls in Light Mode */
[data-theme="light"] .leaflet-bar a {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border-bottom-color: #e2e8f0 !important;
}

[data-theme="light"] .leaflet-popup-content-wrapper {
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
}

[data-theme="light"] .leaflet-popup-tip {
    background: #ffffff !important;
}

/* Login Portal Light Mode Styling */
[data-theme="light"] .login-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .role-pill {
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
    color: #334155 !important;
}

[data-theme="light"] .role-pill.active {
    background: rgba(37, 211, 102, 0.12) !important;
    border-color: var(--primary, #25D366) !important;
    color: #059669 !important;
}

[data-theme="light"] .tab-btn {
    color: #64748b !important;
}

[data-theme="light"] .tab-btn.active {
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

[data-theme="light"] .auth-tabs {
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
}