/* ==========================================================================
   INTESTAZIONE E MENU CONDIVISI — usato da tutte le pagine del sito.
   Prima questo blocco era duplicato in ogni singolo file: una correzione
   (es. al menu mobile) andava fatta dieci volte. Ora basta modificare
   questo file una volta sola e vale ovunque.
   ========================================================================== */

header{
  background:var(--bianco); border-bottom:2px solid var(--inchiostro);
  position:sticky; top:0; z-index:50;
}
.nav-wrap{
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 24px; gap:16px;
}
.nav-wrap-right{display:flex; align-items:center; gap:20px;}

.brand{display:flex; align-items:center; gap:14px; text-decoration:none; flex-shrink:0;}
.crest{
  width:52px; height:52px; border-radius:50%;
  background:var(--bianco); border:3px solid var(--inchiostro);
  display:flex; align-items:center; justify-content:center; position:relative; flex-shrink:0;
  background-size:cover; background-position:center;
}
.crest::after{content:'ACM'; font-family:var(--font-display); font-size:15px; color:var(--bianco); letter-spacing:1px; text-shadow:0 1px 2px rgba(0,0,0,.4);}
.crest.has-logo{background:var(--bianco);}
.crest.has-logo::after{content:none;}
.crest img{width:82%; height:82%; object-fit:contain; border-radius:50%;}
.brand-text{font-family:var(--font-display); line-height:0.95;}
.brand-text .name{font-size:22px; letter-spacing:0.5px;}

nav ul{display:flex; gap:28px; list-style:none; margin:0; padding:0;}
nav a{
  text-decoration:none; font-weight:700; font-size:14px;
  text-transform:uppercase; letter-spacing:0.5px;
  padding-bottom:4px; border-bottom:2px solid transparent;
}
nav a:hover{border-bottom-color:var(--rosso);}

.nav-toggle{display:none; background:none; border:2px solid var(--inchiostro); border-radius:6px; padding:6px 10px; font-size:20px; cursor:pointer;}

.stripe-bar{height:6px; background:repeating-linear-gradient(90deg, var(--rosso) 0 24px, var(--blu) 24px 48px);}

.admin-link-pill{
  display:flex; align-items:center; gap:6px; margin-left:14px;
  background:var(--inchiostro); color:var(--bianco); text-decoration:none;
  font-family:var(--font-mono); font-size:11.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.5px; padding:8px 14px; border-radius:20px; white-space:nowrap;
  border:none; cursor:pointer;
}
.admin-link-pill:hover{background:var(--rosso);}
.admin-link-pill[hidden]{display:none;}

.admin-edit-link{
  display:inline-flex; align-items:center; gap:5px; margin-top:8px;
  background:var(--blu); color:var(--bianco); text-decoration:none;
  font-family:var(--font-mono); font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.5px; padding:6px 11px; border-radius:14px; width:fit-content;
}
.admin-edit-link:hover{background:var(--rosso);}
.admin-edit-link[hidden]{display:none;}
.admin-edit-link-photo{position:absolute; bottom:10px; right:10px; z-index:5; margin-top:0;}

@media (max-width:760px){
  .nav-wrap-right{flex-wrap:wrap; justify-content:flex-start; width:100%;}
  nav{width:100%; order:2;}
  nav ul{
    width:100%; background:var(--bianco);
    flex-direction:column; gap:0;
    max-height:0; overflow:hidden;
    transition:max-height .25s ease;
  }
  nav ul.open{max-height:320px; overflow-y:auto; border-top:1px solid #ddd;}
  nav a{display:block; padding:14px 24px; border-bottom:1px solid #ddd2;}
  .nav-toggle{display:block;}
  .nav-wrap{flex-wrap:wrap; row-gap:8px;}
  .admin-link-pill{padding:8px 10px; margin-left:0;}
  .admin-pill-label{display:none;}
}

/* ==========================================================================
   MODULO "AREA RISERVATA" — render_nav_header() lo inserisce in ogni pagina
   che usa l'intestazione condivisa (anche se quella pagina non ne parla mai
   direttamente), quindi lo stile che lo tiene nascosto finché serve deve
   stare qui, non in ogni singola pagina — altrimenti una pagina nuova che se
   ne dimentica lo mostra per sbaglio come contenuto normale.
   ========================================================================== */
.modal-backdrop{
  position:fixed; inset:0; background:rgba(12,20,40,.65);
  display:none; align-items:center; justify-content:center; padding:20px; z-index:100;
}
.modal-backdrop.open{display:flex;}
.modal{
  background:var(--bianco); border:2px solid var(--inchiostro); border-radius:10px;
  max-width:440px; width:100%; padding:28px; max-height:90vh; overflow-y:auto;
}
.modal h3{font-family:var(--font-display); font-size:26px; margin:0 0 8px;}
.field{margin-bottom:16px;}
.field label{display:block; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:1px; margin-bottom:6px; color:var(--blu-scuro);}
.field input[type=text], .field input[type=password]{
  width:100%; padding:11px 12px; border:2px solid #ccc; border-radius:6px;
  font-family:var(--font-body); font-size:14.5px;
}
.field input[type=text]:focus, .field input[type=password]:focus{outline:3px solid rgba(198,32,46,.3); border-color:var(--rosso);}
.modal-actions{display:flex; justify-content:flex-end; gap:10px; margin-top:8px;}
.btn{
  display:inline-block; border:none; border-radius:24px; padding:12px 28px; font-family:var(--font-mono);
  font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.8px; cursor:pointer;
}
.btn-ghost{background:none; border:2px solid var(--inchiostro); color:var(--inchiostro);}
.btn-rosso{background:var(--rosso); color:var(--bianco);}
.status-msg{font-size:13.5px; margin-top:12px; font-family:var(--font-mono);}
.status-msg.ok{color:var(--blu);}
.status-msg.err{color:var(--rosso);}

/* ==========================================================================
   FOOTER CONDIVISO — usato da tutte le pagine tramite render_site_footer()
   (in includes-nav.php). Prima ogni pagina, eccetto la home, aveva un
   footer minimo di una sola riga.
   ========================================================================== */
footer{background:var(--inchiostro); color:var(--crema); padding:48px 24px 28px;}
.footer-inner{max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.6fr 1fr; gap:36px;}
@media (max-width:760px){.footer-inner{grid-template-columns:1fr;}}
footer h4{font-family:var(--font-display); font-size:18px; letter-spacing:1px; margin:0 0 12px; color:var(--oro);}
footer p, footer li{font-size:14px; color:#C9CBD1;}
footer ul{list-style:none; padding:0; margin:0;}
footer li{margin-bottom:8px;}
footer a{text-decoration:none;}
footer a:hover{color:var(--rosso);}
.footer-bottom{
  max-width:1180px; margin:32px auto 0; padding-top:20px; border-top:1px solid #2c313b;
  font-size:12px; color:#7f8590; font-family:var(--font-mono);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
.footer-legal-links{display:flex; gap:18px; flex-wrap:wrap;}
.footer-legal-links a{color:#7f8590; text-decoration:none;}
.footer-legal-links a:hover{color:var(--crema); text-decoration:underline;}