/* ==========================================================================
   STILI SPECIFICI CONFIGURATORE LICENZE
   Riusano i design token della v9 (--navy, --teal, --paper, --line, --t-*).
   Qui vivono solo le classi .lic-* che non esistono nella v9 accessori.
   ========================================================================== */

/* Utility di base riusate da JS: la v9 non le definiva */
.muted { color: var(--text-soft); }
.small { font-size: var(--t-sm); }
body.no-scroll { overflow: hidden; }

/* ==========================================================================
   LOGHI BRAND (file SVG reali in sito/img/loghi/)
   ========================================================================== */
img.brand-logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}
.brand-logo-fallback {
  font-family: var(--display-serif);
  font-weight: 400;
  font-size: var(--t-md);
  color: var(--ink);
}

/* Nella fascia "Brand disponibili" sopra la hero.
   Grayscale a riposo come la v9 accessori; a colori all'hover.
   Le altezze sono calibrate per brand per equilibrare il peso visivo:
   wordmark lunghi (Omnissa, Veeam) piu' bassi, loghi compatti (Canonical) piu' alti. */
img.brand-logo-strip {
  height: 26px;
  width: auto;
  filter: grayscale(.85) brightness(.5);
  opacity: .78;
  transition: opacity 220ms var(--e-out), filter 220ms var(--e-out), transform 220ms var(--e-out);
}
.brands-item a:hover img.brand-logo-strip,
.brand-strip-pick:hover img.brand-logo-strip {
  opacity: 1;
  filter: grayscale(0) brightness(1);
  transform: translateY(-1px);
}
/* Altezze calibrate per brand */
img.brand-logo-strip[alt="Omnissa"]   { height: 22px; }
img.brand-logo-strip[alt="Canonical"] { height: 32px; }
img.brand-logo-strip[alt="Trend AI"]  { height: 24px; }
img.brand-logo-strip[alt="Veeam"]     { height: 22px; }

/* Dark mode: i loghi colorati stonerebbero su fondo navy. Invertiamo quelli
   principalmente scuri (Omnissa) e teniamo i colorati pieni. */
:root[data-theme="dark"] img.brand-logo-strip {
  filter: grayscale(.4) brightness(1.1) invert(.86);
  opacity: .82;
}
:root[data-theme="dark"] .brands-item a:hover img.brand-logo-strip,
:root[data-theme="dark"] .brand-strip-pick:hover img.brand-logo-strip {
  filter: brightness(1.1) invert(.86);
  opacity: 1;
}

.brand-strip-pick {
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  font: inherit;
  color: inherit;
  border-radius: 4px;
}
.brand-strip-pick:focus-visible {
  outline: 2px solid var(--teal-700);
  outline-offset: 3px;
}
.brand-strip-soon {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  opacity: .55;
  cursor: not-allowed;
}
.brand-strip-soon img.brand-logo-strip {
  filter: grayscale(1) brightness(.6);
}
.brand-strip-soon em {
  font-style: normal;
  font-size: var(--t-xs);
  color: var(--text-soft);
  text-transform: uppercase;
  letter-spacing: .4px;
}

/* Nel chip del titolo del pannello Componi */
img.brand-logo-chip {
  height: 22px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
}
img.brand-logo-chip[alt="Canonical"] { height: 26px; }

/* Nelle card di scelta brand: logo a colori pieni, piu' grande */
.lic-brand-logo {
  display: flex;
  align-items: center;
  min-height: 44px;
  margin-bottom: var(--s2);
}
.lic-brand-logo img.brand-logo {
  height: 36px;
  width: auto;
}
.lic-brand-logo img.brand-logo[alt="Canonical"] { height: 48px; }
.lic-brand-logo img.brand-logo[alt="Omnissa"]   { height: 28px; }
.lic-brand-logo img.brand-logo[alt="Veeam"]     { height: 30px; }
.lic-brand-card[disabled] .lic-brand-logo img.brand-logo {
  filter: grayscale(1) brightness(.8);
  opacity: .6;
}
:root[data-theme="dark"] .lic-brand-logo img.brand-logo {
  filter: brightness(1.1) invert(.86);
}
:root[data-theme="dark"] .lic-brand-logo img.brand-logo[alt="Canonical"],
:root[data-theme="dark"] .lic-brand-logo img.brand-logo[alt="Veeam"] {
  filter: none;  /* questi hanno accenti colorati che reggono sul fondo scuro */
}

/* ==========================================================================
   Masthead on-scroll (classe aggiunta da JS)
   ========================================================================== */
.masthead { transition: box-shadow 220ms var(--e-out), background 220ms var(--e-out); }
.masthead.is-scrolled {
  box-shadow: 0 2px 10px rgba(var(--navy-rgb), .18);
}

/* Char-split hero title */
.hero-h1 .h1-word {
  display: inline-flex;
  overflow: hidden;
  line-height: 1.08;
}
.hero-h1 .h1-char {
  display: inline-block;
  will-change: transform, opacity;
}
.hero-h1 .h1-space {
  display: inline; /* inline-block lasciava uno spazio a inizio riga */
}
html:not(.motion) .hero-h1 .h1-char { opacity: 1 !important; transform: none !important; }

/* Fallback: fade-up / reveal in assenza di motion */
html:not(.motion) .gs-fade-up,
html:not(.motion) .gs-reveal { opacity: 1 !important; transform: none !important; }
.gs-fade-up.gs-visible, .gs-reveal.gs-visible { opacity: 1; transform: none; }

/* Brand pill: una riga di scorciatoie brand sopra la hero (clic -> scroll + select) */
.brand-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--text);
  font-size: var(--t-sm);
  text-decoration: none;
  transition: border-color var(--t-1), color var(--t-1), transform var(--t-1);
}
.brand-pill:hover {
  border-color: var(--teal);
  color: var(--teal-700);
  transform: translateY(-1px);
}
.brand-pill-name {
  font-family: var(--display-serif);
  font-weight: 400;
  color: var(--ink);
}
.brand-pill-meta {
  font-size: var(--t-xs);
  color: var(--text-soft);
}
.brand-pill.is-soon {
  border-style: dashed;
  color: var(--text-soft);
  cursor: not-allowed;
  background: var(--paper-2);
}
.brand-pill.is-soon .brand-pill-name {
  color: var(--text);
}


/* Pannello del configuratore (variante leggera di .panel della v9) */
.lic-panel {
  background: var(--surface-elevated);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: clamp(20px, 3vw, 32px);
  margin: 0 0 var(--s7);
  box-shadow: var(--sh-1);
}
.lic-panel + .lic-panel { margin-top: var(--s7); }
.lic-panel .panel-ask {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--s4);
  margin-bottom: var(--s5);
  flex-wrap: wrap;
}
.lic-panel .panel-ask h2 {
  font-family: var(--display-serif);
  font-weight: 400;
  font-size: var(--t-xl);
  color: var(--ink);
  margin: 0 0 6px;
  display: flex;
  align-items: baseline;
  gap: var(--s3);
  flex-wrap: wrap;
}
.lic-panel .panel-ask p {
  color: var(--text);
  font-size: var(--t-base);
  margin: 0;
  max-width: 72ch;
}

/* ----- Scelta brand ----- */
.lic-brand-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--s4);
}
.lic-brand-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: var(--s5);
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: var(--s2);
  min-height: 128px;
  transition: border-color var(--t-1), box-shadow var(--t-1), transform var(--t-1);
}
.lic-brand-card:hover:not([disabled]) {
  border-color: var(--teal);
  box-shadow: 0 6px 20px rgba(var(--teal-rgb), .12);
  transform: translateY(-1px);
}
.lic-brand-card[disabled] {
  cursor: not-allowed;
  background: var(--paper-2);
  color: var(--text-soft);
  opacity: .72;
}
.lic-brand-card.is-selected {
  border-color: var(--teal);
  background: var(--teal-050);
  box-shadow: 0 0 0 1px var(--teal) inset;
}
.lic-brand-card .bname {
  font-family: var(--display-serif);
  font-weight: 400;
  font-size: var(--t-lg);
  color: var(--ink);
  line-height: 1.15;
}
.lic-brand-card .bmeta {
  font-size: var(--t-sm);
  color: var(--text-soft);
}
.lic-brand-card .btag {
  margin-top: auto;
  align-self: flex-start;
  font-size: var(--t-micro);
  font-weight: 600;
  letter-spacing: .3px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 99px;
  background: var(--paper-3);
  color: var(--text);
}
.lic-brand-card .btag.go {
  background: var(--teal-050);
  color: var(--teal-700);
}

/* Chip brand nel titolo del pannello compose */
.lic-brand-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 99px;
  background: var(--tint);
  color: var(--teal-700);
  font-family: var(--sans);
  font-size: var(--t-sm);
  font-weight: 600;
  letter-spacing: .2px;
}
.lic-brand-chip:empty { display: none; }

/* ----- Shelf (configuratore + distinta laterale) ----- */
.lic-shelf {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: var(--s6);
  align-items: start;
}
.lic-shelf-main {
  min-width: 0;
}
.lic-mini {
  position: sticky;
  top: calc(var(--head) + 12px);
  background: var(--surface-elevated);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  overflow: hidden;
  max-height: calc(100vh - var(--head) - 32px);
  display: flex;
  flex-direction: column;
}
.lic-mini-head {
  padding: var(--s4) var(--s5);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.lic-mini-head h3 {
  font-size: var(--t-md);
  font-weight: 700;
  color: var(--ink);
  margin: 0;
}
.lic-mini-n {
  font-weight: 700;
  font-size: var(--t-sm);
  background: var(--teal);
  color: var(--on-teal);
  padding: 2px 10px;
  border-radius: 99px;
  min-width: 24px;
  text-align: center;
}
.lic-mini-n.is-empty {
  background: var(--paper-3);
  color: var(--text-soft);
}
.lic-mini-body {
  flex: 1;
  overflow-y: auto;
  padding: var(--s3) var(--s5);
}
.lic-mini-body .empty {
  color: var(--text-soft);
  padding: var(--s5) 0;
  text-align: center;
  font-size: var(--t-sm);
}
.lic-mini-foot {
  padding: var(--s4) var(--s5);
  border-top: 1px solid var(--line);
  background: var(--paper-2);
}
@media (max-width: 1020px) {
  .lic-shelf {
    grid-template-columns: minmax(0, 1fr);
  }
  .lic-mini {
    position: static;
    max-height: none;
  }
}

/* ----- Tabs ho/non ho codici ----- */
.lic-tabs {
  display: flex;
  gap: var(--s1);
  border-bottom: 1px solid var(--line);
  margin-bottom: var(--s5);
}
.lic-tab {
  background: none;
  border: 0;
  border-bottom: 3px solid transparent;
  padding: var(--s3) var(--s5);
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  color: var(--text-soft);
  transition: color var(--t-1), border-color var(--t-1);
}
.lic-tab:hover {
  color: var(--ink);
}
.lic-tab[aria-selected="true"] {
  color: var(--teal-700);
  border-bottom-color: var(--teal);
}
.lic-tab-body {
  min-height: 240px;
}

/* ----- Form elementi condivisi tra le tab ----- */
.lic-field { display: block; margin-bottom: var(--s4); }
.lic-field > label {
  display: block;
  font-weight: 600;
  font-size: var(--t-sm);
  color: var(--ink);
  margin-bottom: 6px;
}
.lic-field .hint {
  font-size: var(--t-xs);
  color: var(--text-soft);
  margin: 6px 0 0;
}
.lic-field textarea.control {
  min-height: 110px;
  font-family: var(--mono);
  font-size: var(--t-sm);
  resize: vertical;
}
.lic-row {
  display: flex;
  gap: var(--s2);
  flex-wrap: wrap;
  align-items: center;
}

/* Suggerimenti autocomplete (tab Ho codici) */
.lic-suggest { position: relative; }
.lic-sug {
  position: absolute;
  z-index: 20;
  left: 0; right: 0;
  top: 100%;
  margin: 4px 0 0;
  padding: 4px;
  list-style: none;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xs);
  box-shadow: var(--sh-3);
  max-height: 360px;
  overflow: auto;
}
.lic-sug li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--s3);
  padding: 8px 10px;
  border-radius: 6px;
}
.lic-sug li:hover { background: var(--tint); }
.lic-sug .empty { color: var(--text-soft); padding: 10px; }
.lic-sug .sug-t { min-width: 0; }
.lic-sug .sug-t b {
  display: block;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lic-sug .sug-t small {
  display: block;
  font-size: var(--t-xs);
  color: var(--text-soft);
  margin-top: 2px;
}

/* Tabella esito parse */
.lic-parse-sum {
  display: flex;
  gap: var(--s2);
  flex-wrap: wrap;
  margin: var(--s3) 0;
}
.lic-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--t-sm);
}
.lic-table th {
  text-align: left;
  font-size: var(--t-xs);
  text-transform: uppercase;
  letter-spacing: .4px;
  color: var(--text-soft);
  border-bottom: 1px solid var(--line);
  padding: 6px 8px;
}
.lic-table td {
  padding: 8px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.lic-table code {
  font-family: var(--mono);
  font-size: var(--t-xs);
  background: var(--paper-3);
  padding: 1px 6px;
  border-radius: 4px;
}
.lic-badge {
  display: inline-block;
  font-size: var(--t-xs);
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 99px;
  background: var(--paper-3);
  color: var(--text);
  white-space: nowrap;
}
.lic-badge.ok   { background: var(--ok-tint);   color: var(--ok); }
.lic-badge.warn { background: var(--wait-tint); color: var(--wait); }
.lic-badge.bad  { background: var(--alert-tint); color: var(--alert); }
.lic-badge.info { background: var(--blue-050);  color: var(--blue-ergo-700); }

/* Facets filtri a cascata (tab Non ho codici) */
.lic-fgroup { margin-bottom: var(--s5); }
.lic-fgroup-h {
  font-size: var(--t-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text-soft);
  margin: 0 0 var(--s3);
}
.lic-facet { margin-bottom: var(--s3); }
.lic-facet-l {
  font-weight: 600;
  font-size: var(--t-sm);
  margin-bottom: 6px;
  display: flex;
  gap: var(--s2);
  align-items: baseline;
}
.lic-facet-l .x { font-weight: 400; color: var(--text-soft); font-size: var(--t-xs); }
.lic-chips { display: flex; flex-wrap: wrap; gap: var(--s2); }
.lic-chip {
  border: 1px solid var(--line-strong);
  background: var(--paper);
  border-radius: 99px;
  padding: 5px 12px;
  cursor: pointer;
  font: inherit;
  font-size: var(--t-sm);
  color: var(--text);
  transition: border-color var(--t-1), background var(--t-1), color var(--t-1);
}
.lic-chip:hover { border-color: var(--teal); }
.lic-chip[aria-pressed="true"] {
  background: var(--teal);
  border-color: var(--teal);
  color: var(--on-teal);
}
.lic-chip .n {
  opacity: .72;
  font-size: var(--t-xs);
  margin-left: 4px;
}

/* Risultati cards (tab Non ho codici) */
.lic-res-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s3);
  margin: var(--s5) 0 var(--s3);
  padding-top: var(--s4);
  border-top: 1px solid var(--line);
}
.lic-res-h b { font-size: var(--t-base); color: var(--ink); }
.lic-card {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: var(--s4);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 200px;
  gap: var(--s4);
  background: var(--paper);
  transition: border-color var(--t-1), box-shadow var(--t-1);
}
.lic-card + .lic-card { margin-top: var(--s3); }
.lic-card:hover { border-color: var(--line-strong); box-shadow: var(--sh-1); }
.lic-card h4 {
  font-size: var(--t-md);
  color: var(--ink);
  margin: 0 0 2px;
  font-weight: 600;
}
.lic-card .d {
  font-size: var(--t-sm);
  color: var(--text-soft);
  margin: 0 0 var(--s2);
}
.lic-card code {
  font-family: var(--mono);
  font-size: var(--t-xs);
  background: var(--paper-3);
  padding: 2px 6px;
  border-radius: 4px;
  display: inline-block;
  margin-top: var(--s2);
}
.lic-card .badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 6px 0;
}
.lic-card .side {
  display: flex;
  flex-direction: column;
  gap: var(--s2);
  align-items: flex-end;
  text-align: right;
}
.lic-card .price {
  font-size: var(--t-lg);
  font-weight: 700;
  color: var(--ink);
}
.lic-card .price small {
  display: block;
  font-size: var(--t-xs);
  font-weight: 400;
  color: var(--text-soft);
  margin-top: 2px;
}
.lic-addrow {
  display: flex;
  gap: 6px;
  align-items: center;
}
.lic-addrow input {
  width: 76px;
  padding: 6px 8px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--paper);
  font: inherit;
  text-align: right;
}
@media (max-width: 640px) {
  .lic-card { grid-template-columns: 1fr; }
  .lic-card .side { align-items: stretch; text-align: left; }
}

/* Riga della distinta nel mini-pannello laterale */
.lic-line {
  padding: var(--s3) 0;
  border-bottom: 1px solid var(--line);
}
.lic-line:last-child { border-bottom: 0; }
.lic-line-top {
  display: flex;
  justify-content: space-between;
  gap: var(--s2);
  align-items: flex-start;
}
.lic-line-t { font-weight: 600; font-size: var(--t-sm); color: var(--ink); }
.lic-line-d { font-size: var(--t-xs); color: var(--text-soft); margin-top: 2px; }
.lic-line-ctl {
  display: flex;
  align-items: center;
  gap: var(--s2);
  margin-top: var(--s2);
  flex-wrap: wrap;
}
.lic-qty {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: var(--t-xs);
  color: var(--text-soft);
}
.lic-qty input {
  width: 72px;
  padding: 4px 6px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--paper);
  font: inherit;
  font-weight: 700;
  text-align: right;
}
.lic-line-tot { margin-left: auto; font-weight: 700; color: var(--ink); font-size: var(--t-sm); }
.lic-del {
  background: none;
  border: 0;
  cursor: pointer;
  color: var(--text-soft);
  font-size: 18px;
  line-height: 1;
  padding: 0 4px;
  font: inherit;
}
.lic-del:hover { color: var(--alert); }
.lic-msg {
  font-size: var(--t-xs);
  border-radius: 6px;
  padding: 6px 8px;
  margin-top: 6px;
}
.lic-msg.warn { background: var(--wait-tint); color: var(--wait); }
.lic-msg.info { background: var(--blue-050); color: var(--blue-ergo-700); }
.lic-msg.bad  { background: var(--alert-tint); color: var(--alert); }

/* File upload button */
.lic-file-btn {
  position: relative;
  overflow: hidden;
}
.lic-file-btn input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

/* Totale distinta + bottoni azione sotto mini-foot */
.lic-mini-tot {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: var(--s3);
}
.lic-mini-tot b {
  font-size: var(--t-lg);
  color: var(--ink);
}
.lic-mini-acts {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--s2);
}

/* Riepilogo */
#reviewList .lic-review-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px 120px 120px;
  gap: var(--s3);
  padding: var(--s3) 0;
  border-bottom: 1px solid var(--line);
  align-items: center;
  font-size: var(--t-sm);
}
#reviewList .lic-review-line:last-child { border-bottom: 0; }
#reviewList .rh { font-weight: 700; color: var(--text-soft); font-size: var(--t-xs); text-transform: uppercase; letter-spacing: .4px; }
#reviewList .lic-review-line .right { text-align: right; }
#reviewList .lic-review-line .code { font-family: var(--mono); font-size: var(--t-xs); color: var(--text); }
@media (max-width: 720px) {
  #reviewList .lic-review-line { grid-template-columns: 1fr; }
  #reviewList .lic-review-line .right, #reviewList .lic-review-line .rh { text-align: left; }
}

/* ==========================================================================
   PDF — Documento di configurazione, orizzontale A4
   Ispirato ai blocchi del PDF v9 accessori (header, cards config+ente,
   tabella con subheader piattaforma, totale, "Come procedere" steps,
   recall con codice CNV + QR, footer). Un unico foglio flusso: le righe
   della tabella hanno page-break-inside: avoid, i blocchi hanno page-break-
   inside: avoid dove ha senso.
   ========================================================================== */

/* Variabili locali al PDF: palette ferma dentro #printArea / #ppBody .pdf-sheet
   per non dipendere dal data-theme corrente (anche in dark mode il PDF deve
   restare light). */
.pdf-sheet {
  --pdf-ink: #0b1329;
  --pdf-text: #334155;
  --pdf-soft: #52627a;
  --pdf-mute: #7a8798;
  --pdf-line: #e2e8f0;
  --pdf-rule: #cbd5e1;
  --pdf-tint: #f8fafc;
  --pdf-teal: #10b981;
  --pdf-teal-700: #047857;
  --pdf-teal-050: #ecfdf5;
  --pdf-wait-tint: #fffbeb;
  --pdf-wait-line: #fde68a;
  --pdf-wait: #8a5300;

  background: #fff;
  color: var(--pdf-ink);
  font-family: 'Lexend', 'Segoe UI', system-ui, sans-serif;
  font-size: 9.5pt;
  line-height: 1.35;
  padding: 8mm 10mm;
  width: 277mm;                       /* A4 landscape content width (297 - 2*10) */
  margin: 0 auto;
  box-sizing: border-box;
}

/* ---- HEADER / FOOTER ---- */
.pdf-head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8mm;
  align-items: center;
  padding-bottom: 3mm;
  border-bottom: 1pt solid var(--pdf-ink);
  margin-bottom: 4mm;
}
.pdf-head-logo { height: 34px; width: auto; }
.pdf-head-mark { height: 20px; width: auto; }
.pdf-head-meta {
  display: flex;
  gap: 8mm;
  justify-content: flex-end;
  align-items: baseline;
  color: var(--pdf-soft);
  font-size: 9pt;
}
.pdf-head-kicker {
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-size: 8pt;
  font-weight: 700;
  color: var(--pdf-ink);
}
.pdf-head-date { color: var(--pdf-ink); font-weight: 600; }
.pdf-head-doc { font-family: 'SFMono-Regular','SF Mono',Consolas,monospace; font-size: 8.5pt; color: var(--pdf-soft); }
.pdf-head-doc b { color: var(--pdf-ink); }

.pdf-head-cont {
  grid-template-columns: auto 1fr;
  padding-bottom: 2mm;
  margin-bottom: 3mm;
  border-bottom: .5pt solid var(--pdf-rule);
}
.pdf-head-title-mini {
  font-size: 8.5pt;
  color: var(--pdf-soft);
  justify-self: start;
}
.pdf-head-title-mini b { color: var(--pdf-ink); }
.pdf-head-title-mini span {
  font-family: 'SFMono-Regular','SF Mono',Consolas,monospace;
  color: var(--pdf-teal-700);
}

.pdf-foot {
  margin-top: 5mm;
  padding-top: 2mm;
  border-top: .5pt solid var(--pdf-rule);
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 4mm;
  align-items: center;
  font-size: 7.5pt;
  color: var(--pdf-mute);
}
.pdf-foot-mark { height: 16px; width: auto; }
.pdf-foot .f-mid { text-align: center; }
.pdf-foot .f-right { color: var(--pdf-soft); text-transform: uppercase; letter-spacing: 1px; font-weight: 600; font-size: 7pt; }

/* ---- PAGE BREAK HELPER ---- */
.pdf-pb { page-break-inside: avoid; break-inside: avoid; margin-bottom: 4mm; }
.pdf-pb:last-child { margin-bottom: 0; }
.pdf-keep-prev { page-break-before: avoid; break-before: avoid; }

/* ---- TITOLO + SOTTOTITOLO ---- */
.pdf-title-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8mm;
  align-items: center;
}
.pdf-title {
  font-family: 'DM Serif Display','Lexend',Georgia,serif;
  font-weight: 400;
  font-size: 20pt;
  color: var(--pdf-ink);
  letter-spacing: -0.015em;
  margin: 0;
  line-height: 1.1;
}
.pdf-sub {
  font-size: 10pt;
  color: var(--pdf-soft);
  margin: 1.5mm 0 0;
}
.pdf-title-brand {
  height: 14mm;
  width: auto;
  max-width: 60mm;
  display: block;
}
.pdf-title-brand[alt="Canonical"] { height: 18mm; }
.pdf-title-brand[alt="Omnissa"]   { height: 10mm; }
.pdf-title-brand[alt="Veeam"]     { height: 11mm; }

