/*
 * FILE: stile-pubblico.css
 *
 * COSA FA:
 * Definisce la grafica della pagina pubblica, dell'intestazione,
 * delle schede alimenti e del piè di pagina.
 *
 * QUANDO VIENE UTILIZZATO:
 * Viene caricato dalle pagine pubbliche dopo il CSS di Tabler.
 *
 * PERCHÉ ESISTE:
 * Centralizza la grafica, evitando stili ripetuti nelle pagine.
 *
 * DIPENDENZE LOGICHE:
 * - tabler/css/tabler.min.css: fornisce la struttura grafica di base.
 * - index.php: definisce le variabili colore dalle impostazioni.
 * - header.php e footer.php: utilizzano le classi qui definite.
 *
 * NOTA:
 * I valori predefiniti vengono usati se una variabile colore
 * non è stata definita dalla pagina.
 */

body {
    background: var(--colore-sfondo, #F5F8FA);
    color: var(--colore-testo, #1F2937);
}

.marchio-cliente {
    color: var(--colore-principale, #087F8C);
    font-weight: 700;
    font-size: 1.15rem;
}

h1,
h2 {
    color: var(--colore-secondario, #164E63);
}

.presentazione {
    max-width: 760px;
}

.scheda-alimento {
    height: 100%;
    border-top: 3px solid var(--colore-principale, #087F8C);
}

.indicazione-moderazione {
    display: inline-block;
    padding: .4rem .65rem;
    border-radius: .4rem;
    background: #FFF4DB;
    color: #654500;
    font-weight: 600;
}

.pulsante-ricerca {
    background: var(--colore-principale, #087F8C);
    border-color: var(--colore-principale, #087F8C);
    color: #FFFFFF;
}

.pulsante-ricerca:hover,
.pulsante-ricerca:focus-visible {
    background: var(--colore-secondario, #164E63);
    border-color: var(--colore-secondario, #164E63);
    color: #FFFFFF;
}

.collegamento-fonte {
    overflow-wrap: anywhere;
}