/* Shared appearance: preserve the operational layout while changing semantic colors. */
:root {
  color-scheme: light;
  --bg: #FAFCFB;
  --ink: #0B3D3A;
  --muted: #52655D;
  --accent: #FF6A00;
  --navy: #0B3D3A;
  --line: #D8E4DE;
  --white: #FFFFFF;
  --surface: #FFFFFF;
  --raised: #EFF5F1;
  --input: #FFFFFF;
  --good: #147B55;
  --warn: #8B520B;
  --focus: #B44300;
  --paper: var(--bg);
  --orange: var(--accent);
  --leaf: #0B3D3A;
  --leaf2: #15514C;
  --orange-hover: #FF7C21;
  --appearance-link: #A5420C;
  --appearance-warm: #FFF0E5;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #061E1D;
  --ink: #F2F8F6;
  --muted: #BACFC9;
  --navy: #041714;
  --line: #31544E;
  --white: #0B2B29;
  --surface: #0B2B29;
  --raised: #123A37;
  --input: #0A2523;
  --good: #86DFB5;
  --warn: #FFD298;
  --focus: #FFAB6B;
  --appearance-link: #FFAB6B;
  --appearance-warm: #3A2A1D;
}
::selection { background: #0B3D3A; color: #FFFFFF; }
:root[data-theme="dark"] ::selection { background: #FFAB6B; color: #09221F; }
html { scrollbar-color: #6D8A80 var(--bg); }
input, textarea { caret-color: var(--accent); }
button:focus-visible, a:focus-visible, summary:focus-visible {
  outline-color: var(--focus);
}
.btn:not(.btn-outline):not(.btn-danger), .tabswitch button.selected {
  background: var(--accent); border-color: var(--accent); color: #231309;
}
.btn:not(.btn-outline):not(.btn-danger):hover { background: var(--orange-hover); }
.wordmark>span { color: var(--accent); }
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px;
  border: 1px solid var(--line); border-radius: 12px;
  padding: 10px; background: var(--surface); color: var(--ink); cursor: pointer;
}
.theme-toggle:hover { background: var(--raised); }
.theme-toggle svg, .theme-options svg {
  width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round;
}
.theme-toggle .theme-sun { display: none; }
:root[data-theme="dark"] .theme-toggle .theme-sun { display: block; }
:root[data-theme="dark"] .theme-toggle .theme-moon { display: none; }
.theme-settings {
  min-inline-size: 0; margin: 0 0 26px; padding: 20px 0;
  border: 0; border-block: 1px solid var(--line);
}
.theme-settings legend { padding: 0 8px 0 0; font-size: 17px; font-weight: 750; }
.theme-settings p { margin: 0 0 14px; font-size: 13px; color: var(--muted); }
.theme-options { display: flex; gap: 8px; width: min(100%, 300px); }
.theme-options button {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  flex: 1; min-width: 0; min-height: 46px; padding: 10px 15px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px;
  color: var(--ink); font: inherit; font-size: 13px; font-weight: 750; cursor: pointer;
}
.theme-options button[aria-pressed="true"] { background: #0B3D3A; border-color: #0B3D3A; color: #FFFFFF; }
:root[data-theme="dark"] .theme-options button[aria-pressed="true"] { background: #FF6A00; border-color: #FF6A00; color: #231309; }
:root[data-theme="dark"] body, :root[data-theme="dark"] body:has(#product:not([hidden])) {
  background: var(--bg); color: var(--ink); background-image: none;
}
:root[data-theme="dark"] #product :is(p, .muted, .hint, .mini-help, small),
:root[data-theme="dark"] .dialog-card p { color: var(--muted); }
:root[data-theme="dark"] :is(.field label, .receipt-check label) { color: #D7E7E1; }
:root[data-theme="dark"] :is(input, select, textarea, .field input, .field select, .field textarea, option) {
  color: var(--ink); background: var(--input); border-color: var(--line);
}
:root[data-theme="dark"] input::placeholder, :root[data-theme="dark"] textarea::placeholder { color: #A8BEB6; opacity: 1; }
:root[data-theme="dark"] :is(input:focus, select:focus, textarea:focus, .field input:focus, .field select:focus) {
  background: var(--raised); border-color: var(--focus); outline-color: var(--focus);
}
:root[data-theme="dark"] :is(.btn-outline, .inline-action, #account-bar button, #conflict-panel button) {
  background: var(--surface); color: var(--ink); border-color: #55776C;
}
:root[data-theme="dark"] :is(.btn-outline:hover, .inline-action:hover) { background: var(--raised); color: #FFFFFF; border-color: #89AA9D; }
:root[data-theme="dark"] .btn-danger { background: #412620; color: #FFBCAE; border-color: #8C5145; }
:root[data-theme="dark"] :is(.linklike, .info-link, .info-source-row a, .inline-action, .tool-arrow) { color: var(--appearance-link); }
:root[data-theme="dark"] .site-header { background: #08221F; border-color: var(--line); box-shadow: none; }
:root[data-theme="dark"] :is(.brand-link .wordmark, .brand-link, .institutional-page .brand) { color: var(--ink); }
:root[data-theme="dark"] .brand-emblem .brand-on-light { display: none; }
:root[data-theme="dark"] .brand-emblem .brand-on-dark { display: block; }
:root[data-theme="dark"] :is(.preview-tag, #desktop-nav button) { color: var(--muted); }
:root[data-theme="dark"] #desktop-nav button.active { background: #402B1E; color: #FFB27B; }
:root[data-theme="dark"] #desktop-nav button:hover { background: var(--raised); color: #FFFFFF; }
:root[data-theme="dark"] :is(.card, .entry, .customer-info, .tool-card, .due-item, .pay-row, .service-pane, .metric, .receipt-check, .info-news .card, .info-menu-card) {
  background: var(--surface); color: var(--ink); border-color: var(--line); box-shadow: none;
}
:root[data-theme="dark"] :is(.card>h2, .entryhead h3, .entryprice, .indicators h2, .tool-card b, .receipt-guide h2, .tracking-top strong, .hero h1, .stat strong, .metric strong) { color: var(--ink); }
:root[data-theme="dark"] :is(.entrymeta, .entry small, .tool-card small, .hero p, .stat small, .metric small, .indicators .row) { color: var(--muted); }
:root[data-theme="dark"] #quote-list .service-detail {
  background: var(--raised); color: var(--ink); border-color: var(--line);
}
:root[data-theme="dark"] :is(.section-icon, .tool-card>span:first-child) { background: #402B1E; border-color: #8C5730; color: #FFB27B; }
:root[data-theme="dark"] .stat { background: var(--surface); border-color: var(--line); }
:root[data-theme="dark"] .trip { background: var(--input); border-color: #55776C; color: #CFDED8; }
:root[data-theme="dark"] .trip.selected { background: #402B1E; border-color: #FF9D5C; color: #FFBC8C; }
:root[data-theme="dark"] :is(.extra-costs summary, .customer-info summary, .negotiation summary, .time-section summary, .goal-help summary) { color: #E2EDE8; }
:root[data-theme="dark"] :is(.extra-costs summary small, .customer-info summary small) { color: var(--muted); }
:root[data-theme="dark"] .sum { background: #103C2F; border-color: #42715B; border-top-color: var(--accent); box-shadow: none; }
:root[data-theme="dark"] .sum .big { color: #DDF9E9; }
:root[data-theme="dark"] :is(.sum .row, .sum .row b, .sum small, .sum .private-note, .sum #calc-note, .sum #sum-owner, .sum .row:has(#sum-owner)) { color: #C4E4D2; }
:root[data-theme="dark"] .sum hr { border-color: #42715B; }
:root[data-theme="dark"] .indicators .row b { color: var(--ink); }
:root[data-theme="dark"] .negotiation { background: var(--surface); border-color: var(--line); }
:root[data-theme="dark"] .tabswitch { background: #041714; }
:root[data-theme="dark"] .tabswitch button { color: var(--muted); }
:root[data-theme="dark"] .tabswitch button.selected { color: #231309; }
:root[data-theme="dark"] .notice { background: #123B2C; border-color: #47775B; color: #CBEED8; }
:root[data-theme="dark"] .notice.warn { background: #3B301B; border-color: #856C39; color: #FFE1AB; }
:root[data-theme="dark"] .notice.bad { background: #422622; border-color: #965348; color: #FFD1C7; }
:root[data-theme="dark"] .empty { background: #092521; color: var(--muted); border-color: #55776C; }
:root[data-theme="dark"] .positive, :root[data-theme="dark"] #goal-profit { color: var(--good); }
:root[data-theme="dark"] .negative { color: #FFB2A8; }
:root[data-theme="dark"] :is(.badge, .pill) { background: #143D2C; color: #B1EFCD; border-color: #47775B; }
:root[data-theme="dark"] .tool-card:hover { background: var(--raised); border-color: #698D7E; }
:root[data-theme="dark"] :is(.photo-upload, .photo-thumb, .vehicle-card-photo) { background: var(--raised); color: var(--muted); border-color: #55776C; }
:root[data-theme="dark"] .photo-actions input[type=file] { background: var(--input); }
:root[data-theme="dark"] .photo-actions input::file-selector-button { background: var(--raised); color: var(--ink); }
:root[data-theme="dark"] .due-box { background: var(--surface); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] :is(.due-box.overdue, .due-status.overdue) { background: #412620; color: #FFC1B0; border-color: #8C5145; }
:root[data-theme="dark"] :is(.due-box.today, .due-status.today) { background: #3B301B; color: #FFE1AB; border-color: #856C39; }
:root[data-theme="dark"] :is(.due-box.soon, .due-status.soon) { background: #143D2C; color: #B1EFCD; border-color: #47775B; }
:root[data-theme="dark"] .due-status { background: var(--raised); color: var(--muted); }
:root[data-theme="dark"] :is(.quote-aging, .service-note, .service-due) { color: #FFD298; }
:root[data-theme="dark"] .quote-aging.overdue { color: #FFC1B0; }
:root[data-theme="dark"] :is(.info-intro, .info-shortcuts a) { background: var(--surface); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] .info-seal { background: #402B1E; color: #FFB27B; }
:root[data-theme="dark"] .info-floor-note { background: #3B301B; border-color: #856C39; color: #FFE1AB; }
:root[data-theme="dark"] :is(.info-floor-note p, .info-floor-note b) { color: #FFE1AB; }
:root[data-theme="dark"] :is(.info-steps b, .info-publisher, .eyebrow) { color: #FFB27B; }
:root[data-theme="dark"] :is(.info-question summary, .info-steps span, .info-question p, .info-panel>p, .info-news p, .receipt-guide li) { color: var(--muted); }
:root[data-theme="dark"] :is(.info-steps li, .info-question, .route-stops, .extra-costs, .quote-action-groups .danger-actions) { border-color: var(--line); }
:root[data-theme="dark"] .info-calc-link { background: #123B2C; color: #CBEED8; border-color: #47775B; }
:root[data-theme="dark"] :is(.info-calc-link span, .info-calc-link button) { color: #CBEED8; }
:root[data-theme="dark"] .dialog-card { background: var(--surface); color: var(--ink); border-color: #55776C; }
:root[data-theme="dark"] .dialog-top h2 { color: var(--ink); }
:root[data-theme="dark"] .dialog-backdrop { background: #000B; }
:root[data-theme="dark"] :is(.dialog-top, .dialog-actions) { border-color: var(--line); }
:root[data-theme="dark"] #account-bar { background: #08221F; color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] #sync-state { color: #AAE8C7; }
:root[data-theme="dark"] #conflict-panel { background: #3B301B; color: #FFE1AB; }
:root[data-theme="dark"] .account-menu>summary { background: #402B1E; color: #FFB27B; }
:root[data-theme="dark"] .mobile { background: #08221FFB; border-color: var(--line); box-shadow: none; }
:root[data-theme="dark"] .mobile button { color: var(--muted); }
:root[data-theme="dark"] .mobile button.active { color: #FFB27B; }
:root[data-theme="dark"] .mobile button.active b { background: #402B1E; color: #FFB27B; outline-color: #402B1E; }
:root[data-theme="dark"] :is(.mobile-pricebar, #mobile-price-bar) { background: #0B2B29FA; border-color: var(--line); }
:root[data-theme="dark"] :is(#mobile-price, .mobile-pricebar small) { color: var(--ink); }
:root[data-theme="dark"] .footer { color: var(--muted); }
:root[data-theme="dark"] #view-home>.hero { background: #0C302C; border-color: var(--line); }
:root[data-theme="dark"] :is(.time-section, .goal-section, .goal-summary, .goal-summary>div, .panel-row) { border-color: var(--line); }
:root[data-theme="dark"] .time-summary { background: #402B1E; color: #FFD2AD; }
:root[data-theme="dark"] .time-summary b { color: #FFD2AD; }
:root[data-theme="dark"] .goal-summary .goal-final { background: #402B1E; color: #FFD2AD; }
:root[data-theme="dark"] .vehicle-bar meter { background: var(--raised); }
:root[data-theme="dark"] .vehicle-bar meter::-webkit-meter-bar { background: #264D42; border-color: #55776C; }
:root[data-theme="dark"] .vehicle-bar meter::-webkit-meter-optimum-value { background: #FF9D5C; }
:root[data-theme="dark"] .vehicle-bar meter::-moz-meter-bar { background: #FF9D5C; }
/* The login keeps its photographic treatment in either workspace preference. */
.auth-layout { --accent: #FF6A00; }
:root[data-theme="dark"] .auth-layout .auth-card input { background: #0E322D; color: #FFFFFF; border-color: #658276; }
:root[data-theme="dark"] .auth-layout .auth-card input:focus { border-color: #FFAB6B; }
:root[data-theme="dark"] .auth-layout .auth-card input::placeholder { color: #BDCEC5; }
:root[data-theme="dark"] .auth-layout #resend-confirmation { background: transparent; color: #D8E6E0; border-color: #658276; }
/* Documents stay on paper, including when viewed in a dark modal. */
.customer-document, #receipt-paper {
  color-scheme: light; --ink: #173B27; --muted: #4E6055;
  --line: #D7E3DA; --surface: #FFFFFF; --white: #FFFFFF; --good: #147B55;
  color: #173B27; background: #FFFFFF;
}
:root[data-theme="dark"] :is(.customer-document, #receipt-paper) { background: #FFFFFF; color: #173B27; }
:root[data-theme="dark"] :is(.customer-document, #receipt-paper) :is(h1,h2,h3,strong,b) { color: #173B27; }
:root[data-theme="dark"] :is(.customer-document, #receipt-paper) :is(p,small,.doc-foot) { color: #4E6055; }
:root[data-theme="dark"] :is(.customer-document, #receipt-paper) a { color: #A5420C; }
/* Standalone account recovery shares the saved preference. */
.recovery-page { background: var(--bg); color: var(--ink); }
.recovery-page .card { background: var(--surface); color: var(--ink); border-color: var(--line); }
.recovery-page .mark { color: var(--ink); }
.recovery-page p, .recovery-page #message { color: var(--muted); }
.recovery-page input { background: var(--input); color: var(--ink); border-color: #71887D; }
.recovery-page input:focus { outline-color: var(--focus); }
.recovery-page button { background: var(--accent); color: #231309; }
.recovery-page a, .recovery-page .eyebrow { color: var(--appearance-link); }
.recovery-page #message[data-error="true"] { color: #A33225; }
:root[data-theme="dark"] .recovery-page #message[data-error="true"] { color: #FFC1B0; }
:root[data-theme="light"] .recovery-page .brand-on-light { display: block; }
:root[data-theme="light"] .recovery-page .brand-on-dark { display: none; }
/* Institutional pages inherit the same preference without changing their content. */
:root[data-theme="dark"] .institutional-page :is(.topbar,.feature,.alternate,.toc,.legal,.skip) { background: var(--surface); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] .institutional-page :is(.legal p,.legal li,.feature p,.toc a) { color: var(--muted); }
:root[data-theme="dark"] .institutional-page :is(.legal a,.textlink,.feature .number) { color: var(--appearance-link); }
:root[data-theme="dark"] .institutional-page :is(.note,.aside) { background: var(--raised); color: #CBE4D8; border-color: #55776C; }
:root[data-theme="dark"] .institutional-page .nav .navcta { background: #FF6A00; color: #231309; }
:root[data-theme="dark"] .institutional-page .footer { color: #C7D9D0; }
@media print {
  :root, :root[data-theme="dark"] { color-scheme: light; --ink: #173B27; --muted: #4E6055; --bg: #FFFFFF; --surface: #FFFFFF; --white: #FFFFFF; }
  .theme-toggle, .theme-settings { display: none !important; }
  body, :root[data-theme="dark"] body { background: #FFFFFF !important; color: #173B27 !important; }
  .customer-document, #receipt-paper { background: #FFFFFF !important; color: #173B27 !important; }
}