/* ---- CARDS CONFIGURAZIONE + ENTE ---- */
.pdf-cols2 {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 5mm;
  align-items: stretch;
}
.pdf-card {
  border: .5pt solid var(--pdf-line);
  border-radius: 2mm;
  padding: 3mm 4mm;
  background: #fff;
  display: flex;
  flex-direction: column;
}
.pdf-card.soft { background: var(--pdf-tint); }
.pdf-card.dashed { border-style: dashed; }
.pdf-card-title {
  font-size: 8pt;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--pdf-soft);
  font-weight: 700;
  margin-bottom: 2mm;
}
.pdf-metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2mm 6mm;
}
.pdf-metrics li {
  display: flex;
  justify-content: space-between;
  gap: 3mm;
  border-bottom: .3pt dotted var(--pdf-line);
  padding-bottom: 1mm;
}
.pdf-metrics .m-plats { grid-column: 1 / -1; border-bottom: 0; padding-top: 1mm; }
.pdf-metrics .m-lbl { color: var(--pdf-soft); font-size: 8.5pt; }
.pdf-metrics .m-val {
  color: var(--pdf-ink);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  text-align: right;
  font-size: 9.5pt;
}
.pdf-metrics .m-val small { display: block; color: var(--pdf-mute); font-weight: 400; font-size: 7.5pt; }
.pdf-metrics .m-plats .m-val { text-align: left; font-weight: 400; font-size: 8.5pt; color: var(--pdf-text); }

.pdf-who {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5mm;
}
.pdf-who-item {
  display: grid;
  grid-template-columns: 28mm 1fr;
  gap: 3mm;
  padding: 1mm 0;
  border-bottom: .3pt dotted var(--pdf-line);
}
.pdf-who-item:last-child { border-bottom: 0; }
.pdf-who-item .w-k { color: var(--pdf-soft); font-size: 8.5pt; }
.pdf-who-item .w-v { color: var(--pdf-ink); font-weight: 600; }
.pdf-who-empty { color: var(--pdf-mute); font-size: 8.5pt; }

/* ---- TABELLA PRODOTTI ---- */
.pdf-items {
  width: 100%;
  border-collapse: collapse;
  font-size: 9pt;
}
.pdf-items thead th {
  background: var(--pdf-ink);
  color: #fff;
  padding: 2mm 2.5mm;
  text-align: left;
  font-weight: 700;
  font-size: 8pt;
  text-transform: uppercase;
  letter-spacing: .4px;
  border: 0;
}
.pdf-items thead th.c { text-align: center; }
.pdf-items thead th.r { text-align: right; }
.pdf-items tbody td {
  padding: 2mm 2.5mm;
  border-bottom: .3pt solid var(--pdf-line);
  vertical-align: top;
}
.pdf-items .mono { font-family: 'SFMono-Regular','SF Mono',Consolas,monospace; font-size: 8pt; }
.pdf-items .num { text-align: right; font-variant-numeric: tabular-nums; }
.pdf-items .num small { color: var(--pdf-mute); font-weight: 400; display: block; }
.pdf-items .it-t { font-weight: 600; color: var(--pdf-ink); font-size: 9pt; line-height: 1.25; }
.pdf-items .it-d { color: var(--pdf-soft); font-size: 7.8pt; margin-top: 0.5mm; line-height: 1.3; }
.pdf-items tbody tr.pdf-row-item { page-break-inside: avoid; break-inside: avoid; }

.pdf-items tr.pdf-row-plat td {
  background: var(--pdf-teal-050);
  color: var(--pdf-teal-700);
  border-top: 0.5pt solid var(--pdf-teal);
  border-bottom: 0.5pt solid var(--pdf-teal);
  padding: 1.5mm 2.5mm;
  font-weight: 700;
  font-size: 8pt;
  text-transform: uppercase;
  letter-spacing: 1px;
  display: flex;
  justify-content: space-between;
  gap: 4mm;
}
.pdf-items tr.pdf-row-plat .rc-meta { font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--pdf-soft); }

/* ---- TOTALE ---- */
.pdf-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 4mm;
  padding: 3mm 4mm;
  background: var(--pdf-ink);
  color: #fff;
  border-radius: 2mm;
}
.pdf-total .t-lbl { font-family: 'DM Serif Display','Lexend',Georgia,serif; font-size: 14pt; }
.pdf-total .t-val { text-align: right; }
.pdf-total .t-val b { font-size: 18pt; display: block; letter-spacing: -0.02em; }
.pdf-total .t-val span { font-size: 7.5pt; color: #cbd5e1; display: block; margin-top: 1mm; }

/* ---- COME PROCEDERE ---- */
.pdf-order {
  background: var(--pdf-tint);
  border: .5pt solid var(--pdf-line);
  border-radius: 2mm;
  padding: 4mm 5mm;
}
.pdf-order .order-title {
  font-family: 'DM Serif Display','Lexend',Georgia,serif;
  font-size: 12pt;
  color: var(--pdf-ink);
  margin-bottom: 3mm;
}
.pdf-order .order-steps {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4mm;
}
.pdf-order .order-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 3mm;
  align-items: start;
}
.pdf-order .os-n {
  display: inline-block;
  font-family: 'DM Serif Display','Lexend',Georgia,serif;
  font-size: 20pt;
  color: var(--pdf-teal-700);
  line-height: 1;
}
.pdf-order .os-txt { font-size: 8.5pt; color: var(--pdf-text); line-height: 1.4; }
.pdf-order .o-note {
  margin-top: 4mm;
  padding-top: 2mm;
  border-top: .3pt solid var(--pdf-line);
  font-size: 7.5pt;
  color: var(--pdf-mute);
}

/* ---- RECALL (codice CNV + QR) ---- */
.pdf-recall {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8mm;
  padding: 4mm 5mm;
  background: var(--pdf-teal-050);
  border: .5pt solid var(--pdf-teal);
  border-radius: 2mm;
  align-items: center;
}
.pdf-recall .r-kicker {
  display: block;
  font-size: 8pt;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--pdf-teal-700);
  font-weight: 700;
}
.pdf-recall .r-code {
  display: block;
  margin: 2mm 0;
  font-family: 'SFMono-Regular','SF Mono',Consolas,monospace;
  font-size: 14pt;
  color: var(--pdf-ink);
  word-break: break-all;
  font-weight: 600;
}
.pdf-recall .r-code.md { font-size: 12pt; }
.pdf-recall .r-code.lg { font-size: 10.5pt; }
.pdf-recall .r-code.xl { font-size: 9pt; }
.pdf-recall .r-hint { font-size: 8.5pt; color: var(--pdf-text); margin: 0; line-height: 1.4; }
.pdf-recall .r-qr {
  text-align: center;
}
.pdf-recall .r-qr svg {
  width: 34mm;
  height: 34mm;
  background: #fff;
  padding: 1mm;
  border-radius: 1mm;
}
.pdf-recall .r-qr-cap {
  display: block;
  font-size: 7pt;
  color: var(--pdf-soft);
  margin-top: 1mm;
  font-family: 'SFMono-Regular','SF Mono',Consolas,monospace;
}

/* ---- NOTE ---- */
.pdf-notes {
  padding: 3mm 4mm;
  background: var(--pdf-wait-tint);
  border: .5pt solid var(--pdf-wait-line);
  border-radius: 2mm;
  font-size: 8.5pt;
}
.pdf-notes h3 {
  margin: 0 0 1.5mm;
  font-size: 8pt;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--pdf-wait);
  font-weight: 700;
}
.pdf-notes ol { margin: 0; padding-left: 5mm; color: var(--pdf-text); }
.pdf-notes li { margin: 0.8mm 0; }

/* Anteprima (schermo): mostra il foglio con un contorno card */
#ppBody {
  background: #e9edf3;
  padding: var(--s4);
}
#ppBody .pdf-sheet {
  box-shadow: 0 8px 24px rgba(11, 19, 41, .14);
  margin: 0 auto;
}

/* ==========================================================================
   Stampa: nascondiamo tutta la UI tranne #printArea.
   @page landscape per il PDF orizzontale.
   ========================================================================== */
#printArea { display: none; }

@page { size: A4 landscape; margin: 8mm; }

@media print {
  body > *:not(#printArea) { display: none !important; }
  #printArea { display: block !important; }
  #printArea .pdf-sheet { width: auto; padding: 0; margin: 0; box-shadow: none; }
  .no-scroll { overflow: visible !important; }
  /* Dark mode non si applica in stampa */
  :root[data-theme="dark"] #printArea .pdf-sheet { color: var(--pdf-ink); background: #fff; }
}

/* ==========================================================================
   Lista recupero: anteprima prodotti dentro il dialog recupero
   ========================================================================== */
.recover-list {
  list-style: none;
  margin: var(--s3) 0 0;
  padding: 0;
  display: grid;
  gap: 4px;
  max-height: 220px;
  overflow: auto;
  padding-right: 4px;
}
.recover-list li {
  display: flex;
  justify-content: space-between;
  gap: var(--s3);
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--paper);
  font-size: var(--t-sm);
}
.recover-list li code {
  font-family: var(--mono);
  font-size: var(--t-xs);
  color: var(--text);
}
.tag { display: inline-block; padding: 3px 10px; border-radius: 99px; background: var(--paper-3); color: var(--text); font-size: var(--t-xs); font-weight: 600; }
.tag.tag-ok { background: var(--ok-tint); color: var(--ok); }
.tag.tag-ko { background: var(--alert-tint); color: var(--alert); }

