/* Nitido · pagine «preventivi» nel design editoriale. Un file per gruppo di pagine, caricato dopo nitido.css (vedi _pagine_css.html).
   Solo token di colore di nitido.css, classi con lo scope della pagina.

   Pagine: l'elenco (quotes_list.html, come le Richieste della tavola 05), il nuovo preventivo (quote_new.html)
   e la pagina del preventivo (quote_edit.html, come la scheda della coppia e il modulo delle Richieste); i pezzi
   comuni sono in _preventivi.html. Riusa le classi della sezione 14 di nitido.css (nx-sh, nx-dek, nx-eb,
   nx-thumb, nx-name, nx-meta, nx-warm, nx-ul, nx-lead, nx-mast, nx-rule2) con le scelte di Francesco
   1A 2A 3A 4B: angoli, ombre e margini di oggi; un solo bottone vino pieno per schermata (Crea, Salva o Nuovo).

   Indice: 1. Comuni  2. Elenco  3. Nuovo preventivo  4. Pagina del preventivo  5. Larghezze intermedie
           6. Telefono  7. Passaggio del mouse */

/* ───────────────────────── 1. Comuni ───────────────────────── */
/* il ponte Bootstrap, solo qui: niente margini di p/ul/titoli, link senza sottolineatura, grassetto 500 */
:where(.nx-prev) :is(p, ul, ol, figure, h1, h2, h3, fieldset) { margin: 0; }
:where(.nx-prev) :is(ul, ol) { padding: 0; list-style: none; }
:where(.nx-prev) fieldset { padding: 0; border: 0; min-width: 0; }
:where(.nx-prev) a:not(.nx-btn) { color: inherit; text-decoration: none; }
.nx-prev :is(b, strong) { font-weight: 500 !important; }
.nx-prev .nx-st { height: auto; line-height: 1.35; }
.nx-prev .nx-name a { color: inherit; }
.nx-prev .nx-thumb > .nx-i { width: 18px; height: 18px; }

/* testata: titolo serif grande (come il saluto di Oggi), la frase sotto, a destra un'azione */
.nx-prev-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 40px; flex-wrap: wrap; margin: 8px 0 30px; }
.nx-prev-head-t { flex: 1 1 520px; min-width: 0; }
.nx-prev-head-t > .nx-eb { margin-bottom: 12px; }
.nx-prev-title { margin: 0; font: 400 var(--nx-t-hello)/1.02 var(--nx-f-serif); letter-spacing: -.024em; color: var(--nx-ink); text-wrap: balance; overflow-wrap: anywhere; }
.nx-prev-head .nx-dek { margin-top: 14px; max-width: 70ch; }
.nx-prev-head > .nx-ul, .nx-prev-head > .nx-btn { margin-bottom: 4px; }

/* bottoni a icona delle righe (PDF, «⋯», elimina) */
.nx-prev-ib {
  display: inline-grid; place-items: center; flex: none; width: 36px; height: 36px; padding: 0; border: 0; border-radius: var(--nx-r);
  color: var(--nx-ink2); background: var(--nx-wall); box-shadow: inset 0 0 0 1px var(--nx-line); cursor: pointer; list-style: none;
  transition: box-shadow .15s, color .15s, background .15s;
}
.nx-prev-ib .nx-i { width: 17px; height: 17px; }
.nx-prev-ib::-webkit-details-marker { display: none; }
.nx-prev-pdf { display: inline-flex; align-items: center; gap: 6px; width: auto; padding: 0 12px 0 10px; font: 600 11.5px/1 var(--nx-f-ui); letter-spacing: .06em; color: var(--nx-ink); }
.nx-prev-pdf .nx-i { width: 15px; height: 15px; color: var(--nx-ink2); }

/* il menu «⋯» di una riga, in vetro bianco */
.nx-prev-menu { position: relative; }
.nx-prev-menu > summary { box-shadow: none; }
.nx-prev-menu[open] > summary { background: var(--nx-grey); color: var(--nx-ink); }
.nx-prev-row:has(.nx-prev-menu[open]) { z-index: 5; }
.nx-prev-pop {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; display: flex; flex-direction: column; min-width: 240px; padding: 6px;
  border-radius: 14px; background: rgba(255, 255, 255, .97); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  box-shadow: var(--nx-sh-float);
}
.nx-prev-pop form { margin: 0; }
.nx-prev-pop > a, .nx-prev-pop form > button {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 0 12px; border: 0; border-radius: 9px; background: none;
  font: 500 13.5px/1.2 var(--nx-f-ui); color: var(--nx-ink); text-align: left; white-space: nowrap; cursor: pointer;
}
.nx-prev-pop .nx-i { color: var(--nx-ink2); }
.nx-prev-pop .is-danger, .nx-prev-pop .is-danger .nx-i { color: var(--nx-wine); }
/* «Elimina» spento: il contratto è stato mandato da firmare (il motivo intero nel title) */
.nx-prev-nodel {
  display: flex; align-items: center; gap: 10px; max-width: 260px; min-height: 40px; margin: 0; padding: 8px 12px;
  font: 500 13px/1.3 var(--nx-f-ui); color: var(--nx-ink2); cursor: default;
}
.nx-prev-nodel .nx-i { flex: none; }

