/* GDO & Mio Capitale - adattamenti per il telefono (si aggiunge a stile.css, lo stesso del Mac). */
html { font-size: 15px; -webkit-text-size-adjust: 100%; }
body { padding-bottom: calc(68px + env(safe-area-inset-bottom)); overscroll-behavior-y: none; }
main { padding: 14px 14px 20px; max-width: 760px; }
h1 { font-size: 1.45rem; margin-bottom: 8px; }
h2 { font-size: 1.05rem; margin: 18px 0 8px; }
.card { padding: 14px; margin-top: 12px; }
.card + .card { margin-top: 12px; }

.tel-testata { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: calc(8px + env(safe-area-inset-top)) 14px 8px; background: var(--testata); color: var(--testata-t); border-bottom: 1px solid var(--bordo); }
.tel-titolo { display: flex; align-items: center; gap: 10px; font-size: .95rem; }
.tel-titolo img { width: 30px; height: 30px; border-radius: 7px; }
.tel-aggiornato { font-size: .72rem; opacity: .8; }

.tel-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; display: grid; grid-template-columns: repeat(6, 1fr);
  background: var(--card); border-top: 1px solid var(--bordo); padding-bottom: env(safe-area-inset-bottom); }
.tel-nav a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 0 7px; font-size: .68rem;
  color: var(--muto); text-decoration: none; }
.tel-nav svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tel-nav a.attivo { color: var(--accento); font-weight: 700; }

.anni-tel { display: flex; gap: 6px; overflow-x: auto; padding: 4px 0 8px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.anni-tel::-webkit-scrollbar { display: none; }
.anni-tel .chip { flex: none; padding: 7px 13px; }

.tel-accesso { max-width: 420px; margin: 4vh auto 0; text-align: center; }
.tel-accesso img { border-radius: 16px; }
.tel-accesso .card { text-align: left; }
.tel-accesso input[type=file] { padding: 8px 0; border: 0; background: none; }

.voce-altro { display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: var(--testo); }

.eroe-v { font-size: 2rem; }
.kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
.kpis .card { margin-top: 0; }
.kpi-v { font-size: 1.1rem; }
.kpi-r { flex-direction: column; align-items: flex-start; }
.kpi-r svg { width: 100%; }
.griglia-cumulati { grid-template-columns: 1fr 1fr; gap: 8px; }
.griglia-cumulati .cumulato svg { width: 100%; }
.griglia-2, .griglia-2.uguale, .griglia-anno { grid-template-columns: 1fr; }
.indice-v { font-size: 1.3rem; }
.tabella-compatta td, .tabella-compatta th { padding: 6px 6px; font-size: .82rem; }
.campi { grid-template-columns: 1fr !important; }
.tabella-scenari input { max-width: 70px !important; }
.btn-stampa-sezione, .aiuto-q { display: none; }
.sintesi li { font-size: .92rem; }
/* Niente zoom automatico su iPhone: Safari ingrandisce la pagina quando si tocca un campo con testo sotto i 16px.
   Serve !important perche' le regole di stile.css (es. input[type=password]) sono piu' specifiche. */
input, select, button, textarea { font-size: 16px !important; }
.griglia-2 > *, .griglia-anno > * { min-width: 0; }
th { white-space: normal; }
.risultato-sim { overflow-x: auto; }

/* Tabelle che si adattano allo schermo (vedi adattaTabelle in app.js) */
table.compatta th, table.compatta td { font-size: .74rem; padding: 5px 4px; }
table.compatta td.num, table.compatta th.num { white-space: nowrap; }
table.impilata thead { display: none; }
table.impilata, table.impilata tbody, table.impilata tr { display: block; width: 100%; }
table.impilata tr { padding: 8px 2px; border-bottom: 1px solid var(--bordo); }
table.impilata td { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 3px 0;
  border: 0; font-size: .86rem; text-align: right; }
table.impilata td:first-child { font-weight: 700; font-size: .95rem; text-align: left; }
table.impilata td::before { content: attr(data-etichetta); color: var(--muto); font-weight: 400; text-align: left; flex: 0 1 auto; }
table.impilata td:first-child::before { content: none; }
table.impilata td:empty { display: none; }
table.impilata td input { max-width: 45% !important; text-align: right; }
.tabella-wrap { overflow-x: visible; }
/* Telefoni molto stretti: niente campi piu' larghi dello schermo */
input, select, textarea { max-width: 100%; box-sizing: border-box; }
@media (max-width: 340px) { main { padding: 12px 10px 20px; } .tel-nav a { font-size: .6rem; } }
table.impilata td { white-space: nowrap; }
table.impilata td::before { white-space: normal; flex: 1 1 auto; min-width: 0; }
table.impilata td:first-child { white-space: normal; }
.versione-accesso { text-align: center; font-size: .72rem; color: var(--muto); margin: 28px 0 10px; }
.tel-nav[hidden], #blocca[hidden], [hidden] { display: none !important; }
.riga-novita { display: block; margin: 0 0 12px; padding: 8px 12px; border-radius: 10px; background: var(--accento-m); color: var(--testo); font-size: .88rem; text-decoration: none; border: 1px solid var(--bordo); }