/* MyLogbook — foglio di stile del sito.
   Colori solo dalle variabili dei temi (questi blocchi sono l'unico posto con colori scritti),
   niente opacity; caratteri e spazi in rem, così il testo cresce con il pannello «Aspetto».
   Contrasti (li controlla sito/tests/test_stile.py): testo e collegamenti 4,5:1 su fondo, superficie
   e campo; bordo dei campi e anello di messa a fuoco 3:1; testo dei pulsanti 4,5:1 sul pulsante. */

@font-face{font-family:"Open Sans";src:url("../fonts/OpenSans.c24a515faa91.woff2") format("woff2");
  font-weight:300 800;font-stretch:75% 100%;font-style:normal;font-display:swap}
@font-face{font-family:"Open Sans";src:url("../fonts/OpenSans-Italic.0b02bf8aa34b.woff2") format("woff2");
  font-weight:300 800;font-stretch:75% 100%;font-style:italic;font-display:swap}

/* Chiaro (anche il predefinito) */
:root{
  --fondo:#f6f8f9; --superficie:#ffffff; --campo:#ffffff;
  --testo:#16202a; --testo-2:#45525e; --linea:#cdd5dc; --bordo-campo:#6a7681;
  --accento:#0b5d73; --pulsante:#0b5d73; --pulsante-testo:#ffffff;
  --errore:#a8231b; --ok:#1d6a39; --fuoco:#0b5d73;
}
/* Penombra */
:root[data-theme="medio"]{
  --fondo:#2a3239; --superficie:#333c45; --campo:#39434d;
  --testo:#f1f4f6; --testo-2:#cad3db; --linea:#56636f; --bordo-campo:#9ba8b4;
  --accento:#86d4e3; --pulsante:#86d4e3; --pulsante-testo:#10232a;
  --errore:#ffb4ab; --ok:#94dcab; --fuoco:#86d4e3;
}
/* Scuro */
:root[data-theme="dark"]{
  --fondo:#0f141a; --superficie:#18202a; --campo:#1d2631;
  --testo:#eef2f5; --testo-2:#b9c4ce; --linea:#3a4653; --bordo-campo:#8794a1;
  --accento:#6cc6d8; --pulsante:#6cc6d8; --pulsante-testo:#0b1a20;
  --errore:#ff9e94; --ok:#7ed49b; --fuoco:#6cc6d8;
}
/* Automatico: con il sistema scuro, gli stessi colori del tema Scuro (copia: lo controlla un test) */
@media (prefers-color-scheme:dark){
  :root:not([data-theme]){
    --fondo:#0f141a; --superficie:#18202a; --campo:#1d2631;
    --testo:#eef2f5; --testo-2:#b9c4ce; --linea:#3a4653; --bordo-campo:#8794a1;
    --accento:#6cc6d8; --pulsante:#6cc6d8; --pulsante-testo:#0b1a20;
    --errore:#ff9e94; --ok:#7ed49b; --fuoco:#6cc6d8;
  }
}
/* Il pannello «Aspetto» prende i colori dalle variabili del sito */
:root{
  --asp-sfondo:var(--superficie);--asp-testo:var(--testo);--asp-tenue:var(--testo-2);--asp-bordo:var(--bordo-campo);
  --asp-accento:var(--pulsante);--asp-accento-testo:var(--pulsante-testo);--asp-campo:var(--campo)}

*,*::before,*::after{box-sizing:border-box}
html{font-size:100%}
body{margin:0;background:var(--fondo);color:var(--testo);font-family:"Open Sans",system-ui,sans-serif;
  font-size:1.0625rem;line-height:1.6}
h1,h2,h3{line-height:1.25;margin:1.6rem 0 .7rem}
h1{font-size:2rem;margin-top:1.2rem}
h2{font-size:1.4rem}
h3{font-size:1.15rem}
a{color:var(--accento);text-underline-offset:.15em}
a:hover{text-decoration-thickness:.15em}
img{max-width:100%;height:auto}
code{font-size:.92em}
.contenitore{width:100%;max-width:72rem;margin:0 auto;padding:0 1rem}

.salta{position:absolute;left:1rem;top:-10rem;background:var(--superficie);color:var(--testo);padding:.5rem 1rem;
  border:2px solid var(--fuoco);z-index:10}
.salta:focus{top:.5rem}

.testata{background:var(--superficie);border-bottom:1px solid var(--linea)}
.testata-riga{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.2rem;padding-top:.7rem;padding-bottom:.7rem}
.marchio{font-weight:800;font-size:1.3rem;color:var(--testo);text-decoration:none;letter-spacing:.01em}
.navigazione{flex:1 1 auto}
.navigazione ul{display:flex;flex-wrap:wrap;gap:.2rem 1rem;list-style:none;margin:0;padding:0}
.navigazione a{color:var(--testo);font-weight:600;text-decoration:none;padding:.2rem 0;border-bottom:2px solid transparent}
.navigazione a:hover,.navigazione a[aria-current=page]{border-bottom-color:var(--accento)}
.esci{margin:0}

main{min-height:60vh}
.piede{border-top:1px solid var(--linea);background:var(--superficie);margin-top:3rem;padding:1rem 0;color:var(--testo-2);font-size:.95rem}
.piede-voci{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;list-style:none;margin:0;padding:0}
.piede a{color:var(--accento)}

/* Mappa delle località */
.mappa{height:24rem;max-height:60vh;margin:1rem 0;border:1px solid var(--linea);border-radius:.4rem}
