/* Sea Travel Tour Operator — foglio di stile del sito.
   L'aspetto comune (tavolozza blu navy, Barlow, testata, menu, piede, prima pagina) è nel foglio della famiglia
   MyBluSea, pj_base/famiglia/myblusea.css (si cambia in pj-base). Qui solo ciò che è del simulatore e delle iscrizioni.
   Colori solo dalle variabili dei temi (questi blocchi sono l'unico posto con colori scritti), niente opacity;
   caratteri e spazi in rem. Contrasti: li controlla sito/tests/test_stile.py. */

/* Chiaro: --barra è il colore delle colonne del grafico (3:1 sul pannello, 1.4.11) */
:root{
  --barra:#6f8fbe;
}
/* Penombra */
:root[data-theme="medio"]{
  --barra:#35567f;
}
/* Scuro */
:root[data-theme="dark"]{
  --barra:#5b84b8;
}
/* 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]){
  --barra:#5b84b8;
  }
}

main{min-height:60vh}
.pagina{padding-bottom:2rem}
.pos{color:var(--ok);font-weight:600}
.neg{color:var(--errore);font-weight:600}

/* Elenchi e moduli compatti, come nelle altre pagine della famiglia */
.compatto .campo{margin-bottom:.7rem}
.compatto .campo label{margin-bottom:.15rem}
.compatto .campo input:not([type=checkbox]):not([type=radio]),.compatto .campo select,.compatto .campo textarea,
.compatto .cerca input{padding:.3rem .5rem}
.riquadro,.gruppi{border:1px solid var(--linea);border-radius:.35rem;padding:.6rem 1rem;margin:0 0 1.2rem;min-width:0}
.riquadro legend,.gruppi legend{font-weight:700;padding:0 .3rem}
.gruppi.con-errore{border-color:var(--errore)}
.avviso-fisso{border:2px solid var(--accento);border-left-width:.5rem;background:var(--superficie);padding:.6rem 1rem;border-radius:.3rem;margin:1rem 0}
.azioni-scheda{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0 0 1rem;padding:0}
.azioni-scheda form{margin:0}
td.numeri{white-space:nowrap;text-align:right}
.modulo-nuovo{max-width:34rem}
.det{display:block;color:var(--testo-2);font-size:.85rem;overflow-wrap:anywhere}

/* Simulatore: barra del viaggio, commutatore, verdetto */
.barra-viaggio{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;align-items:flex-end;margin:0 0 1rem}
.modulo-barra{display:flex;flex-wrap:wrap;gap:0 .8rem;align-items:flex-end;margin:0}
.modulo-barra .campo{margin:0 0 1.1rem;flex:1 1 16rem}
.modulo-barra p{margin:0 0 1.1rem}
.azioni-viaggio{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0 0 1.1rem;padding:0}
.azioni-viaggio form{margin:0}
.commutatore{display:inline-flex;flex-wrap:wrap;margin:0 0 1rem;border:1px solid var(--pulsante);border-radius:.35rem;overflow:hidden}
.commutatore .pulsante{border:0;border-radius:0}
.commutatore .pulsante[aria-pressed="true"]{background:var(--pulsante);color:var(--pulsante-testo)}
.verdetto{background:var(--superficie);border:1px solid var(--linea);border-left:.4rem solid var(--accento);border-radius:.3rem;padding:1rem 1.2rem;margin:0 0 .6rem}
.verdetto .grande{font-size:1.4rem;line-height:1.3;margin:0 0 .4rem;max-width:62ch}
.verdetto .piccolo{margin:0;color:var(--testo-2)}

/* Grafico a colonne: colori da classi, niente fill scritti nei template o nel codice */
.grafico-riquadro{margin:1rem 0 1.6rem}
.grafico-riquadro .tabella{margin-bottom:.4rem}
.grafico{display:block;width:100%;min-width:45rem;height:auto}
.g-linea{stroke:var(--linea);stroke-width:1}
.g-asse{stroke:var(--testo);stroke-width:1.5;pointer-events:none}
.g-testo{fill:var(--testo-2)}   /* la dimensione è nell'attributo font-size: unità del disegno, che cresce con lui */
.g-testo-forte{fill:var(--testo);font-weight:700}
.g-barra{fill:var(--barra)}
.g-barra-sel{fill:var(--accento)}
.g-barra-neg{fill:var(--errore)}
.g-zona{fill:transparent}
g.colonna{cursor:pointer;outline:none}
g.colonna:hover .g-zona{fill:var(--campo)}
g.colonna:focus-visible .g-zona{fill:var(--campo);stroke:var(--fuoco);stroke-width:2}

