:root { color-scheme:light; }
.theme-toggle {
  display:inline-flex; align-items:center; justify-content:center; gap:8px; flex-shrink:0;
  min-height:42px; padding:9px 12px; border:1px solid var(--line); border-radius:11px;
  background:transparent; color:var(--ink); font-size:13px; font-weight:600;
}
.theme-toggle:hover { background:#eaf7f8; color:#006671; }
.theme-toggle svg { width:19px; height:19px; }
.login-theme { display:flex; justify-content:flex-end; margin-bottom:20px; }

:root[data-theme=dark] {
  color-scheme:dark;
  --ink:#e5edf2; --muted:#a8b9c4; --paper:#111a21; --line:#344550;
  --green:#55ced6; --green-dark:#77dce3; --mint:#203e46; --warm:#ff97ab;
  --surface:#1b2832; --surface-soft:#22343f; --accent-soft:#1b3c44;
  --shadow:0 4px 20px #00000018;
}
/* Dark surfaces retain the original spacing, type and responsive layouts. */
html[data-theme=dark] :is(.sidebar,.topbar,.panel,.metric,.pipeline-panel,.opportunity-card,
  .opportunity-list,.status-strip,.login-form-card,dialog,.form-actions) {
  background:var(--surface); border-color:var(--line); color:var(--ink);
}
html[data-theme=dark] :is(.login-layout,.login-form-area) { background:var(--paper); }
html[data-theme=dark] :is(.kanban-column,.segmented,.detail-tabs,.environment-card,
  .history-composer,.attribution,.inset-fields,.editor-line,.acceptance-evidence,
  .modal-heading .icon-button,.client-card-heading .icon-button) {
  background:var(--surface-soft); border-color:var(--line); color:var(--ink);
}
html[data-theme=dark] :is(input,select,textarea,.filters select,.btn.secondary,.demo-buttons>button,
  .complete-circle,.search-box) { background:#14232d; border-color:#47606e; color:var(--ink); }
html[data-theme=dark] .search-box input { background:transparent; border:0; }
html[data-theme=dark] input::placeholder,html[data-theme=dark] textarea::placeholder { color:#9aafbc; }
html[data-theme=dark] :is(input:focus,select:focus,textarea:focus,.search-box:focus-within) {
  border-color:var(--green); box-shadow:0 0 0 3px #55ced620;
}
html[data-theme=dark] :is(input[readonly],.editor-line input:disabled) { background:var(--surface-soft); color:#b7cbd6; }
html[data-theme=dark] :is(.btn.secondary:not(:disabled):hover,.demo-buttons>button:hover,
  .icon-button:not(:disabled):hover,.icon-button.selected,.text-button:not(:disabled):hover,
  .opportunity-row:hover,.theme-toggle:hover) { background:var(--accent-soft); border-color:#4b969f; color:var(--green-dark); }
html[data-theme=dark] .theme-toggle { color:var(--ink); }
html[data-theme=dark] :is(.segmented button.active,.detail-tabs button.active) { background:#31505b; color:#a0eef1; }
html[data-theme=dark] :is(.sidebar .nav-item,.segmented button,.detail-tabs button,.icon-button,
  .profile .icon-button) { color:#b4c6d1; }
html[data-theme=dark] :is(.sidebar .nav-item:hover,.sidebar .nav-item.active) { background:var(--accent-soft); color:#8fe3e8; }
html[data-theme=dark] .sidebar .nav-item.active:before { background:var(--green); }
/* Use the official vector outlines with light lettering directly on the dark surface. */
.logo-dark { display:none; }
html[data-theme=dark] .logo-light { display:none; }
html[data-theme=dark] .logo-dark { display:block; }
html[data-theme=dark] .sidebar .brand { background:transparent; padding:0 15px; border-radius:0; }
html[data-theme=dark] .login-brand .brand { background:transparent; box-shadow:none; border-radius:0; }
html[data-theme=dark] :is(.column-header h2,.card-value,.data-grid dd,.status-value,
  .description-block h3,.timeline-meta strong,.company-contact strong,.company-contacts-heading h3,
  .client-opportunities>h3,.empty-state h3,.login-form-card h2,.login-form-card label,
  .modal-heading~form label,.crew-fieldset legend) { color:var(--ink); }
html[data-theme=dark] :is(.brand-caption,.nav-caption,.breadcrumb,.today-label,.eyebrow,
  .page-heading p,.detail-heading p,.metric-top,.metric>small,.metric>strong span,.column-total,
  .card-number,.card-date,.opportunity-card .company,.card-footer,.amount-empty,
  .column-empty,.board-bottom,.quiet-note,.app-footer,.view-label,.environment-card p,
  .task-row small,.compact-opportunity small,.back-link,.status-strip small,.data-grid dt,
  .description-block p,.attribution,.attribution small,.reservation-note p,.reservation-note small,
  .reservation-summary p,.rental-finance-grid small,.rental-finance-grid span,.evidence-row small,
  .resource-row small,.availability-row small,.evidence-row p,.rental-window-note,.job-card .job-company,
  .history-subtitle,.composer-label,.history-composer small,.history-filters button,
  .timeline-meta time,.entry-type,.timeline-entry p,.quote-period,.quote-lines small,.quote-totals>span,
  .quote-intro p,.quote-list-row small,.captured-mail>p,.acceptance-evidence p,.client-card>p,
  .contact-line,.company-activity,.company-contact small,.company-contact span,.directory-toolbar>span,
  .product-row-main>small,.product-row-main>p,.product-stock small,.product-price small,
  .inventory-history small,.user-row small,.roadmap-step p,.empty-state,.quote-number-note span,
  .validity-hint,.quote-editor-heading>span,#quote-editor-totals span,.login-form-card>p,
  .demo-access>strong,.demo-access small,.demo-access code) { color:var(--muted); }
html[data-theme=dark] :is(.rental-finance-grid>div,.availability-result,.reservation-note,.quote-note,
  .quote-number-note,.rental-days-summary,.delivery-line,.inventory-summary,.roadmap-step.ready,
  .attachment,.selected-proposal,.notice.subtle,.source-tag,.task-hint,.test-chip,.count-pill,
  .avatar,.profile .avatar,.tone-1,.client-card-heading .client-icon,.detail-tabs button>span,
  .metric-top svg,.timeline-icon,.compose-mail-button) {
  background:var(--accent-soft); border-color:#385c66; color:#8fe3e8;
}
html[data-theme=dark] :is(.text-button,.quote-code,.quote-rental-days,.rental-finance-grid strong,
  .job-schedule,.availability-row a,.client-opportunities>a,.quote-number-note strong,.inventory-summary span,
  .reservation-note h2,.local-label,.task-hint small) { color:#8fe3e8; }
html[data-theme=dark] .delivery-line .product-label { color:#8fe3e8!important; }
html[data-theme=dark] .delivery-line input[readonly] { color:#8fe3e8; background:transparent; }
html[data-theme=dark] :is(.task-hint.muted,.badge,.badge.new,.badge.draft,.column-count,
  .tone-2,.timeline-entry.email_test .timeline-icon) { background:#30424f; border-color:var(--line); color:#c0d0dc; }
html[data-theme=dark] :is(.badge.conversation,.kanban-column[data-stage=conversation] .column-count) { background:#20444e; color:#8fe3e8; }
html[data-theme=dark] :is(.badge.quoted,.badge.test_captured,.kanban-column[data-stage=quoted] .column-count,
  .timeline-entry.internal_note .timeline-icon) { background:#403624; border-color:#6b5834; color:#f3cf8c; }
html[data-theme=dark] .notice { background:#403624; border-color:#6b5834; color:#f3cf8c; }
html[data-theme=dark] :is(.badge.pending,.badge.lost,.kanban-column[data-stage=pending] .column-count,
  .task-hint.overdue,.count-pill.overdue,.form-error,.tone-0) { background:#492a39; border-color:#784052; color:#ffb0c0; }
html[data-theme=dark] .task-hint.overdue small { color:#ffb0c0; }
html[data-theme=dark] :is(.badge.accepted,.badge.won) { background:#20463e; color:#93e5c8; }
html[data-theme=dark] .metric:nth-child(3) .metric-top svg { background:#492a39; color:#ffb0c0; }
html[data-theme=dark] :is(.metric:first-child,.metric:first-child .metric-top svg) { background:#29414e; border-color:#496575; }
html[data-theme=dark] :is(.metric:first-child .metric-top,.metric:first-child>small) { color:#c5d6e1; }
html[data-theme=dark] :is(.filters,.card-footer,.task-row,.timeline-entry,.modal-heading,.form-actions,
  .quote-lines>div,.quote-totals,#quote-editor-totals,.company-contacts-heading,.company-contact,
  .product-row,.inventory-history>div,.demo-access,.history-filters,.history-composer,
  .quote-list-row,.opportunity-row,.user-row,.compact-opportunity) { border-color:var(--line); }
html[data-theme=dark] dialog::backdrop { background:#03090ec4; }
html[data-theme=dark] #toast { background:#29414e; border-color:#5b7b8b; color:#f0f7fc; }
html[data-theme=dark] #toast.error { background:#492a39; border-color:#a75a72; }
html[data-theme=dark] .composer-label { background:var(--surface-soft); }
html[data-theme=dark] .notice.subtle { background:var(--accent-soft); border-color:#385c66; color:#8fe3e8; }
html[data-theme=dark] :is(.login-brand,.focus-card,.page-heading[data-page=crm]) {
  background:linear-gradient(120deg,#123e48,#17616b);
}
html[data-theme=dark] :is(.login-brand,.focus-card,.page-heading[data-page=crm]) .eyebrow { color:#a8e5e9; }
html[data-theme=dark] :is(.login-brand,.focus-card,.page-heading[data-page=crm]) p { color:#e0f5f6; }
@media(max-width:760px) {
  .theme-toggle { width:40px; min-height:40px; padding:9px; }
  .theme-toggle span { display:none; }
  .topbar-right { gap:8px; }
  .topbar .test-chip { display:none; }
  .login-theme .theme-toggle { width:auto; padding:9px 12px; }
  .login-theme .theme-toggle span { display:inline; }
}