/* =====================================================================
   portale.css — base grafica comune del portale Allegrini
   Tecnobit S.r.l. — creato il 28/07/2026

   POSIZIONE SUL SERVER
     C:\xampp\htdocs\appuntamenti\include\portale.css

   COME RICHIAMARLO NELLE PAGINE (percorso web RELATIVO, non assoluto):
     <link rel="stylesheet" href="include/portale.css">              (pagine in appuntamenti/)
     <link rel="stylesheet" href="../include/portale.css">           (pagine in appuntamenti/budget/, /acquisti/, /admin/...)

     CORRETTO IL 22/09/2026: il percorso assoluto "/appuntamenti/..." si
     rompe per chi accede da commerciali.allegrini.com (accesso esterno via
     reverse proxy 172.16.0.55) — il proxy fa proxy_pass verso .250/appuntamenti/
     su location "/", quindi un URL che include gia' "/appuntamenti/" viene
     raddoppiato (".../appuntamenti/appuntamenti/...") e da' 404. Il relativo
     funziona su intranet.allegrini.com, commerciali.allegrini.com e IP diretto
     perche' si risolve rispetto all'URL visto dal browser, non a come nginx
     instrada internamente. Ogni pagina usa il prefisso relativo corrispondente
     alla propria profondita' reale.

   ATTENZIONE AL RILASCIO
     Questo file va caricato sul server PRIMA delle pagine che lo
     richiamano. Se manca, le pagine perdono variabili e colori.
     (Stesso errore fatto il 28/07/2026 con include/xlsxWriter.lib.php:
     la pagina si e' fermata a meta' perche' la dipendenza non era stata
     caricata prima.)

   COSA C'E' QUI DENTRO, E COSA NO
     Qui stanno SOLO le variabili di colore e la fascia arancione
     superiore. Non ci sono tabelle, pulsanti, card o griglie: diverse
     pagine del portale caricano Bootstrap 3 o 4, e un foglio globale piu'
     ambizioso creerebbe conflitti di specificita' che si scoprirebbero
     solo in produzione. Si accorpa qui una regola nuova solo quando
     almeno due pagine dimostrano di volerla identica.

   RIFERIMENTO
     Pagina canonica: appuntamenti/home.php (ex home_nuovo_riquadri.php).
     Regole e deroghe in:
     01_Documentazione/Standard_Organizzazione_Progetto_Allegrini.md
   ===================================================================== */


/* ---------------------------------------------------------------------
   1) PALETTE — valori presi dalla pagina di riferimento.
      I colori arancioni derivano dal sito ufficiale www.allegrini.com.
   --------------------------------------------------------------------- */
:root{
    --orange:  #E8701A;   /* arancione istituzionale, bordi e accenti     */
    --org-s:   #C45A0E;   /* inizio gradiente header (scuro)             */
    --org-e:   #F5A050;   /* fine gradiente header (chiaro)              */

    --navy:    #1A2540;   /* intestazioni di sezione, pulsanti scuri     */
    --navy-lt: #243050;   /* stato hover del navy                        */

    --white:   #FFFFFF;
    --bg:      #F5F2EE;   /* fondo pagina                                */
    --text:    #1a1a1a;   /* testo corrente                              */
    --muted:   #6B7280;   /* testo secondario                            */
    --border:  #E8EAED;   /* bordi e separatori                          */
}


/* ---------------------------------------------------------------------
   2) HEADER — fascia arancione superiore.

      Un solo breakpoint: 768px. Il sottotitolo sparisce li', perche' a
      quella larghezza l'header va a capo su due righe e "Allegrini
      S.p.A." e' ridondante: il logo accanto dice gia' Allegrini.
      Eventuali altri breakpoint sono di pagina, non dell'header
      (valore convenzionale: 480px).
   --------------------------------------------------------------------- */
header{
    background: linear-gradient(135deg, var(--org-s), var(--org-e));
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 68px;
    border-bottom: 3px solid var(--orange);
    box-shadow: 0 2px 12px rgba(0,0,0,.25);
}

.header-left{ display: flex; align-items: center; gap: 20px; }

/* Il logo puo' essere <img class="header-logo"> oppure
   <div class="header-logo"><img ...></div>: valgono entrambe. */
.header-logo,
.header-logo img{ height: 42px; }

.header-divider{ width: 1px; height: 36px; background: rgba(255,255,255,.3); }

.header-title{ color: var(--white); font-size: 18px; font-weight: 600; }
.header-sub  { color: rgba(255,255,255,.7); font-size: 11px; margin-top: 2px; }

/* Pillola con data/ora: elemento FACOLTATIVO.
   Lo standard ne fissa l'aspetto, non ne impone l'uso. Chi la mette la
   ottiene identica; nel login, per esempio, non ha senso. */
.header-date{
    background: rgba(0,0,0,.28);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,.25);
}

/* Pulsante Home nell'header — standard portale (dal 21/09/2026),
   stessi valori gia' in uso in cruscotto.lib.css. Va in .header-right,
   a destra dell'eventuale .header-date. */
.btn-hdr-home{
    background: rgba(0,0,0,.28);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,.25);
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
}
.btn-hdr-home:hover{ background: rgba(0,0,0,.45); }

@media (max-width: 768px){
    header{
        padding: 0 16px;
        height: auto;
        min-height: 60px;
        flex-wrap: wrap;
        gap: 6px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .header-left{ gap: 14px; }
    .header-logo,
    .header-logo img{ height: 34px; }
    .header-title{ font-size: 15px; }
    .header-sub  { display: none; }
    .header-divider{ display: none; }
}


/* ---------------------------------------------------------------------
   3) DEROGA AMMESSA — modalita' alta accessibilita' del login.

      appuntamenti/index.php ha una modalita' "acc" con testo piu' grande
      e sottotitolo giallo ad alto contrasto. E' una scelta voluta,
      mantenuta invariata il 25/07/2026: NON va "corretta" per
      uniformita'. Le sue regole restano nella pagina, non qui, perche'
      dipendono da una classe applicata dalla pagina stessa.
   --------------------------------------------------------------------- */