:root {
  --bm-page: #f8fafc;
  --bm-surface: #ffffff;
  --bm-surface-soft: #f1f5f9;
  --bm-surface-raised: #ffffff;
  --bm-text: #0f172a;
  --bm-text-soft: #52616d;
  --bm-line: #dbe6eb;
  --bm-shadow: rgba(15, 23, 42, .10);
}

html[data-theme="dark"] {
  --bm-page: #07141b;
  --bm-surface: #0d222b;
  --bm-surface-soft: #102a34;
  --bm-surface-raised: #14313c;
  --bm-text: #edf7f8;
  --bm-text-soft: #aac1c9;
  --bm-line: #294854;
  --bm-shadow: rgba(0, 0, 0, .34);
}

.bm-theme-toggle {
  min-width: 2rem;
  height: 2rem;
  padding: 0 .55rem;
  border: 1px solid #cbd5e1;
  border-radius: .65rem;
  background: rgba(255, 255, 255, .92);
  color: #0b5d73;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  font-size: .72rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.bm-theme-toggle:hover { transform: translateY(-1px); border-color: #168fad; }
.bm-theme-toggle:focus-visible { outline: 3px solid rgba(66, 174, 197, .4); outline-offset: 2px; }
.bm-theme-toggle [data-theme-icon] { font-size: 1rem; width: 1rem; text-align: center; }

html[data-theme="dark"] body {
  background-color: var(--bm-page) !important;
  color: var(--bm-text) !important;
}
html[data-theme="dark"] .bm-theme-toggle {
  background: #17343f;
  border-color: #3b5b67;
  color: #bdebf4;
}

/* Shared Tailwind/DaisyUI surfaces used across public, drawing, proposal and admin pages. */
html[data-theme="dark"] :is(.bg-white, .bg-white\/95, .bg-white\/90, .bg-white\/10, .bg-slate-50, .bg-slate-100) {
  background-color: var(--bm-surface) !important;
}
html[data-theme="dark"] :is(.text-slate-950, .text-slate-900, .text-slate-800, .text-slate-700, .text-\[\#071820\], .text-cyan-950) {
  color: var(--bm-text) !important;
}
html[data-theme="dark"] :is(.text-slate-600, .text-slate-500, .text-slate-400) {
  color: var(--bm-text-soft) !important;
}
html[data-theme="dark"] :is(.border-slate-100, .border-slate-200, .border-slate-200\/60, .border-slate-200\/70, .border-slate-200\/80, .border-slate-300) {
  border-color: var(--bm-line) !important;
}
html[data-theme="dark"] :is(input, select, textarea, .input, .select, .textarea) {
  background-color: #102630 !important;
  border-color: #365560 !important;
  color: var(--bm-text) !important;
}
html[data-theme="dark"] :is(input, textarea)::placeholder { color: #8099a2 !important; }
html[data-theme="dark"] :is(input, select, textarea):focus { border-color: #42aec5 !important; }
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="time"] { color-scheme: dark; }
html[data-theme="dark"] :is(.shadow-sm, .shadow-xs, .shadow-lg) { --tw-shadow-color: var(--bm-shadow) !important; }

/* Public site. */
html[data-theme="dark"] .bm-nav-shell { background: rgba(10, 29, 37, .96) !important; border-color: #294854 !important; }
html[data-theme="dark"] .bm-brand-link { color: var(--bm-text) !important; }
html[data-theme="dark"] .bm-outline { background: #102a34 !important; border-color: #365c69 !important; color: #dff4f7 !important; }
html[data-theme="dark"] .bm-outline:hover { background: #173844 !important; color: #fff !important; }
html[data-theme="dark"] .bm-home-locations,
html[data-theme="dark"] .bm-products-section,
html[data-theme="dark"] #process { background: var(--bm-page) !important; }
html[data-theme="dark"] .bm-quick-contact,
html[data-theme="dark"] .bm-product-card,
html[data-theme="dark"] .bm-home-locations article,
html[data-theme="dark"] #process .rounded-2xl { background: var(--bm-surface) !important; border-color: var(--bm-line) !important; box-shadow: 0 18px 46px var(--bm-shadow); }
html[data-theme="dark"] :is(.bm-products-section h2, .bm-product-body h3, .bm-home-locations h3, #company-locations-title, .bm-error-hero h1) { color: var(--bm-text) !important; }
html[data-theme="dark"] :is(.bm-products-intro, .bm-product-body p, .bm-product-note, .bm-error-description) { color: var(--bm-text-soft) !important; }
html[data-theme="dark"] .bm-product-image { background: #17313a; }
html[data-theme="dark"] .bm-product-actions .bm-call-action { background: #102a34; color: #bdebf4; }
html[data-theme="dark"] .bm-error-hero { background: linear-gradient(145deg, #0b2630, #07141b); border-color: #294854; }
html[data-theme="dark"] #company-locations-map { filter: brightness(.72) contrast(1.08) saturate(.78); }
html[data-theme="dark"] #company-locations-map-status { background: #102a34 !important; }

/* Privacy policy: semantic dark palette so headings/contact blocks never inherit low-contrast utility colors. */
html[data-theme="dark"] .privacy-card {
  background: var(--bm-surface) !important;
  border-color: var(--bm-line) !important;
  color: var(--bm-text) !important;
}
html[data-theme="dark"] :is(.privacy-title, .privacy-section-title) { color: #f4fbfc !important; }
html[data-theme="dark"] :is(.privacy-intro, .privacy-section-body, .privacy-updated) { color: var(--bm-text-soft) !important; }
html[data-theme="dark"] .privacy-eyebrow { color: #67e8f9 !important; }
html[data-theme="dark"] .privacy-contact {
  background: #0e303b !important;
  border-color: #2f6170 !important;
  color: #d9f6fb !important;
}
html[data-theme="dark"] .privacy-contact-link { color: #67e8f9 !important; }

/* Draw/editor chrome; the scene itself keeps its real design colors. */
html[data-theme="dark"] :is(#property-panel, #canvas-panel, .budget-panel, .segment-card, .admin-proposal-card) {
  background: var(--bm-surface) !important;
  border-color: var(--bm-line) !important;
  color: var(--bm-text) !important;
}
html[data-theme="dark"] :is(#property-panel, #canvas-panel, .budget-panel) :is(label, h2, h3, strong) { color: var(--bm-text) !important; }
html[data-theme="dark"] :is(.canvas-history-btn, .draw-toggle-btn, #admin-save-proposal-btn, #admin-public-proposal-link) {
  background: #17343f !important;
  border-color: #3b5b67 !important;
  color: #dff4f7 !important;
}
html[data-theme="dark"] .canvas-clear-btn:not(:disabled) { background: #432918 !important; color: #fdba74 !important; border-color: #7c4a24 !important; }
html[data-theme="dark"] #canvas-wrapper { box-shadow: inset 0 0 0 1px #294854; }

/* Admin, proposal and read-only preview cards/tables. */
html[data-theme="dark"] :is(table, thead, tbody, tr, td, th) { border-color: var(--bm-line) !important; }
html[data-theme="dark"] tbody tr:hover { background-color: #132f39 !important; }
html[data-theme="dark"] :is(.material-stat, .material-group, .material-group-head, .material-table th) {
  background: var(--bm-surface) !important;
  border-color: var(--bm-line) !important;
  color: var(--bm-text) !important;
}
html[data-theme="dark"] .material-group-head { background: var(--bm-surface-soft) !important; }
html[data-theme="dark"] :is(.material-stat strong, .material-group-head h3) { color: var(--bm-text) !important; }
html[data-theme="dark"] .material-warnings { background: #3d3015 !important; color: #fde68a !important; border-color: #8b6b18 !important; }
html[data-theme="dark"] .mode-active { background: #168fad !important; color: #fff !important; }
html[data-theme="dark"] #schedule-button { background: #102a34 !important; border-color: #365560 !important; color: var(--bm-text) !important; }

@media (max-width: 420px) {
  .bm-theme-toggle { min-width: 1.85rem; padding: 0 .4rem; }
  .bm-theme-toggle [data-theme-label] { display: none !important; }
}

@media print {
  html, html[data-theme="dark"] { color-scheme: light !important; }
  html[data-theme="dark"] body { background: #fff !important; color: #0f172a !important; }
  .bm-theme-toggle { display: none !important; }
}

/* v176: shared admin semantic dark palette.
   Admin templates use Tailwind utility classes for status/offer cards. In dark
   mode, leaving a pale `bg-*-50` surface untouched while the page text becomes
   light can create nearly invisible copy (for example the Promotions off-peak
   card). Keep these semantic colors recognizable while giving them dark-mode
   surfaces, borders and readable foregrounds in one shared place. */
html[data-theme="dark"] body.admin-layout-enabled {
  --admin-tone-amber-bg:#35260d;
  --admin-tone-amber-bg-hover:#493716;
  --admin-tone-amber-border:#7c5a18;
  --admin-tone-amber-text:#fde68a;
  --admin-tone-sky-bg:#102d45;
  --admin-tone-sky-bg-hover:#163b59;
  --admin-tone-sky-border:#1d5f88;
  --admin-tone-sky-text:#bae6fd;
  --admin-tone-cyan-bg:#0b3140;
  --admin-tone-cyan-bg-hover:#104257;
  --admin-tone-cyan-border:#17627b;
  --admin-tone-cyan-text:#a5f3fc;
  --admin-tone-emerald-bg:#0d3227;
  --admin-tone-emerald-bg-hover:#124735;
  --admin-tone-emerald-border:#17724f;
  --admin-tone-emerald-text:#a7f3d0;
  --admin-tone-fuchsia-bg:#35133d;
  --admin-tone-fuchsia-bg-hover:#4b1a56;
  --admin-tone-fuchsia-border:#7a2d86;
  --admin-tone-fuchsia-text:#f5d0fe;
  --admin-tone-orange-bg:#3a210d;
  --admin-tone-orange-bg-hover:#4d2d12;
  --admin-tone-orange-border:#8a4a18;
  --admin-tone-orange-text:#fed7aa;
  --admin-tone-rose-bg:#3b1720;
  --admin-tone-rose-bg-hover:#51202c;
  --admin-tone-rose-border:#8b3046;
  --admin-tone-rose-text:#fecdd3;
  --admin-tone-teal-bg:#103630;
  --admin-tone-teal-bg-hover:#164942;
  --admin-tone-teal-border:#1d6e62;
  --admin-tone-teal-text:#99f6e4;
  --admin-tone-violet-bg:#271a46;
  --admin-tone-violet-bg-hover:#36235f;
  --admin-tone-violet-border:#5b3a91;
  --admin-tone-violet-text:#ddd6fe;
  --admin-tone-indigo-bg:#1d2750;
  --admin-tone-indigo-border:#3b4f95;
  --admin-tone-indigo-text:#c7d2fe;
}

/* Neutral light utility surfaces that were not covered by the original theme. */
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-white\/80,.bg-white\/70) {
  background-color:color-mix(in srgb,var(--bm-surface) 92%,transparent) !important;
}
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-slate-200,.bg-slate-100,.bg-slate-50\/80) {
  background-color:var(--bm-surface-soft) !important;
}
html[data-theme="dark"] body.admin-layout-enabled :is(.text-slate-950,.label-text) {
  color:var(--bm-text) !important;
}

/* Semantic light surfaces. */
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-amber-50,.bg-amber-100) { background-color:var(--admin-tone-amber-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-sky-50,.bg-sky-100) { background-color:var(--admin-tone-sky-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-cyan-50,.bg-cyan-50\/50,.bg-cyan-100) { background-color:var(--admin-tone-cyan-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-emerald-50,.bg-emerald-100) { background-color:var(--admin-tone-emerald-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-fuchsia-50,.bg-fuchsia-50\/40,.bg-fuchsia-100) { background-color:var(--admin-tone-fuchsia-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-orange-50,.bg-orange-100) { background-color:var(--admin-tone-orange-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-rose-50,.bg-rose-100) { background-color:var(--admin-tone-rose-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-teal-50,.bg-teal-100) { background-color:var(--admin-tone-teal-bg) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.bg-violet-50,.bg-violet-100) { background-color:var(--admin-tone-violet-bg) !important; }

/* Semantic borders. */
html[data-theme="dark"] body.admin-layout-enabled :is(.border-amber-100,.border-amber-200,.border-amber-200\/80,.border-amber-300) { border-color:var(--admin-tone-amber-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-sky-100,.border-sky-200,.border-sky-300) { border-color:var(--admin-tone-sky-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-cyan-100,.border-cyan-200,.border-cyan-300) { border-color:var(--admin-tone-cyan-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-emerald-100,.border-emerald-200,.border-emerald-200\/80,.border-emerald-300) { border-color:var(--admin-tone-emerald-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-fuchsia-100,.border-fuchsia-200,.border-fuchsia-300) { border-color:var(--admin-tone-fuchsia-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-orange-100,.border-orange-200,.border-orange-300) { border-color:var(--admin-tone-orange-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-rose-100,.border-rose-200,.border-rose-300) { border-color:var(--admin-tone-rose-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-teal-100,.border-teal-200,.border-teal-200\/80,.border-teal-300) { border-color:var(--admin-tone-teal-border) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.border-violet-100,.border-violet-200,.border-violet-200\/80,.border-violet-300) { border-color:var(--admin-tone-violet-border) !important; }

/* Semantic foregrounds. The amber locked badge intentionally keeps its dark
   foreground on bg-amber-400 because that saturated badge already has strong
   contrast in either theme. */
html[data-theme="dark"] body.admin-layout-enabled :is(.text-amber-600,.text-amber-700,.text-amber-800,.text-amber-900,.text-amber-950):not(.bg-amber-400) { color:var(--admin-tone-amber-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-sky-600,.text-sky-700,.text-sky-800,.text-sky-900,.text-sky-950) { color:var(--admin-tone-sky-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-cyan-600,.text-cyan-700,.text-cyan-800,.text-cyan-900,.text-cyan-950) { color:var(--admin-tone-cyan-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-emerald-600,.text-emerald-700,.text-emerald-800,.text-emerald-900,.text-emerald-950) { color:var(--admin-tone-emerald-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-fuchsia-600,.text-fuchsia-700,.text-fuchsia-800,.text-fuchsia-900,.text-fuchsia-950) { color:var(--admin-tone-fuchsia-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-orange-600,.text-orange-700,.text-orange-800,.text-orange-900,.text-orange-950) { color:var(--admin-tone-orange-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-rose-600,.text-rose-700,.text-rose-800,.text-rose-900,.text-rose-950) { color:var(--admin-tone-rose-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-teal-600,.text-teal-700,.text-teal-800,.text-teal-900,.text-teal-950) { color:var(--admin-tone-teal-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-violet-600,.text-violet-700,.text-violet-800,.text-violet-900,.text-violet-950) { color:var(--admin-tone-violet-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.text-indigo-600,.text-indigo-700,.text-indigo-800,.text-indigo-900,.text-indigo-950) { color:var(--admin-tone-indigo-text) !important; }

/* Keep hover states dark instead of flashing back to Tailwind's light tints. */
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-amber-100\/70:hover,
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-amber-200:hover { background-color:var(--admin-tone-amber-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-sky-50:hover { background-color:var(--admin-tone-sky-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.hover\:bg-cyan-100,.hover\:bg-cyan-100\/70):hover { background-color:var(--admin-tone-cyan-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.hover\:bg-emerald-50,.hover\:bg-emerald-100,.hover\:bg-emerald-100\/80):hover { background-color:var(--admin-tone-emerald-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-fuchsia-100:hover { background-color:var(--admin-tone-fuchsia-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-orange-100:hover { background-color:var(--admin-tone-orange-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-rose-100\/70:hover { background-color:var(--admin-tone-rose-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-violet-100:hover { background-color:var(--admin-tone-violet-bg-hover) !important; }
html[data-theme="dark"] body.admin-layout-enabled .hover\:bg-slate-50\/80:hover { background-color:var(--bm-surface-raised) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.hover\:text-cyan-800,.hover\:text-cyan-900):hover { color:var(--admin-tone-cyan-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled :is(.hover\:text-emerald-600,.hover\:text-emerald-700):hover { color:var(--admin-tone-emerald-text) !important; }
html[data-theme="dark"] body.admin-layout-enabled .hover\:text-rose-800:hover { color:var(--admin-tone-rose-text) !important; }

/* Native date/time chrome should follow the dark form surface too. */
html[data-theme="dark"] body.admin-layout-enabled :is(input[type="date"],input[type="time"],input[type="datetime-local"],input[type="month"],input[type="week"]) {
  color-scheme:dark;
}
