:root {
    color-scheme: light;
    --theme-surface: #fff;
    --theme-hover: #edf2e8;
    --theme-selected: #e8f0df;
}

.theme-picker { position: relative; z-index: 35; flex-shrink: 0; }
.theme-summary {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    min-width: 34px; height: 34px; padding: 0 10px; border-radius: 7px;
    color: var(--ink); font-size: 11px; cursor: pointer; list-style: none;
}
.theme-summary::-webkit-details-marker { display: none; }
.theme-summary:hover, .theme-picker[open] .theme-summary { background: var(--theme-hover); }
.theme-current-icon { display: none; }
html:not([data-theme-preference]) .theme-icon-system,
[data-theme-preference="system"] .theme-icon-system,
[data-theme-preference="light"] .theme-icon-light,
[data-theme-preference="dark"] .theme-icon-dark { display: inline-flex; }
.theme-options {
    position: absolute; right: 0; top: calc(100% + 10px); width: 320px;
    max-width: calc(100vw - 36px); max-height: calc(100dvh - 92px); overflow-y: auto;
    padding: 10px; background: var(--theme-surface); border: 1px solid var(--border);
    border-radius: 11px; box-shadow: 0 12px 35px #07150e24; color: var(--ink);
    overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--muted) var(--theme-surface);
}
.theme-heading { display: block; padding: 3px 9px 9px; font-size: 9px; letter-spacing: 1.4px; color: var(--muted); }
.theme-mode-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.theme-option {
    display: flex; align-items: center; justify-content: center; gap: 5px; width: 100%; padding: 10px 4px;
    border: 1px solid transparent; border-radius: 6px; color: var(--ink); background: transparent;
    text-align: center; font-size: 11px;
}
.theme-option:hover { background: var(--theme-hover); }
.theme-option[aria-pressed="true"] { background: var(--theme-selected); border-color: var(--green); font-weight: 600; }
.theme-mode-grid .theme-check { display: none; }
.theme-check { margin-left: auto; visibility: hidden; }
.theme-option[aria-pressed="true"] .theme-check { visibility: visible; }
.theme-help { display: block; font-size: 10px; color: var(--muted); padding: 10px 9px 3px; }
.theme-colour-indicator { width: 7px; height: 7px; border-radius: 50%; background: var(--green); flex-shrink: 0; }
.theme-colours { border-top: 1px solid var(--border); margin-top: 12px; padding-top: 12px; }
.theme-colour-heading { display: flex; align-items: center; justify-content: space-between; padding-right: 9px; margin-bottom: 7px; }
.theme-colour-heading .theme-heading { padding-bottom: 3px; }
.theme-colour-heading>[data-colour-current] { font-size: 10px; color: var(--green); }
.theme-variants { border-top: 1px solid var(--border); margin-top: 10px; padding-top: 10px; }
.theme-variant-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
.theme-variant-option { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 5px; min-height: 55px; border: 1px solid var(--border); border-radius: 7px; padding: 5px 3px; color: var(--ink); background: transparent; font-size: 10px; }
.theme-variant-option:hover { background: var(--theme-hover); }
.theme-variant-option[aria-pressed="true"] { border-color: var(--green); background: var(--theme-selected); font-weight: 600; }
.theme-variant-help { display: block; padding: 7px 9px 0; color: var(--muted); font-size: 10px; }
.theme-variant-option .theme-colour-swatch { height: 26px; }
.theme-variant-option .theme-colour-swatch::after { top: 6px; }
.theme-colour-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.theme-scroll-hint { display: none; margin: 0 9px 8px; font-size: 10px; color: var(--muted); }
.theme-colour-option {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
    border: 1px solid transparent; border-radius: 7px; padding: 7px 2px;
    color: var(--ink); background: transparent; font-size: 10px; min-height: 48px;
}
.theme-colour-option:hover { background: var(--theme-hover); }
.theme-colour-option[aria-pressed="true"] { border-color: var(--green); background: var(--theme-selected); font-weight: 600; }
.theme-colour-swatch {
    --preview-sidebar: var(--green-deep); --preview-canvas: var(--canvas);
    --preview-primary: var(--accent-button); --preview-ink: var(--accent-on-primary);
    display: block; position: relative; width: 54px; height: 34px; border-radius: 6px;
    background: var(--preview-canvas); box-shadow: inset 0 0 0 1px #80808045; overflow: hidden;
}
.theme-colour-swatch::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 15px; background: var(--preview-sidebar); }
.theme-colour-swatch::after { content: ''; position: absolute; left: 22px; right: 7px; top: 10px; height: 6px; border-radius: 2px; background: var(--preview-primary); box-shadow: 0 10px 0 color-mix(in srgb, var(--preview-primary) 35%, var(--preview-canvas)); }
.theme-colour-swatch svg { visibility: hidden; position: absolute; z-index: 1; top: 8px; right: 5px; width: 18px; height: 18px; padding: 2px; border-radius: 50%; background: var(--preview-primary); color: var(--preview-ink); }
.theme-colour-option[aria-pressed="true"] .theme-colour-swatch svg { visibility: visible; }
.auth-main { position: relative; }
.auth-theme { position: absolute; right: 30px; top: 26px; }