/* modulo: sezioni numerate come nelle Richieste */
.nx-prev-fsec { margin-top: 44px; min-width: 0; }
.nx-prev-f > .nx-prev-fsec:first-of-type, .nx-prev-fs > .nx-prev-fsec:first-child { margin-top: 8px; }
.nx-prev-fsec > .nx-sh { margin-bottom: 18px; }
.nx-prev-fsec .nx-sh-x { flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.nx-prev-fsec .nx-form-grid { gap: 20px; }
.nx-prev-grid { grid-auto-flow: row dense; }
.nx-prev-h3 { margin: 26px 0 14px; font: 600 var(--nx-t-eb)/1.35 var(--nx-f-ui); letter-spacing: var(--nx-eb-track); text-transform: uppercase; color: var(--nx-ink); }
.nx-prev-fsec > .nx-sh + .nx-prev-h3 { margin-top: 4px; }
.nx-prev-lnk { color: var(--nx-ink); font-weight: 500; text-decoration: underline; text-decoration-color: var(--nx-line); text-underline-offset: 3px; }

/* la barra di Crea / Salva: sempre a portata di mano mentre scorri */
.nx-prev-save {
  position: sticky; bottom: 16px; z-index: 12; display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
  margin-top: 40px; padding: 10px; border-radius: var(--nx-r-xl);
  background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  box-shadow: var(--nx-sh-float);
}
.nx-prev-save .nx-btn--primary { min-width: 220px; }
.nx-prev-save-n { margin-left: 8px; font-size: 13px; color: var(--nx-ink2); }

/* ───────────────────────── 2. Elenco (quotes_list.html) ───────────────────────── */
/* ogni riga è una griglia con le stesse colonne: monogramma · cliente · data · a che punto · totale · azioni */
.nx-prev-th, .nx-prev-row {
  display: grid; column-gap: 18px;
  grid-template-columns: 48px minmax(0, 1.45fr) minmax(0, .8fr) minmax(0, 1fr) 150px 96px;
  grid-template-areas: "th nm wh st vl ac";
}
.nx-prev-list .c-nm { grid-area: nm; min-width: 0; }
.nx-prev-list .c-wh { grid-area: wh; min-width: 0; }
.nx-prev-list .c-st { grid-area: st; min-width: 0; }
.nx-prev-list .c-vl { grid-area: vl; min-width: 0; text-align: right; }
.nx-prev-list .c-ac { grid-area: ac; display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.nx-prev-row > .nx-thumb { grid-area: th; }

.nx-prev-th { align-items: center; min-height: 48px; border-top: 2px solid var(--nx-rule-strong); border-bottom: 1px solid var(--nx-rule); }
.nx-prev-th > * {
  font: 600 var(--nx-t-eb)/1.35 var(--nx-f-ui); letter-spacing: var(--nx-eb-track); text-transform: uppercase; color: var(--nx-ink2); white-space: nowrap;
}

.nx-prev-sec { margin-top: 34px; }
.nx-prev-sec .nx-sh { margin-bottom: 4px; }
.nx-prev-sec .nx-sh .nx-mt { white-space: nowrap; }

.nx-prev-row { position: relative; align-items: center; min-height: 80px; padding: 13px 0; border-bottom: 1px solid var(--nx-rule); }
.nx-prev-row .nx-name { font-size: var(--nx-t-list); }
.nx-prev-row .nx-meta { margin-top: 3px; }
.nx-prev-date { font-size: 14px; font-weight: 500; color: var(--nx-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nx-prev-date.is-none { font-weight: 400; color: var(--nx-ink2); }
.nx-prev-row .c-st > .nx-meta { margin-top: 4px; }
.nx-prev-tot { white-space: nowrap; }
.nx-prev-tot .nx-amt { font-size: 15px; font-weight: 500; color: var(--nx-ink); }
.nx-prev-iva { font-size: 11.5px; font-weight: 500; color: var(--nx-ink2); }
.nx-prev-row .c-vl .nx-meta { margin-top: 2px; }

/* piede di pagina */
.nx-prev-foot { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 14px 40px; margin-top: 40px; }
.nx-prev-foot .nx-warm { max-width: 62ch; }
.nx-prev-count { margin-left: auto; font-size: 13px; color: var(--nx-ink2); }
.nx-prev-list .nx-empty { padding-top: 24px; }

/* ───────────────────────── 3. Nuovo preventivo (quote_new.html) ───────────────────────── */
.nx-prev-new { max-width: 1040px; }

/* per chi è: la coppia della richiesta collegata */
.nx-prev-for {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; column-gap: 16px; margin: -6px 0 36px; padding: 14px 0;
  border-top: 1px solid var(--nx-rule); border-bottom: 1px solid var(--nx-rule);
}
.nx-prev-for > p { font-size: 15px; line-height: 1.45; color: var(--nx-ink2); }
.nx-prev-for > p b { font: 400 20px/1.2 var(--nx-f-serif) !important; letter-spacing: -.006em; color: var(--nx-ink); }
.nx-prev-for-d { display: block; font-size: 13px; }
.nx-prev-brand1 { margin-top: 14px; }
.nx-prev-new .nx-prev-ro { margin: -8px 0 28px; }

/* il tipo: un elenco a scelta singola; quello scelto ha il segnalibro e apre il suo listino (senza script) */
.nx-prev-types { border-top: 1px solid var(--nx-rule); }
.nx-prev-type { position: relative; border-bottom: 1px solid var(--nx-rule); }
.nx-prev-type > input { position: absolute; left: 0; top: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.nx-prev-type-l { display: flex; align-items: center; gap: 14px; min-height: 60px; margin: 0; padding: 12px 0; cursor: pointer; }
.nx-prev-type-l::before {
  content: ""; flex: none; width: 18px; height: 18px; border-radius: 50%; background: var(--nx-wall);
  box-shadow: inset 0 0 0 1.5px var(--nx-ring); transition: box-shadow .15s;
}
.nx-prev-type-n { min-width: 0; font-size: 15px; font-weight: 500; color: var(--nx-ink); }
.nx-prev-type-m { margin-left: auto; padding-left: 12px; font-size: 13px; color: var(--nx-ink2); white-space: nowrap; }
.nx-prev-type > input:checked + .nx-prev-type-l::before { box-shadow: inset 0 0 0 5px var(--nx-ink); }
.nx-prev-type > input:focus-visible + .nx-prev-type-l { outline: 2px solid var(--nx-ink); outline-offset: 2px; border-radius: 6px; }
.nx-prev-type:has(> input:checked)::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: calc(-1 * var(--nx-hang)); width: var(--nx-mark); background: var(--nx-wine);
}
.nx-prev-panel { display: none; padding: 0 0 22px 32px; }
.nx-prev-type > input:checked ~ .nx-prev-panel { display: block; }
.nx-prev-brand { max-width: 320px; margin-bottom: 16px; }
.nx-prev-panel-hint { margin: 0 0 12px; max-width: 70ch; }
.nx-prev-panel .nx-none { margin-top: 0; }

/* le voci del listino: spunta, nome, puntini di guida, prezzo */
.nx-prev-pick { border-top: 1px solid var(--nx-rule); }
.nx-prev-pick li { display: flex; align-items: baseline; gap: 10px; min-width: 0; padding: 10px 0; border-bottom: 1px solid var(--nx-rule); }
.nx-prev-pick li:last-child { border-bottom: 0; }
.nx-prev-pick .nx-check { flex: 0 1 auto; min-width: 0; align-items: baseline; }
.nx-prev-pick .nx-check input { align-self: flex-start; margin-top: 1px; }
.nx-prev-pick-n { min-width: 0; font-size: 14px; color: var(--nx-ink); overflow-wrap: anywhere; }
.nx-prev-pick-n small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.4; color: var(--nx-ink2); }
.nx-prev-pick .nx-lead { min-width: 16px; }
.nx-prev-pick .nx-amt { flex: none; font-size: 14px; font-weight: 500; color: var(--nx-ink); }

/* ───────────────────────── 4. Pagina del preventivo (quote_edit.html) ───────────────────────── */
.nx-prev-edit { max-width: 1120px; }

/* testata: torna ai preventivi · numero · creazione; a destra marchio e stato */
.nx-prev-mast, .nx-prev-mast .nx-mast-l { align-items: center; }
.nx-prev-mast .nx-mast-r { align-items: center; gap: 14px; }
.nx-prev-back {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin: -12px 0;
  font-size: 13px; font-weight: 500; color: var(--nx-ink2); white-space: nowrap; transition: color .15s;
}
.nx-prev-back .nx-i { width: 14px; height: 14px; }
.nx-prev-tag {
  display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: var(--nx-r-pill); max-width: 240px;
  font-size: 12px; font-weight: 500; color: var(--nx-ink2); background: var(--nx-wall); box-shadow: inset 0 0 0 1px var(--nx-line);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* il cliente in serif, il tipo, quando e dove; a destra le azioni sul preventivo */
.nx-prev-hero { margin-top: 28px; }
.nx-prev-hero-t { min-width: 0; }
.nx-prev-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; margin-top: 14px; font-size: 15px; color: var(--nx-ink2); }
.nx-prev-sub span { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.nx-prev-sub b { color: var(--nx-ink); }
.nx-prev-sub .nx-i { color: var(--nx-ink2); }
.nx-prev-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 20px; }
.nx-prev-acts form { margin: 0; }
.nx-prev-pdfnote { margin-left: 8px; font-size: 12.5px; color: var(--nx-ink2); }
.nx-prev-ro { margin-top: 28px; }
.nx-prev-edit .nx-prev-f { margin-top: 36px; }

/* una voce: titolo e descrizione a sinistra; quantità, prezzo, tipo e giorno a destra; il cestino */
.nx-prev-lines { border-top: 1px solid var(--nx-rule); }
.nx-prev-line {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto 36px; column-gap: 16px; align-items: start;
  padding: 16px 0; border-bottom: 1px solid var(--nx-rule);
}
.ql-txt { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.nx-prev .ql-title { height: 42px; font-size: 15px; font-weight: 500; }
.nx-prev .ql-desc { min-height: 76px; font-size: 13.5px; }
.ql-nums { display: grid; grid-template-columns: 72px 124px 136px; gap: 10px; }
.ql-nums.has-day { grid-template-columns: 72px 124px 136px 176px; }
.ql-f { display: flex; flex-direction: column; min-width: 0; margin: 0; }
.ql-l { margin-bottom: 6px; font-size: 12px; font-weight: 500; line-height: 1.3; color: var(--nx-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nx-prev .ql-f .nx-input { height: 42px; font-variant-numeric: tabular-nums; }
.nx-prev .ql-f .nx-select { padding-left: 12px; padding-right: 30px; background-position: right 9px center; }
.ql-del { margin-top: 3px; }
/* un'alternativa e una facoltativa si riconoscono: filetto a sinistra e il loro nome nel menu */
.nx-prev-line:has(.js-kind option[value="option"]:checked)::before,
.nx-prev-line:has(.js-kind option[value="addon"]:checked)::before {
  content: ""; position: absolute; top: 16px; bottom: 16px; left: calc(-1 * var(--nx-hang)); width: var(--nx-mark); background: var(--nx-wait);
}
.nx-prev-line:has(.js-kind option[value="addon"]:checked)::before { background: repeating-linear-gradient(var(--nx-mute) 0 4px, transparent 4px 7px); }
.nx-prev-line:has(.js-kind option[value="option"]:checked) .js-kind { color: var(--nx-wait); font-weight: 500; }
.nx-prev-line:has(.js-kind option[value="addon"]:checked) .js-kind { color: var(--nx-ink2); font-weight: 500; }
.nx-prev-kinds { margin: -6px 0 16px; max-width: 86ch; }

/* aggiungi una voce: una riga tratteggiata a tutta larghezza */
.nx-prev-add {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 48px; margin-top: 14px; padding: 0 16px;
  border: 1px dashed var(--nx-line); border-radius: var(--nx-r-md); background: none;
  font: 500 13.5px/1 var(--nx-f-ui); color: var(--nx-ink2); cursor: pointer; transition: color .15s, border-color .15s, background .15s;
}

.nx-prev-addday { margin-top: 26px; }

/* un giorno: filetto pieno sopra, «Giorno 1» in serif, data, titolo, subtotale, cestino; poi le sue voci */
.nx-prev-day { margin-top: 30px; }
.nx-prev-day:first-child { margin-top: 6px; }
.qd-h {
  display: grid; grid-template-columns: minmax(96px, auto) 172px minmax(0, 1fr) auto 36px; grid-template-areas: "n date title sub del";
  align-items: center; column-gap: 14px; padding: 12px 0; border-top: 2px solid var(--nx-rule-strong); border-bottom: 1px solid var(--nx-rule);
}
.nx-prev .nx-prev-dn { grid-area: n; margin: 0; font: 400 22px/1.1 var(--nx-f-serif); letter-spacing: -.012em; color: var(--nx-ink); white-space: nowrap; }
.nx-prev .qd-date { grid-area: date; height: 42px; }
.nx-prev .qd-title { grid-area: title; height: 42px; font-weight: 500; }
.qd-sub { grid-area: sub; font-size: 15px; font-weight: 500; color: var(--nx-ink); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.qd-sub:empty { display: none; }
.qd-del { grid-area: del; }
.qd-acts { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 14px; }
.qd-acts .nx-btn { height: 36px; }

/* il listino del giorno: un riquadro grigio con le voci da spuntare */
.qd-cat { margin-top: 14px; padding: 16px 18px 14px; border-radius: 14px; background: var(--nx-grey); }
.qd-cat-h { display: flex; flex-direction: column; max-width: 360px; margin: 0; }
.nx-prev .qd-cat .nx-input { background-color: var(--nx-wall); }
.qd-cat .cat-items { margin-top: 12px; font-size: 13.5px; color: var(--nx-ink2); }
.nx-prev .qd-cat .form-check {
  display: flex; align-items: center; gap: 10px; min-height: 40px; margin: 0; padding: 6px 0; border-bottom: 1px solid var(--nx-rule);
}
.nx-prev .qd-cat .form-check:last-child { border-bottom: 0; }
.nx-prev .qd-cat .form-check .form-check-input {
  float: none; flex: none; width: 18px; height: 18px; margin: 0; border: 0; border-radius: 5px;
  background-color: var(--nx-wall); box-shadow: inset 0 0 0 1.5px var(--nx-ring); cursor: pointer;
}
.nx-prev .qd-cat .form-check .form-check-input:checked { background-color: var(--nx-ink); box-shadow: none; }
.nx-prev .qd-cat .form-check-label { min-width: 0; font-size: 14px; color: var(--nx-ink); cursor: pointer; overflow-wrap: anywhere; }
.qd-cat-a { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }

/* spese di trasferta: tre scelte; quella scelta ha il segnalibro e mostra i suoi campi */
.nx-prev-travel { border-top: 1px solid var(--nx-rule); }
.qt-opt { position: relative; border-bottom: 1px solid var(--nx-rule); }
.qt-choice { display: flex; align-items: flex-start; gap: 12px; min-height: 52px; margin: 0; padding: 15px 0 14px; font-size: 14px; line-height: 1.45; color: var(--nx-ink); cursor: pointer; }
.qt-radio {
  appearance: none; -webkit-appearance: none; flex: none; width: 18px; height: 18px; margin: 1px 0 0; border-radius: 50%;
  background: var(--nx-wall); box-shadow: inset 0 0 0 1.5px var(--nx-ring); cursor: pointer; transition: box-shadow .15s;
}
.qt-radio:checked { box-shadow: inset 0 0 0 5px var(--nx-ink); }
.qt-radio:focus-visible { outline: 2px solid var(--nx-ink); outline-offset: 2px; }
.qt-opt:has(.qt-radio:checked) .qt-choice { font-weight: 500; }
.qt-opt:has(.qt-radio:checked)::after { content: ""; position: absolute; top: 0; bottom: 0; left: calc(-1 * var(--nx-hang)); width: var(--nx-mark); background: var(--nx-wine); }
.qt-sub { padding: 0 0 18px 30px; }
.travel-studio { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 16px; }
@supports selector(:has(*)) {
  .qt-opt:not(:has(.qt-radio:checked)) .qt-sub { display: none; }
}
.nx-prev-hint { margin-top: 16px; }

/* il totale: le note sopra la barra, la cifra in serif nella barra con Salva */
.nx-prev-totnotes { margin-top: 28px; }
.nx-prev-totnotes .nx-hint { margin: 0; font-size: 13px; }
.nx-prev-totnotes .nx-hint + .nx-hint { margin-top: 4px; }
.nx-prev-save--tot { justify-content: space-between; margin-top: 14px; padding: 10px 10px 10px 22px; }
.qs-tot { display: flex; align-items: baseline; gap: 14px; min-width: 0; }
.qs-v { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 0; min-width: 0; }
.nx-prev #totalOut { font: 400 32px/1 var(--nx-f-serif); letter-spacing: -.025em; color: var(--nx-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.qs-vat { font-size: 13px; font-weight: 500; color: var(--nx-ink2); white-space: nowrap; }
.qs-acts { display: flex; flex-wrap: wrap; gap: 10px; }

/* chi legge soltanto: i campi bloccati, niente pulsanti per aggiungere o togliere */
.nx-prev-fs:disabled :is(.nx-prev-add, .qd-acts, .ql-del, .qd-del, .nx-sh-x .nx-btn) { display: none; }
.nx-prev-fs:disabled .qt-sub { display: block; }

/* ───────────────────────── 5. Larghezze intermedie ───────────────────────── */
@media (max-width: 1240px) and (min-width: 768px) {
  /* il totale sotto la data, così cliente e «a che punto» hanno spazio */
  .nx-prev-th, .nx-prev-row { grid-template-columns: 48px minmax(0, 1.4fr) minmax(0, .9fr) minmax(0, 1.1fr) 96px; grid-template-areas: "th nm wh st ac" "th nm vl st ac"; }
  .nx-prev-th { grid-template-areas: "th nm wh st ac"; }
  .nx-prev-th .c-vl { display: none; }
  .nx-prev-list .c-vl { text-align: left; }
  .nx-prev-row .nx-name { white-space: normal; }
  /* una voce: i numeri sotto il testo */
  .nx-prev-line { grid-template-columns: minmax(0, 1fr) 36px; grid-template-areas: "txt del" "nums nums"; row-gap: 12px; }
  .ql-txt { grid-area: txt; }
  .ql-nums.has-day { grid-area: nums; grid-template-columns: 90px repeat(3, minmax(0, 1fr)); }
  .ql-nums:not(.has-day) { grid-area: nums; grid-template-columns: 90px repeat(2, minmax(0, 1fr)); }
  .ql-del { grid-area: del; }
}
@media (max-width: 980px) and (min-width: 768px) {
  .nx-prev-th, .nx-prev-row { grid-template-columns: 44px minmax(0, 1.2fr) minmax(0, 1fr); grid-template-areas: "th nm st" "th wh ac" "th vl ac"; row-gap: 6px; }
  .nx-prev-th { grid-template-areas: "th nm st"; }
  .nx-prev-th .c-wh { display: none; }
  .nx-prev-list .c-ac { justify-content: flex-start; }
  .qd-h { grid-template-columns: minmax(0, 1fr) auto 36px; grid-template-areas: "n sub del" "date title title"; row-gap: 10px; }
}

/* ───────────────────────── 6. Telefono (375 e 320 px) ───────────────────────── */
@media (max-width: 767px) {
  .nx-prev-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin: 2px 0 20px; }
  .nx-prev-head-t > .nx-eb { margin-bottom: 8px; }
  .nx-prev-head .nx-dek { margin-top: 10px; }
  .nx-prev-head > .nx-btn { justify-self: start; height: 44px; margin: 18px 0 0; font-size: 14px; }
  .nx-prev-head > .nx-ul { justify-self: start; margin-top: 16px; }

  /* elenco: niente tabella; ogni preventivo è una scheda: monogramma e cliente, data e totale, stato e azioni */
  .nx-prev-th { display: none; }
  .nx-prev-row {
    grid-template-columns: 40px minmax(0, 1fr) auto; column-gap: 12px; row-gap: 4px; align-items: start; min-height: 0; padding: 14px 0 12px;
    grid-template-areas: "th nm nm" "th wh vl" ". st ac";
  }
  .nx-prev-row > .nx-thumb { width: 40px; height: 40px; }
  .nx-prev-row .nx-thumb-m { font-size: 14px; }
  .nx-prev-row .nx-name { white-space: normal; font-size: var(--nx-t-list); line-height: 1.2; }
  .nx-prev-luogo { display: none; }
  .nx-prev-list .c-wh { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; padding-top: 4px; }
  .nx-prev-list .c-wh .nx-meta { margin: 0; }
  .nx-prev-date { font-size: 13.5px; }
  .nx-prev-list .c-vl { padding-top: 4px; }
  .nx-prev-tot .nx-amt { font-size: 14px; }
  .nx-prev-list .c-st { align-self: center; padding-top: 6px; }
  .nx-prev-list .c-ac { align-self: center; gap: 4px; padding-top: 6px; }
  .nx-prev-ib { width: 44px; height: 44px; }
  .nx-prev-pdf { width: auto; padding: 0 14px 0 12px; }
  .nx-prev-pop { min-width: 230px; }
  .nx-prev-pop > a, .nx-prev-pop form > button { min-height: 44px; }
  .nx-prev-sec { margin-top: 28px; }
  .nx-prev-nota { display: none; }
  .nx-prev .nx-sh .nx-mt { white-space: normal; text-align: right; }
  .nx-prev .nx-sh-t { white-space: normal; }
  .nx-prev-foot { flex-direction: column; gap: 14px; margin-top: 32px; }
  .nx-prev-count { margin-left: 0; }
  .nx-prev .nx-empty .nx-btn { height: 44px; }

  /* moduli: un campo per riga, i campi brevi (nx-half) a due a due */
  .nx-prev-fsec { margin-top: 36px; }
  .nx-prev-fsec .nx-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
  .nx-prev-fsec .nx-form-grid > .nx-field { grid-column: 1 / -1; }
  .nx-prev-fsec .nx-form-grid > .nx-field.nx-half { grid-column: auto; }
  .nx-prev-fsec .nx-sh { grid-template-columns: auto auto minmax(16px, 1fr); }
  .nx-prev-fsec .nx-sh > .nx-sh-x { grid-column: 1 / -1; justify-content: flex-start; margin-top: 10px; }
  .nx-prev-fsec .nx-sh > .nx-sh-x .nx-mt { text-align: left; }
  .nx-prev-fsec .nx-sh-x .nx-btn { height: 44px; }
  .nx-prev-save { bottom: calc(76px + env(safe-area-inset-bottom)); margin-top: 32px; }
  .nx-prev-save .nx-btn { flex: 1 1 auto; min-width: 0; height: 48px; }
  .nx-prev-save .nx-btn--primary { flex: 2 1 auto; min-width: 0; }
  .nx-prev-save-n { display: none; }                       /* la barra resta bassa: la frase è già nella testata */

  /* nuovo preventivo */
  .nx-prev-for { grid-template-columns: 40px minmax(0, 1fr); row-gap: 8px; }
  .nx-prev-for > .nx-thumb { width: 40px; height: 40px; }
  .nx-prev-for > .nx-ul { grid-column: 2; justify-self: start; }
  .nx-prev-for > p b { font-size: 18px !important; }
  .nx-prev-type-l { min-height: 56px; align-items: flex-start; flex-wrap: wrap; row-gap: 2px; }
  .nx-prev-type-l::before { margin-top: 1px; }
  .nx-prev-type-n { flex: 1 1 0; }
  .nx-prev-type-m { flex-basis: 100%; margin-left: 32px; padding-left: 0; }
  .nx-prev-panel { padding: 0 0 18px; }
  .nx-prev-brand { max-width: none; }
  .nx-prev-pick li { align-items: center; padding: 4px 0; }
  .nx-prev-pick .nx-check { flex: 1 1 auto; min-height: 44px; align-items: center; }
  .nx-prev-pick .nx-check input { align-self: center; margin-top: 0; }
  .nx-prev-pick .nx-lead { display: none; }
  .nx-prev-pick .nx-amt { padding-left: 8px; font-size: 13.5px; }

  /* pagina del preventivo */
  .nx-prev-mast { flex-wrap: wrap; row-gap: 6px; }
  .nx-prev-mast .nx-mast-r { gap: 10px; flex-wrap: wrap; }
  .nx-prev-hero { margin-top: 18px; }
  .nx-prev-sub { margin-top: 10px; font-size: 14px; gap: 4px 14px; }
  .nx-prev-acts { margin-top: 16px; }
  .nx-prev-acts .nx-btn { height: 44px; }
  .nx-prev-pdfnote { flex-basis: 100%; margin: 2px 0 0; }
  .nx-prev-edit .nx-prev-f { margin-top: 28px; }

  .nx-prev-line { grid-template-columns: minmax(0, 1fr) 44px; grid-template-areas: "txt del" "nums nums"; column-gap: 10px; row-gap: 12px; }
  .ql-txt { grid-area: txt; }
  .ql-del { grid-area: del; margin-top: 0; }
  .ql-nums, .ql-nums.has-day { grid-area: nums; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; }
  .nx-prev .ql-f .nx-input, .nx-prev .ql-title { height: 44px; }

  .qd-h { grid-template-columns: minmax(0, 1fr) auto 44px; grid-template-areas: "n sub del" "date date date" "title title title"; row-gap: 10px; column-gap: 10px; }
  .nx-prev .qd-date, .nx-prev .qd-title { height: 44px; }
  .qd-acts .nx-btn { height: 44px; flex: 1 1 auto; }
  .qd-cat { padding: 14px 14px 12px; }
  .qd-cat-h { max-width: none; }
  .nx-prev .qd-cat .form-check { min-height: 44px; }
  .qd-cat-a .nx-btn { height: 44px; flex: 1 1 auto; }

  .qt-sub { padding-left: 0; }
  .travel-studio { grid-template-columns: minmax(0, 1fr); gap: 12px; }

  .nx-prev-save--tot { padding: 12px; row-gap: 10px; }
  .qs-tot { flex: 1 1 100%; justify-content: space-between; padding: 0 6px; }
  .qs-acts { flex: 1 1 100%; flex-wrap: nowrap; }
  .nx-prev #totalOut { font-size: 26px; }
}
@media (max-width: 400px) {
  .nx-prev-mast .nx-mast-l > .nx-eb { letter-spacing: .08em; }
  .qs-vat { font-size: 12px; }
}

/* ───────────────────────── 7. Passaggio del mouse (solo puntatori veri) ───────────────────────── */
@media (hover: hover) and (pointer: fine) {
  .nx-prev-row:hover::after {
    content: ""; position: absolute; left: calc(-1 * var(--nx-hang)); top: 18px; bottom: 18px; width: var(--nx-mark); background: var(--nx-ink);
  }
  .nx-prev-row .nx-name a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--nx-line); }
  .nx-prev-ib:hover { color: var(--nx-ink); box-shadow: inset 0 0 0 1px var(--nx-ink); }
  .nx-prev-menu > summary:hover { box-shadow: none; background: var(--nx-hover); }
  .nx-prev-pop > a:hover, .nx-prev-pop form > button:hover { background: var(--nx-hover); }
  .nx-prev-back:hover { color: var(--nx-ink); }
  .nx-prev-type-l:hover::before { box-shadow: inset 0 0 0 1.5px var(--nx-ink); }
  .nx-prev-type > input:checked + .nx-prev-type-l:hover::before { box-shadow: inset 0 0 0 5px var(--nx-ink); }
  .nx-prev-add:hover { color: var(--nx-ink); border-color: var(--nx-ink); background: var(--nx-hover); }
  .qt-choice:hover .qt-radio:not(:checked) { box-shadow: inset 0 0 0 1.5px var(--nx-ink); }
  .nx-prev-lnk:hover { text-decoration-color: currentColor; }
}

/* ───────────────────────── Profondità (palette Grafite): le altre pagine dei Preventivi ───────────────────────── */
/* elenco: come Richieste. Il titolo del gruppo sul tavolo, le righe in un foglio, senza il filetto nero sotto le intestazioni */
.nx-crm .nx-prev-rows { margin-top: 8px; background: var(--nx-sheet); border-radius: var(--nx-r-sheet); box-shadow: var(--nx-sheet-ring); }
.nx-crm .nx-prev-row { padding-left: var(--nx-sheet-padx); padding-right: var(--nx-sheet-padx); }
.nx-crm .nx-prev-rows > :last-child { border-bottom: 0; border-radius: 0 0 var(--nx-r-sheet) var(--nx-r-sheet); }
.nx-crm .nx-prev-rows > :first-child { border-radius: var(--nx-r-sheet) var(--nx-r-sheet) 0 0; }
.nx-crm .nx-prev-rows > :only-child { border-radius: var(--nx-r-sheet); }
.nx-crm .nx-prev-th { margin-top: 24px; padding: 0 var(--nx-sheet-padx); min-height: 36px; border-top: 0; border-bottom: 0; }
.nx-crm .nx-prev-sec { margin-top: 28px; }
/* nuovo preventivo e modifica: ogni sezione è un foglio */
.nx-crm .nx-prev-fsec { margin-top: var(--nx-gap-sheet); padding: var(--nx-sheet-pad); background: var(--nx-sheet); border-radius: var(--nx-r-sheet); box-shadow: var(--nx-sheet-ring); }
.nx-crm .nx-prev-f > .nx-prev-fsec:first-of-type, .nx-crm .nx-prev-fs > .nx-prev-fsec:first-child { margin-top: 20px; }
@media (hover: hover) and (pointer: fine) {
  .nx-crm .nx-prev-row:hover { background: var(--nx-hover); }
}
/* azioni secondarie tranquille: PDF e «…» si accendono sulla riga */
@media (hover: hover) and (pointer: fine) {
  .nx-crm .nx-prev-row .nx-prev-ib { opacity: .5; transition: opacity .15s; }
  .nx-crm .nx-prev-row:hover .nx-prev-ib, .nx-crm .nx-prev-row:focus-within .nx-prev-ib, .nx-crm .nx-prev-menu[open] .nx-prev-ib { opacity: 1; }
}