/* assets/css/app.css - stile comune */
body { background: #f0f2f5; font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; padding-bottom: 4rem; }
.barra-app { position: sticky; top: 0; z-index: 1030; background: #0d6efd; color: #fff; padding: .5rem .75rem; box-shadow: 0 2px 6px rgba(0,0,0,.15); }
.barra-app .badge { font-weight: 500; }
main { max-width: 960px; margin: 1rem auto; padding: 0 .75rem; }
.card { border: 0; border-radius: .75rem; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.btn-dashboard { display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .9rem; font-size: 1.05rem; height: 100%; }
.matricola { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-weight: 700; background: #fff3cd; color: #664d03; padding: 0 .35rem; border-radius: .25rem; white-space: nowrap; }
.risultato-utente { text-align: left; }
.in-attesa { border-left: 4px solid #ffc107 !important; }
.preview { max-width: 150px; max-height: 150px; border: 2px solid #0d6efd; border-radius: .5rem; cursor: zoom-in; object-fit: cover; }
.foto-assente { width: 150px; height: 100px; display: flex; align-items: center; justify-content: center; text-align: center; font-size: .8rem; background: #e9ecef; border-radius: .5rem; color: #6c757d; }
.valore-lettura { font-size: 1.2em; font-weight: 700; color: #1b1f24; }
.nota { background: #f8f9fa; border-left: 3px solid #0d6efd; padding: .35rem .6rem; font-style: italic; white-space: pre-wrap; }
.barra-avanzamento { height: 30px; font-weight: 600; }
.passo-prepara { display: flex; gap: .6rem; align-items: flex-start; padding: .4rem 0; }
.passo-prepara .icona { width: 1.6rem; text-align: center; font-size: 1.2rem; }
.torna-su { position: fixed; right: 1rem; bottom: 1rem; z-index: 1020; display: none; }
input.maiuscolo { text-transform: uppercase; }

/* Dashboard: azione principale, riquadri uguali, collegamenti secondari */
body { font-size: 1.05rem; color: #1b1f24; }
.btn-lettura { font-size: 1.3rem; font-weight: 700; padding: .8rem; border-radius: .9rem; box-shadow: 0 3px 10px rgba(13,110,253,.3); }
.griglia-riquadri { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; }
@media (min-width: 768px) { .griglia-riquadri { grid-template-columns: repeat(3, 1fr); } }
.riquadro { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem;
    min-height: 74px; padding: .45rem; background: #fff; border: 1px solid #cfd8e3; border-radius: .9rem; color: #0a3a80;
    font-weight: 600; text-align: center; text-decoration: none; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.riquadro:active { background: #e7f0ff; }
.riquadro .icona { font-size: 1.9rem; line-height: 1; }
.riquadro .badge { position: absolute; top: .4rem; right: .5rem; }
.collegamenti > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; padding: .5rem 0 .25rem; }
.collegamenti .etichetta { grid-column: 1 / -1; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: #5c6670; }
.collegamenti a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1rem; min-height: 3.6rem; padding: .35rem .25rem;
    text-decoration: none; font-weight: 600; font-size: .85rem; line-height: 1.15; text-align: center; background: #fff; border: 1px solid #dde3ea; border-radius: .7rem; }
.collegamenti a .ms { font-size: 1.35rem; }
.collegamenti a:active { background: #e7f0ff; }
.stato-compatto .btn { color: #146c43; }

/* Icone Material Symbols Rounded (font locale con le sole icone usate: tools/aggiorna_icone.sh) */
@font-face { font-family: 'Material Symbols Rounded'; font-style: normal; font-weight: 400; font-display: block;
    src: url('../lib/material-symbols-rounded-fbebd41f.woff2') format('woff2'); }
.ms { text-transform: none !important; font-family: 'Material Symbols Rounded'; font-weight: normal; font-style: normal; font-size: 1.25em; line-height: 1;
    letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr;
    vertical-align: -.22em; -webkit-font-feature-settings: 'liga'; font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; user-select: none; }
.ms.piena { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.riquadro .ms { font-size: 1.75rem; color: #0d6efd; vertical-align: 0; }
.btn-lettura .ms { font-size: 1.5rem; margin-right: .35rem; }
.collegamenti .ms, .barra-app .ms { color: inherit; }

/* Campi: bordo sottile, evidenziazione leggera al tocco (niente alone spesso) */
.form-control, .form-select { border: 1px solid #c4cdd8; border-radius: .6rem; }
.form-control:focus, .form-select:focus { border-color: #6ea8fe; box-shadow: 0 0 0 .12rem rgba(13,110,253,.12); }
.input-group > .form-control:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .btn { border-radius: 0 .6rem .6rem 0; }
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }

/* Giro per via */
.barra-giro { background: #e7f0ff; border-bottom: 1px solid #cfe0ff; padding: .5rem .75rem; border-radius: .75rem .75rem 0 0; color: #0a3a80; }

/* Pulsante d'azione fisso in fondo allo schermo */
.barra-fissa { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1025; padding: .6rem .75rem calc(.6rem + env(safe-area-inset-bottom));
    background: rgba(240,242,245,.95); box-shadow: 0 -2px 8px rgba(0,0,0,.08); }
.barra-fissa .btn-lettura { max-width: 936px; margin: 0 auto; display: block; }
.barra-fissa .barra-azioni { max-width: 936px; margin: 0 auto; }
.barra-fissa .barra-azioni .btn-lettura { margin: 0; }
body.con-barra-fissa { padding-bottom: 6rem; }
body.con-barra-fissa .torna-su { bottom: 5.5rem; }

/* Elenco suggerimenti sotto i campi */
.suggerimenti { position: absolute; z-index: 1060; max-height: 45vh; overflow-y: auto; border-radius: .6rem; background: #fff; }
.suggerimenti .list-group-item { font-size: 1rem; }

/* Scheda di lettura */
.scheda-lettura .nome-utente { font-size: 1.3rem; font-weight: 700; line-height: 1.2; }
.min-w-0 { min-width: 0; }
.lettura-precedente { background: #f3f6fa; border-radius: .75rem; padding: .6rem .8rem; }
.lettura-precedente .cifre { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1.6rem; font-weight: 700; letter-spacing: .03em; color: #1b1f24; }
.lettura-precedente .cifre small { font-size: .9rem; font-weight: 500; color: #5c6670; }
.campo-valore .form-control { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1.8rem; font-weight: 700; letter-spacing: .03em; text-align: right; }
.campo-valore .input-group-text { background: #fff; color: #5c6670; }
.consumo { background: #e8f5ee; color: #146c43; border-radius: .6rem; padding: .35rem .6rem; font-size: .95rem; }
.area-foto { width: 100%; min-height: 96px; border: 2px dashed #9ec5fe; border-radius: .9rem; background: #f5f9ff; color: #0a58ca;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; font-weight: 600; }
.area-foto .ms { font-size: 2rem; }
.area-foto:active { background: #e7f0ff; }
.opzioni { border-top: 1px solid #e3e8ee; padding-top: .6rem; font-size: .95rem; }
.campo-matricola { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-weight: 700; letter-spacing: .03em; }
.input-group-text:empty { display: none; }
.btn-foto-barra { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 5.2rem; border-radius: .9rem;
    font-weight: 600; font-size: .85rem; line-height: 1.1; background: #fff; }
.btn-foto-barra .ms { font-size: 1.6rem; }
.storia-contatore { border-left: 4px solid #0d6efd !important; }
.storia-letture .list-group-item { background: transparent; }

/* Barra compatta in alto */
.barra-app .btn-home { display: inline-flex; align-items: center; justify-content: center; width: 44px; padding: 0; line-height: 1; }
.barra-app .btn-home .ms { vertical-align: 0; }
.barra-app .titolo-barra { font-size: 1.1rem; }
.stato-unico { font-size: .8rem; font-weight: 600; padding: .4em .7em; white-space: nowrap; }

/* Comandi comodi con il pollice e leggibili al sole */
.btn { min-height: 44px; }
.btn-sm { min-height: 38px; }
.btn-outline-secondary, .btn-outline-primary { border-width: 1.5px; }
.btn-outline-secondary { color: #343a40; border-color: #8a939c; }
.form-check-input { width: 1.35em; height: 1.35em; margin-top: .1em; }
.form-check-label { padding-left: .25rem; }
.form-control::placeholder { color: #aab2bb; opacity: 1; }
.titolo-sezione { font-size: 1.05rem; font-weight: 700; color: #1b1f24; border-bottom: 2px solid #dbe4ee; padding-bottom: .25rem; margin-bottom: .6rem; }
.altri-dati summary { color: #0a58ca; font-weight: 600; cursor: pointer; padding: .4rem 0; }

/* Modulo compatto (modifica dati utente dentro la lettura) */
.form-compatto .form-control { padding: .3rem .5rem; font-size: .95rem; min-height: 38px; }
.form-compatto .form-label { margin-bottom: 0; }
.form-compatto .mb-2 { margin-bottom: .35rem !important; }
/* Più foto per lettura */
.miniature-foto { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .25rem; margin-top: .25rem; }
.miniature-foto img { width: 46px; height: 46px; object-fit: cover; border-radius: .35rem; border: 1px solid #9ec5fe; cursor: zoom-in; }
.galleria-foto { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; }
.galleria-foto.una { grid-template-columns: 1fr; }
.foto-scheda { position: relative; border: 1px solid #dee2e6; border-radius: .6rem; overflow: hidden; background: #f8f9fa; }
.foto-scheda img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.galleria-foto.una .foto-scheda img { aspect-ratio: auto; max-height: 60vh; object-fit: contain; }
.foto-scheda .numero { position: absolute; top: .3rem; left: .3rem; background: rgba(0,0,0,.6); color: #fff; border-radius: 1rem; padding: 0 .55rem; font-size: .85rem; font-weight: 600; }
.foto-scheda .azioni { display: flex; }
.foto-scheda .azioni .btn { flex: 1; border-radius: 0; min-height: 44px; display: flex; align-items: center; justify-content: center; gap: .25rem; }
.foto-scheda img[data-ingrandisci] { cursor: zoom-in; }
.freccia-foto { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 64px; opacity: .85; display: flex; align-items: center; justify-content: center; }
.freccia-foto.sinistra { left: .4rem; }
.freccia-foto.destra { right: .4rem; }
.freccia-foto .ms { font-size: 2rem; }