/* Fix stampa quando "printing" classe aggiunta al body */
body.printing > *:not(#printArea) { display: none !important; }
body.printing #printArea { display: block !important; }


/* Hero licenze: soggetto (monitor con logo) a destra */
.hero-visual .hero-img-wrap img { object-position: 72% 50%; }

/* Vincoli d'acquisto del prodotto (prerequisiti dal listino) */
.lic-vincoli { font-size: 12.5px; line-height: 1.45; color: var(--wait, #b45309); margin: 4px 0 6px; }
/* La tabella prodotti del PDF puo' proseguire nella pagina successiva (le singole righe restano intere) */
.pdf-pb.pdf-pb-flow { page-break-inside: auto; break-inside: auto; }

/* ==========================================================================
   v1.1 UX - font locali, ricerca guidata compatta, note leggere, step
   ========================================================================== */

/* Font serviti in locale (niente Google Fonts: privacy degli enti e caricamento piu' rapido) */
@font-face { font-family: 'Lexend'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(fonts/lexend-latin-wght-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Lexend'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url(fonts/lexend-latin-ext-wght-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'DM Serif Display'; font-style: normal; font-weight: 400; font-display: swap;
  src: url(fonts/dm-serif-display-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'DM Serif Display'; font-style: italic; font-weight: 400; font-display: swap;
  src: url(fonts/dm-serif-display-latin-400-italic.woff2) format('woff2'); }

/* ----- Step numerati nei pannelli ----- */
.lic-step {
  display: inline-grid; place-items: center;
  width: 30px; height: 30px; flex: none;
  border-radius: 50%;
  background: var(--navy); color: var(--mint);
  font-family: var(--sans); font-size: 14px; font-weight: 700;
  align-self: center;
}
[data-theme="dark"] .lic-step { background: var(--teal-700); color: #fff; }

/* ----- Brand: disponibile in evidenza, "in arrivo" compatti ----- */
.lic-brand-card .bcta {
  margin-top: auto;
  display: inline-flex; align-items: center; gap: 6px;
  font-size: var(--t-sm); font-weight: 650; color: var(--teal-700);
}
.lic-brand-card .bcta svg { width: 14px; height: 14px; transition: transform var(--t-1); }
.lic-brand-card:hover:not([disabled]) .bcta svg { transform: translateX(3px); }
.lic-brand-card.is-soon { min-height: 0; padding: var(--s4); gap: 6px; background: var(--paper-2); box-shadow: none; }
.lic-brand-card.is-soon .bmeta { font-size: var(--t-xs); }
@media (max-width: 720px) {
  .lic-brand-grid { grid-template-columns: 1fr 1fr; gap: var(--s3); }
  .lic-brand-grid .lic-brand-card:not(.is-soon) { grid-column: 1 / -1; }
  .lic-brand-card.is-soon { padding: var(--s3); }
  .lic-brand-card.is-soon .bmeta { display: none; }
}

/* ----- Schede: icona + testo, mai su due righe ----- */
.lic-tab { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; min-height: 48px; }
.lic-tab svg { width: 18px; height: 18px; flex: none; opacity: .75; }
.lic-tab[aria-selected="true"] svg { opacity: 1; }
@media (max-width: 520px) {
  .lic-tabs { display: grid; grid-template-columns: 1fr 1fr; }
  .lic-tab { justify-content: center; padding: var(--s3) var(--s2); font-size: var(--t-sm); }
  .lic-tab svg { display: none; }
}

/* ----- Filtri: secondo gruppo richiudibile, chip piu' comode al tocco ----- */
.lic-refine { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); margin: var(--s3) 0 var(--s2); }
.lic-refine > summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: baseline; gap: var(--s3); flex-wrap: wrap;
  padding: var(--s3) var(--s4); min-height: 48px; box-sizing: border-box;
}
.lic-refine > summary::-webkit-details-marker { display: none; }
.lic-refine > summary::before {
  content: ''; width: 8px; height: 8px; flex: none; align-self: center;
  border-right: 2px solid var(--text-soft); border-bottom: 2px solid var(--text-soft);
  transform: rotate(-45deg); transition: transform var(--t-1);
}
.lic-refine[open] > summary::before { transform: rotate(45deg); }
.lic-refine-t { font-weight: 650; color: var(--ink); }
.lic-refine-s { font-size: var(--t-xs); color: var(--text-soft); }
.lic-refine > .lic-fgroup { padding: 0 var(--s4) var(--s2); }
.lic-refine:focus-within { border-color: var(--line-strong); }
@media (pointer: coarse) { .lic-chip { min-height: 40px; } }

/* ----- Filtri attivi ----- */
.lic-actives { display: flex; flex-wrap: wrap; gap: 6px; margin: -4px 0 var(--s4); }
.lic-active {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; padding: 4px 10px 4px 12px;
  border: 1px solid var(--teal-200, #a7f3d0); border-radius: 99px;
  background: var(--teal-050); color: var(--teal-700);
  font: inherit; font-size: var(--t-sm); font-weight: 600; cursor: pointer;
}
.lic-active .k { font-weight: 500; color: var(--text-soft); }
.lic-active .x { font-size: 16px; line-height: 1; margin-left: 2px; }
.lic-active:hover { border-color: var(--teal); }

/* ----- Risultati: righe compatte ----- */
.lic-res-list { display: flex; flex-direction: column; gap: var(--s2); }
.lic-res {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s4);
  align-items: center;
  padding: var(--s3) var(--s4);
  border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--surface-elevated, var(--paper));
  transition: border-color var(--t-1), box-shadow var(--t-1);
}
.lic-res:hover { border-color: var(--line-strong); box-shadow: var(--sh-1); }
.lic-res.is-in { border-color: var(--teal-200, #a7f3d0); box-shadow: inset 3px 0 0 var(--teal); }
.lic-res h4 { margin: 0; font-size: var(--t-base); font-weight: 650; color: var(--ink); line-height: 1.3; }
.lic-res .d { margin: 2px 0 0; font-size: var(--t-xs); color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lic-res .badges { display: flex; flex-wrap: wrap; gap: 4px; margin: 6px 0 0; }
.lic-res .badges .lic-badge { font-size: 11.5px; padding: 1px 7px; }
.lic-res .lic-vincoli { margin: 6px 0 0; font-size: var(--t-xs); }
.lic-res-code { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 6px; }
.lic-res-code code { font-family: var(--mono); font-size: 12px; color: var(--text-soft); background: var(--paper-3); padding: 1px 6px; border-radius: 4px; }
.lic-in { font-size: var(--t-xs); font-weight: 650; color: var(--teal-700); }
.lic-res-main { min-width: 0; }
.lic-res-side { display: grid; justify-items: end; gap: 6px; min-width: 210px; }
.lic-res-side .price { text-align: right; font-size: var(--t-md); font-weight: 680; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1.15; }
.lic-res-side .price small { display: block; font-size: 11.5px; font-weight: 500; color: var(--text-soft); }
.lic-res-add { display: flex; gap: 6px; align-items: center; }
.lic-res-add input.control { width: 86px; height: 40px; text-align: right; font-variant-numeric: tabular-nums; }
.lic-res-add .btn { height: 40px; white-space: nowrap; }
.lic-res-add .btn.is-done { background: var(--teal-700); border-color: var(--teal-700); color: #fff; }
.lic-res-unit { font-size: 11.5px; color: var(--text-soft); }
.lic-more { text-align: center; margin: var(--s5) 0 0; }
.lic-empty { display: grid; gap: 4px; padding: var(--s6); text-align: center; border: 1px dashed var(--line-strong); border-radius: var(--r-sm); color: var(--text-soft); }
.lic-empty b { color: var(--ink); }
@media (max-width: 640px) {
  .lic-res { grid-template-columns: minmax(0, 1fr); gap: var(--s3); }
  .lic-res-main { min-width: 0; }
  .lic-res-side { justify-items: stretch; grid-template-columns: 1fr auto; align-items: center; min-width: 0; }
  .lic-res-side .price { text-align: left; }
  .lic-res-unit { grid-column: 1 / -1; }
}

/* ----- Configurazione laterale: note leggere ----- */
.lic-note { margin: 6px 0 0; padding-left: 18px; position: relative; font-size: 12.5px; line-height: 1.4; color: var(--text-soft); }
.lic-note::before { content: ''; position: absolute; left: 4px; top: .5em; width: 6px; height: 6px; border-radius: 50%; background: var(--blue-mid, #3a506b); }
.lic-note.warn { color: var(--wait); }
.lic-note.warn::before { background: var(--wait-solid, #d97706); }
.lic-mini-empty { display: grid; justify-items: center; gap: 6px; text-align: center; padding: var(--s6) var(--s3); color: var(--text-soft); font-size: var(--t-sm); }
.lic-mini-empty svg { width: 34px; height: 34px; color: var(--line-strong); margin-bottom: 4px; }
.lic-mini-empty b { color: var(--ink); font-size: var(--t-base); }

/* ----- Riepilogo: barra di soglia ----- */
.gauge .gauge-note { margin: var(--s3) 0 0; font-size: var(--t-xs); color: var(--text-soft); }

/* brand "in arrivo" non si allungano alla stessa altezza della card disponibile */
.lic-brand-grid { align-items: start; }

/* ----- Hero: cosa si ottiene ----- */
.hero-proof { list-style: none; margin: var(--s6) 0 0; padding: 0; display: grid; gap: 10px; max-width: 520px; }
.hero-proof li { display: flex; align-items: flex-start; gap: 10px; font-size: var(--t-sm); line-height: 1.45; color: rgba(255,255,255,.82); }
.hero-proof svg { width: 18px; height: 18px; flex: none; margin-top: 1px; padding: 2px; border-radius: 50%; color: var(--navy); background: var(--mint); }
@media (max-width: 640px) { .hero-proof { margin-top: var(--s5); } }

/* ----- Tema scuro: contrasti dei componenti licenze ----- */
[data-theme="dark"] .btn-accent { background: var(--teal); color: var(--on-teal); }
[data-theme="dark"] .btn-accent:not(:disabled):hover { background: var(--mint); }
[data-theme="dark"] .lic-msg.info, [data-theme="dark"] .lic-badge.info { background: rgba(96,165,250,.14); color: #bfdbfe; }
[data-theme="dark"] .lic-msg.warn, [data-theme="dark"] .lic-badge.warn { background: rgba(245,158,11,.14); color: #fcd34d; }
[data-theme="dark"] .lic-msg.bad,  [data-theme="dark"] .lic-badge.bad  { background: rgba(248,113,113,.14); color: #fecaca; }
[data-theme="dark"] .lic-badge.ok { background: rgba(52,211,153,.14); color: #a7f3d0; }
[data-theme="dark"] .lic-note.warn, [data-theme="dark"] .lic-vincoli { color: #fcd34d; }
[data-theme="dark"] .lic-active { background: rgba(16,185,129,.14); border-color: rgba(52,211,153,.4); color: #a7f3d0; }
/* loghi dei brand (scuri) leggibili su fondo scuro */
[data-theme="dark"] .lic-brand-logo,
[data-theme="dark"] .lic-brand-chip,
[data-theme="dark"] .brands-list .brand-strip-pick,
[data-theme="dark"] .brands-list .brand-strip-soon { background: #fff; border-radius: 8px; padding: 6px 10px; }

/* area di rilascio per Excel/CSV */
#licTabBody.is-drop { outline: 2px dashed var(--teal); outline-offset: 8px; border-radius: var(--r-sm); background: var(--teal-050); }
[data-theme="dark"] #licTabBody.is-drop { background: rgba(16,185,129,.08); }

/* ==========================================================================
   v1.2 - stati, responsive e micro-animazioni
   ========================================================================== */

/* ----- Banner "riprendi la sessione": scheda flottante, non piu' nascosta sotto la testata ----- */
.session-banner {
  position: fixed; top: auto; left: auto; right: 24px; bottom: 24px; z-index: 330;
  max-width: 440px; width: calc(100vw - 48px);
  padding: var(--s4); border: 1px solid var(--teal-200, #a7f3d0); border-radius: var(--r-md);
  background: var(--surface-elevated, #fff); box-shadow: var(--sh-4);
  flex-direction: column; align-items: stretch; gap: var(--s3); font-size: var(--t-sm);
  animation: lic-slide-up 380ms cubic-bezier(.16,1,.3,1) both;
}
.session-banner-copy { align-items: flex-start; gap: 10px; }
.session-banner-ico { width: 32px; height: 32px; border-radius: 50%; background: var(--teal-050); justify-content: center; }
.session-banner-txt { white-space: normal; line-height: 1.45; padding-top: 5px; }
.session-banner-actions { justify-content: flex-end; }
.session-banner-btn { min-height: 40px; padding: 8px 16px; font-size: 13px; }
@media (max-width: 600px) {
  .session-banner { right: 12px; left: 12px; bottom: 12px; width: auto; max-width: none; }
  .session-banner-actions { width: auto; margin-top: 0; }
  .session-banner-btn { flex: 1; }
}
@keyframes lic-slide-up { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

/* ----- Riga appena aggiunta, contatori, soglia raggiunta ----- */
@keyframes lic-fresh { 0% { background: rgba(16,185,129,.18); } 100% { background: transparent; } }
.lic-line.is-fresh { animation: lic-fresh 1400ms ease-out both; border-radius: 8px; }
@keyframes lic-bump { 0% { transform: scale(1); } 40% { transform: scale(1.28); } 100% { transform: scale(1); } }
.bump { animation: lic-bump 320ms cubic-bezier(.34,1.56,.64,1); }
@media (prefers-reduced-motion: reduce) {
  .lic-line.is-fresh, .bump, .session-banner { animation: none; }
}

/* ----- Strumenti dei risultati (ordinamento) ----- */
.lic-res-h { flex-wrap: wrap; gap: var(--s3); }
.lic-res-tools { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; }
.lic-sort { display: inline-flex; align-items: center; gap: 8px; font-size: var(--t-xs); color: var(--text-soft); }
.lic-sort select.control { height: 36px; padding: 0 30px 0 10px; font-size: var(--t-sm); width: auto; }

/* ----- Analisi codici: tabella che su telefono diventa un elenco di schede ----- */
.lic-table tr.is-ko td { background: rgba(185,28,28,.03); }
@media (max-width: 640px) {
  .lic-table thead { display: none; }
  .lic-table, .lic-table tbody, .lic-table tr, .lic-table td { display: block; width: 100%; }
  .lic-table tr { border: 1px solid var(--line); border-radius: var(--r-sm); padding: var(--s3); margin-bottom: var(--s3); background: var(--surface-elevated, #fff); }
  .lic-table td { border: 0; padding: 4px 0; }
  .lic-table td[data-l]::before { content: attr(data-l); display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-soft); margin-bottom: 2px; }
  .lic-table td code { word-break: break-all; }
}

/* ----- Riepilogo: righe leggibili anche su telefono ----- */
#reviewList .rl-main .lic-note { max-width: 560px; }
@media (max-width: 720px) {
  #reviewList .lic-review-line.rl-head { display: none; }
  #reviewList .lic-review-line { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 6px; }
  #reviewList .lic-review-line .rl-main { grid-column: 1 / -1; }
  #reviewList .lic-review-line [data-l]::before { content: attr(data-l); display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-soft); }
  #reviewList .lic-review-line .rl-imp { text-align: right; font-weight: 700; }
}
/* azioni sul documento: 2 per riga su telefono, mai testo troncato */
@media (max-width: 600px) {
  .issue-secondary { display: grid; grid-template-columns: 1fr 1fr; }
  .issue-secondary .btn { white-space: nowrap; font-size: var(--t-sm); padding-left: 8px; padding-right: 8px; }
}

/* ----- Dialog codice CNV: QR visibile e spunta che si disegna ----- */
.seal-qr { display: grid; justify-items: center; gap: 8px; margin: var(--s4) auto 0; max-width: 260px; text-align: center; }
.seal-qr svg { width: 132px; height: 132px; padding: 8px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-sm); }
.seal-qr span { font-size: 11.5px; color: var(--text-soft); line-height: 1.4; }
.seal-qr:empty { display: none; }
#cnvSheet.on .seal-ok svg path { stroke-dasharray: 24; stroke-dashoffset: 24; animation: lic-draw 520ms 120ms ease-out forwards; }
@keyframes lic-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { #cnvSheet.on .seal-ok svg path { animation: none; stroke-dashoffset: 0; } }
#cnvRecap .recap { max-height: 240px; overflow: auto; }

/* ----- Dialog di recupero: storico e anteprima ----- */
.recover-history-item {
  display: grid; gap: 2px; width: 100%; text-align: left; cursor: pointer;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-xs);
  background: var(--surface-elevated, #fff); font: inherit; color: inherit;
}
.recover-history-item:hover { border-color: var(--teal); }
.recover-history-item .rh-code { font-family: var(--mono); font-size: 12px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.recover-history-item .rh-meta { font-size: 11.5px; color: var(--text-soft); }
#recoverHistoryList { display: grid; gap: 6px; list-style: none; padding: 0; margin: 0; }
.recover-list { list-style: none; margin: var(--s3) 0 0; padding: 0; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; }
.recover-list li { display: flex; justify-content: space-between; gap: var(--s3); padding: 8px 12px; border-bottom: 1px solid var(--line); font-size: var(--t-sm); }
.recover-list li:last-child { border-bottom: 0; }
.recover-list .rp-t { display: grid; min-width: 0; }
.recover-list .rp-t b { font-weight: 600; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.recover-list .rp-t code { font-family: var(--mono); font-size: 11.5px; color: var(--text-soft); }
.recover-list .rp-t small { font-size: 11.5px; color: var(--wait); }
.recover-list .rp-q { display: grid; justify-items: end; white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; }
.recover-list .rp-q small { font-weight: 500; color: var(--text-soft); font-size: 11.5px; }
.recover-list li.is-gone { background: var(--wait-tint); }
.rp-tot { display: flex; justify-content: space-between; align-items: baseline; margin-top: var(--s3); font-size: var(--t-sm); color: var(--text-soft); }
.rp-tot b { font-size: var(--t-md); color: var(--ink); font-variant-numeric: tabular-nums; }

/* ----- Anteprima PDF: il foglio si adatta alla finestra ----- */
.pp-body .pdf-sheet { flex: none; }
/* lo storico usa un layout proprio: annullo le aree di griglia ereditate */
.recover-history-item .rh-code, .recover-history-item .rh-meta { grid-area: auto; text-align: left; }
@media (max-width: 600px) {
  .issue-secondary .btn { white-space: normal; line-height: 1.2; min-height: 44px; }
}
/* il codice CNV distingue maiuscole e minuscole: mai trasformarlo a video */
#recoverInput.control-mono { text-transform: none; letter-spacing: .04em; }

/* ==========================================================================
   v1.3  Orientamento, percorso guidato, guida
   ========================================================================== */

/* ----- Hero: secondo percorso ben visibile ----- */
.hero-cta-guide {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 10px 18px 10px 14px; min-height: 52px;
  border-radius: var(--r-sm); border: 1px solid rgba(255,255,255,.26);
  background: rgba(255,255,255,.06); color: #fff; text-align: left;
  font-family: var(--sans); cursor: pointer;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  transition: background .2s, border-color .2s, transform .2s;
}
.hero-cta-guide svg { width: 24px; height: 24px; color: var(--mint); flex: none; }
.hero-cta-guide b { display: block; font-size: var(--t-sm); font-weight: 620; line-height: 1.25; }
.hero-cta-guide small { display: block; font-size: var(--t-xs); color: rgba(255,255,255,.66); margin-top: 2px; }
.hero-cta-guide:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.45); transform: translateY(-1px); }
.hero-cta-guide:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; }
@media (max-width: 720px) { .hero-cta-guide { width: 100%; } }

/* ----- Da dove vuoi partire ----- */
.paths { padding: var(--s9) 0 var(--s8); background: var(--paper); position: relative; }
.paths-head { display: grid; gap: var(--s3); margin-bottom: var(--s7); max-width: 720px; }
.paths-h2 { font-family: var(--display); font-size: var(--t-2xl); font-weight: 660; color: var(--ink); letter-spacing: -0.018em; line-height: 1.1; margin: 0; }
.paths-lede { margin: 0; color: var(--text); font-size: var(--t-base); line-height: 1.6; max-width: 62ch; }
.paths-grid { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: var(--s5); }
.path-card {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
  padding: var(--s6); border-radius: var(--r-md); text-align: left; cursor: pointer;
  background: var(--surface-elevated); border: 1px solid var(--line); color: var(--text);
  font-family: var(--sans); box-shadow: var(--sh-1);
  transition: transform .25s var(--e-out, ease), box-shadow .25s, border-color .25s;
}
.path-card:hover { transform: translateY(-3px); box-shadow: var(--sh-3); border-color: var(--teal-200); }
.path-card:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
.path-ico { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--teal-050); color: var(--teal-700); }
.path-ico svg { width: 26px; height: 26px; }
.path-t { font-family: var(--display); font-size: var(--t-lg); font-weight: 660; color: var(--ink); line-height: 1.2; letter-spacing: -0.01em; margin-top: 4px; }
.path-d { font-size: var(--t-sm); line-height: 1.6; color: var(--text); flex: 1; }
.path-go { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: var(--t-sm); font-weight: 650; color: var(--teal-700); }
.path-go svg { width: 14px; height: 14px; transition: transform .2s; }
.path-card:hover .path-go svg { transform: translateX(3px); }
.path-card.is-reco { background: var(--navy); border-color: var(--navy); color: rgba(255,255,255,.82); box-shadow: var(--sh-2); overflow: hidden; }
.path-card.is-reco::after { content: ''; position: absolute; right: -60px; top: -60px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, rgba(16,185,129,.32), transparent 70%); pointer-events: none; }
.path-card.is-reco .path-ico { background: rgba(16,185,129,.16); color: var(--mint); }
.path-card.is-reco .path-t { color: #fff; }
.path-card.is-reco .path-d { color: rgba(255,255,255,.78); }
.path-card.is-reco .path-go { color: var(--mint); }
.path-badge { position: absolute; top: var(--s5); right: var(--s5); font-size: 11px; font-weight: 700; letter-spacing: .04em; padding: 4px 10px; border-radius: 99px; background: var(--teal); color: var(--on-teal, #04210f); }
@media (max-width: 980px) { .paths-grid { grid-template-columns: 1fr; } .path-badge { position: static; order: -1; } }
[data-theme="dark"] .path-card.is-reco { background: #0a2a24; border-color: #12493c; }

/* ----- Come funziona a 4 passi ----- */
.flow { background: var(--paper-2); }
.flow-seq { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 980px) { .flow-seq { grid-template-columns: repeat(2, 1fr); row-gap: var(--s7); } }
@media (max-width: 560px) { .flow-seq { grid-template-columns: 1fr; } }
.flow-seq > .flow-step:last-child .flow-n { color: var(--teal-700); }

/* ----- Passo 2: logo del brand allineato sotto il titolo ----- */
#panelCompose .panel-ask > div { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
#panelCompose .panel-ask > div > p { flex-basis: 100%; }
#panelCompose .lic-brand-chip { background: var(--surface-elevated); border: 1px solid var(--line); padding: 6px 12px; border-radius: 8px; }
#panelCompose .lic-brand-chip img.brand-logo-chip { height: 18px; }

/* ----- Invito al percorso nei filtri e nei risultati ----- */
.lic-guide-cta {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px;
  padding: 14px 16px; margin-bottom: var(--s5); border-radius: var(--r-sm);
  background: linear-gradient(100deg, var(--teal-050), transparent 85%); border: 1px solid var(--teal-200);
}
.lic-guide-cta .ico, .lic-guide-res .ico { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--teal); color: #fff; flex: none; }
.lic-guide-cta .ico svg { width: 20px; height: 20px; }
.lic-guide-cta b { display: block; color: var(--ink); font-size: var(--t-sm); }
.lic-guide-cta span { display: block; font-size: var(--t-xs); color: var(--text); line-height: 1.5; margin-top: 2px; }
@media (max-width: 640px) { .lic-guide-cta { grid-template-columns: auto 1fr; } .lic-guide-cta .btn { grid-column: 1 / -1; } }
.lic-guide-res { padding: 16px 18px; margin-bottom: var(--s5); border-radius: var(--r-sm); background: var(--navy); color: rgba(255,255,255,.82); }
.lic-guide-res-t { display: flex; align-items: flex-start; gap: 12px; }
.lic-guide-res .ico { width: 32px; height: 32px; padding: 6px; }
.lic-guide-res b { display: block; color: #fff; font-size: var(--t-sm); }
.lic-guide-res-sum { display: block; font-size: var(--t-xs); color: var(--mint); margin-top: 3px; line-height: 1.5; }
.lic-guide-res p { margin: 10px 0 12px; font-size: var(--t-xs); line-height: 1.6; }
.lic-guide-res-a { display: flex; flex-wrap: wrap; gap: 8px; }
.lic-guide-res .btn-line { color: #fff; border-color: rgba(255,255,255,.35); background: transparent; }
.lic-guide-res .btn-quiet { color: rgba(255,255,255,.75); }
[data-theme="dark"] .lic-guide-res { background: #0a2a24; }
.lic-facet-h { margin: -2px 0 8px; font-size: var(--t-xs); color: var(--text-soft); line-height: 1.5; max-width: 70ch; }
.link-btn { background: none; border: 0; padding: 0; font: inherit; color: var(--teal-700); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.lic-mini-empty .link-btn { margin-top: 8px; font-size: var(--t-sm); }

/* ----- Dialog del percorso guidato ----- */
.dlg-guide .dlg-box { max-width: 720px; }
.dlg-guide .dlg-head { padding-bottom: var(--s5); }
.dlg-guide .dlg-head h2 { font-family: var(--display); }
.guide-progress { height: 4px; border-radius: 4px; background: var(--paper-3); overflow: hidden; margin: 0 48px var(--s4) 0; }
.guide-progress span { display: block; height: 100%; background: var(--teal); transform-origin: left center; transform: scaleX(0); transition: transform .35s var(--e-out, ease); }
.guide-opts { display: grid; gap: 10px; }
.guide-opts.is-compact { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.guide-opt {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; width: 100%;
  padding: 14px 16px; border-radius: var(--r-sm); border: 1.5px solid var(--line); background: var(--surface-elevated);
  text-align: left; cursor: pointer; font-family: var(--sans); color: var(--text);
  transition: border-color .2s, background .2s, transform .2s;
}
.guide-opt:hover:not([disabled]) { border-color: var(--teal); background: var(--teal-050); transform: translateX(2px); }
.guide-opt:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
.guide-opt.is-on { border-color: var(--teal); background: var(--teal-050); }
.guide-opt[disabled] { opacity: .5; cursor: not-allowed; }
.guide-opt-ico { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 11px; background: var(--paper-2); color: var(--teal-700); }
.guide-opt-ico svg { width: 24px; height: 24px; }
.guide-opt-txt b { display: block; color: var(--ink); font-size: var(--t-base); font-weight: 640; line-height: 1.3; }
.guide-opt-txt span { display: block; font-size: var(--t-sm); line-height: 1.5; margin-top: 3px; }
.guide-opt-txt em { display: inline-block; margin-top: 6px; font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .04em; color: var(--teal-700); background: var(--teal-050); padding: 2px 8px; border-radius: 99px; }
.guide-opt-txt em.no { color: var(--text-soft); background: var(--paper-2); }
.guide-opt-go { width: 16px; height: 16px; color: var(--text-mute); }
.guide-qty label { display: block; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.guide-qty-row { display: flex; align-items: center; gap: 12px; }
.guide-qty-row .control { max-width: 200px; font-size: var(--t-lg); font-weight: 600; }
.guide-qty-quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.guide-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.guide-foot-sp { flex: 1; }
.guide-sum { list-style: none; padding: 0; margin: 0 0 var(--s5); display: flex; flex-wrap: wrap; gap: 6px; }
.guide-sum li { font-size: var(--t-xs); font-weight: 600; padding: 5px 11px; border-radius: 99px; background: var(--teal-050); color: var(--teal-700); }
.guide-found { display: flex; align-items: baseline; gap: 10px; color: var(--text); margin-bottom: 10px; }
.guide-found-n { font-family: var(--display); font-size: 44px; line-height: 1; color: var(--ink); font-weight: 660; }
.guide-ed { margin: 0 0 var(--s4); padding-left: 1.3em; display: grid; gap: 4px; color: var(--ink); font-size: var(--t-sm); }
.guide-ed li::marker { color: var(--teal); font-weight: 700; }
.guide-ed li.more { list-style: none; color: var(--text-soft); margin-left: -1.3em; }
.guide-tip { margin: 0; padding: 12px 14px; border-radius: var(--r-sm); background: var(--paper-2); font-size: var(--t-sm); line-height: 1.6; color: var(--text); }
@media (max-width: 640px) {
  .guide-foot .btn { flex: 1 1 auto; }
  .guide-foot-sp { display: none; }
  .guide-opt { grid-template-columns: auto 1fr; }
  .guide-opt-go { display: none; }
}

/* ----- Guida: glossario e domande frequenti ----- */
.guida { padding: var(--s9) 0; background: var(--paper-2); border-top: 1px solid var(--line); }
.guida-head { display: grid; gap: var(--s3); margin-bottom: var(--s7); max-width: 720px; }
.guida-h2 { font-family: var(--display); font-size: var(--t-2xl); font-weight: 660; color: var(--ink); letter-spacing: -0.018em; line-height: 1.1; margin: 0; }
.guida-lede { margin: 0; color: var(--text); line-height: 1.6; }
.guida-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--s7); align-items: start; }
@media (max-width: 980px) { .guida-grid { grid-template-columns: 1fr; } }
.guida-sub { font-size: var(--t-micro); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--text-soft); margin: 0 0 var(--s4); }
.gloss { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
@media (max-width: 640px) { .gloss { grid-template-columns: 1fr; } }
.gloss-i { padding: 14px 16px; border-radius: var(--r-sm); background: var(--surface-elevated); border: 1px solid var(--line); }
.gloss-i dt { font-weight: 650; color: var(--ink); font-size: var(--t-sm); margin-bottom: 4px; }
.gloss-i dd { margin: 0; font-size: var(--t-xs); line-height: 1.6; color: var(--text); }
.faq { display: grid; gap: 8px; }
.faq-i { border-radius: var(--r-sm); background: var(--surface-elevated); border: 1px solid var(--line); transition: border-color .2s; }
.faq-i[open] { border-color: var(--teal-200); }
.faq-i summary { list-style: none; cursor: pointer; padding: 14px 44px 14px 16px; position: relative; font-weight: 620; color: var(--ink); font-size: var(--t-sm); line-height: 1.4; }
.faq-i summary::-webkit-details-marker { display: none; }
.faq-i summary::after { content: ''; position: absolute; right: 18px; top: 50%; width: 8px; height: 8px; border-right: 2px solid var(--teal-700); border-bottom: 2px solid var(--teal-700); transform: translateY(-70%) rotate(45deg); transition: transform .2s; }
.faq-i[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.faq-i summary:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; border-radius: var(--r-sm); }
.faq-i p { margin: 0; padding: 0 16px 16px; font-size: var(--t-sm); line-height: 1.65; color: var(--text); }
.guida-cta { margin-top: var(--s8); display: flex; align-items: center; justify-content: space-between; gap: var(--s5); flex-wrap: wrap; padding: var(--s6); border-radius: var(--r-md); background: var(--navy); color: rgba(255,255,255,.78); }
.guida-cta b { display: block; color: #fff; font-family: var(--display); font-size: var(--t-lg); margin-bottom: 4px; }
.guida-cta-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.guida-cta .btn-line { color: #fff; border-color: rgba(255,255,255,.35); background: transparent; }
[data-theme="dark"] .guida-cta { background: #0a2a24; }

/* footer: pulsanti come link */
.sitefoot-col button { background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.sitefoot-inner { grid-template-columns: 1.4fr repeat(3, 1fr); }
.sitefoot-inner { gap: var(--s7); }
@media (max-width: 860px) { .sitefoot-inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .sitefoot-inner { grid-template-columns: 1fr; } }
.guide-foot [hidden], .dlg-guide [hidden] { display: none !important; }
.dlg-guide .dlg-head h2 { font-family: var(--display-serif); font-weight: 400; letter-spacing: -0.01em; }
.guide-ed { list-style: none; padding: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; }
.guide-ed li { position: relative; padding-left: 16px; }
.guide-ed li::before { content: ''; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--teal); }
.guide-ed li.more { margin-left: 0; padding-left: 0; }
.guide-ed li.more::before { display: none; }
@media (max-width: 560px) { .guide-ed { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .guide-foot { display: grid; grid-template-columns: 1fr 1fr; }
  .guide-foot #guideSkip:only-of-type, .guide-foot #guideNext { grid-column: 1 / -1; }
  #guideBack[hidden] + .guide-foot-sp + #guideSkip { grid-column: 1 / -1; }
}

/* ==========================================================================
   v1.4  Composizione: "Ho i codici", "Non conosco i codici", conferma, percorso multi-brand
   ========================================================================== */

/* ----- Ho i codici: due metodi, A e B ----- */
.lic-codes { display: grid; gap: var(--s5); }
.lic-method { padding: var(--s5); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface-elevated); }
.lic-method-h { display: flex; gap: 12px; align-items: flex-start; margin-bottom: var(--s4); }
.lic-method-h label { display: block; font-weight: 650; color: var(--ink); font-size: var(--t-base); line-height: 1.3; }
.lic-method-h p { margin: 3px 0 0; font-size: var(--t-xs); color: var(--text-soft); line-height: 1.5; }
.lic-method-n { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--navy); color: #fff; font-size: 13px; font-weight: 700; }
[data-theme="dark"] .lic-method-n { background: var(--teal); color: #04210f; }

.lic-searchbox { position: relative; }
.lic-searchbox .lic-search-ico { position: absolute; left: 14px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--text-mute); pointer-events: none; }
.lic-searchbox > input.control { padding-left: 42px; height: 50px; font-size: var(--t-base); }
.lic-searchbox > .kbd { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.lic-searchbox-sm > label { display: block; font-weight: 600; color: var(--ink); font-size: var(--t-sm); margin-bottom: 8px; }
.lic-searchbox-sm .lic-search-ico { top: auto; bottom: 16px; transform: none; }
.lic-searchbox-sm > input.control { height: 46px; }
@media (max-width: 640px) { .lic-searchbox > .kbd { display: none; } }

.lic-import { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--s4); align-items: stretch; }
@media (max-width: 860px) { .lic-import { grid-template-columns: 1fr; } }
.lic-import-paste textarea.control { min-height: 150px; font-family: var(--mono); font-size: 13px; line-height: 1.6; }
.lic-formats { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0 12px; font-size: var(--t-xs); color: var(--text-soft); }
.lic-formats code { font-family: var(--mono); font-size: 11.5px; padding: 2px 7px; border-radius: 5px; background: var(--paper-3); color: var(--ink); }
.lic-drop {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center;
  padding: var(--s5); border: 1.5px dashed var(--line-strong); border-radius: var(--r-sm); background: var(--paper-2); cursor: pointer;
  transition: border-color .2s, background .2s;
}
.lic-drop:hover, .lic-drop:focus-within { border-color: var(--teal); background: var(--teal-050); }
.lic-drop svg { width: 34px; height: 34px; color: var(--teal-700); }
.lic-drop b { color: var(--ink); font-size: var(--t-sm); }
.lic-drop > span:not(.btn) { font-size: var(--t-xs); color: var(--text-soft); line-height: 1.5; max-width: 32ch; }
.lic-drop .btn { margin-top: 4px; pointer-events: none; }
.lic-drop .sr-file { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.lic-drop:focus-within { outline: 2px solid var(--teal); outline-offset: 2px; }

/* esito del riconoscimento */
#parse-out:not(:empty) { margin-top: var(--s5); padding: var(--s5); border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface-elevated); }
.lic-parse-h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin-bottom: var(--s4); }
.lic-parse-h h4 { margin: 0; font-size: var(--t-md); color: var(--ink); }
.lic-parse-sum { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: var(--s4); }
.lic-pt { padding: 12px 14px; border-radius: var(--r-sm); border: 1px solid var(--line); display: flex; align-items: baseline; gap: 8px; }
.lic-pt-n { font-family: var(--display); font-size: 26px; font-weight: 680; line-height: 1; font-variant-numeric: tabular-nums; }
.lic-pt-l { font-size: var(--t-xs); font-weight: 600; }
.lic-pt.ok { background: var(--ok-tint); border-color: transparent; color: var(--ok); }
.lic-pt.warn { background: var(--wait-tint); border-color: transparent; color: var(--wait); }
.lic-pt.bad { background: var(--alert-tint); border-color: transparent; color: var(--alert); }
.lic-parse-note { margin: -4px 0 var(--s4); font-size: var(--t-xs); color: var(--wait); }
.lic-table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: var(--r-sm); }
.lic-table-wrap .lic-table { margin: 0; }
.lic-table tr.is-warn td:first-child { box-shadow: inset 3px 0 0 var(--wait-solid, #d97706); }
.lic-table tr.is-ok td:first-child { box-shadow: inset 3px 0 0 var(--teal); }
.lic-table tr.is-ko td:first-child { box-shadow: inset 3px 0 0 var(--alert); }
.lic-swaps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.lic-swap { font-family: var(--mono); font-size: 12px; padding: 5px 9px; border-radius: 6px; border: 1px solid var(--line-strong); background: var(--surface-elevated); color: var(--ink); cursor: pointer; min-height: 32px; }
.lic-swap:hover { border-color: var(--teal); background: var(--teal-050); }
.lic-parse-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: var(--s4); }
@media (max-width: 640px) {
  #parse-out:not(:empty) { padding: var(--s4); }
  .lic-parse-sum { grid-template-columns: 1fr; }
  .lic-parse-foot .btn { width: 100%; }
  .lic-method { padding: var(--s4); }
  .lic-table-wrap { border: 0; }
}

/* ----- Non conosco i codici: piattaforme come schede ----- */
.lic-pfs { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.lic-pf {
  display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; column-gap: 12px; row-gap: 2px; align-items: start;
  padding: 14px; border-radius: var(--r-sm); border: 1.5px solid var(--line); background: var(--surface-elevated);
  text-align: left; cursor: pointer; font-family: var(--sans); color: var(--text); transition: border-color .2s, background .2s, transform .2s;
}
.lic-pf svg { grid-row: 1 / span 3; width: 38px; height: 38px; padding: 8px; border-radius: 10px; background: var(--paper-2); color: var(--teal-700); }
.lic-pf-t { font-weight: 650; color: var(--ink); font-size: var(--t-sm); }
.lic-pf-d { font-size: var(--t-xs); line-height: 1.45; }
.lic-pf-n { font-size: 11.5px; color: var(--text-soft); margin-top: 4px; }
.lic-pf:hover { border-color: var(--teal); transform: translateY(-1px); }
.lic-pf:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
.lic-pf[aria-pressed="true"] { border-color: var(--teal); background: var(--teal-050); }
.lic-pf[aria-pressed="true"] svg { background: var(--teal); color: #fff; }
.lic-facet { padding-bottom: var(--s3); }
.lic-fgroup > .lic-facet + .lic-facet { border-top: 1px solid var(--line); padding-top: var(--s4); }
.lic-res-k { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal-700); margin-bottom: 3px; }
.lic-res-h { position: sticky; top: 72px; z-index: 2; background: var(--surface-elevated); padding: 10px 0; }
.lic-empty .link-btn { margin-top: 8px; }
@media (max-width: 640px) {
  .lic-res-h { position: static; }
  .lic-res-side { grid-template-columns: auto 1fr; }
  .lic-res-add { justify-content: flex-end; }
  .lic-res-unit { text-align: right; }
}

/* ----- Conferma prima della richiesta d'offerta ----- */
.lic-confirm { display: flex; gap: 12px; align-items: flex-start; margin-top: var(--s4); padding: 14px 16px; border-radius: var(--r-sm); border: 1.5px solid var(--line-strong); background: var(--surface-elevated); cursor: pointer; font-size: var(--t-xs); line-height: 1.55; color: var(--text); }
.lic-confirm b { display: block; color: var(--ink); font-size: var(--t-sm); margin-bottom: 3px; }
.lic-confirm input { flex: none; width: 20px; height: 20px; margin-top: 2px; accent-color: var(--teal-700); cursor: pointer; }
.lic-confirm:has(input:checked) { border-color: var(--teal); background: var(--teal-050); }
.lic-confirm:focus-within { outline: 2px solid var(--teal); outline-offset: 2px; }

/* ----- Footer: avvertenza ----- */
.sitefoot-disclaimer { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad) var(--s6); }
.sitefoot-disclaimer p { margin: 0; max-width: 110ch; font-size: 12.5px; line-height: 1.6; color: rgba(255,255,255,.58); }

/* ----- Percorso guidato: scelta del brand e nota brand ----- */
.guide-brand-logo { display: grid; place-items: center; width: 110px; height: 44px; padding: 6px 10px; border-radius: 10px; background: #fff; border: 1px solid var(--line); }
.guide-brand-logo img { max-width: 100%; max-height: 28px; width: auto; height: auto; }
.guide-brand[disabled] .guide-brand-logo img { filter: grayscale(1); opacity: .7; }
.guide-brandnote { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: var(--s4); padding: 10px 12px; border-radius: var(--r-sm); background: var(--paper-2); font-size: var(--t-xs); color: var(--text); }
.guide-brandnote-logo { display: inline-grid; place-items: center; padding: 4px 8px; border-radius: 6px; background: #fff; border: 1px solid var(--line); }
.guide-brandnote-logo img { height: 16px; width: auto; }
.guide-brandnote .link-btn { margin-left: auto; font-size: var(--t-xs); }
.lic-res h4 { max-width: none; }
.guide-brandnote { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; }
.guide-brandnote .link-btn { margin-left: 0; }
.guide-foot:not(:has(> .btn:not([hidden]))) { display: none; }
@media (max-width: 640px) { .guide-brandnote { grid-template-columns: auto minmax(0, 1fr); } .guide-brandnote .link-btn { grid-column: 1 / -1; } }
.lic-res h4, .guide-opt-txt b, .lic-pf-t { text-wrap: pretty; }
[data-theme="dark"] #panelCompose .lic-brand-chip { background: #fff; border-color: transparent; }

/* ==========================================================================
   v1.5  Loghi brand, un brand per configurazione, risultati raggruppati
   ========================================================================== */

/* ----- Loghi: sempre nei colori ufficiali, mai invertiti; su tema scuro poggiano su una tessera bianca ----- */
.brand-lockup { display: inline-flex; align-items: center; gap: .4em; font-family: var(--sans); font-weight: 700; letter-spacing: -.01em; color: #1f2430; white-space: nowrap; line-height: 1; font-size: 18px; }
.brand-lockup img.brand-logo { height: 1.55em; width: auto; }
.brand-lockup.is-text .brand-lockup-name { font-size: 1.05em; }
.brands-list .brand-lockup { font-size: 17px; }
.lic-brand-logo .brand-lockup { font-size: 24px; }
.lic-brand-chip .brand-lockup, .lic-mini-brand .brand-lockup, .guide-brandnote .brand-lockup { font-size: 14px; }
.guide-brand-logo .brand-lockup { font-size: 15px; }
.bs-logo .brand-lockup { font-size: 18px; }

img.brand-logo-strip, .brand-strip-pick:hover img.brand-logo-strip { filter: none; opacity: 1; }
.brand-strip-soon { opacity: .6; }
.brand-strip-soon img.brand-logo-strip, .brand-strip-soon .brand-lockup { filter: grayscale(.35); }
:root[data-theme="dark"] img.brand-logo-strip,
:root[data-theme="dark"] .brand-strip-pick:hover img.brand-logo-strip,
:root[data-theme="dark"] .lic-brand-logo img.brand-logo { filter: none; }
:root[data-theme="dark"] .brands-list .brand-strip-soon { background: #fff; border-radius: 8px; padding: 6px 10px; }
.lic-brand-card[disabled] .lic-brand-logo img.brand-logo, .lic-brand-card[disabled] .lic-brand-logo .brand-lockup { filter: grayscale(.4); opacity: .7; }
:root[data-theme="dark"] .lic-brand-logo { background: #fff; border-radius: 10px; padding: 8px 12px; align-self: flex-start; }

/* card brand: stato della configurazione */
.lic-brand-card .bcfg { display: inline-block; margin-top: 6px; font-size: var(--t-xs); font-weight: 650; color: var(--teal-700); }
.lic-brand-card .bcfg.other { color: var(--text-soft); font-weight: 500; }

/* ----- Pannello configurazione: brand della configurazione ----- */
.lic-mini-brand:empty { display: none; }
.lic-mini-brand { display: flex; align-items: center; gap: 10px; padding: 10px var(--s5); border-bottom: 1px solid var(--line); font-size: 12px; color: var(--text-soft); background: var(--paper-2); }
.lic-mini-brand-logo { display: inline-grid; place-items: center; padding: 4px 8px; border-radius: 6px; background: #fff; border: 1px solid var(--line); }
.lic-mini-brand-logo img { height: 15px; width: auto; }
.tray-brand { margin: 0; }

/* ----- Dialog cambio brand ----- */
.dlg-top { z-index: 320; }
.dlg-small .dlg-box { max-width: 520px; }
.bs-logos { display: flex; align-items: center; gap: 14px; margin: var(--s4) 0 var(--s2); }
.bs-logos svg { width: 20px; height: 20px; color: var(--text-mute); }
.bs-logo { display: inline-grid; place-items: center; min-width: 120px; height: 52px; padding: 8px 14px; border-radius: 10px; background: #fff; border: 1px solid var(--line); }
.bs-logo img.brand-logo { max-height: 30px; width: auto; }
.bs-tip { font-size: var(--t-xs); }
#brandSwitchSheet .dlg-foot { display: flex; flex-wrap: wrap; gap: 10px; }

/* ----- Ho i codici: ricerca e conteggio dal vivo ----- */
.lic-sug li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; }
.lic-sug .sug-k { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal-700); margin-bottom: 2px; }
.lic-sug .sug-p { font-size: var(--t-sm); font-weight: 650; color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
.lic-sug li.sug-all { display: block; text-align: center; }
@media (max-width: 640px) { .lic-sug li { grid-template-columns: minmax(0, 1fr) auto; } .lic-sug .sug-p { grid-column: 1; } }
.lic-paste-live:empty { display: none; }
.lic-paste-live { display: flex; align-items: center; gap: 8px; margin: 8px 0 0; font-size: var(--t-xs); font-weight: 600; color: var(--ink); }
.lic-paste-live .dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.lic-paste-live .dot.ok { background: var(--teal); }
.lic-paste-live .dot.bad { background: var(--alert); margin-left: 6px; }

/* ----- Non conosco i codici: un prodotto, piu' varianti ----- */
.lic-res-sub { font-weight: 500; color: var(--text-soft); font-size: var(--t-sm); margin-left: 6px; }
.lic-grp { display: block; padding: 0; overflow: hidden; }
.lic-grp-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 14px 16px 12px; }
.lic-grp-n { flex: none; display: grid; justify-items: end; gap: 3px; font-size: var(--t-xs); color: var(--text-soft); white-space: nowrap; }
.lic-grp-n b { color: var(--teal-700); font-weight: 650; }
.lic-vars { border-top: 1px solid var(--line); }
.lic-var {
  display: grid; grid-template-columns: 150px minmax(0, 1fr) 150px auto; align-items: center; gap: 14px;
  padding: 10px 16px; border-top: 1px solid var(--line); background: var(--paper-2);
}
.lic-var:first-child { border-top: 0; }
.lic-var.is-in { background: var(--teal-050); box-shadow: inset 3px 0 0 var(--teal); }
.lic-var-a { display: grid; gap: 3px; }
.lic-var-du { font-weight: 650; color: var(--ink); font-size: var(--t-sm); }
.lic-var-a code { font-family: var(--mono); font-size: 11.5px; color: var(--text-soft); }
.lic-var-b { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font-size: var(--t-xs); color: var(--text); }
.lic-var-b .lim { color: var(--wait); font-weight: 600; }
.lic-var-b .lic-vincoli { flex-basis: 100%; margin: 0; }
.lic-var-p .price { text-align: right; font-size: var(--t-base); font-weight: 680; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1.15; }
.lic-var-p .price small { display: block; font-size: 11px; font-weight: 500; color: var(--text-soft); }
.lic-var .lic-res-add { display: grid; grid-template-columns: 80px auto; gap: 6px; }
.lic-var .lic-res-add .lic-res-unit { grid-column: 1 / -1; text-align: left; font-size: 11px; }
.lic-var .lic-res-add input.control { width: 80px; height: 38px; }
.lic-var .lic-res-add .btn { height: 38px; }
.lic-grp:hover { box-shadow: var(--sh-1); }
@media (max-width: 860px) {
  .lic-var { grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; }
  .lic-var-b { grid-column: 1 / -1; grid-row: 2; }
  .lic-var-p { grid-column: 2; grid-row: 1; }
  .lic-var .lic-res-add { grid-column: 1 / -1; grid-template-columns: 1fr auto; }
  .lic-var .lic-res-add input.control { width: 100%; }
  .lic-grp-h { flex-direction: column; gap: 6px; }
  .lic-grp-n { justify-items: start; }
}

/* ----- v1.5.1 Hero: due pulsanti della stessa altezza e allineati ----- */
.hero-actions { display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px; }
.hero-actions .hero-cta-primary, .hero-actions .hero-cta-guide { min-height: 58px; box-sizing: border-box; border-radius: var(--r-sm); }
.hero-actions .hero-cta-primary { padding: 0 26px; }
.hero-actions .hero-cta-guide { padding: 0 20px 0 16px; }
.hero-cta-guide b { font-size: var(--t-sm); }
@media (max-width: 720px) { .hero-actions .hero-cta-primary { justify-content: center; width: 100%; } }

/* ----- v1.6 PDF: riga piattaforma su tutta la larghezza, colonne centrate ----- */
.pdf-items tr.pdf-row-plat td { display: table-cell; overflow: hidden; }
.pdf-items tr.pdf-row-plat .rc-name { float: left; }
.pdf-items tr.pdf-row-plat .rc-meta { float: right; }
.pdf-items td.c, .pdf-items th.c { text-align: center; }
.pdf-items td.c small { display: block; color: var(--pdf-mute); font-weight: 400; font-size: 7pt; line-height: 1.25; margin-top: .5mm; }
.pdf-items td.num:first-child { text-align: left; color: var(--pdf-mute); }
.pdf-notes .n-orig { color: var(--pdf-mute); font-weight: 400; }
#printArea .pdf-order .order-title { font-family: 'DM Serif Display', Georgia, serif; font-size: 12pt; text-transform: none; letter-spacing: 0; color: var(--pdf-ink); font-weight: 400; margin-bottom: 3mm; }
.pdf-items td.c small { white-space: nowrap; }

/* ==========================================================================
   v1.7  Colore per sezioni e righe alternate per una lettura veloce
   ========================================================================== */
:root {
  --sec-teal: #0f9d74;          /* sezione "da dove partire", passo 1 */
  --sec-blue: #2563eb;          /* "come funziona", passo 2 */
  --sec-indigo: #4338ca;        /* passo 3, guida */
  --tint-teal: #effaf5;
  --tint-blue: #f0f5ff;
  --tint-indigo: #f3f2ff;
  --zebra: #f3f6fa;
}
:root[data-theme="dark"] {
  --sec-teal: #34d399; --sec-blue: #60a5fa; --sec-indigo: #a5b4fc;
  --tint-teal: rgba(16,185,129,.07); --tint-blue: rgba(59,130,246,.07); --tint-indigo: rgba(99,102,241,.08);
  --zebra: rgba(255,255,255,.035);
}

/* ----- sezioni: fondo tenue e filo colorato in testa ----- */
.paths, .flow, .tool, .guida { position: relative; }
.paths::before, .flow::before, .tool::before, .guida::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 4px; z-index: 1;
}
.paths { background: linear-gradient(180deg, var(--tint-teal), var(--paper) 55%); }
.paths::before { background: linear-gradient(90deg, var(--sec-teal), var(--sec-blue)); }
.flow { background: var(--tint-blue); }
.flow::before { background: linear-gradient(90deg, var(--sec-blue), var(--sec-indigo)); height: 4px; }
.flow::after { display: none; }
.tool { border-top: 0; background: linear-gradient(180deg, var(--paper-2), var(--paper-2)); }
.tool::before { background: linear-gradient(90deg, var(--sec-teal), var(--sec-blue) 50%, var(--sec-indigo)); }
.guida { background: var(--tint-indigo); border-top: 0; }
.guida::before { background: linear-gradient(90deg, var(--sec-indigo), var(--sec-teal)); }

/* kicker con pallino del colore della sezione */
.paths .kicker, .flow .kicker, .tool .kicker, .guida .kicker { display: inline-flex; align-items: center; gap: 8px; }
.paths .kicker::before, .flow .kicker::before, .tool-kicker::before, .guida .kicker::before { content: ''; width: 8px; height: 8px; border-radius: 50%; flex: none; }
.paths .kicker::before { background: var(--sec-teal); }
.flow .kicker::before { background: var(--sec-blue); }
.tool-kicker::before { background: var(--sec-teal); }
.guida .kicker::before { background: var(--sec-indigo); }

/* come funziona: ogni passo il suo colore */
.flow-seq > .flow-step:nth-child(1) .flow-n { color: var(--sec-teal); }
.flow-seq > .flow-step:nth-child(2) .flow-n { color: var(--sec-blue); }
.flow-seq > .flow-step:nth-child(3) .flow-n { color: var(--sec-indigo); }
.flow-seq > .flow-step:nth-child(4) .flow-n { color: var(--ink); }
.flow-seq > .flow-step:nth-child(1) .flow-accent { background: var(--sec-teal); }
.flow-seq > .flow-step:nth-child(2) .flow-accent { background: var(--sec-blue); }
.flow-seq > .flow-step:nth-child(3) .flow-accent { background: var(--sec-indigo); }
.flow-seq > .flow-step:nth-child(4) .flow-accent { background: var(--ink); }

/* percorsi: le due card chiare con filo colorato a sinistra */
.path-card:not(.is-reco) { box-shadow: inset 4px 0 0 var(--sec-blue), var(--sh-1); }
#pathRecover { box-shadow: inset 4px 0 0 var(--sec-indigo), var(--sh-1); }
#pathRecover .path-ico { background: var(--tint-indigo); color: var(--sec-indigo); }
#pathCodes .path-ico { background: var(--tint-blue); color: var(--sec-blue); }
#pathCodes .path-go { color: var(--sec-blue); }
#pathRecover .path-go { color: var(--sec-indigo); }

/* passi del configuratore: colore sul numero e filo in testa al pannello */
#panelBrand, #panelCompose, #panelReview { border-top-width: 4px; border-top-style: solid; }
#panelBrand { border-top-color: var(--sec-teal); }
#panelCompose { border-top-color: var(--sec-blue); }
#panelReview { border-top-color: var(--sec-indigo); }
#panelBrand .lic-step { background: var(--sec-teal); color: #fff; }
#panelCompose .lic-step { background: var(--sec-blue); color: #fff; }
#panelReview .lic-step { background: var(--sec-indigo); color: #fff; }
.lic-tab[aria-selected="true"] { color: var(--sec-blue); border-bottom-color: var(--sec-blue); }
.lic-method-n { background: var(--sec-blue); }
.lic-mini { border-top: 4px solid var(--sec-blue); }
.lic-mini-head { background: var(--tint-blue); }

/* guida: glossario con filo teal, FAQ aperte con filo indaco */
.gloss-i { box-shadow: inset 3px 0 0 var(--sec-teal); }
.faq-i[open] { box-shadow: inset 3px 0 0 var(--sec-indigo); border-color: transparent; }
.faq-i summary::after { border-color: var(--sec-indigo); }

/* ----- righe alternate ----- */
#reviewList .lic-review-line:not(.rl-head):nth-child(odd) { background: var(--zebra); }
#reviewList .lic-review-line:not(.rl-head) { padding-left: 12px; padding-right: 12px; }
#reviewList .rl-head { padding-left: 12px; padding-right: 12px; background: var(--tint-indigo); border-radius: 6px 6px 0 0; }
.lic-mini-body .lic-line { padding-left: var(--s5); padding-right: var(--s5); margin: 0 calc(-1 * var(--s5)); }
.lic-mini-body .lic-line:nth-child(even) { background: var(--zebra); }
.tray-body .lic-line:nth-child(even) { background: var(--zebra); }
.lic-table tbody tr:nth-child(even) td { background: var(--zebra); }
.lic-table tbody tr.is-ko td { background: var(--alert-tint); }
.lic-var { background: var(--surface-elevated); }
.lic-var:nth-child(even) { background: var(--zebra); }
.lic-var.is-in { background: var(--teal-050); }
.lic-sug li:nth-child(even):not(.empty) { background: var(--zebra); }
.lic-sug li:hover { background: var(--tint); }
.recover-history-item:nth-child(even) { background: var(--zebra); }
/* PDF: righe alternate, gruppi per piattaforma che non si spezzano male */
.pdf-items tbody.pdf-grp.keep { break-inside: avoid; page-break-inside: avoid; }
.pdf-items tr.pdf-row-plat { break-after: avoid; page-break-after: avoid; }
.pdf-items tr.pdf-row-item.z td { background: #f2f5f9; }
.pdf-items tr.pdf-row-plat td { box-shadow: inset 3pt 0 0 var(--pdf-teal); }
.pdf-items tbody td { border-bottom-color: #e6ebf1; }

/* ----- v1.7.1 colori piu' sobri, coerenti con lo stile del sito ----- */
:root {
  --sec-teal: #0e9f6e;
  --sec-blue: #3d5f86;          /* blu Converge attenuato */
  --sec-indigo: #5a6886;        /* ardesia */
  --tint-teal: #f4fbf8;
  --tint-blue: #f5f8fb;
  --tint-indigo: #f6f7fa;
  --zebra: #f4f6f9;
}
:root[data-theme="dark"] {
  --sec-teal: #34d399; --sec-blue: #8fb0d6; --sec-indigo: #a3b0c8;
  --tint-teal: rgba(16,185,129,.05); --tint-blue: rgba(143,176,214,.05); --tint-indigo: rgba(163,176,200,.05);
  --zebra: rgba(255,255,255,.03);
}
/* fili di sezione sottili e sfumati */
.paths::before, .flow::before, .tool::before, .guida::before { height: 2px; opacity: .55; }
.paths::before { background: linear-gradient(90deg, transparent, var(--sec-teal) 20%, var(--sec-blue) 80%, transparent); }
.flow::before { background: linear-gradient(90deg, transparent, var(--sec-blue) 20%, var(--sec-blue) 80%, transparent); }
.tool::before { background: linear-gradient(90deg, transparent, var(--sec-teal) 20%, var(--sec-teal) 80%, transparent); }
.guida::before { background: linear-gradient(90deg, transparent, var(--sec-indigo) 20%, var(--sec-indigo) 80%, transparent); }
/* pannelli: filo in testa leggero */
#panelBrand, #panelCompose, #panelReview { border-top-width: 3px; }
#panelBrand { border-top-color: rgba(14,159,110,.55); }
#panelCompose { border-top-color: rgba(61,95,134,.45); }
#panelReview { border-top-color: rgba(90,104,134,.45); }
#panelBrand .lic-step, #panelCompose .lic-step, #panelReview .lic-step { background: var(--navy); color: var(--mint); }
[data-theme="dark"] #panelBrand .lic-step, [data-theme="dark"] #panelCompose .lic-step, [data-theme="dark"] #panelReview .lic-step { background: var(--teal-700); color: #fff; }
/* schede e numeri tornano ai colori del sito */
.lic-tab[aria-selected="true"] { color: var(--teal-700); border-bottom-color: var(--teal); }
.lic-method-n { background: var(--navy); }
.lic-mini { border-top: 3px solid rgba(61,95,134,.35); }
.lic-mini-head { background: transparent; }
.path-card:not(.is-reco) { box-shadow: inset 3px 0 0 rgba(61,95,134,.45), var(--sh-1); }
#pathRecover { box-shadow: inset 3px 0 0 rgba(90,104,134,.45), var(--sh-1); }
.flow-seq > .flow-step:nth-child(1) .flow-n { color: var(--teal-700); }
.flow-seq > .flow-step:nth-child(2) .flow-n, .flow-seq > .flow-step:nth-child(3) .flow-n { color: var(--ink); }
.flow-seq > .flow-step:nth-child(4) .flow-n { color: var(--teal-700); }
.flow-seq > .flow-step .flow-accent { background: var(--line-strong) !important; }
.gloss-i { box-shadow: inset 2px 0 0 rgba(14,159,110,.5); }
.faq-i[open] { box-shadow: inset 2px 0 0 rgba(90,104,134,.6); border-color: var(--line); }
#reviewList .rl-head { background: transparent; }

/* ==========================================================================
   v1.8  Pulsanti e stati (design-loop, parte 1)
   ========================================================================== */
/* niente luccichio che attraversa i pulsanti: era solo decorativo */
.btn-solid::before, .btn-accent::before { display: none; }
/* durate e curve uniche per tutti i pulsanti */
.btn { transition: background-color 160ms ease-out, border-color 160ms ease-out, color 160ms ease-out, box-shadow 160ms ease-out, transform 160ms ease-out; border-radius: var(--r-xs); }
.btn:not(:disabled):not([aria-disabled="true"]):active { transform: translateY(0) scale(.98); box-shadow: none; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .45; box-shadow: none; filter: saturate(.6); }
.btn .btn-ico { width: 15px; height: 15px; flex: none; }
/* primario teal: hover leggermente piu' scuro, testo resta leggibile */
.btn-solid:not(:disabled):not([aria-disabled="true"]):hover { background: #0fb57f; box-shadow: 0 0 0 3px rgba(var(--teal-rgb),.22), var(--sh-2); }
/* navy: hover blu Converge */
.btn-accent:not(:disabled):not([aria-disabled="true"]):hover { background: #1c2f52; }
/* secondario a contorno: testo navy, hover teal */
.btn-line { color: var(--ink); }
.btn-line:not(:disabled):not([aria-disabled="true"]):hover { border-color: var(--teal); background: var(--teal-050); color: var(--teal-700); }
/* testo: sottolineatura in hover, area cliccabile piena */
.btn-quiet { color: var(--text); }
.btn-quiet:not(:disabled):hover { color: var(--ink); background: var(--paper-2); }
.btn-danger-text { color: var(--alert); }
.btn-danger-text:not(:disabled):hover { color: var(--alert); background: var(--alert-tint); }
/* azione di riga "Aggiungi": contorno teal, si riempie al passaggio */
.btn-add { background: var(--surface-elevated); color: var(--teal-700); border-color: rgba(var(--teal-rgb),.55); font-weight: 650; }
.btn-add:not(:disabled):not([aria-disabled="true"]):hover { background: var(--teal); border-color: var(--teal); color: var(--on-teal); }
.btn-add.is-done, .lic-res-add .btn.is-done { background: var(--teal-700); border-color: var(--teal-700); color: #fff; }
[data-theme="dark"] .btn-add { color: var(--mint); border-color: rgba(var(--teal-rgb),.5); }
/* focus da tastiera sempre visibile e diverso dall'hover */
.btn:focus-visible, .lic-chip:focus-visible, .lic-pf:focus-visible, .link-btn:focus-visible, .lic-swap:focus-visible {
  outline: 2px solid var(--teal-700); outline-offset: 2px; box-shadow: 0 0 0 5px rgba(var(--teal-rgb),.18);
}
[data-theme="dark"] .btn:focus-visible { outline-color: var(--mint); }
/* caricamento ed esito dentro il pulsante */
.btn.is-loading { pointer-events: none; color: transparent !important; }
.btn.is-loading > * { visibility: hidden; }
.btn.is-loading::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px;
  border: 2px solid currentColor; border-radius: 50%; border-color: var(--teal-700) transparent var(--teal-700) var(--teal-700);
  animation: btnSpin .7s linear infinite;
}
.btn-accent.is-loading::after, .btn-solid.is-loading::after { border-color: #fff transparent #fff #fff; }
@keyframes btnSpin { to { transform: rotate(360deg); } }
.btn.is-ok { border-color: var(--teal) !important; color: var(--teal-700) !important; background: var(--teal-050) !important; }
/* chip filtro: stati chiari */
.lic-chip { transition: background-color 160ms ease-out, border-color 160ms ease-out, color 160ms ease-out; min-height: 36px; }
.lic-chip:hover { border-color: var(--teal); background: var(--teal-050); }
.lic-chip[aria-pressed="true"]:hover { background: var(--teal); }
/* pulsanti nella stessa riga: stessa altezza */
.lic-row .btn, .issue-secondary .btn, .lic-mini-acts .btn, .guide-foot .btn, .dlg-foot .btn { min-height: 44px; }
@media (max-width: 640px) { .btn { min-height: 48px; } .lic-row .btn, .lic-mini-acts .btn, .dlg-foot .btn { min-height: 48px; } }
@media (prefers-reduced-motion: reduce) { .btn, .lic-chip { transition: none; } .btn:active { transform: none !important; } }

/* ----- v1.8 giro 2: stati piu' leggibili ----- */
/* caricamento: spinner al posto dell'icona, etichetta "Preparo il file..." resta leggibile */
.btn.is-loading { color: var(--text) !important; cursor: progress; pointer-events: none; }
.btn.is-loading > * { visibility: visible; }
.btn.is-loading .btn-ico { display: none; }
.btn.is-loading::after { display: none; }
.btn.is-loading::before {
  content: ''; display: inline-block !important; position: static; width: 14px; height: 14px; flex: none; transform: none;
  border-radius: 50%; border: 2px solid rgba(var(--teal-rgb),.25); border-top-color: var(--teal-700); background: none;
  animation: btnSpin .7s linear infinite;
}
/* esito: non sembra un pulsante da premere (niente bordo, spunta, fondo verde tenue) */
.btn.is-ok { background: var(--ok-tint) !important; border-color: transparent !important; color: var(--ok) !important; cursor: default; box-shadow: none !important; }
.btn.is-ok .btn-ico { display: none; }
.btn.is-ok::before {
  content: ''; display: inline-block !important; position: static; width: 15px; height: 15px; flex: none; transform: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3.5 8.5 3 3 6-7'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3.5 8.5 3 3 6-7'/></svg>") center / contain no-repeat;
}
/* pulsanti secondari del riepilogo: tutti uguali a riposo (niente bordo verde "pronto") */
#btnPdfSummary[data-state="ready"], #btnEmailSummary[data-state="ready"] { border-color: var(--line-strong); color: var(--ink); }
#btnPdfSummary[data-state="disabled"], #btnEmailSummary[data-state="disabled"] { opacity: .45; }
/* azione principale navy: hover evidente (schiarisce e solleva) */
.btn-accent:not(:disabled):not([aria-disabled="true"]):hover { background: #24406b; box-shadow: 0 0 0 3px rgba(36,64,107,.18), var(--sh-3); transform: translateY(-1px); }
/* "Aggiungi": a riposo contorno neutro e testo verde; hover bordo verde e fondo tenue; aggiunto = esito */
.btn-add { border-color: var(--line-strong); color: var(--teal-700); }
.btn-add:not(:disabled):not([aria-disabled="true"]):hover { background: var(--teal-050); border-color: var(--teal); color: var(--teal-700); }
.btn-add.is-done, .lic-res-add .btn.is-done { background: var(--ok-tint); border-color: transparent; color: var(--ok); box-shadow: none; }
/* motivi delle azioni bloccate */
.issue-help { font-size: var(--t-xs); color: var(--text); text-align: left; padding: 10px 12px; border-radius: var(--r-xs); background: var(--wait-tint); }
.issue-help.is-ready { background: var(--ok-tint); color: var(--ok); }
.issue-help .ih-t { display: block; font-weight: 700; color: var(--wait); margin-bottom: 4px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.issue-help ul { margin: 0; padding-left: 18px; display: grid; gap: 3px; }
.issue-help .ih-ok { font-weight: 600; }
.issue-back { align-self: flex-start; }
/* minimi: informazione, non allarme */
.lic-var-b .lim { color: var(--text); font-weight: 600; }
.lic-var-b .lim::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--wait); margin-right: 6px; vertical-align: middle; }
/* riga appena aggiunta: si evidenzia una volta */
.lic-var.is-flash { animation: varFlash 900ms ease-out; }
@keyframes varFlash { 0% { background: rgba(var(--teal-rgb),.28); } 100% { background: var(--teal-050); } }
@media (prefers-reduced-motion: reduce) { .lic-var.is-flash { animation: none; } .btn.is-loading::before { animation-duration: 2s; } }
/* notifiche: in basso a destra, piccole, non coprono la lista */
@media (min-width: 900px) {
  .toast { left: auto; right: 24px; transform: translateY(14px); max-width: 380px; font-size: var(--t-xs); }
  .toast.show { transform: translateY(0); }
}
/* campo quantita' delle varianti: 44px */
.lic-var .lic-res-add input.control, .lic-var .lic-res-add .btn { height: 44px; min-height: 44px; }

/* ----- v1.8 giro 3 ----- */
/* primario teal: hover visibilmente piu' scuro; focus con anello navy (sul verde il verde non si vede) */
.btn-solid:not(:disabled):not([aria-disabled="true"]):hover { background: #0c9a6a; color: var(--on-teal); box-shadow: var(--sh-2); }
.btn-solid:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; box-shadow: 0 0 0 5px rgba(var(--navy-rgb),.16); }
[data-theme="dark"] .btn-solid:focus-visible { outline-color: #fff; }
/* testo/link: teal-700 sottolineato */
.btn-quiet { color: var(--teal-700); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.btn-quiet:not(:disabled):hover { color: var(--ink); background: transparent; text-decoration-thickness: 2px; }
.btn-danger-text { color: var(--alert); }
.btn-danger-text:not(:disabled):hover { color: var(--alert); background: transparent; }
.link-btn { min-height: 32px; }
.issue-back { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; }
.issue-back svg { width: 14px; height: 14px; }
/* esito "Aggiunto": nessun bordo, stessa altezza del campo, riga evidenziata */
.btn-add.is-done, .lic-res-add .btn.is-done { outline: 0; box-shadow: none; border: 1px solid transparent; height: 44px; }
.lic-var.is-flash { background: var(--teal-050) !important; box-shadow: inset 3px 0 0 var(--teal); }
@keyframes varFlash { 0% { background: rgba(var(--teal-rgb),.30); } 100% { background: var(--teal-050); } }
/* motivi: riquadro neutro con filo ambra, subito sotto i pulsanti */
.issue-help { background: var(--paper-2); color: var(--text); box-shadow: inset 3px 0 0 var(--wait); }
.issue-help .ih-t { color: var(--ink); }
.issue-help.is-ready { background: var(--ok-tint); box-shadow: inset 3px 0 0 var(--ok); }

/* ----- v1.8 giro 4 ----- */
/* disattivato: grigio chiaro tratteggiato, leggero, con il motivo in hover e focus */
.btn[aria-disabled="true"] { opacity: 1; filter: none; background: var(--paper-2) !important; color: var(--text-soft) !important; border: 1px dashed var(--line-strong) !important; box-shadow: none !important; cursor: not-allowed; overflow: visible; }
.btn[aria-disabled="true"] .btn-ico { opacity: .6; }
.btn[aria-disabled="true"][data-why]:hover::after, .btn[aria-disabled="true"][data-why]:focus-visible::after {
  content: attr(data-why); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%);
  background: var(--navy); color: #fff; font-size: 12px; font-weight: 600; line-height: 1.35; white-space: nowrap;
  padding: 6px 10px; border-radius: 6px; box-shadow: var(--sh-3); z-index: 5; pointer-events: none;
}
.btn[aria-disabled="true"][data-why]:hover::before, .btn[aria-disabled="true"][data-why]:focus-visible::before {
  content: ''; display: block !important; position: absolute; left: 50%; bottom: calc(100% + 2px); transform: translateX(-50%); width: 0; height: 0;
  border: 6px solid transparent; border-top-color: var(--navy); border-bottom: 0; background: none; z-index: 5;
}
/* navy: hover piu' evidente */
.btn-accent:not([aria-disabled="true"]):hover { background: #2c4f80 !important; }
/* svuota: sottolineato solo in hover */
.btn-danger-text { text-decoration: none; }
.btn-danger-text:not([aria-disabled="true"]):hover { text-decoration: underline; text-decoration-thickness: 2px; }
/* esito "valore minimo raggiunto": verde con spunta */
.lic-msg.ok { background: var(--ok-tint); color: var(--ok); display: flex; gap: 8px; align-items: center; font-weight: 600; }
.lic-msg.ok::before { content: ''; width: 14px; height: 14px; flex: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3.5 8.5 3 3 6-7'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3.5 8.5 3 3 6-7'/></svg>") center / contain no-repeat; }
/* pannello configurazione: campi e "x" da 44px */
.lic-qty input { height: 44px; min-width: 76px; }
.lic-del { width: 44px; height: 44px; display: inline-grid; place-items: center; border-radius: 8px; margin: -10px -12px 0 0; font-size: 20px; }
.lic-del:hover { background: var(--alert-tint); color: var(--alert); }
/* segnaposto leggibile ma distinto dal testo */
.control::placeholder, textarea.control::placeholder { color: var(--text-soft); opacity: 1; }

/* ----- v1.8 giro 5 ----- */
/* disattivato: resta un pulsante pieno (non un riquadro tratteggiato), grigio, con lucchetto */
.btn[aria-disabled="true"] {
  background-color: #e6ebf1 !important; color: #475569 !important; border: 1px solid #d5dce5 !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23475569' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3.5' y='7' width='9' height='6.5' rx='1.2'/><path d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2'/></svg>") !important;
  background-repeat: no-repeat !important; background-position: 12px 50% !important; background-size: 14px 14px !important;
  padding-left: 32px !important;
}
.btn[aria-disabled="true"] .btn-ico { display: none; }
[data-theme="dark"] .btn[aria-disabled="true"] { background-color: rgba(255,255,255,.06) !important; color: #a3b0c8 !important; border-color: rgba(255,255,255,.12) !important; }
#btnPdfSummary[data-state="disabled"], #btnEmailSummary[data-state="disabled"] { opacity: 1; }
/* focus: anello staccato di 3px, ben visibile anche sui pulsanti scuri */
.btn:focus-visible { outline: 2px solid var(--teal-700) !important; outline-offset: 3px; box-shadow: 0 0 0 6px rgba(var(--teal-rgb),.20) !important; }
.btn-solid:focus-visible { outline-color: var(--navy) !important; }
/* messaggi di attesa: neutri con filo ambra (come i motivi) */
.lic-msg.warn { background: var(--paper-2); color: var(--text); box-shadow: inset 3px 0 0 var(--wait); }
/* area di caricamento: hover evidente */
.lic-drop:hover { border-style: solid; border-color: var(--teal); background: var(--teal-050); box-shadow: var(--sh-2); }
.lic-drop { background: var(--surface-elevated); }
/* unita' sopra il campo quantita' */
.lic-var .lic-res-add { grid-template-columns: 80px auto; grid-template-rows: auto auto; }
.lic-var .lic-res-add .lic-res-unit { grid-row: 1; grid-column: 1 / -1; order: -1; margin: 0 0 2px; font-weight: 600; color: var(--text-soft); }
.lic-var .lic-res-add input.control { grid-row: 2; grid-column: 1; }
.lic-var .lic-res-add .btn { grid-row: 2; grid-column: 2; }
.lic-var .lic-in { display: inline-block; padding: 2px 8px; border-radius: 99px; background: var(--teal-050); border: 1px solid rgba(var(--teal-rgb),.4); font-size: 12px; }

/* ----- v1.8 giro 6 ----- */
.lic-var .btn-add { min-width: 116px; }
.lic-var .lic-in { white-space: nowrap; border: 0; background: var(--ok-tint); color: var(--ok); font-weight: 650; display: inline-flex; align-items: center; gap: 5px; }
.lic-var .lic-in::before, .issue-help .ih-ok::before { content: ''; width: 12px; height: 12px; flex: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'><path d='m3.5 8.5 3 3 6-7'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'><path d='m3.5 8.5 3 3 6-7'/></svg>") center / contain no-repeat; }
.issue-help.is-ready { box-shadow: none; }
.issue-help .ih-ok { display: inline-flex; align-items: center; gap: 6px; }
/* conferma spuntata: bordo verde semplice; l'anello compare solo con il focus da tastiera */
.lic-confirm:focus-within { outline: 0; }
.lic-confirm:has(input:focus-visible) { outline: 2px solid var(--teal-700); outline-offset: 3px; }
.lic-confirm:has(input:checked) { box-shadow: none; }
/* hover del navy: blu del logo Converge */
.btn-accent:not([aria-disabled="true"]):hover { background: #224b75 !important; }
/* ----- v1.8 giro 7 ----- */
.lic-drop { border: 1.5px dashed var(--line-strong); background: var(--surface-elevated); box-shadow: none; transition: border-color 160ms ease-out, background-color 160ms ease-out, box-shadow 160ms ease-out, transform 160ms ease-out; }
.lic-drop:hover { border: 1.5px solid var(--teal); background: var(--teal-050); box-shadow: var(--sh-3); transform: translateY(-2px); }
.lic-drop:focus-within { outline: 2px solid var(--teal-700); outline-offset: 3px; }
.lic-chip:hover { background: transparent; border-color: var(--teal); }
.lic-chip[aria-pressed="true"]:hover { background: var(--teal); }
@media (prefers-reduced-motion: reduce) { .lic-drop:hover { transform: none; } }
.lic-import-paste textarea.control::placeholder { font-style: italic; }
/* ----- v1.8 giro 8 ----- */
.control:focus, textarea.control:focus { border-color: var(--teal-700); box-shadow: 0 0 0 3px rgba(var(--teal-rgb),.22); outline: 0; }
.lic-chip { min-height: 44px; padding-top: 0; padding-bottom: 0; display: inline-flex; align-items: center; }
.lic-drop:hover { border: 1.5px solid #99e2c6; background: var(--surface-elevated); box-shadow: var(--sh-3); transform: translateY(-2px); }
.lic-var .lic-in { background: rgba(16,185,129,.16); padding: 3px 9px; }
.lic-var-b .lim { font-weight: 400; }
.lic-var-a .lic-in { justify-self: start; margin-top: 4px; }
/* ----- v1.8 giro 10 ----- */
.lic-var-a { min-width: 0; }
.lic-var-a .lic-in { white-space: normal; font-size: 11.5px; line-height: 1.3; max-width: 100%; }
.lic-active { min-height: 44px; padding: 0 6px 0 14px; }
.lic-active .x { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; font-size: 18px; margin-left: 2px; }
.lic-active:hover .x { background: rgba(var(--teal-rgb),.16); }
.lic-sort select.control { height: 44px; }
.lic-mini-head h3 { font-family: var(--display-serif); font-weight: 400; font-size: 20px; letter-spacing: -.01em; }
/* ----- v1.8 giro 11 ----- */
.lic-var .lic-res-add .lic-res-unit { font-size: 12px; }
.control::placeholder, textarea.control::placeholder { color: #64748b; }
[data-theme="dark"] .control::placeholder { color: #92a0bd; }
.issue-copy h3 { font-family: var(--display-serif); font-weight: 400; letter-spacing: -.01em; }
.btn-add.is-done, .lic-res-add .btn.is-done { background: rgba(16,185,129,.18) !important; color: var(--teal-700) !important; }
/* ----- v1.8 giro 12 ----- */
.btn-why { margin: -2px 0 0; font-size: 12px; color: #475569; display: flex; align-items: center; gap: 6px; }
.btn-why::before { content: ''; width: 13px; height: 13px; flex: none; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23475569' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3.5' y='7' width='9' height='6.5' rx='1.2'/><path d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2'/></svg>") center / contain no-repeat; }
.lic-active .k { color: var(--teal-700); opacity: .8; font-weight: 500; }
.btn-add.is-done, .lic-res-add .btn.is-done { border-radius: 99px; }

/* ----- v1.8 giro 13 ----- */
/* motivo sotto Genera: rispetta [hidden] (prima il display:flex lasciava il lucchetto orfano) */
.btn-why[hidden] { display: none !important; }
/* disattivato: lucchetto accanto all'etichetta su tutti i pulsanti, stessa composizione */
.btn[aria-disabled="true"] { background-image: none !important; }
.btn[aria-disabled="true"]:not(.btn-sm) { padding-left: 20px !important; }
.btn-sm[aria-disabled="true"] { padding-left: 14px !important; }
.btn[aria-disabled="true"] .btn-lbl { display: inline-flex; align-items: center; gap: 7px; }
.btn[aria-disabled="true"] .btn-lbl::before { content: ''; width: 14px; height: 14px; flex: none;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23475569' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3.5' y='7' width='9' height='6.5' rx='1.2'/><path d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2'/></svg>") center / contain no-repeat; }
/* "Per sbloccare le azioni": a tutta larghezza subito sotto i pulsanti, non un box stretto a destra */
.issue-actions .issue-help, .panel#panel3 .issue-help { max-width: none; width: 100%; align-self: stretch; text-align: left; margin-top: 2px; }
/* esito "Aggiunto": stesso disegno di "Scaricato" (rettangolo tinto, senza bordo), non una pillola */
.btn-add.is-done, .lic-res-add .btn.is-done { border-radius: var(--r-xs); cursor: default; }
/* etichetta "in configurazione": su una riga, niente pillola che va a capo */
.lic-var-a .lic-in { white-space: normal; font-size: 12px; line-height: 1.35; border-radius: 6px; align-items: flex-start; max-width: 100%; padding: 4px 8px; }
.lic-var-a .lic-in::before { margin-top: 2px; }
/* card di gruppo con varianti in configurazione: il filo teal resta solo sulla riga interessata */
.lic-grp.is-in, .lic-res.lic-grp.is-in { box-shadow: var(--sh-1, none); }
/* campo codici: stesso focus di tutti i campi (bordo teal + alone) */
.lic-import textarea.control:focus, .lic-import .control:focus { border-color: var(--teal-700); box-shadow: 0 0 0 3px rgba(var(--teal-rgb),.22); outline: 0; }
/* filtro attivo: nome del filtro in teal-700 pieno (niente opacità che lo schiarisce sotto il contrasto) */
.lic-active .k { color: var(--teal-700); opacity: 1; }
.lic-import textarea.control:focus, .lic-import .control:focus, .control:focus { border-color: var(--teal-700); box-shadow: 0 0 0 1px var(--teal-700), 0 0 0 5px rgba(var(--teal-rgb),.20); }

/* ----- v1.8 giro 15 ----- */
/* pannello "Genera": due colonne bilanciate, la colonna azioni non si allarga col testo dell'aiuto */
@media (min-width: 721px) {
  .issue { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
}
.issue-help .ih-ok { display: flex; align-items: flex-start; white-space: normal; }
.issue-help .ih-ok::before { margin-top: 3px; }
/* a conferma data, una sola azione piena: Richiedi offerta (navy); Genera diventa secondario */
.issue-actions.is-offer #btnGenerate { background: var(--white, #fff) !important; color: var(--ink) !important; border: 1px solid var(--line-strong) !important; box-shadow: none !important; }
.issue-actions.is-offer #btnGenerate:not([aria-disabled="true"]):hover { border-color: var(--ink) !important; background: var(--paper-2) !important; }
.issue-actions.is-offer #btnEmailSummary { background: var(--navy) !important; color: #fff !important; border-color: var(--navy) !important; }
.issue-actions.is-offer #btnEmailSummary:not([aria-disabled="true"]):not(.is-ok):hover { background: #224b75 !important; border-color: #224b75 !important; }
.issue-actions.is-offer #btnEmailSummary .btn-ico { color: #fff; }
[data-theme="dark"] .issue-actions.is-offer #btnGenerate { background: transparent !important; color: #e6ebf5 !important; border-color: rgba(255,255,255,.25) !important; }
/* hover navy: solo il fondo cambia, nessun alone che si confonda con il focus */
.btn-accent:not([aria-disabled="true"]):hover { box-shadow: var(--sh-2) !important; }

/* ----- v1.8 giro 16 ----- */
.lic-row { flex-wrap: wrap; }
.lic-row .btn-why { flex-basis: 100%; margin: 2px 0 0; }
/* esito sulla richiesta: verde tenue anche quando il pulsante era l'azione piena */
.issue-actions.is-offer #btnEmailSummary.is-ok { background: var(--ok-tint) !important; color: var(--ok) !important; border-color: transparent !important; }
.issue-actions.is-offer #btnEmailSummary.is-ok .btn-ico { color: var(--ok); }
.issue-actions.is-offer #btnEmailSummary.is-loading { background: var(--paper-2) !important; color: var(--text) !important; border-color: var(--line-strong) !important; }
/* Genera diventato secondario: hover come ogni pulsante a contorno (bordo teal, fondo teal tenue) */
.issue-actions.is-offer #btnGenerate:not([aria-disabled="true"]):hover { border-color: var(--teal) !important; background: var(--teal-050) !important; color: var(--teal-700) !important; }
/* Aggiungi: hover = contorno teal su fondo bianco con ombra; si distingue dall'esito "Aggiunto" (verde tenue senza bordo) */
.btn-add:not(:disabled):not([aria-disabled="true"]):not(.is-done):hover { background: #fff; border-color: var(--teal); color: var(--teal-700); box-shadow: var(--sh-2); }
/* focus da tastiera su Aggiungi: stesso anello staccato di tutti i pulsanti */
.lic-res-add .btn:focus-visible, .btn-add:focus-visible { outline: 2px solid var(--teal-700) !important; outline-offset: 3px !important; box-shadow: 0 0 0 6px rgba(var(--teal-rgb),.20) !important; }

/* ----- v1.8 giro 17 ----- */
/* gerarchia fissa del pannello: l'azione piena è sempre "Richiedi offerta" (bloccata finché mancano i passaggi); Genera è secondario */
.issue-actions.is-offer #btnGenerate[aria-disabled="true"] { background-color: #e6ebf1 !important; color: #475569 !important; border: 1px solid #d5dce5 !important; }
.issue-actions.is-offer #btnEmailSummary[aria-disabled="true"] { background-color: #e6ebf1 !important; color: #475569 !important; border-color: #d5dce5 !important; }
/* caricamento della richiesta: resta navy, con spinner chiaro */
.issue-actions.is-offer #btnEmailSummary.is-loading { background: var(--navy) !important; color: #fff !important; border-color: var(--navy) !important; }
/* Aggiungi: hover come da sistema (bordo teal, fondo teal tenue) */
.btn-add:not(:disabled):not([aria-disabled="true"]):not(.is-done):hover { background: var(--teal-050); border-color: var(--teal); color: var(--teal-700); box-shadow: none; }
/* larghezza fissa: "Aggiungi" e "Aggiungi altre" occupano la stessa colonna, prezzi e campi restano allineati */
.lic-res-add .btn-add { min-width: 9.6em; justify-content: center; }
/* la card non taglia più l'anello di focus dei controlli a filo */
.lic-grp { overflow: clip; overflow-clip-margin: 8px; }
.lic-grp > .lic-vars > .lic-var:last-child { border-radius: 0 0 var(--r-sm) var(--r-sm); }
.issue-actions.is-offer #btnEmailSummary.is-loading::before { border-color: rgba(255,255,255,.3); border-top-color: #fff; }
.lic-var .lic-res-add .btn.btn-add { width: 10.4em; min-width: 10.4em; padding-left: 10px; padding-right: 10px; }

/* ----- v1.8 giro 18 ----- */
/* pannello finale: bordo in palette (line-strong), non più ink */
.issue { border-color: var(--line-strong); }
/* caricamento sui pulsanti a contorno: il contorno resta */
.btn-line.is-loading { background: var(--white, #fff) !important; border: 1px solid var(--line-strong) !important; }
/* esito sull'azione piena: verde tenue senza bordo */
#btnEmailSummary.is-ok { background: var(--ok-tint) !important; color: var(--ok) !important; border-color: transparent !important; box-shadow: none !important; }
#btnEmailSummary.is-loading { background: var(--navy) !important; color: #fff !important; border-color: var(--navy) !important; }
#btnEmailSummary.is-loading::before { border-color: rgba(255,255,255,.3); border-top-color: #fff; }
.issue-actions > #btnEmailSummary { align-self: stretch; justify-content: center; }
/* Richiedi offerta pronto: navy pieno con testo bianco (annulla i vecchi stili "ready" da pulsante a contorno) */
#btnEmailSummary[data-state="ready"]:not(.is-ok):not(.is-loading) { background: var(--navy); border-color: var(--navy); color: #fff; }
#btnEmailSummary[data-state="ready"]:not(.is-ok):not(.is-loading):hover { background: #224b75; border-color: #224b75; color: #fff; }
#btnEmailSummary[data-state="ready"] .btn-ico { color: currentColor; }
[data-theme="dark"] #btnEmailSummary[data-state="ready"]:not(.is-ok):not(.is-loading) { background: var(--teal); border-color: var(--teal); color: var(--on-teal); }

/* ----- v1.8 giro 19 ----- */
/* etichette sempre sopra il campo */
.lic-qty { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 4px; font-size: 12px; color: var(--text-soft); }
.lic-sort { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.lic-sort > span { font-size: 12px; color: var(--text-soft); }
.lic-field-lbl { display: block; font-size: 13px; font-weight: 600; color: var(--ink); margin: 0 0 6px; }
/* richiesta preparata: riquadro con il passo successivo */
.issue-help.is-ready .ih-t { color: var(--ok); }
.issue-help.is-ready ul { color: var(--text); }
.issue-help a { color: var(--teal-700); font-weight: 600; }
/* richiesta già preparata: il pulsante torna a contorno, per non spingere a ripeterla */
#btnEmailSummary.is-sent[data-state="ready"]:not(.is-ok):not(.is-loading) { background: var(--white, #fff); color: var(--ink); border-color: var(--line-strong); }
#btnEmailSummary.is-sent[data-state="ready"]:not(.is-ok):not(.is-loading):hover { background: var(--teal-050); border-color: var(--teal); color: var(--teal-700); }
/* richiesta preparata: titolo con spunta, link sottolineato come tutti i link */
.issue-help.is-ready .ih-t { display: flex; align-items: center; gap: 6px; }
.issue-help.is-ready .ih-t::before { content: ''; width: 12px; height: 12px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3 8.5 3 3 7-7'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3 8.5 3 3 7-7'/></svg>") center / contain no-repeat; }
.issue-help a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
/* avviso del minimo staccato dal pulsante */
.lic-mini .lic-msg + .btn, .lic-mini-acts { margin-top: 12px; }
.issue-help.is-busy { box-shadow: inset 3px 0 0 var(--line-strong); }

/* =====================================================================
   v1.9 · ANIMAZIONI (design-loop parte 2)
   Regole: movimento solo con uno scopo; entrata 180-240ms con fade + max 10px,
   uscita più rapida (140ms); nessun rimbalzo, nessun loop decorativo;
   con prefers-reduced-motion tutto è istantaneo.
   ===================================================================== */
:root { --m-in: 220ms; --m-out: 140ms; --m-ease: cubic-bezier(.16,1,.3,1); --m-ease-out: cubic-bezier(.4,0,1,1); }

/* dialog: sfondo che sfuma, riquadro che sale di 10px; chiusura più rapida */
@keyframes dlgVeilIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes dlgBoxIn  { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes dlgVeilOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes dlgBoxOut  { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(6px); } }
html.motion .dlg.on { animation: dlgVeilIn 180ms ease-out both; }
html.motion .dlg.on .dlg-box { animation: dlgBoxIn var(--m-in) var(--m-ease) both; }
html.motion .dlg.is-closing { display: flex; animation: dlgVeilOut var(--m-out) var(--m-ease-out) both; pointer-events: none; }
html.motion .dlg.is-closing .dlg-box { animation: dlgBoxOut var(--m-out) var(--m-ease-out) both; }

/* cambio pannello e cambio tab / domanda del percorso */
.panel.on { animation-duration: 200ms; }
@keyframes animIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
html.motion .anim-in { animation: animIn 200ms var(--m-ease) both; }

/* notifica: entra in 220ms, esce in 140ms */
.toast { transition: opacity var(--m-out) var(--m-ease-out), transform var(--m-out) var(--m-ease-out), visibility var(--m-out); }
.toast.show { transition: opacity var(--m-in) var(--m-ease), transform var(--m-in) var(--m-ease), visibility 0s; }

/* riga aggiunta nel pannello: evidenziata una volta, più breve */
.lic-line.is-fresh { animation-duration: 1000ms; }
/* contatore: piccolo impulso senza rimbalzo */
@keyframes lic-bump { 0% { transform: scale(1); } 45% { transform: scale(1.14); } 100% { transform: scale(1); } }
.bump { animation: lic-bump 240ms var(--m-ease); }
/* banner di sessione ripresa: stessa entrata dei dialog */
.session-banner { animation: dlgBoxIn var(--m-in) var(--m-ease) both; }

/* riduzione del movimento: tutto istantaneo (lo spinner resta, ma lento; il testo di stato spiega comunque) */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .btn.is-loading::before { animation-duration: 1.6s !important; animation-iteration-count: infinite !important; }
}
/* giro 2: lo sfondo scurisce senza rendere trasparente il riquadro (prima l'opacità del velo
   si sommava a quella del riquadro e lasciava leggere la pagina sotto) */
@keyframes dlgVeilIn  { from { background-color: rgba(var(--navy-rgb), 0); -webkit-backdrop-filter: blur(0); backdrop-filter: blur(0); } }
@keyframes dlgVeilOut { to   { background-color: rgba(var(--navy-rgb), 0); -webkit-backdrop-filter: blur(0); backdrop-filter: blur(0); } }
@keyframes dlgBoxIn  { 0% { opacity: 0; transform: translateY(12px); } 45% { opacity: 1; } 100% { opacity: 1; transform: none; } }
html.motion .dlg.on { animation: dlgVeilIn 160ms ease-out both; }
html.motion .dlg.on .dlg-box { animation: dlgBoxIn var(--m-in) var(--m-ease) both; }
html.motion .dlg.is-closing { animation: dlgVeilOut var(--m-out) var(--m-ease-out) both; }
/* chiusura: tutto il dialog (velo + riquadro) sfuma insieme in 140ms, il riquadro scende di 6px */
@keyframes dlgAllOut { to { opacity: 0; } }
@keyframes dlgBoxDown { to { transform: translateY(6px); } }
html.motion .dlg.is-closing { animation: dlgAllOut var(--m-out) var(--m-ease-out) both; }
html.motion .dlg.is-closing .dlg-box { animation: dlgBoxDown var(--m-out) var(--m-ease-out) both; }
/* chiusura (giro 3): il riquadro sparisce per primo (100ms), il velo scuro e la sfocatura subito dopo (140ms):
   nessun momento con il testo del dialog sopra la pagina non sfocata */
@keyframes dlgBoxGone { to { opacity: 0; transform: translateY(6px); } }
html.motion .dlg.is-closing { animation: dlgVeilOut var(--m-out) var(--m-ease-out) both; }
html.motion .dlg.is-closing .dlg-box { animation: dlgBoxGone 100ms var(--m-ease-out) both; }
/* durante l'entrata il contenuto non avvia transizioni proprie (niente pulsanti che cambiano colore fuori sincrono) */
.anim-in *, .anim-in { transition: none !important; }
/* avanzamento del percorso e sottolineatura dei tab: stessi tempi dell'entrata */
.guide-progress span { transition-duration: 200ms; }
.lic-tab { transition-duration: 150ms !important; }
/* riga appena aggiunta: un lampo teal più leggibile, poi lo stato "in configurazione" */
@keyframes varFlash { 0% { background: rgba(var(--teal-rgb), .42); box-shadow: inset 4px 0 0 var(--teal); } 100% { background: var(--teal-050); box-shadow: inset 3px 0 0 var(--teal); } }
.lic-var.is-flash { animation: varFlash 900ms ease-out; }
html.motion .dlg.is-closing { animation: dlgVeilOut 100ms ease-in 40ms both; }
html.motion .dlg.is-closing .dlg-box { animation: dlgBoxGone 90ms var(--m-ease-out) both; }
/* giro 4: contenuto nuovo opaco presto (niente pulsanti "grigi" a metà dissolvenza); barra del percorso su tutta la larghezza */
@keyframes animIn { 0% { opacity: 0; transform: translateY(6px); } 40% { opacity: 1; } 100% { opacity: 1; transform: none; } }
.guide-progress { margin-right: 0; }
/* barra di lettura: segue lo scroll senza animarsi (non "arretra" in modo visibile quando la pagina si allunga) */
.read-bar span { transition: none; }
.guide-progress span { transition-duration: 150ms; }

/* =====================================================================
   v1.10 · FORM E DIALOG (design-loop parte 3)
   ===================================================================== */
/* un elemento con [hidden] resta nascosto anche se è un pulsante */
.btn[hidden], [hidden].btn { display: none !important; }
/* campi: ritmo verticale costante, etichetta sopra, aiuto ed errore sotto */
#entityForm .field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
#entityForm .entity-rows { gap: 14px 16px; }
#entityForm fieldset { margin: 6px 0 4px; }
#entityForm label, .recover-form label, .guide-qty label { font-size: 13px; font-weight: 600; color: var(--ink); }
#entityForm .control, .recover-form .control { min-height: 44px; }
textarea#fNote { font-family: inherit; font-size: var(--t-sm); line-height: 1.5; min-height: 72px; }
/* errore: bordo rosso + testo rosso con icona sotto il campo */
.control.error, .control[aria-invalid="true"] { border-color: var(--alert) !important; box-shadow: 0 0 0 3px rgba(185,28,28,.10) !important; }
.field-error { font-size: 12.5px; font-weight: 500; line-height: 1.4; align-items: flex-start; gap: 6px; margin-top: 0; }
.field-error::before { content: ''; flex: none; width: 14px; height: 14px; margin-top: 1px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='8' cy='8' r='6.2'/><path d='M8 4.8v3.8M8 11v.1'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='8' cy='8' r='6.2'/><path d='M8 4.8v3.8M8 11v.1'/></svg>") center / contain no-repeat; }
/* recupero: esito sotto il campo, come gli errori; nessun riquadro rosa */
.recover-form .field { display: flex; flex-direction: column; gap: 6px; }
.recover-msg { margin: 0; font-size: 12.5px; }
.recover-msg .tag { display: flex; align-items: flex-start; gap: 6px; padding: 0; background: none; border: 0; font-weight: 500; white-space: normal; line-height: 1.4; }
.recover-msg .tag-ko { color: var(--alert); }
.recover-msg .tag-ok { color: var(--ok); }
.recover-msg .tag::before { content: ''; flex: none; width: 14px; height: 14px; margin-top: 1px; background: currentColor; }
.recover-msg .tag-ko::before { -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='8' cy='8' r='6.2'/><path d='M8 4.8v3.8M8 11v.1'/></svg>") center / contain no-repeat; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='8' cy='8' r='6.2'/><path d='M8 4.8v3.8M8 11v.1'/></svg>") center / contain no-repeat; }
.recover-msg .tag-ok::before { -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m3 8.5 3 3 7-7'/></svg>") center / contain no-repeat; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m3 8.5 3 3 7-7'/></svg>") center / contain no-repeat; }
#recoverInput[aria-invalid="true"] { border-color: var(--alert) !important; }
/* dialog: chiusura con area di 44px, piede con una sola azione piena in testa */
.dlg-close.icon-btn, .dlg .icon-btn.dlg-close { width: 44px; height: 44px; top: 14px; right: 14px; }
.dlg-close.icon-btn:hover { background: var(--paper-2); color: var(--ink); }
#cnvSheet .dlg-foot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#cnvSheet .dlg-foot > #btnEmailCnv { grid-column: 1 / -1; }
#cnvSheet .dlg-foot > .link-btn, #cnvSheet .dlg-foot > a { grid-column: 1 / -1; justify-self: center; }
/* campo quantità del percorso: segnaposto chiaramente più tenue del valore */
#guideQty::placeholder { color: var(--text-soft); opacity: .8; font-weight: 400; }
#cnvSheet .dlg-foot > #btnCloseCnv { grid-column: 1 / -1; }
/* giro 2: un'unica regola per il piede dei dialog: testo/chiusura a sinistra, azione principale a destra */
.dlg-foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.dlg-foot > .btn-quiet:first-child, .dlg-foot > .link-btn:first-child { margin-right: auto; }
.dlg-foot .btn { flex: 0 0 auto; min-width: 0; }
#recoverSheet .dlg-foot .btn-solid, #recoverSheet .dlg-foot .btn-accent { min-width: 220px; }
/* dialog CNV: azioni secondarie in griglia, poi riga finale come tutti gli altri dialog */
#cnvSheet .dlg-foot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#cnvSheet .dlg-foot > #btnPrint { order: 1; } #cnvSheet .dlg-foot > #btnCopyCode { order: 2; }
#cnvSheet .dlg-foot > #btnCopyLink { order: 3; } #cnvSheet .dlg-foot > #btnExportXlsx { order: 4; }
#cnvSheet .dlg-foot > #btnCloseCnv { order: 5; grid-column: auto; justify-self: start; }
#cnvSheet .dlg-foot > #btnEmailCnv { order: 6; grid-column: auto; }
#cnvSheet .dlg-foot .btn { width: 100%; }
#cnvSheet .dlg-foot > #btnCloseCnv { width: auto; }
/* separatore sotto il codice: linea chiara come gli altri divisori */
#cnvSheet .seal-code { border-bottom-color: var(--line) !important; }
/* nome ente come gli altri campi, senza pannello grigio */
#entityForm .entity-primary { background: none !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; }
/* focus identico su tutti i campi, textarea compresa */
#entityForm .control:focus, textarea#fNote:focus { border-color: var(--teal-700) !important; box-shadow: 0 0 0 1px var(--teal-700), 0 0 0 5px rgba(var(--teal-rgb),.20) !important; outline: 0; }
/* quantità del percorso: niente frecce native, segnaposto della stessa misura degli altri campi */
#guideQty { font-size: var(--t-sm); -moz-appearance: textfield; }
#guideQty::-webkit-outer-spin-button, #guideQty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.guide-qty-quick .lic-chip { min-height: 44px; min-width: 56px; }
/* recupero: righe recenti cliccabili in modo evidente, "Svuota elenco" come testo distruttivo */
.recover-history-item { position: relative; padding-right: 40px !important; min-height: 48px; }
.recover-history-item::after { content: 'Apri ›'; position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 12px; font-weight: 600; color: var(--teal-700); }
.recover-history-item:hover { border-color: var(--teal) !important; background: var(--teal-050) !important; }
.recover-history-clear.btn-danger-text { color: var(--alert); background: none; border: 0; font-size: 12.5px; font-weight: 600; min-height: 32px; cursor: pointer; }
.recover-history-clear.btn-danger-text:hover { text-decoration: underline; }
.rp-note { margin: 8px 0 0; font-size: 12.5px; color: var(--text-soft); }
.guide-qty .btn-why { margin-top: 10px; }
/* giro 3 */
.recover-history-item::after { content: 'Verifica ›'; }
#entityForm fieldset legend { margin: 10px 0 10px; padding: 0; }
#entityForm fieldset { margin-top: 18px; }
#cnvSheet .dlg-foot > #btnCloseCnv { align-self: center; }
/* alone di focus più leggibile su fondo bianco */
#entityForm .control:focus, textarea#fNote:focus, #guideQty:focus, #recoverInput:focus { box-shadow: 0 0 0 1px var(--teal-700), 0 0 0 5px rgba(var(--teal-rgb),.28) !important; }
.recover-form .field-help { margin: 0; font-size: 12.5px; color: var(--text-soft); line-height: 1.45; }
.recover-msg:not(:empty) + .field-help { display: none; }
#recoverInput[aria-invalid="true"]:focus, #entityForm .control.error:focus { border-color: var(--alert) !important; box-shadow: 0 0 0 1px var(--alert), 0 0 0 5px rgba(185,28,28,.14) !important; }
/* giro 4 */
.entity-privacy { border: 1px solid var(--line) !important; border-left-width: 1px !important; border-radius: var(--r-xs) !important; box-shadow: none !important; background: var(--paper-2) !important; }
.recover-list { box-shadow: none !important; }
.recover-list li { box-shadow: none !important; }
#cnvSheet .seal-ok { display: none; }
#recoverNote { margin: 10px 0 0; padding: 10px 12px; border-radius: var(--r-xs); background: var(--paper-2); box-shadow: inset 3px 0 0 var(--wait); color: var(--text); font-size: 12.5px; }
.recover-form .field-help { display: flex; gap: 6px; align-items: flex-start; }
.recover-form .field-help::before { content: ''; flex: none; width: 13px; height: 13px; margin-top: 2px; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23475569' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3.5' y='7' width='9' height='6.5' rx='1.2'/><path d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2'/></svg>") center / contain no-repeat; }
.guide-qty label .req { color: var(--alert); }
/* giro 5: motivo del blocco accanto all'azione piena nel piede */
.foot-why { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: #475569; }
.foot-why[hidden] { display: none !important; }
.foot-why::before { content: ''; width: 13px; height: 13px; flex: none; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23475569' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3.5' y='7' width='9' height='6.5' rx='1.2'/><path d='M5.5 7V5a2.5 2.5 0 0 1 5 0v2'/></svg>") center / contain no-repeat; }
.recover-history-item::after { text-decoration: underline; text-underline-offset: 3px; }
#recoverNote { box-shadow: none; border: 1px solid var(--wait-line, #fde68a); background: var(--wait-tint, #fffbeb); }
textarea#fNote { resize: vertical; }
.recover-form .field-help::before { display: none; }
.guide-foot { flex-wrap: nowrap; }
.guide-foot .guide-foot-sp { flex: 1 1 auto; }

/* =====================================================================
   v1.11 · CARD E RISULTATI (design-loop parte 4)
   ===================================================================== */
/* intestazioni di sezione: filo chiaro, non nero */
.doc-lbl { border-bottom-color: var(--line) !important; }
/* esito del riconoscimento: i codici non vanno a capo, colonne leggibili */
.lic-table td[data-l="Codice"] code { white-space: nowrap; }
.lic-table td[data-l="Codice"], .lic-table th:first-child { min-width: 190px; }
.lic-table td { vertical-align: middle; }
/* card dei percorsi in home: elevazione al passaggio (solo ciò che è cliccabile) */
.path-card { transition: transform 160ms var(--m-ease, ease-out), box-shadow 160ms ease-out, border-color 160ms ease-out; }
.path-card:not(.is-dark):hover { border-color: var(--teal); }
@media (max-width: 720px) {
  /* notifica su mobile: a tutta larghezza sopra la barra del totale, non in mezzo alla lista */
  .toast { left: 12px !important; right: 12px !important; transform: translateY(14px) !important; max-width: none !important; bottom: 92px !important; }
  .toast.show { transform: none !important; }
  /* riga variante su mobile: etichetta del campo allineata a sinistra sopra quantità e pulsante */
  .lic-var .lic-res-add { display: grid; grid-template-columns: 96px 1fr; gap: 6px 8px; align-items: end; }
  .lic-var .lic-res-add .lic-res-unit { grid-column: 1 / -1; grid-row: 1; text-align: left; }
  .lic-var .lic-res-add .btn.btn-add { width: 100%; min-width: 0; }
  .lic-res-tools { width: 100%; justify-content: space-between; }
  .lic-res-tools .link-btn { margin-left: 0; }
}
/* giro 2 card e risultati */
.path-card { border-left-width: 1px !important; box-shadow: var(--sh-1) !important; }
.path-card:hover { translate: 0 -3px; box-shadow: 0 10px 24px -8px rgba(11,19,41,.22), 0 2px 6px rgba(11,19,41,.08) !important; border-color: var(--teal) !important; }
html.motion .path-card { transition: translate 160ms ease-out, box-shadow 160ms ease-out, border-color 160ms ease-out; }
/* codici sempre su una riga */
.lic-var code, .lic-mini code, #reviewList .code { white-space: nowrap; }
.lic-var-d { display: block; font-size: 12px; color: var(--text-soft); line-height: 1.4; margin-top: 2px; }
/* riepilogo: quantità e importi a destra; su mobile etichetta a sinistra e valore a destra */
#reviewList .lic-review-line .right { text-align: right !important; justify-self: stretch; }
@media (max-width: 720px) {
  #reviewList .rl-head { display: none; }
  .lic-var-a code { font-size: 11.5px; }
  .lic-paste-live > * { white-space: nowrap; }
}
/* esito del riconoscimento: etichetta del campo sopra */
.lic-table td[data-l="Quantità"] { display: table-cell; }
.lic-table td[data-l="Quantità"] .lic-unit-lbl, .lic-table td[data-l="Quantità"] > .muted { display: block; }
/* intestazioni di sezione: stesso stile (maiuscolo spaziato + filo chiaro sotto) */
#entityForm fieldset legend { display: block; width: 100%; font-size: var(--t-micro); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); padding: 0 0 var(--s3); border-bottom: 1px solid var(--line); margin-bottom: 14px; }
#entityForm fieldset legend::after { display: none !important; }
/* barra del totale su mobile: superficie scura, quindi l'azione piena è teal (navy su navy non si vedrebbe) */
.lic-table td[data-l="Quantità"] { white-space: nowrap; }
.lic-table td[data-l="Quantità"] .control { display: inline-block; vertical-align: middle; }
.lic-table td[data-l="Quantità"] > .muted { display: inline; margin-left: 6px; }
/* giro 3 card e risultati */
/* colonna azione della variante: centrata sulla riga, etichetta discreta */
.lic-var > .lic-res-add { align-self: center; }
.lic-var .lic-res-add .lic-res-unit { font-size: 11.5px; color: var(--text-soft); line-height: 1.2; }
/* barra risultati fissa: separata dalla lista che scorre sotto */
.lic-res-h { box-shadow: 0 1px 0 var(--line), 0 8px 12px -10px rgba(11,19,41,.25); }
/* pannello configurazione: importo centrato sul campo quantità */
.lic-mini .lic-line-foot, .lic-line .lic-line-b { align-items: center; }
/* giro 4 card e risultati */
/* scelta selezionata (chip e card piattaforma): stesso linguaggio dei filtri attivi, mai un pieno che sembri un pulsante */
.lic-chip[aria-pressed="true"], .lic-chip[aria-pressed="true"]:hover { background: var(--teal-050) !important; border: 1.5px solid var(--teal-700) !important; color: var(--teal-700) !important; font-weight: 600; box-shadow: none; }
.lic-chip[aria-pressed="true"]::before { content: ''; width: 12px; height: 12px; margin-right: 6px; flex: none; display: inline-block; background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3 8.5 3 3 7-7'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='m3 8.5 3 3 7-7'/></svg>") center / contain no-repeat; }
.lic-chip[aria-pressed="true"] .n { color: var(--teal-700); opacity: .75; }
.lic-pf[aria-pressed="true"] { background: var(--teal-050) !important; border: 1.5px solid var(--teal-700) !important; box-shadow: none !important; }
@media (hover: none) { .lic-pf:hover:not([aria-pressed="true"]), .path-card:hover { border-color: var(--line) !important; translate: none; } }
/* riga variante: tutte le colonne sullo stesso asse verticale */
.lic-var { align-items: center !important; }
.lic-var > div { align-self: center; }
.lic-var .lic-res-add { padding-top: 2px; }
/* pannello configurazione: niente filo spesso in testa; prezzo centrato sul campo */
.lic-mini { border-top: 1px solid var(--line) !important; }
.lic-line-foot { align-items: center !important; }
/* mobile: legenda del conteggio senza a capo spezzati */
@media (max-width: 720px) { .lic-paste-live { display: flex; flex-wrap: wrap; gap: 4px 14px; } .lic-paste-live .dot { flex: none; } }
.lic-var { padding-top: 14px !important; padding-bottom: 14px !important; }
/* giro 5 card e risultati */
.lic-line-ctl { align-items: flex-end !important; }
.lic-line-ctl .lic-line-tot, .lic-line-ctl .lic-line-lic { padding-bottom: 12px; }
.lic-res-h { box-shadow: 0 1px 0 var(--line) !important; }
@media (max-width: 720px) {
  .lic-res-h { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .lic-res-tools { display: grid !important; grid-template-columns: 1fr auto; align-items: end; gap: 12px; }
  .lic-res-tools .lic-sort select { width: 100%; }
  .lic-row .btn-quiet { padding-left: 0; }
  .lic-paste-live > span { white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
}
.lic-paste-live .lp-i { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; margin-right: 14px; }
/* giro 6 card e risultati */
.lic-line, .lic-line.is-fresh { border-radius: 0 !important; }
.price.is-quote { font-size: 13px !important; font-weight: 600 !important; color: var(--text-soft) !important; }
.lic-pt.zero { background: var(--paper-2) !important; color: var(--text-soft) !important; border-color: var(--line) !important; }
.lic-pt.zero .lic-pt-n, .lic-pt.zero .lic-pt-l { color: var(--text-soft) !important; }
.lic-active .k { font-weight: 400 !important; color: var(--text-soft) !important; }
.lic-active { font-weight: 600; }
.lic-res-h { top: 64px; box-shadow: 0 1px 0 var(--line), 0 -12px 0 var(--surface-elevated) !important; }
/* giro 7: varianti simili, la descrizione distintiva diventa la riga principale; prezzo in asse con il campo */
.lic-var-d.is-key { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.lic-var-p { padding-top: 18px; }
@media (max-width: 720px) { .lic-var-p { padding-top: 0; } }
.lic-var .lic-res-add .lic-res-unit { font-weight: 600; color: var(--ink); font-size: 12px; }
/* asse comune: le colonne di testo scendono quanto l'etichetta del campo, così tutto è centrato sul campo quantità */
@media (min-width: 721px) { .lic-var-a, .lic-var-b { padding-top: 18px; } }
[data-theme="dark"] .entity-privacy a, [data-theme="dark"] .issue-help a { color: var(--mint, #6ee7b7) !important; }
[data-theme="dark"] .entity-privacy { background: rgba(255,255,255,.04) !important; border-color: rgba(255,255,255,.12) !important; }
[data-theme="dark"] .lic-chip[aria-pressed="true"] { background: rgba(16,185,129,.14) !important; color: #6ee7b7 !important; border-color: #34d399 !important; }

/* =====================================================================
   v1.12 · DATE DI VALIDITÀ (inizio presunto e fine calcolata)
   ===================================================================== */
.sd-box { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); padding: 14px 16px; margin: 0 0 16px; }
.sd-box-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; margin-bottom: 10px; }
.sd-box-h b { font-size: var(--t-sm); color: var(--ink); }
.sd-box-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 16px; }
.sd-box-row .field { display: flex; flex-direction: column; gap: 6px; }
.sd-box-row label, .sd-line label { font-size: 13px; font-weight: 600; color: var(--ink); }
.sd-box input[type="date"], .sd-line input[type="date"] { min-height: 44px; font-family: inherit; font-size: var(--t-sm); padding: 0 10px; width: 180px; }
.sd-box .field-help { margin: 10px 0 0; font-size: 12.5px; color: var(--text-soft); line-height: 1.45; }
.sd-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 8px; font-size: 12.5px; }
.sd-line label { font-size: 12px; font-weight: 600; }
.sd-line input[type="date"] { min-height: 38px; width: 160px; }
.sd-line .sd-end b { color: var(--teal-700); }
.sd-line.is-na { color: var(--text-soft); }
.sd-diff { font-size: 11.5px; font-weight: 600; color: var(--wait); background: var(--wait-tint); border-radius: 99px; padding: 2px 8px; }
.lic-line-sd { font-size: 12px; color: var(--text-soft); margin-top: 4px; }
.pdf-items small.sd { display: block; font-size: 7.5pt; color: #475569; white-space: nowrap; margin-top: 2px; }
[data-theme="dark"] .sd-box { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.12); }
@media (max-width: 720px) { .sd-box input[type="date"], .sd-line input[type="date"] { width: 100%; } .sd-line { flex-direction: column; align-items: stretch; } }

/* =====================================================================
   v1.13 · RITOCCHI MOBILE
   ===================================================================== */
@media (max-width: 720px) {
  /* esito del riconoscimento: ogni codice è una scheda con filo colorato, niente fondi a pezzi */
  .lic-table tr { border-left: 4px solid var(--teal) !important; background: var(--surface-elevated, #fff) !important; }
  .lic-table tr.is-warn { border-left-color: var(--wait) !important; }
  .lic-table tr.is-ko { border-left-color: var(--alert) !important; background: var(--alert-tint) !important; }
  .lic-table tr td, .lic-table tbody tr:nth-child(even) td, .lic-table tbody tr.is-ko td { background: none !important; box-shadow: none !important; border: 0 !important; padding: 3px 0 !important; }
  .lic-table td[data-l="Quantità"], .lic-table td[data-l="Esito"] { display: flex !important; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding-top: 8px !important; }
  .lic-table td[data-l="Quantità"]::before, .lic-table td[data-l="Esito"]::before { display: inline-block !important; width: 78px; margin: 0 !important; }
  .lic-table td[data-l="Esito"] .lic-swaps, .lic-table td[data-l="Esito"] > div { flex-basis: 100%; }
  .lic-table td[data-l="Codice"]::before, .lic-table td[data-l="Prodotto"]::before { display: none !important; }
  .lic-table td[data-l="Codice"] code { background: none; padding: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
  /* codice CNV nel dialog: entra su una riga, va a capo solo se serve e senza spezzare a caso */
  #cnvSheet .seal-code { font-size: clamp(15px, 4.6vw, 22px); letter-spacing: 0; overflow-wrap: anywhere; line-height: 1.35; }
  /* il banner "configurazione trovata" non si sovrappone ai dialog */
  body.no-scroll .session-banner { display: none !important; }
  /* nelle azioni del riquadro finale le etichette stanno su una riga */
  .issue-secondary .btn { font-size: 13px; padding-left: 10px; padding-right: 10px; }
  .issue-secondary .btn .btn-ico { margin-right: 4px; }
}
/* notifica toccabile per chiuderla */
.toast { cursor: pointer; }
@media (max-width: 720px) {
  /* con un dialog aperto la notifica va in alto, lontano dai pulsanti del piede */
  body.no-scroll .toast { top: 12px !important; bottom: auto !important; transform: translateY(-14px) !important; }
  body.no-scroll .toast.show { transform: none !important; }
}
@media (max-width: 420px) { .issue-secondary .btn .btn-ico { display: none; } .issue-secondary .btn { padding-left: 6px; padding-right: 6px; } }

/* v1.13 · PDF: il codice CNV (anche lungo, con le date) occupa la colonna larga; QR a larghezza fissa */
.pdf-recall { grid-template-columns: minmax(0, 1fr) 40mm; }
.pdf-recall .r-qr { width: 40mm; }
.pdf-recall .r-code { word-break: break-all; overflow-wrap: anywhere; line-height: 1.35; }
.pdf-recall .r-qr-cap { font-family: inherit; white-space: normal; }
/* v1.13 · PDF: nessun margine sotto la tabella (con l'intestazione ripetuta, Chrome spostava a pagina nuova i blocchi successivi lasciando mezza pagina vuota) */
.pdf-pb.pdf-pb-flow, .pdf-items { margin-bottom: 0 !important; }
.pdf-items { display: table; }

/* =====================================================================
   v1.14 · LETTURA A COLPO D'OCCHIO (toni tenui + icone) e TRENDAI
   Icone: maschere SVG colorate con currentColor. Colori dei tipi tenui,
   testo sempre scuro sul fondo chiaro (contrasto AA).
   ===================================================================== */
:root {
  --i-check: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='m3.5 8.5 3 3 6-7'/></svg>");
  --i-clock: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><circle cx='8' cy='8' r='6'/><path d='M8 4.8V8l2.2 1.4'/></svg>");
  --i-warn: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M8 2.2 14.3 13H1.7L8 2.2Z'/><path d='M8 6.5v3M8 11.2h.01'/></svg>");
  --i-info: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='8' cy='8' r='6'/><path d='M8 7.2V11M8 5h.01'/></svg>");
  --i-x: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'><circle cx='8' cy='8' r='6'/><path d='m5.8 5.8 4.4 4.4M10.2 5.8l-4.4 4.4'/></svg>");
  --i-cloud: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'><path d='M4.7 12.5h7a2.7 2.7 0 0 0 .3-5.4A4 4 0 0 0 4.2 6.4a3 3 0 0 0 .5 6.1Z'/></svg>");
  --i-hourglass: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M4.5 2h7M4.5 14h7M5 2c0 3 6 3.5 6 6s-6 3-6 6M11 2c0 3-6 3.5-6 6s6 3 6 6'/></svg>");
  --i-infinity: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'><path d='M8 8c-1.4-1.9-2.4-2.8-3.7-2.8a2.8 2.8 0 0 0 0 5.6C5.6 10.8 6.6 9.9 8 8Zm0 0c1.4 1.9 2.4 2.8 3.7 2.8a2.8 2.8 0 0 0 0-5.6C10.4 5.2 9.4 6.1 8 8Z'/></svg>");
  --i-life: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6'><circle cx='8' cy='8' r='6'/><circle cx='8' cy='8' r='2.5'/><path d='m3.8 3.8 2.4 2.4M9.8 9.8l2.4 2.4M12.2 3.8 9.8 6.2M6.2 9.8l-2.4 2.4'/></svg>");
  --i-tool: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M9.8 2.6a3.3 3.3 0 0 0-3.6 4.5L2.5 10.8a1.2 1.2 0 0 0 1.7 1.7l3.7-3.7a3.3 3.3 0 0 0 4.5-3.6L10.4 7.2 8.8 6.8 8.4 5.2l2-1.9-.6-.7Z'/></svg>");
  --i-coin: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6'><ellipse cx='8' cy='4.5' rx='5' ry='2.2'/><path d='M3 4.5v3.5c0 1.2 2.2 2.2 5 2.2s5-1 5-2.2V4.5M3 8v3.5c0 1.2 2.2 2.2 5 2.2s5-1 5-2.2V8'/></svg>");
  --i-tag: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'><path d='M2.5 2.5h5.3l5.7 5.7-5.3 5.3-5.7-5.7V2.5Z'/><circle cx='5.4' cy='5.4' r='1' fill='black'/></svg>");
  --i-cap: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'><path d='M1.5 6 8 3l6.5 3L8 9 1.5 6Z'/><path d='M4.2 7.3v3.2c2 1.6 5.6 1.6 7.6 0V7.3'/></svg>");
  --i-dot: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><circle cx='8' cy='8' r='3' fill='black'/></svg>");
  --i-list: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'><path d='M6 4h7.5M6 8h7.5M6 12h7.5M2.5 4h.01M2.5 8h.01M2.5 12h.01'/></svg>");
  --i-org: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'><path d='M2 14h12M3.5 14V6.5L8 3l4.5 3.5V14'/><path d='M6.5 14v-3.5h3V14'/></svg>");
  --i-euro: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'><path d='M12 4.2A5 5 0 1 0 12 11.8'/><path d='M2.8 6.6h6.5M2.8 9.4h6.5'/></svg>");
  --i-box: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'><path d='m8 1.8 5.5 3v6.4L8 14.2l-5.5-3V4.8L8 1.8Z'/><path d='m2.5 4.8 5.5 3 5.5-3M8 7.8v6.4'/></svg>");
  --i-cal: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'><rect x='2.5' y='3.5' width='11' height='10' rx='1.5'/><path d='M2.5 6.8h11M5.5 2v3M10.5 2v3'/></svg>");
  --i-steps: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'><path d='M2 13.5h4v-3h4v-3h4'/></svg>");

  /* tipi di prodotto: fondo tenue, testo scuro dello stesso tono */
  --ty-saas-bg: #e8f5f8;  --ty-saas: #0b5f6e;
  --ty-term-bg: #e9f6f0;  --ty-term: #0b6a4c;
  --ty-sns-bg:  #eef2f6;  --ty-sns:  #3a4a60;
  --ty-perp-bg: #eeeffa;  --ty-perp: #43449a;
  --ty-ps-bg:   #f9eef2;  --ty-ps:   #8e2f4d;
  --ty-flex-bg: #edf2fd;  --ty-flex: #284f9e;
  --ty-acad-bg: #f3eefb;  --ty-acad: #5f3b98;
  --ty-quote-bg:#fdf3e6;  --ty-quote:#8f4700;
}
:root[data-theme="dark"] {
  --ty-saas-bg: rgba(45,170,195,.14);  --ty-saas: #9fdde9;
  --ty-term-bg: rgba(52,211,153,.13);  --ty-term: #9ee8c7;
  --ty-sns-bg:  rgba(148,163,184,.14); --ty-sns:  #cbd5e1;
  --ty-perp-bg: rgba(129,140,248,.15); --ty-perp: #c7cbff;
  --ty-ps-bg:   rgba(244,114,182,.13); --ty-ps:   #f9c6dc;
  --ty-flex-bg: rgba(96,165,250,.14);  --ty-flex: #bcd6ff;
  --ty-acad-bg: rgba(167,139,250,.15); --ty-acad: #dacbff;
  --ty-quote-bg:rgba(245,158,11,.15);  --ty-quote:#fcd38d;
}
/* icona generica */
.ty::before, .ty-du::before, .rd::before, .doc-lbl[data-ico]::before, .lic-badge.ok::before, .lic-badge.warn::before, .lic-badge.bad::before, .lic-badge.info::before,
.lic-msg.warn::before, .lic-msg.info::before, .lic-msg.bad::before, .calc-k::before, .issue-help .ih-t::before {
  content: ''; display: inline-block; flex: none; width: 12px; height: 12px; background: currentColor;
  -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat;
}

/* ----- chip del tipo di prodotto ----- */
.ty, .ty-du { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; line-height: 1; padding: 4px 8px 4px 7px; border-radius: 99px; white-space: nowrap; vertical-align: middle; }
.ty { background: var(--paper-3); color: var(--text); }
.ty-saas  { background: var(--ty-saas-bg);  color: var(--ty-saas);  --ico: var(--i-cloud); }
.ty-term  { background: var(--ty-term-bg);  color: var(--ty-term);  --ico: var(--i-hourglass); }
.ty-sns   { background: var(--ty-sns-bg);   color: var(--ty-sns);   --ico: var(--i-life); }
.ty-perp  { background: var(--ty-perp-bg);  color: var(--ty-perp);  --ico: var(--i-infinity); }
.ty-ps    { background: var(--ty-ps-bg);    color: var(--ty-ps);    --ico: var(--i-tool); }
.ty-flex  { background: var(--ty-flex-bg);  color: var(--ty-flex);  --ico: var(--i-coin); }
.ty-acad  { background: var(--ty-acad-bg);  color: var(--ty-acad);  --ico: var(--i-cap); }
.ty-quote { background: var(--ty-quote-bg); color: var(--ty-quote); --ico: var(--i-tag); }
.ty-du { background: transparent; color: var(--text-soft); padding-left: 2px; --ico: var(--i-clock); font-weight: 500; }
.ty-du.is-once { --ico: var(--i-dot); }
.ty-row { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 6px; align-items: center; }
.lic-res .badges .ty { font-size: 11.5px; }
.lic-res-k { margin-bottom: 4px; }
.lic-var-du { display: inline-flex; align-items: center; gap: 5px; }
.lic-var-du::before { content: ''; width: 12px; height: 12px; background: var(--text-soft); -webkit-mask: var(--i-clock) center / contain no-repeat; mask: var(--i-clock) center / contain no-repeat; }
.lic-var-du.is-once::before { -webkit-mask-image: var(--i-dot); mask-image: var(--i-dot); }

/* ----- stati con icona (stessi colori di prima, piu' riconoscibili) ----- */
.lic-badge.ok, .lic-badge.warn, .lic-badge.bad, .lic-badge.info { display: inline-flex; align-items: center; gap: 5px; }
.lic-badge.ok { --ico: var(--i-check); }
.lic-badge.warn { --ico: var(--i-warn); }
.lic-badge.bad { --ico: var(--i-x); }
.lic-badge.info { --ico: var(--i-info); }
.lic-msg.warn, .lic-msg.info, .lic-msg.bad { display: flex; gap: 8px; align-items: flex-start; }
.lic-msg.warn::before, .lic-msg.info::before, .lic-msg.bad::before { width: 14px; height: 14px; margin-top: 2px; }
.lic-msg.warn { --ico: var(--i-clock); }
.lic-msg.warn::before { background: var(--wait); }
.lic-msg.info { --ico: var(--i-info); }
.lic-msg.bad { --ico: var(--i-x); }
.issue-help:not(.is-ready) .ih-t { display: flex; align-items: center; gap: 6px; --ico: var(--i-clock); }
.issue-help:not(.is-ready) .ih-t::before { background: var(--wait); }

/* ----- fasi del percorso: testata tenue con filo del colore della fase ----- */
#panelBrand { --ph: var(--sec-teal); --ph-t: var(--tint-teal); }
#panelCompose { --ph: var(--sec-blue); --ph-t: var(--tint-blue); }
#panelReview { --ph: var(--sec-indigo); --ph-t: var(--tint-indigo); }
#panelBrand .panel-ask, #panelCompose .panel-ask, #panelReview .panel-ask {
  background: var(--ph-t); box-shadow: inset 3px 0 0 var(--ph); border-radius: var(--r-sm); padding: 14px 16px 14px 18px;
}
#panelBrand .lic-step, #panelCompose .lic-step, #panelReview .lic-step { background: var(--ph); color: #fff; }
[data-theme="dark"] #panelBrand .lic-step, [data-theme="dark"] #panelCompose .lic-step, [data-theme="dark"] #panelReview .lic-step { background: var(--ph); color: #0b1329; }
#panelBrand, #panelCompose, #panelReview { border-top-color: var(--line) !important; border-top-width: 1px !important; }

/* ----- etichette dei blocchi del riepilogo con icona ----- */
.doc-lbl[data-ico] { display: flex; align-items: center; gap: 8px; }
.doc-lbl[data-ico]::before { width: 15px; height: 15px; background: var(--sec-indigo); }
.doc-lbl[data-ico="list"] { --ico: var(--i-list); }
.doc-lbl[data-ico="org"] { --ico: var(--i-org); }
.doc-lbl[data-ico="euro"] { --ico: var(--i-euro); }

/* ----- striscia di stato in testa al riepilogo ----- */
.ready-strip { list-style: none; margin: 0 0 var(--s5); padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.ready-strip:empty { display: none; }
.rd { position: relative; }
.rd::before { position: absolute; left: 12px; top: 50%; margin-top: -9px; width: 18px; height: 18px; pointer-events: none; }
.rd-in { display: flex; flex-direction: column; gap: 2px; width: 100%; height: 100%; text-align: left; font: inherit; padding: 9px 12px 9px 40px; border-radius: var(--r-xs); border: 1px solid var(--line); background: var(--surface-elevated); color: var(--text); }
button.rd-in { cursor: pointer; }
button.rd-in:hover { border-color: var(--wait); }
.rd-l { font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text-soft); }
.rd-v { font-size: 14px; font-weight: 650; color: var(--ink); font-variant-numeric: tabular-nums; }
.rd.is-ok { --ico: var(--i-check); }
.rd.is-ok::before { background: var(--ok); }
.rd.is-ok .rd-in { background: var(--ok-tint); border-color: transparent; }
.rd.is-todo { --ico: var(--i-clock); }
.rd.is-todo::before { background: var(--wait); }
.rd.is-todo .rd-in { box-shadow: inset 3px 0 0 var(--wait); }
.rd.is-opt { --ico: var(--i-cal); }
.rd.is-opt::before { background: var(--text-soft); }
.rd.is-opt .rd-v { color: var(--text); font-weight: 600; }

/* ----- riga di calcolo: fascia raggiunta o crediti consumati ----- */
.lic-line-calc { font-size: 12.5px; color: var(--text-soft); margin-top: 6px; line-height: 1.45; }
.lic-line-calc b { color: var(--ink); font-weight: 650; }
.calc-k { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ty-term); margin-right: 4px; --ico: var(--i-steps); }
.calc-k::before { width: 11px; height: 11px; }
.lic-line-calc .calc-up { display: block; margin-top: 6px; padding: 6px 10px; border-radius: var(--r-xs); background: var(--paper-2); box-shadow: inset 3px 0 0 var(--wait); color: var(--text); }
.calc-up .link-btn { font-weight: 650; margin-left: 2px; }
#reviewList .rl-main .lic-line-calc { max-width: 560px; }

/* fasce nella scheda prodotto */
.band-tbl { display: inline-flex; flex-wrap: wrap; gap: 4px; flex-basis: 100%; margin-top: 2px; }
.band-i { display: inline-flex; flex-direction: column; gap: 1px; padding: 4px 8px; border-radius: 6px; background: var(--paper-2); border: 1px solid var(--line); font-size: 11px; line-height: 1.2; color: var(--text-soft); font-variant-numeric: tabular-nums; }
.band-i b { font-size: 12px; color: var(--ink); font-weight: 650; }
.band-q { white-space: nowrap; }

/* ----- crediti TrendAI Flex ----- */
.flex-box { margin: 12px 0 4px; padding: 12px 14px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--surface-elevated); box-shadow: inset 3px 0 0 var(--ty-flex); }
.flex-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.flex-h b { font-size: 13px; color: var(--ink); }
.flex-dl { margin: 0; display: grid; gap: 0; }
.flex-dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 5px 0; border-bottom: 1px dashed var(--line); font-size: 13px; }
.flex-dl dt { color: var(--text-soft); margin: 0; }
.flex-dl dd { margin: 0; font-weight: 650; color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.flex-dl dd small { font-weight: 500; color: var(--text-soft); font-size: 11.5px; }
.flex-dl .is-note dd { color: var(--ty-quote); }
.flex-dl .is-tot { border-bottom: 0; padding-top: 8px; }
.flex-dl .is-tot dt { color: var(--ink); font-weight: 600; }
.flex-dl .is-tot dd { font-size: 15px; }
.flex-sku { margin: 8px 0 0; font-size: 12px; color: var(--text-soft); }
.flex-sku code { font-size: 11.5px; color: var(--ink); background: var(--paper-3); padding: 1px 6px; border-radius: 4px; overflow-wrap: anywhere; }
.flex-up { margin: 8px 0 0; padding: 6px 10px; border-radius: var(--r-xs); background: var(--paper-2); box-shadow: inset 3px 0 0 var(--wait); font-size: 12.5px; color: var(--text); }
.lic-mini-foot .flex-box { margin-top: 0; margin-bottom: 12px; }
#reviewList .flex-box { max-width: 520px; margin-top: 16px; }

@media (max-width: 720px) {
  .ready-strip { grid-template-columns: 1fr 1fr; }
  .rd-in { padding-left: 36px; }
  .rd::before { left: 10px; }
  #panelBrand .panel-ask, #panelCompose .panel-ask, #panelReview .panel-ask { padding: 12px 12px 12px 14px; }
}
/* v1.14 · PDF: riquadro dei crediti TrendAI Flex */
.pdf-flex { margin-top: 4mm; border: 0.3mm solid #dbe3ee; border-left: 1mm solid #284f9e; border-radius: 2mm; padding: 3mm 4mm; break-inside: avoid; page-break-inside: avoid; }
.pdf-flex-h { font-weight: 700; font-size: 10.5pt; color: #0b1329; margin-bottom: 2mm; }
.pdf-flex table { width: 100%; border-collapse: collapse; font-size: 8.5pt; }
.pdf-flex th { text-align: left; font-weight: 600; color: #475569; font-size: 7.5pt; text-transform: uppercase; letter-spacing: .04em; padding: 1mm 1.5mm; border-bottom: 0.3mm solid #dbe3ee; }
.pdf-flex td { padding: 1.5mm; border-bottom: 0.2mm solid #eef2f7; vertical-align: top; }
.pdf-flex .num, .pdf-flex .r { text-align: right; font-variant-numeric: tabular-nums; }
.pdf-flex .c { text-align: center; }
.pdf-flex .mono { font-family: 'JetBrains Mono', Consolas, monospace; font-size: 8pt; }
.pdf-flex small { display: block; color: #64748b; font-size: 7pt; }
.pdf-flex p { margin: 2mm 0 0; font-size: 7.5pt; color: #64748b; }
.pdf-items td.num small { display: block; color: #64748b; font-size: 7pt; font-weight: 400; }
.pdf-title-brand-txt { font-family: var(--sans); font-weight: 700; font-size: 17pt; letter-spacing: -.01em; color: #1f2430; border: 0; padding: 0; border-radius: 2mm; align-self: center; }
/* v1.14 · percorso guidato: con molte opzioni due colonne larghe, testi leggibili */
.guide-opts.is-compact { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
/* v1.14 · fasce a tutta larghezza sotto la riga, fascia della quantita' indicata evidenziata */
.lic-var-bands { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: -2px; }
.band-lbl { font-size: 11.5px; color: var(--text-soft); }
.lic-var-bands .band-tbl { flex-basis: auto; margin: 0; }
.band-i { flex-direction: row; align-items: baseline; gap: 6px; padding: 4px 9px; }
.band-i.is-cur { background: var(--ty-term-bg); border-color: var(--ty-term); color: var(--ty-term); }
.band-i.is-cur b { color: var(--ty-term); }
.price.is-range { font-size: 15px; }
.lic-mini-flex:empty { display: none; }
.lic-mini-flex .flex-box { margin: 12px 0 4px; }
.lic-var-a code { overflow-wrap: anywhere; }
/* v1.14 · logo con simbolo + nome (Canonical) nel pannello: non si sovrappone al testo */
.lic-mini-brand-logo { flex: none; }
.lic-mini-brand-logo .brand-lockup.is-mark { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.lic-mini-brand-logo .brand-lockup.is-mark img { height: 16px; width: 16px; }

/* ==========================================================================
   v1.17  Card brand allineate e loghi a peso visivo uniforme
   ========================================================================== */
/* card della stessa riga alla stessa altezza; tag e "Inizia" sempre sulla stessa linea */
.lic-brand-grid { align-items: stretch; }
@media (min-width: 1100px) { .lic-brand-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.lic-brand-card .bmeta { min-height: calc(2 * 1.5em); line-height: 1.5; }
.lic-brand-card .btag { margin-top: auto; }
.lic-brand-card .bcta { margin-top: var(--s1); }
/* area logo: altezza fissa, logo centrato in verticale e allineato a sinistra */
.lic-brand-logo { height: 52px; min-height: 52px; margin-bottom: var(--s2); }
.lic-brand-logo img.brand-logo { height: 30px; max-width: 100%; }
.lic-brand-logo img.brand-logo[alt="Omnissa"] { height: 26px; }
.lic-brand-logo img.brand-logo[alt="Veeam"]   { height: 38px; }
.lic-brand-logo .brand-lockup { font-size: 25px; }
.lic-brand-logo .brand-lockup.is-mark img.brand-logo { height: 1.5em; }
:root[data-theme="dark"] .lic-brand-logo { height: 52px; box-sizing: border-box; }
/* fascia loghi sopra la hero */
.brands-list .brand-strip-pick { min-height: 34px; }
img.brand-logo-strip[alt="Omnissa"] { height: 20px; }
img.brand-logo-strip[alt="Veeam"]   { height: 28px; }
.brands-list .brand-lockup { font-size: 18px; }
/* chip e pannelli piccoli */
img.brand-logo-chip[alt="Veeam"] { height: 24px; }
img.brand-logo-chip[alt="Omnissa"] { height: 18px; }
.guide-brand-logo img[alt="Veeam"] { max-height: 30px; }
:root[data-theme="dark"] .lic-brand-logo { width: 200px; max-width: 100%; }
:root[data-theme="dark"] .lic-brand-card .btag.go { color: #a7f3d0; background: rgba(52,211,153,.14); }
/* PDF: marchio + nome per i brand con logo a pittogramma (Canonical) */
.pdf-title-lockup { display: inline-flex; align-items: center; gap: 2.5mm; align-self: center; font-family: var(--sans); font-weight: 700; font-size: 17pt; letter-spacing: -.01em; color: #1f2430; white-space: nowrap; }
.pdf-title-lockup img { height: 12mm; width: auto; }
.pdf-title-brand[alt="Veeam"] { height: 12mm; }
/* mobile: brand in griglia 2x2 compatta, stesse altezze */
@media (max-width: 720px) {
  .lic-brand-grid .lic-brand-card:not(.is-soon) { grid-column: auto; }
  .lic-brand-card { padding: var(--s4); min-height: 0; }
  .lic-brand-logo { height: 40px; min-height: 40px; margin-bottom: 0; }
  .lic-brand-logo img.brand-logo { height: 24px; }
  .lic-brand-logo img.brand-logo[alt="Omnissa"] { height: 18px; }
  .lic-brand-logo img.brand-logo[alt="Veeam"] { height: 28px; }
  .lic-brand-logo .brand-lockup { font-size: 16px; }
  .lic-brand-card .bmeta { font-size: var(--t-xs); min-height: calc(4 * 1.45em); line-height: 1.45; }
  .lic-brand-card .btag { display: none; }
  .lic-brand-card .bcta { margin-top: auto; }
  :root[data-theme="dark"] .lic-brand-logo { width: 100%; height: 40px; padding: 6px 10px; }
}
.guide-brand-logo .brand-lockup { font-size: 13px; }
/* TrendAI: logo ufficiale (PNG) */
.lic-brand-logo img.brand-logo[alt="TrendAI"] { height: 28px; }
img.brand-logo-strip[alt="TrendAI"] { height: 22px; }
img.brand-logo-chip[alt="TrendAI"] { height: 18px; }
.pdf-title-brand[alt="TrendAI"] { height: 9mm; }
@media (max-width: 720px) { .lic-brand-logo img.brand-logo[alt="TrendAI"] { height: 22px; } }

/* ==========================================================================
   v1.18  Ricomincia, notifica con Annulla, rifiniture UX
   ========================================================================== */
/* notifica con azione: testo + pulsante "Annulla" ben distinto */
.toast.has-act { display: flex; align-items: center; gap: 14px; cursor: default; }
.toast .toast-msg { flex: 1 1 auto; min-width: 0; }
.toast .toast-act {
  flex: none; appearance: none; border: 1px solid rgba(255,255,255,.28); background: transparent; color: #6ee7b7;
  font: inherit; font-weight: 700; font-size: 13px; padding: 6px 12px; border-radius: 8px; cursor: pointer;
  transition: background var(--t-1, .15s), border-color var(--t-1, .15s);
}
.toast .toast-act:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.45); }
.toast .toast-act:focus-visible { outline: 2px solid #6ee7b7; outline-offset: 2px; }
/* Ricomincia nell'intestazione: un po' piu' leggibile delle altre voci, mai rosso */
.mh-reset { color: rgba(255,255,255,.78) !important; }
.mh-reset svg { opacity: .85; transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.mh-reset:hover svg { transform: rotate(-200deg); }
@media (prefers-reduced-motion: reduce) { .mh-reset:hover svg { transform: none; } }
/* mobile: il logo riporta gia' al portale, liberiamo spazio per Ricomincia */
@media (max-width: 720px) { .mh-portal { display: none !important; } }
/* i pannelli non finiscono sotto l'intestazione fissa quando ci si scorre sopra */
.lic-panel, #panelBrand, #panelCompose, #panelReview, #results, #guida { scroll-margin-top: 84px; }
/* piede del riquadro vuoto: niente striscia grigia */
.lic-mini-foot:empty { display: none; }
/* "Come si acquista <brand>": spiegazione breve, chiusa di default */
.lic-howto { margin: var(--s3) 0 var(--s5); border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.lic-howto > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: inherit; }
.lic-howto > summary::-webkit-details-marker { display: none; }
.lic-howto > summary:hover { background: var(--paper-2); }
.lic-howto > summary:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
.lic-howto-ico { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--teal-050); color: var(--teal-700); flex: none; }
.lic-howto-ico svg { width: 17px; height: 17px; }
.lic-howto-t { font-weight: 650; color: var(--ink); }
.lic-howto-s { font-size: var(--t-xs); color: var(--text-soft); }
.lic-howto-chev { width: 16px; height: 16px; margin-left: auto; color: var(--text-soft); transition: transform .2s cubic-bezier(.2,.7,.2,1); }
.lic-howto[open] .lic-howto-chev { transform: rotate(180deg); }
.lic-howto-list { list-style: none; margin: 0; padding: 4px 16px 14px 54px; display: grid; gap: 8px; animation: howtoIn .22s cubic-bezier(.2,.7,.2,1); }
.lic-howto-list li { font-size: var(--t-sm); line-height: 1.5; color: var(--text); }
.lic-howto-k { color: var(--ink); font-weight: 650; }
.lic-howto-k::after { content: ": "; }
@keyframes howtoIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .lic-howto-list { animation: none; } .lic-howto-chev { transition: none; } }
@media (max-width: 720px) {
  .lic-howto-s { display: none; }
  .lic-howto-list { padding-left: 16px; }
}
:root[data-theme="dark"] .lic-howto-ico { background: rgba(52,211,153,.14); color: #a7f3d0; }
/* card brand: esigenza in chiaro, prodotti in piccolo */
.lic-brand-card .bneed { font-size: var(--t-sm); font-weight: 650; color: var(--ink); line-height: 1.4; min-height: calc(2 * 1.4em); }
.lic-brand-card .bmeta { font-size: var(--t-xs); min-height: 0; }
@media (max-width: 720px) {
  .lic-brand-card .bneed { font-size: var(--t-xs); min-height: calc(3 * 1.4em); }
  .lic-brand-card .bmeta { display: none; }
}
.lic-brand-card .bmeta { min-height: calc(2 * 1.5em); }
/* tutti i brand sono disponibili: il bollino "Disponibile" e' rumore */
.lic-brand-card .btag.go { display: none; }
.lic-brand-card:not(.is-soon) .bcta { margin-top: auto; padding-top: var(--s2); }
:root[data-theme="dark"] .lic-brand-card .bcta { color: #6ee7b7; }
.lic-howto-list { max-width: 110ch; }
.lic-brand-grid.is-enter .lic-brand-card { animation: animIn .34s cubic-bezier(.2,.7,.2,1) both; }
.lic-brand-grid.is-enter .lic-brand-card:nth-child(2) { animation-delay: .05s; }
.lic-brand-grid.is-enter .lic-brand-card:nth-child(3) { animation-delay: .10s; }
.lic-brand-grid.is-enter .lic-brand-card:nth-child(4) { animation-delay: .15s; }
/* tema scuro: link e azioni testuali leggibili sul fondo navy */
:root[data-theme="dark"] .link-btn, :root[data-theme="dark"] .lic-panel a:not(.btn), :root[data-theme="dark"] .gen-why .link-btn { color: #6ee7b7; text-decoration-color: rgba(110,231,183,.5); }
.lic-grp-d { margin: 6px 0 0; font-size: var(--t-sm); line-height: 1.5; color: var(--text); max-width: 78ch; }
/* descrizioni lunghe (es. servizi Canonical): 3 righe con "Leggi tutto" */
.lic-grp-dx { margin-top: 6px; }
.lic-grp-dx .lic-grp-d { margin: 0; }
.lic-grp-d.is-clamp { display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lic-grp-d.is-clamp.is-open { -webkit-line-clamp: unset; line-clamp: unset; display: block; overflow: visible; }
.lic-readmore { margin-top: 4px; font-size: var(--t-xs); }
/* prezzo su quotazione con prezzo indicativo */
.price .price-why { display: inline-block; margin-top: 4px; font-size: var(--t-xs); font-weight: 600; }
#quoteSheet .qs-price { margin: var(--s3) 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper-2); display: grid; gap: 2px; }
#quoteSheet .qs-price span { font-size: var(--t-xs); font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--text-soft); }
#quoteSheet .qs-price b { font-size: var(--t-lg); color: var(--ink); font-weight: 700; }
#quoteSheet .qs-price small { font-size: var(--t-xs); color: var(--text-soft); }
#quoteSheet #qsText p { margin: 0 0 8px; font-size: var(--t-sm); line-height: 1.55; color: var(--text); }
#quoteSheet .qs-note { color: var(--text-soft) !important; }
#quoteSheet .dlg-head { position: relative; }
#quoteSheet .dlg-close { position: absolute; top: 0; right: 0; }
/* loghi in alto: link al sito del produttore, con freccia "esterno" discreta */
.brand-strip-link { position: relative; text-decoration: none; gap: 6px; padding: 4px 6px; border-radius: 6px; transition: background .18s ease; }
.brand-strip-link:hover { background: rgba(11,19,41,.04); text-decoration: none; }
.brand-strip-link .brand-ext { width: 12px; height: 12px; color: var(--text-soft); opacity: 0; transform: translate(-2px, 2px); transition: opacity .18s ease, transform .18s ease; }
.brand-strip-link:hover .brand-ext, .brand-strip-link:focus-visible .brand-ext { opacity: 1; transform: none; }
@media (hover: none) { .brand-strip-link .brand-ext { opacity: .7; transform: none; } }
@media (prefers-reduced-motion: reduce) { .brand-strip-link .brand-ext { transition: none; } }
/* variante accanto al nome (es. livello di supporto) */
.lic-line-va { font-size: var(--t-xs); color: var(--teal-700); font-weight: 600; margin-top: 1px; }
.rl-va { display: inline-block; margin-left: 4px; font-size: var(--t-xs); font-weight: 600; color: var(--teal-700); }
#printArea .it-v { font-weight: 600; color: var(--pdf-teal-700, #047857); font-size: .9em; }
/* PDF "Come procedere": numero e testo non si sovrappongono */
#printArea .order-step { grid-template-columns: auto 1fr; column-gap: 8px; }
#printArea .order-step .os-n { width: auto; min-width: 26px; }
:root[data-theme="dark"] .lic-line-va, :root[data-theme="dark"] .rl-va { color: #6ee7b7; }
/* titolo hero: tre righe equilibrate ("Il software per la tua / amministrazione, / pronto per l'offerta") */
.hero-copy h1#heroH1 { max-width: 21ch; text-wrap: balance; }
/* tablet: brand in 2x2, niente card orfana */
@media (min-width: 721px) and (max-width: 1099px) { .lic-brand-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* a capo: niente parole orfane in fondo a paragrafi ed elenchi; titoli bilanciati */
p, li, dd, .lic-grp-d, .bmeta, .bneed, .lede, .field-help, .lic-vincoli { text-wrap: pretty; }
h1, h2, h3, h4, .kicker { text-wrap: balance; }
/* mobile: loghi in alto su una griglia 2x2 ordinata */
@media (max-width: 720px) {
  .brands-list { display: grid !important; grid-template-columns: 1fr 1fr; gap: 14px 12px; justify-items: center; align-items: center; }
  .brands-list .brands-sep { display: none !important; }
  .brands-list .brands-item { display: flex; justify-content: center; width: 100%; }
}
/* i link-pulsante seguono l'allineamento del testo che li contiene (niente righe centrate a capo) */
.link-btn { text-align: inherit; }
@media (max-width: 720px) {
  /* riepilogo: "unita' totali" uguale alla quantita' non si ripete su mobile */
  #reviewList .lic-review-line .rl-dup { display: none; }
  #reviewList .lic-review-line { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  /* azioni sul documento: etichette su una riga */
  .issue-secondary .btn { white-space: nowrap; font-size: 13px; padding-left: 8px; padding-right: 8px; }
}
/* link alle schede ufficiali dei prodotti (Veeam) */
.doc-link { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-xs); font-weight: 600; color: var(--teal-700); text-decoration: none; border-bottom: 1px solid rgba(4,120,87,.28); padding-bottom: 1px; }
.doc-link:hover { border-bottom-color: currentColor; }
.doc-link svg { width: 13px; height: 13px; flex: none; }
.guide-opt-wrap { display: grid; gap: 6px; }
.guide-opt-wrap .doc-link { justify-self: start; margin-left: 52px; }
.guide-doc { margin: 0 0 12px; }
.lic-grp-h .doc-link { margin: 2px 0 6px; }
:root[data-theme="dark"] .doc-link { color: #6ee7b7; border-bottom-color: rgba(110,231,183,.4); }
@media (max-width: 720px) { .guide-opt-wrap .doc-link { margin-left: 4px; } }

/* v1.22 Veeam: prezzo per istanza sotto il prezzo del pacchetto, email per l'attivazione */
.price small.price-per { color: var(--teal-700); font-weight: 600; margin-top: 1px; }
.act-box[hidden] { display: none !important; }
.act-box .act-hint { margin: -6px 0 14px; font-size: 13px; line-height: 1.5; color: var(--text-soft); max-width: 62ch; }
.act-box legend .req { margin-left: 2px; }
[data-theme="dark"] .price small.price-per { color: #6ee7b7; }

/* v1.23 schede tecniche ufficiali in evidenza: banner, pulsantino e richiamo nel percorso guidato */
.doc-banner {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px;
  margin: 12px 0 14px; padding: 14px 16px;
  background: var(--tint); border: 1px solid var(--teal-200); border-left: 3px solid var(--teal-600); border-radius: 12px;
  color: var(--ink); text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.doc-banner:hover { transform: translateY(-1px); box-shadow: 0 6px 18px -10px rgba(4,120,87,.45); border-color: var(--teal-600); }
.doc-banner:focus-visible { outline: 2px solid var(--teal-600); outline-offset: 2px; }
.doc-banner-ico { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--paper); border: 1px solid var(--teal-200); color: var(--teal-700); flex: none; }
.doc-banner-ico svg { width: 22px; height: 22px; }
.doc-banner-txt { display: grid; gap: 1px; min-width: 0; }
.doc-banner-k { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--teal-700); }
.doc-banner-txt b { font-size: 15px; font-weight: 650; color: var(--ink); line-height: 1.3; }
.doc-banner-s { font-size: 12.5px; color: var(--text-soft); line-height: 1.45; }
.doc-banner-go { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; background: var(--teal-600); color: #fff; font-size: 13px; font-weight: 650; white-space: nowrap; }
.doc-banner:hover .doc-banner-go { background: var(--teal-700); }
.doc-ext { width: 13px; height: 13px; flex: none; }
.doc-banner.is-compact { margin: 8px 0 10px; padding: 10px 12px; gap: 12px; }
.doc-banner.is-compact .doc-banner-ico { width: 34px; height: 34px; }
.doc-banner.is-compact .doc-banner-ico svg { width: 19px; height: 19px; }
.doc-banner.is-compact .doc-banner-txt b { font-size: 14px; }
.doc-banner.is-compact .doc-banner-go { padding: 6px 12px; font-size: 12.5px; }
.lic-grp-h .doc-banner { max-width: 620px; }

.doc-pill {
  justify-self: start; display: inline-flex; align-items: center; gap: 7px;
  margin-left: 52px; padding: 6px 12px 6px 10px; border-radius: 999px;
  background: var(--tint); border: 1px solid var(--teal-200); color: var(--teal-700);
  font-size: 12.5px; font-weight: 550; text-decoration: none; transition: background .15s ease, border-color .15s ease;
}
.doc-pill > svg:first-child { width: 16px; height: 16px; flex: none; }
.doc-pill b { font-weight: 700; }
.doc-pill:hover { background: var(--teal-100); border-color: var(--teal-600); }
.doc-pill:focus-visible { outline: 2px solid var(--teal-600); outline-offset: 2px; }
.guide-opt-wrap { gap: 8px; }

.doc-hint { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; background: var(--tint); border: 1px dashed var(--teal-200); font-size: 13px; line-height: 1.5; color: var(--text); }
.doc-hint .doc-banner-ico { width: 34px; height: 34px; }
.doc-hint .doc-banner-ico svg { width: 19px; height: 19px; }
.doc-hint b { color: var(--ink); }

#licHowtoList a[target="_blank"] { display: inline-flex; align-items: center; gap: 4px; margin-left: 4px; padding: 1px 9px; border-radius: 999px; background: var(--tint); border: 1px solid var(--teal-200); color: var(--teal-700); font-weight: 650; font-size: .92em; text-decoration: none; white-space: nowrap; }
#licHowtoList a[target="_blank"]::after { content: "\2197"; font-size: .9em; }
#licHowtoList a[target="_blank"]:hover { background: var(--teal-100); }

:root[data-theme="dark"] .doc-banner { border-color: rgba(52,211,153,.35); border-left-color: var(--mint); }
:root[data-theme="dark"] .doc-banner-k, :root[data-theme="dark"] .doc-pill, :root[data-theme="dark"] .doc-banner-ico, :root[data-theme="dark"] #licHowtoList a[target="_blank"] { color: #6ee7b7; }
:root[data-theme="dark"] .doc-banner-ico { background: var(--paper-3); border-color: rgba(52,211,153,.35); }
:root[data-theme="dark"] .doc-banner-go { background: var(--teal-700); }
:root[data-theme="dark"] .doc-pill, :root[data-theme="dark"] .doc-hint, :root[data-theme="dark"] #licHowtoList a[target="_blank"] { border-color: rgba(52,211,153,.35); }

@media (max-width: 720px) {
  .doc-banner { grid-template-columns: auto 1fr; }
  .doc-banner-go { grid-column: 1 / -1; justify-self: start; }
  .doc-banner.is-compact .doc-banner-s { display: none; }
  .doc-pill { margin-left: 4px; }
}
@media (prefers-reduced-motion: reduce) { .doc-banner, .doc-banner:hover { transition: none; transform: none; } }

/* v1.25 stima dei crediti TrendAI Flex */
.flex-cta { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; margin: 0 0 16px; padding: 14px 16px; border-radius: 12px; background: var(--tint); border: 1px solid var(--teal-200); border-left: 3px solid var(--teal-600); }
.flex-cta[hidden] { display: none !important; }
.flex-cta-txt { display: grid; gap: 2px; font-size: 13px; color: var(--text); line-height: 1.45; }
.flex-cta-txt b { font-size: 15px; color: var(--ink); font-weight: 650; }
.flex-cta .btn { white-space: nowrap; }
.flex-calc { margin: 8px 0 0; font-size: 13px; }
.dlg-flex .dlg-box { max-width: 900px; }
.fc-help { margin: 6px 0 0; font-size: 14px; color: var(--text-soft); line-height: 1.5; max-width: 70ch; }
.fc-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.fc-dur { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.fc-dur > span { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-soft); margin-right: 4px; }
.fc-chip { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface-elevated); color: var(--text); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .15s ease, border-color .15s ease; }
.fc-chip:hover { border-color: var(--teal-600); }
.fc-chip.is-on { background: var(--tint); border-color: var(--teal-600); color: var(--teal-700); }
.fc-chip:focus-visible { outline: 2px solid var(--teal-600); outline-offset: 2px; }
.fc-grp { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px 6px; margin: 0 0 12px; }
.fc-grp legend { padding: 0 6px; font-size: 13px; font-weight: 700; color: var(--ink); }
.fc-ghelp { margin: 0 0 8px; font-size: 12.5px; color: var(--text-soft); line-height: 1.45; }
.fc-row { display: grid; grid-template-columns: minmax(0, 1fr) 110px 110px; gap: 12px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line); }
.fc-grp .fc-row:first-of-type { border-top: 0; }
.fc-row label { display: grid; gap: 1px; min-width: 0; }
.fc-row label b { font-size: 14px; font-weight: 600; color: var(--ink); }
.fc-row label span { font-size: 12px; color: var(--text-soft); }
.fc-row input { text-align: right; }
.fc-sub { font-size: 12.5px; color: var(--teal-700); font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.fc-out { position: sticky; top: 0; }
.fc-res { display: grid; gap: 8px; padding: 16px; border-radius: 12px; background: var(--tint); border: 1px solid var(--teal-200); }
.fc-res.is-empty { color: var(--text-soft); font-size: 13px; }
.fc-res.is-empty b { color: var(--ink); font-size: 14px; }
.fc-res-row { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--text); }
.fc-res-row b { color: var(--ink); font-variant-numeric: tabular-nums; text-align: right; }
.fc-tot { margin-top: 4px; padding-top: 10px; border-top: 1px solid var(--teal-200); font-size: 15px; }
.fc-tot b { font-size: 18px; }
.fc-res-code { display: grid; gap: 2px; font-size: 12px; color: var(--text-soft); }
.fc-res-code code { font-size: 12px; color: var(--ink); word-break: break-all; }
.fc-note { margin: 0; font-size: 12px; color: var(--text-soft); line-height: 1.45; }
.fc-foot { display: flex; flex-wrap: wrap; gap: 10px; }
:root[data-theme="dark"] .fc-sub, :root[data-theme="dark"] .fc-chip.is-on { color: #6ee7b7; }
:root[data-theme="dark"] .flex-cta, :root[data-theme="dark"] .fc-res { border-color: rgba(52,211,153,.35); }
@media (max-width: 760px) {
  .fc-grid { grid-template-columns: 1fr; }
  .fc-out { position: static; }
  .fc-row { grid-template-columns: minmax(0, 1fr) 92px; }
  .fc-sub { grid-column: 1 / -1; text-align: left; margin-top: -4px; }
  .flex-cta { grid-template-columns: auto 1fr; }
  .flex-cta .btn { grid-column: 1 / -1; justify-self: start; }
}
.fc-foot { align-items: center; }
.fc-sum { margin: 0 auto 0 0; display: grid; gap: 1px; font-size: 12px; color: var(--text-soft); }
.fc-sum b { font-size: 15px; color: var(--ink); font-variant-numeric: tabular-nums; }
.fc-tot span { white-space: nowrap; }
@media (max-width: 760px) { .fc-sum { flex: 1 1 100%; } .fc-foot .btn { flex: 1 1 auto; } }

/* v1.26 brand "In arrivo": il badge resta visibile anche su tablet e mobile */
.lic-brand-card.is-soon .btag { display: inline-flex !important; margin-top: auto; align-self: flex-start; }