/* Theme toggle and alternate palette for Halden Builders, Premium.
   Generated by _design-system/builder/gallery_theme/apply.py; edit themes.py there, not this file. */
/* Theme toggle button. It inherits the header's text colour, so it reads correctly over
   footage and on solid bars alike. Hidden until the head script has set a theme (no-JS visitors
   keep the designed palette and never see a dead control). */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;margin:0;padding:0;border:1px solid color-mix(in srgb,currentColor 28%,transparent);border-radius:50%;background:transparent;color:inherit;line-height:0;cursor:pointer;transition:border-color .2s,background-color .2s}
.theme-toggle:hover{border-color:currentColor;background:color-mix(in srgb,currentColor 8%,transparent)}
.theme-toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.theme-toggle .theme-toggle__icon{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .theme-toggle__sun{display:none}
html[data-theme="dark"] .theme-toggle .theme-toggle__sun{display:block}
html[data-theme="dark"] .theme-toggle .theme-toggle__moon{display:none}
html:not([data-theme]) .theme-toggle{display:none}
@media (prefers-reduced-motion:reduce){.theme-toggle{transition:none}}
/* Toggle placement in this header. */
.topbar{justify-content:flex-start}
.topbar>.brand{margin-right:auto}
.topbar>.topbar__right{margin-left:auto}
.topbar>.theme-toggle{margin-left:-10px}
@media (max-width:860px){.topbar>.topbar__right{margin-left:0}.topbar>.theme-toggle{margin-left:0}}
/* Alternate palette. The designed palette stays the default. */
html[data-theme="light"]{color-scheme:light;--bg:#F3EFE8;--surface:#1B1B1A;--ink:#1B1B1A;--ink-dark:#F3EFE8;--muted:rgba(27,27,26,.66);--muted-dark:rgba(243,239,232,.66);--line:rgba(27,27,26,.14);--line-dark:rgba(243,239,232,.14);--accent:#8A6425;--accent-deep:#B8893A}
/* The hero film stage, photo panels and comparison frames stay dark, as designed. */
html[data-theme="light"] :is(.hero__stage,.panel,.compare__frame,.compare__tag,.page-hero__media figcaption){--bg:#1B1B1A;--ink:#F3EFE8;--muted:rgba(243,239,232,.66);--line:rgba(243,239,232,.14);--accent:#B8893A;color:var(--ink)}
html[data-theme="light"] .btn--brass{background:#B8893A;color:#1B1B1A}
html[data-theme="light"] .callbar__cta{background:#B8893A}
html[data-theme="light"] .btn--ghost{background:transparent}
html[data-theme="light"] .panel .btn--ghost{background:rgba(27,27,26,.35)}
html[data-theme="light"] .section--light .faq__list details p{color:var(--muted-dark)}
html[data-theme="light"] .finance__card .eyebrow{color:#8A6425}
html[data-theme="light"] .review{background:#EAE5DC}
html[data-theme="light"] .review footer span{color:#74531E}
html[data-theme="light"] .map{background:#E6E1D6}
html[data-theme="light"] .field :is(input,select,textarea){background:#FFFFFF}
@media (max-width:767px){html[data-theme="light"] .callbar{background:color-mix(in srgb,var(--bg) 94%,transparent)}}