/* Label Studio · consenso cookie
   Le variabili sono quelle del tema: se il tema cambia, i colori di ripiego
   tengono comunque il banner leggibile. */

.lscc{
  position:fixed; z-index:9999; inset:auto 0 0 0;
  display:flex; justify-content:center;
  padding:clamp(12px,3vw,28px);
  font-family:var(--sans,system-ui,-apple-system,"Segoe UI",sans-serif);
  animation:lscc-entra .5s cubic-bezier(.22,.61,.36,1) both;
}
.lscc[hidden]{ display:none; }

@keyframes lscc-entra{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .lscc{ animation:none; } }

.lscc-box{
  position:relative;
  width:100%; max-width:720px;
  background:var(--paper,#F6F1E6);
  color:var(--ink-soft,#57493A);
  border:1px solid var(--line,rgba(44,35,24,.16));
  border-radius:2px;
  box-shadow:0 18px 60px rgba(24,17,10,.28);
  padding:clamp(20px,3.4vw,34px);
  max-height:82vh; overflow-y:auto;
}

/* La riga d'apertura: il sopratitolo a sinistra, l'informativa privacy a
   destra. Il padding a destra è lo spazio della ×, che le sta sopra. */
.lscc-testa{
  display:flex; align-items:baseline; justify-content:space-between;
  flex-wrap:wrap; gap:6px 18px;
  padding-right:34px;
  margin:0 0 .9em;
}
.lscc-testa .lscc-kicker{ margin:0 !important; }

/* Un testo sottolineato, niente di più: è un rimando, non un invito. */
.lscc-privacy{
  margin-left:auto;
  font-size:.78rem; line-height:1.5;
  color:var(--muted,#8A7B68);
  text-decoration:underline; text-underline-offset:3px;
  transition:color .3s ease;
}
.lscc-privacy:hover{ color:var(--gold-text,#776035); }

/* Stesso sopratitolo delle sezioni del sito: maiuscoletto oro fra due filetti. */
.lscc-kicker{
  display:inline-flex; align-items:center; gap:1.1em;
  margin:0 0 .9em !important;
  font-family:var(--serif-sc,var(--serif,Georgia,serif));
  font-weight:600; font-size:.8rem;
  letter-spacing:.32em; text-transform:lowercase;
  color:var(--gold-text,#776035);
}
.lscc-kicker::before,
.lscc-kicker::after{
  content:""; width:32px; height:1px;
  background:currentColor; opacity:.55;
}

.lscc-box h2{
  margin:0 0 10px;
  font-family:var(--serif,Georgia,"Times New Roman",serif);
  font-weight:400; font-size:clamp(1.35rem,1.1rem + .9vw,1.9rem);
  line-height:1.22; color:var(--ink,#2C2318);
  letter-spacing:.01em;
}

.lscc-box p{
  margin:0 0 14px;
  font-size:.92rem; line-height:1.7;
}

.lscc-x{
  position:absolute; top:8px; right:10px;
  background:none; border:0; cursor:pointer;
  font-size:1.5rem; line-height:1; padding:6px 10px;
  color:var(--muted,#8A7B68);
  transition:color .3s ease;
}
.lscc-x:hover{ color:var(--ink,#2C2318); }

/* ---------- pannello delle scelte ---------- */

.lscc-scelte{
  margin:18px 0 4px; padding:16px 0 4px;
  border-top:1px solid var(--line,rgba(44,35,24,.16));
}
.lscc-scelte[hidden]{ display:none; }

.lscc-voce + .lscc-voce{ margin-top:14px; }

.lscc-riga{
  display:flex; align-items:center; gap:10px;
  cursor:pointer; font-weight:600;
  color:var(--ink,#2C2318);
}
.lscc-riga input{ width:16px; height:16px; accent-color:var(--gold,#9C7E45); cursor:pointer; }
.lscc-riga input:disabled{ cursor:default; }

.lscc-nome{ font-size:.92rem; letter-spacing:.02em; }

.lscc-sempre{
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--muted,#8A7B68); font-weight:500;
}

.lscc-desc{
  margin:4px 0 0 26px !important;
  font-size:.82rem !important; line-height:1.6;
  color:var(--muted,#8A7B68);
}

/* ---------- pulsanti ---------- */

.lscc-azioni{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-top:20px;
}

/* Rifiutare deve costare quanto accettare: stessa dimensione, stesso peso. */
.lscc-btn{
  flex:1 1 auto; min-width:132px;
  padding:13px 22px;
  font-family:inherit; font-size:.76rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase;
  cursor:pointer;
  background:transparent;
  color:var(--ink,#2C2318);
  border:1px solid var(--line-2,rgba(44,35,24,.30));
  border-radius:1px;
  transition:background .3s ease, color .3s ease, border-color .3s ease;
}
.lscc-btn:hover{ border-color:var(--gold,#9C7E45); color:var(--gold-text,#776035); }
.lscc-btn[hidden]{ display:none; }

/* Le due risposte sono la stessa cosa a rovescio, e si vedono uguali: stesso
   riquadro, stesso colore, stesso contorno. Non bastava la larghezza — un
   fondo pieno da una parte e un filo dall'altra è la stessa spinta, data col
   colore invece che con le parole. «Personalizza» resta più tenue perché non
   è una risposta ma una terza strada; «Salva le scelte» è pieno perché
   conferma quello che il visitatore ha già deciso da sé, e non tira né di qua
   né di là. */
.lscc-btn-scelta{
  /* Metà riga per una, e la riga è loro: «Personalizza» e «Salva» vanno sotto.
     Il -5px è la metà dello scarto fra le due. */
  flex:1 1 calc(50% - 5px);
  border-color:var(--ink,#2C2318);
}
.lscc-btn-scelta:hover{
  background:var(--ink,#2C2318);
  border-color:var(--ink,#2C2318);
  color:var(--paper,#F6F1E6);
}

.lscc-btn-si,
.lscc-btn-salva{
  background:var(--gold-text,#776035);
  border-color:var(--gold-text,#776035);
  color:var(--paper,#F6F1E6);
}
.lscc-btn-si:hover,
.lscc-btn-salva:hover{
  background:var(--ink,#2C2318);
  border-color:var(--ink,#2C2318);
  color:var(--paper,#F6F1E6);
}

.lscc-policy{ margin:14px 0 0 !important; font-size:.8rem !important; }
.lscc-policy a{ color:var(--muted,#8A7B68); text-underline-offset:3px; }
.lscc-policy a:hover{ color:var(--gold-text,#776035); }

/* ---------- link per ripensarci ---------- */

.lscc-riapri{
  background:none; border:0; padding:0; cursor:pointer;
  font-family:inherit; font-size:inherit; color:inherit;
  text-decoration:underline; text-underline-offset:3px;
   transition:opacity .3s ease, color .3s ease;
}
.lscc-riapri:hover{ opacity:1; color:var(--gold-text,#776035); }

/* ---------- segnaposto dei contenuti bloccati ---------- */

.lscc-blocco{
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  min-height:260px; height:100%;
  padding:clamp(24px,4vw,44px);
  background:var(--paper-2,#EFE8D8);
  border:1px solid var(--line,rgba(44,35,24,.16));
  text-align:center;
}

/* Mappa disegnata da noi: sta sotto, non deve rubare la scena al testo. */
.lscc-mappa-svg{
  position:absolute; inset:0;
  width:100%; height:100%;
  color:var(--bronze,#8B7C61);
  opacity:.38;
  pointer-events:none;
}
.lscc-blocco-mappa .lscc-blocco-testo{
  position:relative;
  padding:clamp(18px,3vw,28px) clamp(16px,3vw,32px);
  background:color-mix(in srgb, var(--paper-2,#EFE8D8) 88%, transparent);
  backdrop-filter:blur(1px);
}
@supports not (background:color-mix(in srgb, red 50%, transparent)){
  .lscc-blocco-mappa .lscc-blocco-testo{ background:rgba(239,232,216,.9); }
}

.lscc-blocco-testo{ max-width:34em; }

/* Stesso sopratitolo delle sezioni: maiuscoletto bronzo fra due filetti. */
.lscc-blocco-tit{
  display:inline-flex; align-items:center; gap:1em;
  margin:0 0 10px;
  font-family:var(--serif-sc,var(--serif,Georgia,serif));
  font-size:.8rem; font-weight:600;
  letter-spacing:.28em; text-transform:lowercase;
  color:var(--bronze-text,#6E624D);
}
.lscc-blocco-tit::before,
.lscc-blocco-tit::after{
  content:""; width:26px; height:1px;
  background:currentColor; opacity:.55;
}
.lscc-blocco-desc{
  margin:0 0 18px;
  font-family:var(--sans,system-ui,sans-serif);
  font-size:.86rem; line-height:1.65;
  color:var(--ink-soft,#57493A);
}
.lscc-blocco .lscc-btn{ flex:0 0 auto; margin-bottom:12px; }
.lscc-blocco .lscc-riapri{
  display:block; width:100%;
  font-size:.78rem; color:var(--muted,#8A7B68);
}

/* ---------- schermi stretti ---------- */

@media (max-width:600px){
  .lscc{ padding:0; }
  .lscc-box{
    max-width:none; max-height:88vh;
    border-left:0; border-right:0; border-bottom:0; border-radius:0;
  }
  .lscc-azioni{ flex-direction:column; }
  .lscc-btn{ width:100%; }
  /* In colonna il flex-basis è un'altezza, non una larghezza: se restasse al
     50% i due pulsanti delle risposte diventerebbero due mezze pagine. */
  .lscc-btn-scelta{ flex:0 0 auto; }
}

@media (prefers-contrast:more){
  .lscc-box{ border-width:2px; }
  .lscc-btn{ border-width:2px; }
}

/* L'avviso tecnico ha una sola azione e un comando di chiusura accessibile. */
.lscc.lscc-tecnico .lscc-btn{ flex:1 1 100%; min-height:44px; }
.lscc.lscc-tecnico .lscc-x{ width:44px; height:44px; top:6px; right:6px; padding:0; }
.lscc.lscc-tecnico .lscc-testa{ padding-right:32px; }