/* Cars on Site – theme toggle button + light theme.
   Dark (default) is untouched: every light rule is scoped to html.theme-light. */

.theme-toggle-btn {
    width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 12px; background: #1a1a1a; border: 1px solid #444; color: #FFD700;
    font-size: 1.05rem; transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.theme-toggle-btn:hover { border-color: #FFD700; }

/* ================= LIGHT THEME ================= */
html.theme-light {
    --l-bg: #f4f5f7;
    --l-surface: #ffffff;
    --l-surface-2: #f8f9fb;
    --l-border: #e3e6eb;
    --l-border-strong: #cfd4dc;
    --l-text: #1f2328;
    --l-muted: #5f6b7a;
    --l-faint: #8a94a3;
    --l-gold: #a98000;      /* small gold text on white (clear amber, not brown) */
    --l-gold-big: #c29100;  /* large/bold gold (titles, numbers, headers) */
    --l-gold-line: #e2b400; /* borders / accents */
    --l-gold-bg: #f7c600;
    --l-shadow: 0 1px 2px rgba(16,24,40,0.05), 0 1px 3px rgba(16,24,40,0.07);
    color-scheme: light;
}
html.theme-light body { background: var(--l-bg); color: var(--l-text); }

/* Text colours */
html.theme-light .gold, html.theme-light .text-gold { color: var(--l-gold-big); }
html.theme-light .text-white { color: var(--l-text); }
html.theme-light .text-gray-400 { color: var(--l-muted); }
html.theme-light .text-gray-500 { color: var(--l-faint); }
html.theme-light .text-red-400 { color: #dc2626; }
html.theme-light .hover\:text-white:hover { color: var(--l-text); }
html.theme-light label { color: #374151; }
html.theme-light .label-bold, html.theme-light .people-label { color: var(--l-gold); }
html.theme-light .value-normal, html.theme-light .people-name { color: var(--l-text); }
html.theme-light .meta-highlight { color: var(--l-gold); }

/* Header buttons */
html.theme-light .theme-toggle-btn { background: var(--l-surface); border-color: var(--l-border-strong); color: var(--l-gold-big); box-shadow: var(--l-shadow); }
html.theme-light .theme-toggle-btn:hover { border-color: var(--l-gold); }
html.theme-light .settings-icon { background: var(--l-surface); color: var(--l-gold); border-color: var(--l-gold-line); box-shadow: var(--l-shadow); }
html.theme-light .settings-icon:hover { background: var(--l-gold-bg); color: #000; }
html.theme-light .bg-gray-800 { background: var(--l-surface); color: var(--l-text); box-shadow: var(--l-shadow); }
html.theme-light .border-gray-700 { border-color: var(--l-border); }
html.theme-light .gold-bg { box-shadow: 0 1px 3px rgba(167,123,0,0.35); }

/* Stats */
html.theme-light .stat-card { background: var(--l-surface); border-color: var(--l-border); box-shadow: var(--l-shadow); }
html.theme-light .stat-gold { border-color: var(--l-gold-line); }
html.theme-light .stat-value { color: var(--l-gold-big); }
html.theme-light .stat-label { color: var(--l-muted); }
html.theme-light .stat-card.stat-ready { border-color: #4ade80; }
html.theme-light .stat-card.stat-ready .stat-value { color: #15803d; }

/* Inputs / filters / dropdowns */
html.theme-light .form-input { background: var(--l-surface); border-color: var(--l-border-strong); color: var(--l-text); }
html.theme-light .form-input::placeholder { color: var(--l-faint); }
html.theme-light .form-input:focus { border-color: var(--l-gold-line); box-shadow: 0 0 0 3px rgba(255,215,0,0.25); }
html.theme-light .bg-\[\#1a1a1a\] { background: var(--l-surface); }
html.theme-light .border-\[\#444\] { border-color: var(--l-border-strong); }
html.theme-light .hover\:bg-\[\#222\]:hover { background: #f1f3f6; }
html.theme-light .filter-dropdown { box-shadow: 0 8px 24px rgba(16,24,40,0.12); color: var(--l-text); }
html.theme-light .btn-reset { background: #e9ecf1; color: var(--l-text); border-color: var(--l-border-strong); }
html.theme-light .btn-reset:hover { background: #dfe3e9; border-color: var(--l-gold-line); }
html.theme-light .include-unassigned { color: #374151; }
html.theme-light .include-unassigned input, html.theme-light .checkbox-row input[type="checkbox"] { accent-color: var(--l-gold-line); }

/* Quick views / presets */
html.theme-light .view-bar-label { color: var(--l-faint); }
html.theme-light .view-chip { background: var(--l-surface); border-color: var(--l-border-strong); color: #374151; }
html.theme-light .view-chip:hover { border-color: var(--l-gold-line); }
html.theme-light .view-chip-active { background: var(--l-gold-bg); color: #000; border-color: var(--l-gold-line); }
html.theme-light .view-chip-back { border-color: var(--l-gold-line); color: var(--l-gold); }
html.theme-light .preset-delete { color: #dc2626; }
html.theme-light .preset-delete:hover { color: #7f1d1d; }

/* Section headers */
html.theme-light .section-header { color: var(--l-gold); background: linear-gradient(90deg, #fff6cc 0%, #ffffff 100%); border-left-color: var(--l-gold-line); box-shadow: var(--l-shadow); }

/* Tiles */
html.theme-light .card { background: var(--l-surface); border-color: var(--l-border); box-shadow: var(--l-shadow); }
html.theme-light .card:hover { border-color: var(--l-gold-line); box-shadow: 0 4px 14px rgba(16,24,40,0.08); }
html.theme-light .card.urgent,
html.theme-light #archive-page .arch-table tbody tr.urgent { background: linear-gradient(90deg, rgba(239, 68, 68, 0.14) 0%, #ffffff 45%); border-color: var(--l-border); }
html.theme-light .card.ready-collect,
html.theme-light #archive-page .arch-table tbody tr.ready-collect { background: linear-gradient(90deg, rgba(34,197,94,0.14) 0%, #ffffff 45%); border-color: var(--l-border); }
html.theme-light .gold-divider { background: linear-gradient(to bottom, transparent, var(--l-gold-line), transparent); }
html.theme-light .status-badge { color: color-mix(in srgb, var(--sc) 60%, #000); background: color-mix(in srgb, var(--sc) 14%, #fff); border-color: color-mix(in srgb, var(--sc) 55%, #fff); }
html.theme-light .badge-onsite { background: #dcfce7; color: #166534; }
html.theme-light .badge-offsite { background: #fee2e2; color: #991b1b; }
html.theme-light .badge-parts { background: #e2e8f0; color: #1e293b; }
html.theme-light .badge-courtesy { background: #16a34a; }
html.theme-light .due-line { color: #374151; }
html.theme-light .due-line.due-amber { color: #b45309; }
html.theme-light .due-line.due-red { color: #dc2626; }
html.theme-light .edit-stamp { color: var(--l-faint); }
html.theme-light .copy-reg { color: var(--l-faint); }
html.theme-light .copy-reg:hover { color: var(--l-gold); background: #f1f3f6; }
html.theme-light .quick-select option { background: #fff; color: var(--l-text); }
html.theme-light .quick-pending { outline-color: var(--l-gold-line); }
html.theme-light .pending-box { background: #fffbea; border-color: var(--l-gold-line); }
html.theme-light .pending-label { color: #374151; }
html.theme-light .pending-cancel { color: var(--l-muted); }
html.theme-light .pending-cancel:hover { color: var(--l-text); background: #eef0f3; }

/* Toast */
html.theme-light .cars-toast { background: #1f2328; color: #fff; border-color: #FFD700; }

/* Modals (job card + Manage Lists) */
html.theme-light .modal-bg { background: rgba(15,23,42,0.45); }
html.theme-light .bg-\[\#161616\] { background: var(--l-surface); color: var(--l-text); box-shadow: 0 20px 50px rgba(16,24,40,0.25); }
html.theme-light #car-modal input[type="date"] { color-scheme: light !important; }
html.theme-light .list-editor { background: var(--l-surface-2); border-color: var(--l-border-strong); }
html.theme-light .list-item { background: var(--l-surface); border: 1px solid var(--l-border); color: var(--l-text); }
html.theme-light .tech-color { border-color: var(--l-border-strong); }
html.theme-light .tech-color-auto { color: var(--l-muted); }
html.theme-light .onsite-yes { background: #dcfce7; color: #166534; }
html.theme-light .onsite-no { background: #fee2e2; color: #991b1b; }

/* Mobile-support branch elements (harmless if absent) */
html.theme-light .m-toggle, html.theme-light .m-filter-btn { background: var(--l-surface); border-color: var(--l-border); color: var(--l-gold); }
html.theme-light #m-sheet { background: var(--l-surface); border-color: var(--l-border); }
html.theme-light #m-sheet .m-handle { background: #cbd2db; }
html.theme-light #m-sheet .m-sheet-actions { border-color: var(--l-border); }
@media (max-width: 639.98px) {
    html.theme-light body:has(.m-filter-btn) > .flex:first-child { background: rgba(255,255,255,0.97) !important; border-bottom-color: var(--l-border) !important; }
}

/* Phone app bar (mobile-support): small toggle icon next to the gear/username */
@media (max-width: 639.98px) {
    body:has(.m-filter-btn) #theme-toggle-btn { order: 2; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 999px; font-size: 15px; background: transparent; border: 0; box-shadow: none; }
    html.theme-light body:has(.m-filter-btn) > .flex:first-child a[href="/chatbot"] { background: transparent; box-shadow: none; color: var(--l-gold); }
    html.theme-light #m-sheet .m-sheet-title { color: var(--l-gold); }
    body:has(.m-filter-btn) #theme-toggle-btn:active { background: rgba(127,127,127,0.18); }
}

html.theme-light .gold-bg { background: linear-gradient(135deg, #f2b900, #ffd21f, #e8a900); }

/* ================= PINK THEME (light base + pink accents) ================= */
html.theme-pink {
    --l-bg: #fdf6f9;
    --l-gold: #be185d;
    --l-gold-big: #db2777;
    --l-gold-line: #f472b6;
    --l-gold-bg: #ec4899;
}
html.theme-pink .gold-bg { background: linear-gradient(135deg, #db2777, #ec4899, #be185d); color: #fff !important; box-shadow: 0 1px 3px rgba(190,24,93,0.35); }
html.theme-pink .gold-bg * { color: #fff; }
html.theme-pink .settings-icon:hover, html.theme-pink .view-chip-active, html.theme-pink .pending-save { background: #ec4899; color: #fff; border-color: #ec4899; }
html.theme-pink .section-header { background: linear-gradient(90deg, #fce7f3 0%, #ffffff 100%); }
html.theme-pink .stat-gold { border-color: #f9a8d4; }
html.theme-pink .form-input:focus { box-shadow: 0 0 0 3px rgba(236,72,153,0.2); }
html.theme-pink .pending-box { background: #fdf2f8; }
html.theme-pink .cars-toast { border-color: #ec4899; }
html.theme-pink #m-sheet .m-done { background: #ec4899; color: #fff; }
html.theme-pink .m-filter-btn .m-count, html.theme-pink .m-toggle .m-count { background: #ec4899; color: #fff; }
html.theme-pink .card:hover { border-color: #f9a8d4; }
html.theme-pink ::selection { background: #fbcfe8; }

/* Phone/tablet chips in light + pink */
@media (max-width: 1023.98px) {
    html.theme-light body > .flex:first-child > .text-xl { border-color: var(--l-gold-line); background: #fff8db; color: var(--l-gold); }
    html.theme-pink body > .flex:first-child > .text-xl { background: #fce7f3; }
    html.theme-light .m-filters > .m-toggle[data-m="views"] { border-color: var(--l-border-strong); }
}