/* Calm, high-contrast presentation layer for the complete-black BRAVV theme. */
:root {
  --ink: #f8fafc;
  --muted: #c4ccd6;
  --line: #343b43;
  --blue: #a9c5ff;
  --cyan: #74d9d0;
  --pink: #e2b5f7;
  --warn: #f5cd7b;
  --red: #f3a0aa;
  --green: #8bd3aa;
  --violet: #c4b5fd;
  --amber: #f5cd7b;
  --surface: #15191d;
  --shadow: 0 18px 50px rgba(0, 0, 0, .38);
}

body { background: #000; color: var(--ink); }
.sidebar, .topbar { background: #050607; }
.sidebar { border-right-color: #252a30; }
.topbar { border-bottom-color: #252a30; }
.card { background: linear-gradient(145deg, #191d21, #111417); border-color: var(--line); box-shadow: var(--shadow); }
.metric-primary { background: linear-gradient(145deg, #1b2428, #111518); }
.metric:not(.metric-primary) { background: linear-gradient(145deg, #191c20, #111417); }

.nav-link { color: #c8d0da; font-weight: 600; }
.nav-link:hover, .nav-link.active { color: #fff; background: linear-gradient(90deg, rgba(116, 217, 208, .16), rgba(169, 197, 255, .08)); }
.sidebar-bottom, .table-sub, .mini-row span, .date-summary, .vehicle-search-results { color: #bac4cf; }
.eyebrow, .card-heading a, .link-button:hover { color: #82ddd4; }

.field label, .data-table th, .metric-label, .ticket-boxes legend { color: #d0d9e3; font-weight: 700; }
.field input, .field select, .field textarea, .search, .date-control input, .invoice-line input, .invoice-line select { background: #0b0d0f; color: #f8fafc; border-color: #3a424b; }
.field input::placeholder, .field textarea::placeholder, .search::placeholder { color: #9ca8b6; }
.search:focus, .field input:focus, .field select:focus, .field textarea:focus { border-color: #86baff; box-shadow: 0 0 0 3px rgba(134, 186, 255, .18); }
:focus-visible { outline-color: #86baff; }

.button-secondary { color: #f4f7fb; background: #1a2730; border-color: #435461; }
.button-primary { color: #071318; background: linear-gradient(135deg, #74d9d0, #a9b8ff); }
.job-date-policy { color: #c3e9e5; background: #142123; border-color: #3d7471; }
.vehicle-lookup { background: #131b1d; border-color: #345b5d; }
.vehicle-result, .vehicle-selected { background: #151b1d; border-color: #3a5558; }
.vehicle-result:hover { background: #1b2b2c; border-color: #69aaa5; }
.vehicle-selected { background: #182721; border-color: #4b8c70; }
.vehicle-result strong, .vehicle-selected strong { color: #8ce5dc; }
.vehicle-result span, .vehicle-selected span { color: #c1cbd5; }
.status.ok, .tag.green { color: #a5edbf; background: rgba(139, 211, 170, .16); }
.status.warn { color: #ffe0a3; background: rgba(245, 205, 123, .16); }
.status.due { color: #edc8ff; background: rgba(226, 181, 247, .16); }
.service-nearing-row.urgent-service-due { margin-inline: -8px; padding-inline: 8px; border-radius: 8px; background: rgba(243, 160, 170, .12); box-shadow: inset 3px 0 #f3a0aa; }
.status.urgent { display: inline-flex; align-items: center; gap: 6px; color: #ffd1d7; background: rgba(243, 160, 170, .2); }
.urgent-pulse { width: 8px; height: 8px; border-radius: 50%; background: #ff8794; box-shadow: 0 0 0 0 rgba(255, 135, 148, .78); animation: urgent-service-pulse 1.2s ease-out infinite; }
@keyframes urgent-service-pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 135, 148, .78); } 70% { box-shadow: 0 0 0 8px rgba(255, 135, 148, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 135, 148, 0); } }
.master-delete { color: #f3a0aa; }
.master-delete:hover { color: #ffd1d7; }

.history-invoice-row { border-bottom: 0; padding-bottom: 8px; }
.history-invoice-details { margin: 0 0 14px; border: 1px solid #35434a; border-radius: 10px; background: #101416; overflow: hidden; }
.history-invoice-details summary { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; color: #d7e0e9; cursor: pointer; font-size: 12px; font-weight: 700; }
.history-invoice-details summary span:last-child { color: #9edfd8; font-weight: 600; }
.history-invoice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 11px 12px; border-top: 1px solid #303b41; background: #151b1e; }
.history-invoice-grid small { display: block; margin-bottom: 4px; color: #b9c5d0; font-size: 10px; font-weight: 700; }
.history-invoice-grid strong { font-size: 12px; line-height: 1.4; }
.history-invoice-lines { display: grid; gap: 0; padding: 4px 12px; }
.history-invoice-lines > div { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; border-bottom: 1px solid #2d363c; color: #c7d0d9; font-size: 12px; }
.history-invoice-lines > div span:last-child { text-align: right; white-space: nowrap; }
.history-invoice-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 12px; color: #f8fafc; font-size: 13px; }
.theme-toggle { white-space: nowrap; }
.service-plan-settings { padding: 14px; border: 1px solid #3a5558; border-radius: 11px; background: #131b1d; }
.service-plan-settings > label { color: #8ce5dc; }
.service-plan-note { color: #c1cbd5; font-size: 12px; line-height: 1.45; }

/* The default remains the dark BRAVV theme. Light mode intentionally uses softer
   neutral whites and high-contrast ink instead of inverting colours. */
:root[data-theme="light"] {
  --ink: #15202b !important;
  --muted: #536474 !important;
  --line: #c7d2dc !important;
  --blue: #275da8 !important;
  --cyan: #087c74 !important;
  --pink: #8951a4 !important;
  --warn: #8a5700 !important;
  --red: #b42331 !important;
  --green: #167045 !important;
  --surface: #ffffff !important;
  --border: #c7d2dc;
  --shadow: 0 14px 36px rgba(28, 47, 66, .11) !important;
  color-scheme: light;
}
:root[data-theme="light"] body { background: #edf2f6 !important; color: var(--ink); }
:root[data-theme="light"] .sidebar, :root[data-theme="light"] .topbar { background: rgba(255,255,255,.96) !important; }
:root[data-theme="light"] .sidebar { border-right-color: #d2dce5 !important; }
:root[data-theme="light"] .topbar { border-bottom-color: #d2dce5 !important; }
:root[data-theme="light"] .card { background: linear-gradient(145deg, #ffffff, #f6f9fb) !important; border-color: #d2dce5 !important; }
:root[data-theme="light"] .metric-primary { background: linear-gradient(145deg, #effbf9, #f5f9ff) !important; }
:root[data-theme="light"] .metric:not(.metric-primary) { background: linear-gradient(145deg, #ffffff, #f6f9fb) !important; }
:root[data-theme="light"] .nav-link { color: #405263; }
:root[data-theme="light"] .nav-link:hover, :root[data-theme="light"] .nav-link.active { color: #102b3d; background: linear-gradient(90deg, rgba(8,124,116,.14), rgba(39,93,168,.09)); }
:root[data-theme="light"] .sidebar-bottom, :root[data-theme="light"] .table-sub, :root[data-theme="light"] .mini-row span, :root[data-theme="light"] .date-summary, :root[data-theme="light"] .vehicle-search-results { color: #536474; }
:root[data-theme="light"] .eyebrow, :root[data-theme="light"] .card-heading a, :root[data-theme="light"] .link-button:hover { color: #087c74; }
:root[data-theme="light"] .field label, :root[data-theme="light"] .data-table th, :root[data-theme="light"] .metric-label, :root[data-theme="light"] .ticket-boxes legend { color: #34495c; }
:root[data-theme="light"] .data-table { background: #ffffff; }
:root[data-theme="light"] .data-table th { background: #eaf1f5; border-bottom-color: #cbd8e1; }
:root[data-theme="light"] .data-table td { background: #ffffff; color: #1c2d3b; border-bottom-color: #d8e2e9; }
:root[data-theme="light"] .data-table tr:hover td { background: #f1f8f9; }
:root[data-theme="light"] .status.ok, :root[data-theme="light"] .tag.green { color: #126b40; background: #dff4e8; }
:root[data-theme="light"] .status.warn { color: #805000; background: #fff0c7; }
:root[data-theme="light"] .status.due { color: #76428c; background: #f4e4fb; }
:root[data-theme="light"] .service-nearing-row.urgent-service-due { background: #fff2f3; box-shadow: inset 3px 0 #c4313d; }
:root[data-theme="light"] .status.urgent { color: #9e1f2b; background: #ffe1e5; }
:root[data-theme="light"] .urgent-pulse { background: #c4313d; box-shadow: 0 0 0 0 rgba(196, 49, 61, .62); }
:root[data-theme="light"] .account-detail { color: #1c2d3b; background: #f1f6f9; border-color: #c6d4de; }
:root[data-theme="light"] .account-detail span, :root[data-theme="light"] .account-detail small { color: #536474; }
:root[data-theme="light"] .button-danger { color: #9e1f2b; background: #fff0f2; border-color: #f1b6be; }
:root[data-theme="light"] .modal-backdrop { background: rgba(22, 39, 54, .34); backdrop-filter: blur(2px); }
:root[data-theme="light"] .master-delete, :root[data-theme="light"] .master-delete:hover { color: #b42331; }
:root[data-theme="light"] .page-back { background: #edf3f7; border-color: #b9cad7; color: #193042; }
:root[data-theme="light"] .page-back:hover { background: #e3f3f1; border-color: #69aaa5; color: #087c74; }
:root[data-theme="light"] .history-header,
:root[data-theme="light"] .invoice-summary,
:root[data-theme="light"] .calculator-display,
:root[data-theme="light"] .import-columns,
:root[data-theme="light"] .customer-mode,
:root[data-theme="light"] .closing-summary > div,
:root[data-theme="light"] .closing-record > div,
:root[data-theme="light"] .restock-current { background: #f2f6f8; border-color: #c7d4dd; color: #1c2d3b; }
:root[data-theme="light"] .history-header span,
:root[data-theme="light"] .history-row small,
:root[data-theme="light"] .summary-row,
:root[data-theme="light"] .customer-mode span,
:root[data-theme="light"] .import-columns,
:root[data-theme="light"] .restock-current span { color: #536474; }
:root[data-theme="light"] .summary-row.total,
:root[data-theme="light"] .customer-mode label,
:root[data-theme="light"] .import-columns strong,
:root[data-theme="light"] .restock-current strong { color: #15202b; }
:root[data-theme="light"] .customer-list-tab { background: #ffffff; border-color: #c7d4dd; color: #405263; }
:root[data-theme="light"] .customer-list-tab:hover,
:root[data-theme="light"] .customer-list-tab.active { color: #153c4c; border-color: #74b9b2; background: #e8f6f4; }
:root[data-theme="light"] .report-summary { border-color: #c7d4dd; background: #f1f8f9; color: #087c74; }
:root[data-theme="light"] .report-table-wrap { border-color: #c7d4dd; }
:root[data-theme="light"] .import-ready { color: #126b40; background: #e9f8ef; border-color: #a8d8b8; }
:root[data-theme="light"] .import-errors { color: #805000; background: #fff6df; border-color: #e9cc85; }
:root[data-theme="light"] .import-errors ul { color: #3b4a57; }
:root[data-theme="light"] .calculator-display { color: #15202b; }
:root[data-theme="light"] .calc-key { background: #f0f5f8; border-color: #c7d4dd; color: #1c2d3b; }
:root[data-theme="light"] .calc-key:hover { background: #e1f3f1; }
:root[data-theme="light"] .stock-deduction,
:root[data-theme="light"] .invoice-stock-preview { background: #edf9f2; border-color: #9bcfb1; color: #126b40; }
:root[data-theme="light"] .stock-deduction label,
:root[data-theme="light"] .invoice-stock-preview span { color: #1c2d3b; }
:root[data-theme="light"] .stock-deduction span { color: #536474; }
:root[data-theme="light"] .invoice-stock-preview.muted { background: #eef5fb; border-color: #b8cee3; color: #405f7b; }
:root[data-theme="light"] .invoice-stock-preview.warning { background: #fff6df; border-color: #e9cc85; color: #805000; }
:root[data-theme="light"] .dashboard-panel .mini-list { scrollbar-color: #6aaea7 #e5edf2; }
:root[data-theme="light"] .dashboard-panel .mini-list::-webkit-scrollbar-track { background: #e5edf2; }
:root[data-theme="light"] .dashboard-panel .mini-list::-webkit-scrollbar-thumb { background: #6aaea7; }
:root[data-theme="light"] .field input, :root[data-theme="light"] .field select, :root[data-theme="light"] .field textarea, :root[data-theme="light"] .search, :root[data-theme="light"] .date-control input, :root[data-theme="light"] .invoice-line input, :root[data-theme="light"] .invoice-line select { background: #fff !important; color: #15202b; border-color: #aebdca; }
:root[data-theme="light"] .field input::placeholder, :root[data-theme="light"] .field textarea::placeholder, :root[data-theme="light"] .search::placeholder { color: #718193; }
:root[data-theme="light"] .search:focus, :root[data-theme="light"] .field input:focus, :root[data-theme="light"] .field select:focus, :root[data-theme="light"] .field textarea:focus { border-color: #2d74c7; box-shadow: 0 0 0 3px rgba(45,116,199,.16); }
:root[data-theme="light"] .button-secondary { color: #193042; background: #edf3f7; border-color: #aebdca; }
:root[data-theme="light"] .button-primary { color: #fff; background: linear-gradient(135deg, #087c74, #346bb3); }
:root[data-theme="light"] .job-date-policy { color: #12625d; background: #edf9f7; border-color: #8bcac4; }
:root[data-theme="light"] .vehicle-lookup, :root[data-theme="light"] .service-plan-settings { background: #f2f9f9; border-color: #9ccdc9; }
:root[data-theme="light"] .service-plan-settings > label { color: #087c74; }
:root[data-theme="light"] .service-plan-note { color: #536474; }
:root[data-theme="light"] .vehicle-result, :root[data-theme="light"] .vehicle-selected { background: #f8fbfc; border-color: #abc1c3; }
:root[data-theme="light"] .vehicle-result:hover { background: #e9f7f5; border-color: #52a9a1; }
:root[data-theme="light"] .vehicle-selected { background: #edf9f2; border-color: #79b997; }
:root[data-theme="light"] .vehicle-result strong, :root[data-theme="light"] .vehicle-selected strong { color: #087c74; }
:root[data-theme="light"] .vehicle-result span, :root[data-theme="light"] .vehicle-selected span { color: #405263; }
:root[data-theme="light"] .history-invoice-details { background: #fff; border-color: #b9c8d3; }
:root[data-theme="light"] .history-invoice-details summary { color: #213445; }
:root[data-theme="light"] .history-invoice-details summary span:last-child { color: #087c74; }
:root[data-theme="light"] .history-invoice-grid { background: #f4f8fa; border-top-color: #d4dee6; }
:root[data-theme="light"] .history-invoice-grid small, :root[data-theme="light"] .history-invoice-lines > div, :root[data-theme="light"] .history-invoice-footer { color: #405263; }
:root[data-theme="light"] .history-invoice-lines > div { border-bottom-color: #d4dee6; }
:root[data-theme="light"] .history-invoice-footer { color: #15202b; }
:root[data-theme="light"] .vehicle-type-table { background: #fff !important; border-color: #b7c5d0; }
:root[data-theme="light"] .vehicle-type-table input { background: #fff !important; color: #15202b; border-color: #aebdca; }
@media (max-width: 600px) { .history-invoice-grid { grid-template-columns: 1fr; } .history-invoice-details summary, .history-invoice-footer { display: grid; } .history-invoice-lines > div { display: grid; } .history-invoice-lines > div span:last-child { text-align: left; white-space: normal; } }
@media (max-width: 430px) {
  .topbar-actions .theme-toggle::before { content: "☀"; font-size: 17px; }
  :root[data-theme="light"] .topbar-actions .theme-toggle::before { content: "☾"; }
}
@media (prefers-reduced-motion: reduce) { .urgent-pulse { animation: none; } }