/* QUEEN — light / dark switch.
   The normal (light) look is unchanged; everything below "html.dark" only applies when dark mode is on. */

/* the switch button (header + full-screen menu) — the header is always black, so it's white */
.thm{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.32);border-radius:50%;background:transparent;color:#fff;cursor:pointer;flex:none;transition:background .25s,color .25s,border-color .25s}
.thm:hover{background:#fff;color:#0b0b0b;border-color:#fff}
.thm svg{width:16px;height:16px}
.thm .t-sun{display:none}
html.dark .thm .t-sun{display:block}
html.dark .thm .t-moon{display:none}
.qh-l .thm{margin-left:-12px}
.qo-foot .thm{margin-left:18px}

/* ---------- dark mode ---------- */
html.dark{
  --ink:#ededed; --paper:#0e0e0e; --cream:#161616; --alt:#161616; --mute:rgba(255,255,255,.6); --grey:rgba(255,255,255,.62); --line:rgba(255,255,255,.14);
  color-scheme:dark;
}
html.dark body{background:#0e0e0e!important;color:#ededed}

/* light sections → dark */
html.dark section.alt,html.dark .events,html.dark .m-head{background:#161616!important;color:#ededed}
html.dark .side-nav{background:#0e0e0e}
html.dark .car-track figure{background:#1c1c1c}
html.dark .map{background:#1c1c1c;filter:grayscale(1) invert(.9) contrast(.9)}

/* buttons that fill black on hover/selected → fill white with black text */
html.dark .btn:hover,html.dark .rev-b:hover,html.dark .car-nav button:hover,
html.dark .chips input:checked+span,html.dark .r-info .call:hover,html.dark .nf .bt a.fill,html.dark .nf .bt a:hover{background:#ededed!important;color:#0b0b0b!important;border-color:#ededed!important}
html.dark .nf .bt a.fill:hover{background:transparent!important;color:#ededed!important}
html.dark .send{background:#ededed!important;border-color:#ededed!important;color:#0b0b0b!important}
html.dark .send:hover{background:transparent!important;color:#ededed!important}
html.dark .job .pill,html.dark .file .pl{background:#ededed;color:#0b0b0b}

/* forms */
html.dark .in-t,html.dark select.in-t,html.dark .cat-pick select,html.dark .search input{background-color:#161616;color:#ededed;border-color:rgba(255,255,255,.28)}
html.dark select.in-t{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23ededed' stroke-width='1.6'/%3E%3C/svg%3E")}
html.dark .fi{border-color:rgba(255,255,255,.3);color:#ededed}
html.dark .fi:focus,html.dark .file:hover{background-color:#161616}
html.dark input::placeholder,html.dark textarea::placeholder{color:rgba(255,255,255,.4)}
html.dark .file{border-color:rgba(255,255,255,.3)}
html.dark #formErr{border-color:#ff7a66!important;color:#ff9b8a!important}

/* privacy page text */
html.dark .pol p,html.dark .pol li{color:rgba(255,255,255,.75)}
html.dark .pol li::before{background:#ededed}

/* the dark crown on the menu page → white crown */
html.dark img[src$="crown-dark.png"]{content:url("images/logo/crown-light.png")}

/* chat helper */
html.dark .cb-panel,html.dark .cb-chips,html.dark .cb-form,html.dark .cb-note{background:#121212!important;color:#ddd}
html.dark .cb-body{background:#0e0e0e!important}
html.dark .cb-head{background:#0b0b0b!important}
html.dark .cb-head,html.dark .cb-head *{color:#ededed!important}
html.dark .cb-head button{border-color:rgba(255,255,255,.28)!important;background:transparent!important}
html.dark .cb-m.bot .cb-b{background:#1c1c1c!important;color:#ededed!important;border-color:rgba(255,255,255,.12)!important}
html.dark .cb-m.me .cb-b{background:#ededed!important;color:#0b0b0b!important}
html.dark .cb-chips button{background:transparent!important;color:#ededed!important;border-color:rgba(255,255,255,.28)!important}
html.dark .cb-in{background:#0e0e0e!important;color:#ededed!important;border-color:rgba(255,255,255,.28)!important}
html.dark .cb-send,html.dark .cb-fab{background:#ededed!important;color:#0b0b0b!important}
/* small greys that would vanish on dark */
html.dark .sides button{color:rgba(255,255,255,.3)}
html.dark .sides button.on{color:#ededed}
html.dark .rev-dots button{background:rgba(255,255,255,.25)}
html.dark .rev-dots button.on{background:#ededed}
html.dark .car-bar{background:rgba(255,255,255,.18)}
html.dark .ev .pic{background:#1c1c1c}
html.dark .fi::placeholder{color:rgba(255,255,255,.4)}
html.dark .cb-av{background:#1c1c1c!important;border-color:rgba(255,255,255,.15)!important}
/* cocktail finder + mobile bar section */
html.dark .cf{background:#080808}
/* menu page: printed-menu leaders + English names */
html.dark .item .ld{border-bottom-color:rgba(255,255,255,.32)}
html.dark .item .en{color:rgba(255,255,255,.75)}
html.dark .legal{color:rgba(255,255,255,.72)}
