/* =====================================================================
   RIVETTI MODA LAB — design system ADVLAB Prestige
   charcoal #2c2c2c · magenta profondo #5d0052 · oro prestige #D0B264
   Display: Cormorant Garamond italic · UI: DM Sans
   ===================================================================== */

:root{
  --carbone:#2c2c2c;
  --carbone-2:#3a3a3a;
  --magenta:#5d0052;
  --magenta-chiaro:#7a1a6e;
  --oro:#D0B264;
  --oro-tenue:#e7d5a6;
  --avorio:#faf8f5;
  --linea:#e6e1da;
  --testo:#2c2c2c;
  --testo-tenue:#7a736c;
  --lat:260px;
  --raggio:10px;
  --ombra:0 1px 2px rgba(44,44,44,.06), 0 8px 24px rgba(44,44,44,.06);
}

*{box-sizing:border-box}
body{
  margin:0; background:var(--avorio); color:var(--testo);
  font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
a{color:var(--magenta); text-decoration:none}
a:hover{color:var(--magenta-chiaro); text-decoration:underline}

/* ------------------------------------------------------------ SIDEBAR */
.barra-laterale{
  position:fixed; inset:0 auto 0 0; width:var(--lat);
  background:var(--carbone); color:#efece7;
  display:flex; flex-direction:column; z-index:1040;
  transition:transform .25s ease;
}
.marchio{padding:22px 22px 16px; border-bottom:1px solid rgba(255,255,255,.08)}
.marchio-nome{
  display:block; font-family:'Cormorant Garamond',Georgia,serif; font-style:italic;
  font-weight:600; font-size:30px; line-height:1; color:var(--oro); letter-spacing:.5px;
}
.marchio .marchio-nome{font-size:25px; white-space:nowrap; letter-spacing:.35px}
.marchio-logo{display:block; max-width:100%; max-height:66px; object-fit:contain; object-position:left}
.marchio-sotto{display:block; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:#a89f95; margin-top:6px}
.logo-accesso{display:block; max-width:210px; max-height:90px; object-fit:contain; margin:0 auto 14px}

.menu{
  flex:1; overflow-y:auto; padding:12px 12px 20px;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(208,178,100,.58) var(--carbone);
}
/* Scroll del menu coerente con il tema Rivetti Moda Lab */
.menu::-webkit-scrollbar{width:8px}
.menu::-webkit-scrollbar-track{background:var(--carbone)}
.menu::-webkit-scrollbar-thumb{
  background:rgba(208,178,100,.58);
  border:2px solid var(--carbone);
  border-radius:999px;
}
.menu::-webkit-scrollbar-thumb:hover{background:var(--oro)}
.menu::-webkit-scrollbar-corner{background:var(--carbone)}
.menu .gruppo{
  font-size:10px; letter-spacing:.18em; text-transform:uppercase;
  color:#8a8177; padding:18px 10px 6px;
}
.menu .voce{
  display:flex; align-items:center; gap:11px; padding:9px 11px; border-radius:8px;
  color:#d8d3cc; font-size:14px; text-decoration:none; transition:background .15s,color .15s;
}
.menu .voce i{font-size:16px; width:20px; text-align:center}
.menu .voce i{color:#9a938a}
.menu .voce:hover{background:rgba(255,255,255,.06); color:#fff; text-decoration:none}
.menu .voce.attiva{background:var(--magenta); color:#fff}
.menu .voce.attiva i{color:var(--oro)}

.utente-box{padding:14px 18px; border-top:1px solid rgba(255,255,255,.08); font-size:13px}
.utente-nome{font-weight:500; color:#fff}
.utente-ruolo{font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:#8a8177}
.esci{display:inline-block; margin-top:8px; color:var(--oro-tenue); font-size:13px}
.esci:hover{color:var(--oro); text-decoration:none}

.apri-menu{
  position:fixed; top:12px; left:12px; z-index:1060; width:42px; height:42px;
  border:none; border-radius:10px; background:var(--carbone); color:var(--oro); font-size:20px;
}
.velo{display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1035}
.velo.visibile{display:block}

/* ------------------------------------------------------------ CONTENUTO */
.contenuto{margin-left:var(--lat); padding:26px 30px 60px; max-width:1600px}
.testata{
  display:flex; align-items:flex-start; gap:20px; flex-wrap:wrap;
  padding-bottom:18px; margin-bottom:22px; border-bottom:1px solid var(--linea);
}
.titolo-pagina{
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic; font-weight:600;
  font-size:36px; margin:0; line-height:1.1;
}
.sottotitolo{margin:4px 0 0; color:var(--testo-tenue); font-size:14px}
.azioni-testata{margin-left:auto; display:flex; gap:8px; flex-wrap:wrap}
.ricerca-rapida{position:relative; margin-left:auto; min-width:260px}
.ricerca-rapida i{position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--testo-tenue)}
.ricerca-rapida input{
  width:100%; padding:9px 12px 9px 34px; border:1px solid var(--linea); border-radius:999px;
  background:#fff; font-size:14px; font-family:inherit;
}
.ricerca-rapida input:focus{outline:2px solid var(--oro); outline-offset:1px; border-color:transparent}
.azioni-testata + .ricerca-rapida{margin-left:0}

/* ------------------------------------------------------------ COMPONENTI */
.riquadro{background:#fff; border:1px solid var(--linea); border-radius:var(--raggio); box-shadow:var(--ombra)}
.riquadro-testa{padding:14px 18px; border-bottom:1px solid var(--linea); display:flex; align-items:center; gap:12px}
.riquadro-testa h2{font-size:15px; font-weight:700; margin:0; letter-spacing:.01em}
.riquadro-corpo{padding:18px}

.kpi{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; margin-bottom:24px}
.kpi .scheda{background:#fff; border:1px solid var(--linea); border-radius:var(--raggio); padding:16px 18px; box-shadow:var(--ombra); position:relative; overflow:hidden}
.kpi .scheda::after{content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--oro)}
.kpi .etichetta{font-size:11px; text-transform:uppercase; letter-spacing:.14em; color:var(--testo-tenue)}
.kpi .valore{font-size:28px; font-weight:700; line-height:1.2; margin-top:4px}
.kpi .nota{font-size:12px; color:var(--testo-tenue)}
.kpi .scheda.allerta::after{background:#c0392b}

.table{margin:0}
.table thead th{
  font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--testo-tenue);
  font-weight:700; border-bottom:1px solid var(--linea); background:#fcfbf9; white-space:nowrap;
}
.table td{vertical-align:middle}
.table-hover tbody tr:hover{background:#fdfbf6}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; letter-spacing:.02em}
.codice{display:inline-block; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12.5px;
  background:#f4f1eb; border:1px solid var(--linea); border-radius:5px; padding:2px 7px; color:var(--carbone)}

.btn{font-family:inherit; font-size:14px; border-radius:8px; font-weight:500}
.btn-primary{background:var(--magenta); border-color:var(--magenta)}
.btn-primary:hover,.btn-primary:focus{background:var(--magenta-chiaro); border-color:var(--magenta-chiaro)}
.btn-oro{background:var(--oro); border-color:var(--oro); color:var(--carbone)}
.btn-oro:hover{background:var(--oro-tenue); border-color:var(--oro-tenue); color:var(--carbone)}
.btn-outline-scuro{border:1px solid var(--linea); background:#fff; color:var(--carbone)}
.btn-outline-scuro:hover{background:#f4f1eb; color:var(--carbone)}

.form-label{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--testo-tenue); font-weight:700; margin-bottom:4px}
.form-control,.form-select{font-family:inherit; font-size:14px; border-color:var(--linea); border-radius:8px; padding:8px 11px}
.form-control:focus,.form-select:focus{border-color:var(--oro); box-shadow:0 0 0 3px rgba(208,178,100,.25)}
.form-text{font-size:12px}
fieldset{border:none; padding:0; margin:0 0 22px}
fieldset legend{
  font-size:11px; text-transform:uppercase; letter-spacing:.16em; color:var(--magenta);
  font-weight:700; border-bottom:1px solid var(--linea); padding-bottom:7px; margin-bottom:16px; width:100%;
}

.badge{font-weight:600; letter-spacing:.02em}
.pastiglia-colore{display:inline-block; width:14px; height:14px; border-radius:50%; border:1px solid rgba(0,0,0,.2); vertical-align:-2px; margin-right:6px}

/* ------------------------------------------------------------ GRIGLIA ARTICOLI */
.griglia-articoli{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:18px}
.carta-articolo{background:#fff; border:1px solid var(--linea); border-radius:var(--raggio); overflow:hidden; box-shadow:var(--ombra); transition:transform .15s, box-shadow .15s}
.carta-articolo:hover{transform:translateY(-2px); box-shadow:0 10px 28px rgba(44,44,44,.12)}
.carta-articolo .foto{aspect-ratio:1; background:#f4f1eb center/cover no-repeat; display:block}
.carta-articolo .corpo{padding:12px 14px}
.carta-articolo .nome{font-weight:600; font-size:14.5px; margin:0 0 2px; color:var(--carbone)}
.carta-articolo .meta{font-size:12px; color:var(--testo-tenue)}
.carta-articolo a:hover{text-decoration:none}
.pallini{display:flex; gap:4px; margin-top:8px; flex-wrap:wrap}
.pallini span{width:15px; height:15px; border-radius:50%; border:1px solid rgba(0,0,0,.18)}

.galleria{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px}
.galleria figure{margin:0; position:relative; border:1px solid var(--linea); border-radius:8px; overflow:hidden; background:#fff}
.galleria img{width:100%; aspect-ratio:1; object-fit:cover; display:block}
.galleria figcaption{font-size:11.5px; padding:6px 8px; color:var(--testo-tenue); border-top:1px solid var(--linea)}
.galleria .elimina{position:absolute; top:6px; right:6px}

.vuoto{text-align:center; padding:48px 20px; color:var(--testo-tenue)}
.vuoto i{font-size:34px; color:var(--oro); display:block; margin-bottom:10px}
.vuoto p{margin:0 0 14px}

.nav-tabs{border-bottom:1px solid var(--linea)}
.nav-tabs .nav-link{color:var(--testo-tenue); border:none; border-bottom:2px solid transparent; font-size:14px; padding:9px 14px}
.nav-tabs .nav-link.active{color:var(--magenta); border-bottom-color:var(--oro); background:none; font-weight:600}

/* ------------------------------------------------------------ ACCESSO */
.pagina-accesso{
  margin:0; min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(160deg,var(--carbone) 0%, #1f1f1f 55%, var(--magenta) 100%); padding:24px;
}
.riquadro-accesso{width:100%; max-width:380px; background:#fff; border-radius:14px; padding:34px 30px; box-shadow:0 24px 60px rgba(0,0,0,.35)}
.riquadro-accesso .marchio-nome{color:var(--magenta); font-size:38px; text-align:center; display:block;
  font-family:'Cormorant Garamond',Georgia,serif; font-style:italic; font-weight:600}
.riquadro-accesso .sub{text-align:center; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--testo-tenue); margin-bottom:26px}

/* ------------------------------------------------------------ STAMPA */
@media print{
  .barra-laterale,.apri-menu,.azioni-testata,.ricerca-rapida,.no-stampa,.velo{display:none !important}
  .contenuto{margin:0; padding:0; max-width:none}
  body{background:#fff}
  .riquadro{box-shadow:none; border-color:#ccc; break-inside:avoid}
}

/* ------------------------------------------------------------ RESPONSIVE */
@media (max-width:991.98px){
  .barra-laterale{transform:translateX(-100%)}
  .barra-laterale.aperta{transform:translateX(0)}
  .contenuto{margin-left:0; padding:64px 16px 48px}
  .titolo-pagina{font-size:29px}
  .ricerca-rapida{min-width:100%; margin-left:0}
  .azioni-testata{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important; animation:none !important}
}
:focus-visible{outline:2px solid var(--oro); outline-offset:2px}

/* ------------------------------------------------------------ SITO E-COMMERCE */
.pallino-stato{display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:6px; vertical-align:1px}
.pallino-stato.ok{background:#2e7d32}
.pallino-stato.errore{background:#c0392b}
.pallino-stato.mai{background:#bbb}
.pallino-stato.in_coda{background:var(--oro)}
.riga-prezzi{display:flex; gap:22px; flex-wrap:wrap}
.riga-prezzi .voce-prezzo{min-width:118px}
.riga-prezzi .etichetta-prezzo{font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--testo-tenue)}
.riga-prezzi .valore-prezzo{font-size:19px; font-weight:700; line-height:1.25}
.riga-prezzi .valore-prezzo.sito{color:var(--magenta)}