@media screen {
    :root[data-bs-theme="dark"] {
        color-scheme: dark;
        --ink: #e1ebe3; --muted: #a0b2a5; --green: #b5d394; --green-deep: #102b24;
        --canvas: #111c18; --border: #304039; --white: #1b2922;
        --theme-surface: #1b2922; --theme-hover: #2a3c30; --theme-selected: #354e36;
        --bs-body-color: #e1ebe3; --bs-body-bg: #111c18; --bs-border-color: #304039;
        --bs-secondary-color: #a0b2a5; --bs-tertiary-bg: #24352b;
        --bs-emphasis-color: #edf5ee; --bs-secondary-bg: #283a2f;
        --bs-link-color: #b5d394; --bs-link-hover-color: #d6e9b6;
        --bs-heading-color: #e1ebe3;
    }
    [data-bs-theme="dark"] a:hover { color: #d6e9b6; }
    [data-bs-theme="dark"] .nav-item.active:hover { color: #244234; }
    [data-bs-theme="dark"] :is(.panel, .stat-card, .vehicle-card, .quick-actions>a, .theme-options) { background: var(--theme-surface); }
    [data-bs-theme="dark"] .topbar { background: #17241e; }
    [data-bs-theme="dark"] :is(.breadcrumb-text strong, .form-label, .check-label, .record-title a, .garage-vehicle, .breakdown-list strong) { color: #d0dfcd; }
    [data-bs-theme="dark"] :is(.breadcrumb-text, .today, .stat-top, .stat-value small, .stat-caption, .panel-heading p, .quick-actions>span,
        .chart-grid>span, .chart-bar span, .bar-label, .chart-legend, .reminder-item small, .garage-vehicle>div span,
        .records-table td, .record-title small, .page-footer, .form-text, .check-label small, .filter-bar label, .table-summary,
        .vehicle-year, .vehicle-card-meta, .vehicle-card-stats small, .vehicle-card-stats strong span, .report-meta, .report-total small,
        .breakdown-list>div, .economy-row span, .empty-state, .empty-state p) { color: var(--muted); }
    [data-bs-theme="dark"] :is(.overline, .text-link, .stat-caption a, .chart-legend a, .attachment-link, .reset-filter,
        .vehicle-card-link, .table-summary strong, .economy-row strong, .empty-state h3, .chart-bar.current span) { color: #b5ce9e; }
    [data-bs-theme="dark"] .amount { color: #d0dfcd !important; }
    [data-bs-theme="dark"] :is(.reminder-item, .panel-bottom-link, .garage-vehicle, .records-table th, .records-table td, .breakdown-list>div) { border-color: var(--border); }
    [data-bs-theme="dark"] :is(.garage-vehicle, .document-mini, .panel-bottom-link, .table-summary, .records-table th, .audit-detail pre) { background: #1f3026; }
    [data-bs-theme="dark"] :is(.panel-bottom-link, .records-table th, .quick-actions>a, .icon-button, .table-action) { color: #b6c7b2; }
    [data-bs-theme="dark"] :is(.icon-button:hover, .table-action:hover, .quick-actions>a:hover) { background: var(--theme-hover); color: #d6e9b6; }
    [data-bs-theme="dark"] .avatar { background: #354b34; color: #d4e5c4; border-color: #17241e; box-shadow: 0 0 0 1px #3d503d; }
    [data-bs-theme="dark"] :is(.subtle-tag, .plate-small) { color: #c0d0ae; background: #283a2a; border-color: #3b4e37; }
    [data-bs-theme="dark"] :is(.count-pill, .section-number, .vehicle-symbol, .all-clear) { color: #b9d09a; background: #30422b; }
    [data-bs-theme="dark"] :is(.form-control, .form-select, .auth-panel .form-control) { color: #e1ebe3; background-color: #15221b; border-color: #415341; }
    [data-bs-theme="dark"] :is(.form-control:focus, .form-select:focus) { border-color: #a2bf83; box-shadow: 0 0 0 3px #a2bf8325; }
    [data-bs-theme="dark"] .form-control::placeholder { color: #96a690; }
    [data-bs-theme="dark"] :is(.form-control[readonly], .form-control:disabled, .form-select:disabled) { background-color: #28372a; }
    [data-bs-theme="dark"] .btn-primary {
        --bs-btn-color: #16251b; --bs-btn-bg: #bbd59e; --bs-btn-border-color: #bbd59e;
        --bs-btn-hover-color: #16251b; --bs-btn-hover-bg: #d0e5b8; --bs-btn-hover-border-color: #d0e5b8;
        --bs-btn-active-color: #16251b; --bs-btn-active-bg: #a7c789; --bs-btn-active-border-color: #a7c789;
        --bs-btn-disabled-color: #16251b; --bs-btn-disabled-bg: #bbd59e; --bs-btn-disabled-border-color: #bbd59e;
    }
    [data-bs-theme="dark"] .btn-primary:hover { color: #16251b; }
    [data-bs-theme="dark"] .btn-outline-secondary {
        background: transparent; --bs-btn-color: #d0dfc5; --bs-btn-border-color: #53674b;
        --bs-btn-hover-color: #e1ebe3; --bs-btn-hover-bg: #31452b; --bs-btn-hover-border-color: #a2bf83;
        --bs-btn-active-bg: #31452b; --bs-btn-active-color: #e1ebe3;
    }
    [data-bs-theme="dark"] .btn-outline-danger { --bs-btn-color: #edb09f; --bs-btn-border-color: #9f6555; }
    [data-bs-theme="dark"] :is(.green, .type-icon.fuel, .status-pill.paid) { color: #b8d49a; background: #304129; }
    [data-bs-theme="dark"] .blue { color: #acc9e0; background: #293a47; }
    [data-bs-theme="dark"] :is(.purple, .type-icon.expense, .status-pill.disputed) { color: #cdbce2; background: #3b3049; }
    [data-bs-theme="dark"] :is(.amber, .type-icon.maintenance, .status-pill.unpaid) { color: #e1c38b; background: #433a25; }
    [data-bs-theme="dark"] .type-icon.challan { color: #e5b19a; background: #473129; }
    [data-bs-theme="dark"] .mini-label { color: #ddc58e; }
    [data-bs-theme="dark"] .mini-label.late { color: #e5a58d; }
    [data-bs-theme="dark"] .chart-grid>span:after { border-color: #3a4a3b; }
    [data-bs-theme="dark"] .chart-bar { background: #435d38; }
    [data-bs-theme="dark"] .chart-bar.current { background: #a6c184; }
    [data-bs-theme="dark"] .vehicle-card-art { color: #b1c88f; background: radial-gradient(ellipse, #30422a, transparent 67%); }
    [data-bs-theme="dark"] :is(.notice, .alert-success, .demo-check) { color: #c1d6a9; background: #293d25; border-color: #415935; }
    [data-bs-theme="dark"] .outstanding-note { background: #3c3525; }
    [data-bs-theme="dark"] .outstanding-note :is(small, strong) { color: #e1c38b; }
    [data-bs-theme="dark"] .pagination {
        --bs-pagination-bg: #1b2922; --bs-pagination-color: #c0d6a5; --bs-pagination-border-color: #415341;
        --bs-pagination-hover-bg: #31452b; --bs-pagination-hover-color: #e1ebe3;
        --bs-pagination-active-bg: #435d38; --bs-pagination-active-border-color: #688650;
        --bs-pagination-disabled-bg: #243128; --bs-pagination-disabled-color: #92a38c;
        --bs-pagination-disabled-border-color: #415341;
    }
    [data-bs-theme="dark"] .auth-body { background: var(--canvas); }
    [data-bs-theme="dark"] .skip-link { color: var(--ink); background: var(--theme-surface); }
}

@media (max-width: 1199px) { .topbar-right { gap: 12px; } }
@media (max-width: 991px) {
    .topbar .theme-current-label { display: none; }
    .topbar .theme-summary { padding: 0; width: 34px; }
    .topbar .theme-colour-indicator { position: absolute; right: 3px; top: 3px; width: 5px; height: 5px; }
    .topbar .theme-summary { position: relative; }
    .topbar .today { display: none; }
}
@media (max-width: 767px) {
    .topbar { position: relative; z-index: 30; }
    .topbar .theme-picker { position: static; }
    .topbar .theme-options { right: 18px; top: calc(100% - 4px); }
    .topbar-right { gap: 4px; flex-shrink: 0; }
    .topbar>div:first-child { min-width: 0; }
    .topbar .mobile-menu { flex-shrink: 0; }
    .breadcrumb-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .auth-main { padding-top: 90px; }
    .auth-theme { top: 22px; right: 22px; }
}
@media (max-width: 400px) {
    .topbar>div:first-child { gap: 6px !important; }
}
@media (max-height: 500px) {
    .theme-options { padding: 8px; }
    .theme-option { padding: 7px 3px; }
    .theme-help { display: none; }
    .theme-colours { margin-top: 8px; padding-top: 8px; }
    .theme-colour-option { padding: 5px 2px; gap: 4px; }
}
@media (max-height: 820px) {
    .theme-scroll-hint { display: block; }
}
@media print {
    :root[data-bs-theme] { color-scheme: light; --bs-body-color: #203b34; --bs-body-bg: #fff; --bs-heading-color: #203b34; --bs-emphasis-color: #203b34; }
    .theme-picker { display: none !important; }
}