/* Simulatore e iscrizione: due colonne da 54rem in su, una sola sotto */
.colonne-simulatore{display:grid;grid-template-columns:minmax(0,1fr);gap:0 2rem;align-items:start}
@media (min-width:54rem){.colonne-simulatore{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}}
.voce{display:grid;grid-template-columns:minmax(0,1fr) 8rem;gap:.3rem .8rem;align-items:center;margin:.4rem 0}
.voce:has(select){grid-template-columns:minmax(0,1fr) minmax(0,14rem)}
.voce label small{display:block;color:var(--testo-2);font-size:.85rem;font-weight:400}
.voce input,.voce select,.riga-camera input,.mini input{
  font:inherit;color:var(--testo);background:var(--campo);border:2px solid var(--bordo-campo);border-radius:.3rem;
  padding:.3rem .5rem;width:100%;min-width:0}
.voce input:focus,.voce select:focus,.riga-camera input:focus,.mini input:focus{
  outline:3px solid var(--fuoco);outline-offset:2px}
.voce input:disabled,.voce select:disabled,.mini input:disabled,.riga-camera input:disabled{
  background:var(--superficie);color:var(--testo-2);border-style:dashed}
@media (max-width:30rem){.voce,.voce:has(select){grid-template-columns:minmax(0,1fr)}}
.calcolato{font-weight:700;text-align:right}
.riga-camera{display:grid;grid-template-columns:minmax(4.5rem,.8fr) minmax(0,1fr) minmax(0,1fr) minmax(4.5rem,.9fr);gap:.4rem;align-items:center;margin:.4rem 0}
.riga-camera.testa{color:var(--testo-2);font-size:.85rem}
@media (max-width:30rem){.riga-camera{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.riga-camera.testa{display:none}.riga-camera label,.riga-camera output{grid-column:1 / -1}}
.mini{display:block;font-size:.88rem;color:var(--testo-2);min-width:0}
.mini input{display:block;margin-top:.1rem;font-size:1rem}
.riga-extra{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) auto;gap:.4rem .6rem;align-items:end;margin:.6rem 0;
  padding-top:.5rem;border-top:1px solid var(--linea)}
.riga-extra .mini:first-child{grid-column:1 / -1}
.brevetto{border-top:1px solid var(--linea);padding-top:.5rem;margin-top:.5rem}
.brevetto:first-child{border-top:0;margin-top:0;padding-top:0}
.nome-brevetto{margin:0 0 .3rem}
.riga-brevetto{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem .6rem;margin-bottom:.4rem}

/* Tabelle dei risultati */
.risultati h2,.risultati h3{margin-top:1.4rem}
.risultati table,.riepilogo table{min-width:0}
.tabella th.n,.tabella td.n{text-align:right;white-space:nowrap}
.tabella tr.tot td{font-weight:700}
.tabella tr.sep td{color:var(--testo-2)}
.da-controllare{background:var(--nota);border:2px solid var(--nota-bordo);color:var(--testo);border-radius:.35rem;padding:.4rem 1rem .6rem;margin:1rem 0}
.da-controllare h3{margin:.4rem 0 .2rem;font-size:1.1rem}
.da-controllare ul{margin:.2rem 0 0;padding-left:1.2rem}

/* Modulo di iscrizione: scelte come schede */
.scelte{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));gap:.6rem;margin:.4rem 0}
.scelta{display:block;border:2px solid var(--linea);border-radius:.5rem;padding:.6rem .8rem;cursor:pointer;background:var(--superficie);min-width:0}
.scelta:has(input:checked){border-color:var(--accento);box-shadow:inset 0 0 0 1px var(--accento)}
.scelta:has(input:focus-visible){outline:3px solid var(--fuoco);outline-offset:2px}
.scelta:has(input:disabled){border-style:dashed;color:var(--testo-2);cursor:default}
.scelta input{margin:0 .4rem 0 0}
.scelta .nota{display:block;margin-top:.15rem;font-size:.9rem}
.scelta .nota.piccolo{font-size:.82rem;line-height:1.35}
.senza-js{margin:0 0 1.5rem}
.riepilogo h2{margin-top:0}
#errore-persone{margin:.2rem 0}
.riquadro .campo:last-child{margin-bottom:.3rem}