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

/* the switch button (header + mobile menu) */
.thm{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;flex:none;transition:background .25s,color .25s,border-color .25s}
.thm:hover{border-color:var(--ink)}
.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}
.hd-nav.r .thm{margin-left:-14px}
.mp .thm{position:absolute;top:26px;right:74px}

/* ---------- dark mode ---------- */
html.dark{
  --bg:#0d1822; --paper:#13212d; --box:#1a2a37; --ink:#eef2f5; --text:#c4cdd4; --soft:#8f9ba5; --line:rgba(255,255,255,.13);
  color-scheme:dark;
}
html.dark body{background:var(--bg);color:var(--text)}

/* logos: light versions */
html.dark img[src$="logo-h-dark.png"]{content:url("images/logo/logo-h-light.png")}
html.dark img[src$="logo-dark.png"]{content:url("images/logo/logo-light.png")}

/* header, mobile menu, loader */
html.dark .hd,html.dark .mp .pn{background:var(--paper)}
html.dark .hd.sh{box-shadow:0 1px 0 var(--line)}
html.dark .mp{background:rgba(0,0,0,.55)}

/* buttons: outline on dark, light fill on hover */
html.dark .btn{background:transparent;border-color:var(--ink);color:var(--ink)}
html.dark .btn:hover,html.dark .btn.fill,
html.dark .hd-book:hover,html.dark .hd-book.on,
html.dark .ft .soc a:hover{background:#eef2f5;border-color:#eef2f5;color:#0d1822}
html.dark .btn.fill:hover{background:transparent;color:var(--ink)}
html.dark .btn.ghost{background:transparent;border-color:#fff;color:#fff}
html.dark .btn.ghost:hover{background:#fff;color:#14283a}
/* buttons sitting on photos keep their white look */
html.dark .card.img .btn{background:#fff;border-color:#fff;color:#14283a}
html.dark .card.img .btn:hover{background:#14283a;border-color:#14283a;color:#fff}

/* dark navy panels stay dark (they would turn light otherwise) */
html.dark .tri .pn,html.dark .cta{background:#1a2a37;color:#fff}
html.dark .cta .btn{border-color:#fff;color:#fff}
html.dark .cta .btn:hover,html.dark .cta .btn.fill{background:#fff;color:#14283a}
html.dark .cta .btn.fill:hover{background:transparent;color:#fff}
html.dark .tri .pn .btn{background:#fff;border-color:#fff;color:#14283a}
html.dark .tri .pn .btn:hover{background:transparent;color:#fff}

/* menu page sticky category bar */
html.dark .cats{background:rgba(13,24,34,.96)}

/* forms */
html.dark input[type=text],html.dark input[type=email],html.dark input[type=tel],html.dark input[type=date],html.dark select,html.dark textarea,html.dark .file{
  background-color:var(--paper);color:var(--ink);border-color:rgba(255,255,255,.28)}
html.dark select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23eef2f5' stroke-width='1.6'/%3E%3C/svg%3E")}
html.dark input::placeholder,html.dark textarea::placeholder{color:rgba(255,255,255,.4)}
html.dark .ppl span{border-color:rgba(255,255,255,.28);background:transparent;color:var(--ink)}
html.dark .ppl input:checked+span{background:#eef2f5;border-color:#eef2f5;color:#0d1822}
html.dark button.send,html.dark .cv-ext a.send{background:#eef2f5;border-color:#eef2f5;color:#0d1822}
html.dark button.send:hover,html.dark .cv-ext a.send:hover{background:transparent;color:var(--ink)}
html.dark #formErr{border-color:#ff7a66!important;color:#ff9b8a!important}

/* map: soften the bright map a little */
html.dark iframe[src*="maps.google"]{filter:brightness(.82) contrast(1.05)}

/* chat helper */
html.dark .cb-panel,html.dark .cb-chips,html.dark .cb-form,html.dark .cb-note{background:var(--paper)!important;color:var(--text)}
html.dark .cb-body{background:var(--bg)!important}
html.dark .cb-head{background:#0a131b!important}
html.dark .cb-b{background:var(--box)!important;color:var(--ink)!important;border-color:var(--line)!important}
html.dark .cb-me .cb-b,html.dark .cb-m.me .cb-b{background:#f14523!important;color:#fff!important}
html.dark .cb-chip,html.dark .cb-chips button{background:transparent!important;color:var(--ink)!important;border-color:rgba(255,255,255,.28)!important}
html.dark .cb-in{background:var(--bg)!important;color:var(--ink)!important;border-color:rgba(255,255,255,.28)!important}
html.dark .cb-head,html.dark .cb-head *{color:#eef2f5!important}
html.dark .cb-head button{border-color:rgba(255,255,255,.28)!important;background:transparent!important}
html.dark .cb-dot{color:inherit}
/* menu page: arrows/fade at the ends of the category bar */
html.dark .ca.prev{background:linear-gradient(90deg,#0d1822 50%,rgba(13,24,34,0))}
html.dark .ca.next{background:linear-gradient(270deg,#0d1822 50%,rgba(13,24,34,0))}
html.dark .ca{color:var(--ink)}
html.dark mark{background:rgba(241,69,35,.35);color:#fff}
/* cocktail finder pop-up */
html.dark #fm .box{--qf-card:var(--paper);--qf-tint:rgba(241,69,35,.14)}
html.dark #fm .x{color:var(--ink)}
/* cocktail finder bubble */
html.dark .cf-tip{background:#eef2f5;color:#0d1822}
html.dark .cf-tip-x{background:rgba(13,24,34,.1);color:#0d1822}
/* menu page: printed-menu leaders */
html.dark .it .dots{border-bottom-color:rgba(255,255,255,.32)}