/* --- Night mode ------------------------------------------------------------
   Applied by JS (html.is-dark) only while the sun is down in Athens.
   The idea: the deep night-blue becomes the ground, and everything that was
   ink-black — text, outlines, drawn walls, rocks, dithers' darks — renders in
   the daytime page colour instead (captured into --day-ground by JS before
   the flip). One stylesheet, all overrides live here. */

html.is-dark {
  /* swap: ground goes night-blue, ink takes the day ground colour */
  --ground: #0b0056;
  --black: var(--day-ground, #e4d9c4);
  /* "white" table/panel fills sit on the night ground too */
  --white: #0b0056;
  /* the map dims to night water */
  --map-land: #1a1170;
  --map-ocean: #0b0056;
}

/* text that hardcodes black */
html.is-dark body,
html.is-dark .foot-jump a,
html.is-dark .sea-link,
html.is-dark .hills-link,
html.is-dark .orientation-toggle,
html.is-dark .orientation__text,
html.is-dark .alphabet button,
html.is-dark .alphabet a,
html.is-dark .alphabet .is-disabled,
html.is-dark .person2-nav__btn,
html.is-dark .shuffle,
html.is-dark .sound-toggle,
html.is-dark .orientation__sound,
html.is-dark .newsletter__field,
html.is-dark .newsletter__submit,
html.is-dark .slideshow__caption,
html.is-dark .map-toggle,
html.is-dark .view-toggle,
html.is-dark .place-marker__name,
html.is-dark .sun-label {
  color: var(--black);
}

/* the coloured home blocks stay exactly as by day: their own fill, black ink
   (only the uncoloured, ground-sitting cards take the night ink). The
   .grid.is-list selector needs restating — it otherwise out-specifies this. */
html.is-dark .card--color,
html.is-dark .grid.is-list .card--color {
  color: #000;
}

/* lines that hardcode black */
html.is-dark .colophon-div {
  border-top-color: var(--black);
}

/* the door back-button on detail pages: night outline + knob */
html.is-dark .nav__door {
  border-color: var(--black);
}
html.is-dark .nav__door::after {
  background: var(--black);
}

/* the active A–Z letter sits on the orange chip — black ink like daytime */
html.is-dark .alphabet button.is-active,
html.is-dark .alphabet a.is-active,
html.is-dark .person2-nav__btn:hover {
  color: #000;
}

/* hovered hide/show-map button fills orange — black ink there */
html.is-dark .map-toggle:hover {
  color: #000;
}

/* hovered shuffle button fills orange — black ink there */
html.is-dark .shuffle:hover {
  color: #000;
}

/* places popup: night table borders, no focus ring on its links */
html.is-dark .place-popup__table th,
html.is-dark .place-popup__table td {
  border-color: var(--black);
}

/* map zoom buttons: night glyphs (the !important matches the light rules',
   which must out-rank MapLibre's own late-loading stylesheet) */
html.is-dark .places-map .maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 29 29"><path d="M14.5 8v13M8 14.5h13" stroke="white" stroke-width="1"/></svg>') !important;
}
html.is-dark .places-map .maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 29 29"><path d="M8 14.5h13" stroke="white" stroke-width="1"/></svg>') !important;
}

/* book spines: no outline at night (the inline border-color needs the
   important); drop the -1px overlap that only existed to hide the border seam
   against the shelf line */
html.is-dark .book {
  border-color: transparent !important;
  margin-bottom: 0;
}

/* the mobile "naive weekly / navigation" button reads in night ink, open or
   closed (it keeps the page colour, never an orange fill) */
html.is-dark .nav__burger {
  color: var(--black);
}

/* the "images" checkbox tick — the daytime × is a black-stroke SVG */
html.is-dark .print-noimg__box:checked {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10"><path d="M2 2l6 6M8 2l-6 6" stroke="white" stroke-width="1.1"/></svg>');
}
html.is-dark .deck-slider {
  background: var(--black);
}
html.is-dark .print-noimg__box {
  border-color: var(--black);
}

/* hovering a nav room at night: the fill is the (daytime) room colour, so
   the label takes black — or the per-section "Room text at night" colour
   set in the Panel */
html.is-dark .nav__cell:hover {
  color: var(--room-ink-night, #000);
}

/* everything hand-drawn with black SVG strokes/fills — ruins, walls, rocks,
   the boat, waves, the nav house, arrows (CSS wins over the attributes) */
html.is-dark [stroke="#000"] {
  stroke: var(--black);
}
html.is-dark [fill="#000"] {
  fill: var(--black);
}


/* the old logo (near-black art) flips to light on the night ground */
html.is-dark .colophon-logo {
  filter: invert(1);
}