/* Night (owner 25 Oct 2026): the shop list and the candle pages go dark, every candle burns in the dark.
   Loaded only on the shop list and candle pages; the cart drawer and checkout keep their own light colours. */
html[data-night]{--soot:#efe6dc;--wax:#0e0b0a;--linen:#2a221f;--ash:#a09087;--oxblood:#efe6dc;color-scheme:dark}
html[data-night] body{background:#0e0b0a;color:#efe6dc}
html[data-fade] body,html[data-fade] .top,html[data-fade] .bar,html[data-fade] footer,html[data-fade] .buybar,html[data-fade] .card .name,html[data-fade] .card .price,html[data-fade] .info,html[data-fade] .btn{transition:background-color .6s ease,color .6s ease,border-color .6s ease,box-shadow .6s ease}

/* header, footer, buttons */
html[data-night] .top.solid{background:rgba(14,11,10,.94);color:#efe6dc;box-shadow:0 1px 0 #2a221f}
html[data-night] .top.solid .brand img{filter:brightness(0) invert(.92)}
html[data-night] footer{background:#070504;color:#b9aba1;border-top:1px solid #2a221f}
html[data-night] .fcontact b{color:#efe6dc}
html[data-night] .btn{background:#2a221f;color:#efe6dc}
html[data-night] .btn:hover{background:#3a2f2b}
html[data-night] .btn.dark{background:#efe6dc;color:#1c1412}
html[data-night] .btn.dark:hover{background:#fff}
html[data-night] .btn.ghost{background:transparent;color:inherit}
html[data-night] .qadd{background:rgba(36,29,26,.92);color:#efe6dc;box-shadow:0 4px 14px rgba(0,0,0,.5)}
html[data-night] .qadd:hover{background:#3a2f2b}

/* shop list */
html[data-night] .bar{background:rgba(14,11,10,.96)}
html[data-night] .search,html[data-night] .sort{background:#1a1412;color:#efe6dc}
html[data-night] .feature{background:#1a1412;color:#efe6dc}
html[data-night] .feature p{color:#d8cabd}

/* the candle in the dark on a card: laid over the day photo, the page colour around it */
.card .media .dark{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;z-index:2;pointer-events:none;transition:opacity .6s ease}
html[data-night] .card .media .dark.ok{opacity:1}
html[data-night] .card .media{background:#0e0b0a}
html[data-night] .card .media:has(.dark.ok){border-radius:0}
html[data-night] .card .media .hv{display:none}

/* candle page */
html[data-night] .stage{background:#0e0b0a}
html[data-night] .arrow{background:rgba(36,29,26,.85);color:#efe6dc;box-shadow:0 2px 10px rgba(0,0,0,.5)}
html[data-night] .arrow:hover{background:#3a2f2b}
html[data-night] .buybar{background:rgba(14,11,10,.97);box-shadow:0 -1px 0 #2a221f}
html[data-night] .info .btn.add.soft,html[data-night] .buybar .bb-add{background:#efe6dc;color:#1c1412}
html[data-night] .info .btn.add.soft:hover,html[data-night] .buybar .bb-add:hover{background:#fff}
.nslide{background:#0e0b0a}
.nslide img{opacity:0;transition:opacity .4s}
.nslide img.ok{opacity:1}

/* Day / Night switch */
.tg{display:flex;gap:2px;align-items:center}
.tg button{border:0;background:none;cursor:pointer;padding:6px 8px;color:var(--ash);font-size:15px;text-underline-offset:6px}
.tg button[aria-pressed="true"]{color:var(--soot);text-decoration:underline}
.daynight button{display:inline-flex;align-items:center;gap:6px}
.daynight svg{width:16px;height:16px;flex:none}
.views button{display:grid;place-items:center;width:36px;height:36px;padding:0}
.views svg{width:20px;height:20px}
.views button[aria-pressed="true"]{text-decoration:none}
.views button[aria-pressed="false"]{opacity:.5}
/* candle page: a small switch on the photo, top left */
.dn-chip{position:absolute;top:12px;left:12px;z-index:4;display:inline-flex;align-items:center;gap:7px;border:0;border-radius:99px;padding:7px 14px 7px 11px;font-size:14px;line-height:1;cursor:pointer;background:rgba(243,236,228,.9);color:#1c1412;box-shadow:0 2px 10px rgba(28,20,18,.16);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.dn-chip svg{width:16px;height:16px;flex:none}
.dn-chip .sun{display:none}
.dn-chip[data-to="day"] .sun{display:block}
.dn-chip[data-to="day"] .moon{display:none}
html[data-night] .dn-chip{background:rgba(36,29,26,.9);color:#efe6dc;box-shadow:0 2px 10px rgba(0,0,0,.5)}