/* COPIA da depy/static/css/commesse.css (commit 1360520, 10/11/2026). Non modificare qui:
   se cambia in Depy si ricopia (vedi web/css/depy/LEGGIMI.md). */
/* DEPY - commesse e documenti: nuova commessa (nc-*), pagina commessa (cd-*),
   documento (dp-*), nuovo documento (nd-*), import fabbisogno (imp-*), azioni (az-*). */
/* ============================================================
   NUOVA COMMESSA (nc-*)

   La porta unica per aprire una commessa: dalla distinta, da zero, da
   un'altra. Le misure sono quelle del mockup approvato. Da telefono il
   riepilogo «Come verra'» non sta sopra il modulo ma dietro un pulsante
   in fondo, e si apre dal basso.
   ============================================================ */
.nc { width: 100%; }
.nc-testa { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 18px; }
.nc-testa-ico {
    width: 46px; height: 46px; flex: 0 0 46px; border-radius: var(--r-md);
    display: flex; align-items: center; justify-content: center; font-size: 1.3rem;
    background: var(--hb-lavoro-ico); color: var(--blu-500);
}
.nc-testa h2 { margin: 0; font-size: 1.4rem; font-weight: 700; }
.nc-testa p { margin: 3px 0 0; font-size: var(--fs-base); color: var(--testo-2); }

.nc-doppia { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }

.nc-rq {
    background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-lg);
    box-shadow: var(--ombra-2); margin-bottom: 16px;
}
.nc-rq-testa {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 13px 18px; border-bottom: 1px solid var(--bordo);
}
.nc-rq-testa h3 { margin: 0; font-size: .95rem; font-weight: 600; display: flex; align-items: center; gap: .5rem; }
.nc-rq-testa h3 i { color: var(--testo-2); font-size: var(--fs-md); }
.nc-rq-nota { font-size: var(--fs-sm); color: var(--testo-2); text-align: right; }
.nc-passo {
    width: 22px; height: 22px; border-radius: 50%; font-size: var(--fs-xs); font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--hb-lavoro-ico); color: var(--blu-500);
}
.nc-rq-corpo { padding: 16px 18px; }

/* ---- i campi ---- */
.nc-griglia { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; }
.nc-griglia .c6 { grid-column: span 6; }
.nc-griglia .c12 { grid-column: span 12; }
.nc-campo label { display: block; font-size: var(--fs-sm); font-weight: 600; margin-bottom: 4px; }
.nc-campo input[type=text], .nc-campo input[type=date], .nc-campo input[type=number], .nc-campo textarea {
    width: 100%; min-height: 40px; padding: 8px 12px;
    border: 1px solid var(--bordo); border-radius: var(--r-md); background: var(--superficie);
    font-size: var(--fs-base); color: var(--primario); font-family: inherit;
}
.nc-campo input:focus, .nc-campo textarea:focus {
    outline: 0; border-color: var(--primario); box-shadow: 0 0 0 4px rgba(var(--primario-rgb),.10);
}
.nc-campo .tnd { display: block; width: 100%; }
.nc-aiuto { display: block; font-size: .76rem; color: var(--testo-2); margin-top: 4px; line-height: 1.45; }
.nc-aiuto b { color: var(--testo-2); font-weight: 600; }
.nc-obbl { color: var(--no); }
.nc-link {
    display: inline-flex; align-items: center; gap: .3rem; margin-top: 6px;
    border: 0; background: none; padding: 0; font-size: var(--fs-sm); font-weight: 600;
    color: var(--blu-500); cursor: pointer;
}
.nc-link:hover { text-decoration: underline; }

/* ---- il cliente nuovo, dentro la pagina ---- */
.nc-nuovo { display: none; margin-top: 8px; padding: 12px; border: 1px dashed var(--bordo-forte); border-radius: var(--r-md); background: var(--velo); }
.nc-nuovo.e-su { display: block; }
.nc-nuovo-az { display: flex; gap: 8px; justify-content: flex-end; margin-top: 10px; }
.nc-nuovo-az .hbt { height: 32px; font-size: var(--fs-sm); }

/* ---- il numero che si mette da solo ---- */
.nc-auto {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    background: var(--velo); border: 1px dashed var(--bordo-forte);
    border-radius: var(--r-md); padding: 10px 14px;
}
.nc-auto b { font-size: var(--fs-md); font-variant-numeric: tabular-nums; }
.nc-auto span { font-size: var(--fs-sm); color: var(--testo-2); }
.nc-auto button { margin-left: auto; border: 0; background: none; color: var(--blu-500); font-size: var(--fs-sm); cursor: pointer; text-decoration: underline; }
.nc-auto-mano { display: none; }
.nc-auto-mano.e-su { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }

/* ---- le tre strade ---- */
.nc-strade { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.nc-strada {
    border: 1px solid var(--bordo); border-radius: var(--r-md); padding: 14px;
    background: var(--superficie); cursor: pointer; text-align: left; display: block; width: 100%;
    transition: background .15s, border-color .15s;
}
.nc-strada:hover { border-color: var(--bordo-forte); background: var(--velo); }
/* «senza commessa» e' un link (porta all'ordine): stesso aspetto dei riquadri */
a.nc-strada { color: var(--testo); text-decoration: none; }
.nc-strada.on { border-color: var(--blu-500); background: var(--hb-lavoro-ico); }
.nc-strada-ico {
    width: 34px; height: 34px; border-radius: var(--r-md); margin-bottom: 9px;
    display: flex; align-items: center; justify-content: center; font-size: 1.05rem;
    background: var(--superficie); border: 1px solid var(--bordo); color: var(--blu-500);
}
.nc-strada.on .nc-strada-ico { border-color: var(--blu-200); }
.nc-strada strong { display: block; font-size: var(--fs-base); }
/* non «ogni span»: il riquadro dell'icona e' uno span anche lui */
.nc-strada > span:not(.nc-strada-ico) { display: block; font-size: var(--fs-sm); color: var(--testo-2); margin-top: 3px; line-height: 1.45; }

/* ---- le zone che escono solo con la loro strada ---- */
.nc-zona { display: none; margin-top: 15px; }
.nc-zona.e-su { display: block; }
/* Un import lasciato a meta: un avviso giallo, centrato, che non si puo
   non vedere. Il giallo in Depy e «c e qualcosa da fare». */
.nc-sospeso {
    display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap;
    margin-bottom: 12px; padding: 10px 14px; border-radius: var(--r-md); text-align: center;
    background: var(--hb-compra-ico); border: 1px solid var(--ambra-200); color: var(--hb-compra-testo);
    font-size: .86rem; font-weight: 600;
}
.nc-sospeso > span i { color: var(--hb-compra-scuro); margin-right: 4px; }
.nc-sospeso .hbt { height: 32px; font-size: var(--fs-sm); }
[data-bs-theme="dark"] .nc-sospeso { background: rgba(var(--attenzione-rgb),.25); border-color: var(--ambra-800); color: var(--ambra-300); }

/* «Da dove parti»: quattro strade, quattro colori pieni, cosi' si
   riconoscono a colpo d'occhio (prima erano bianche con l'icona appena
   tinta e sembravano uguali). Blu la distinta, verde a mano, azzurrino la
   copia, giallo il materiale senza commessa. Tutto il riquadro prende la
   tinta tenue; quello scelto si accende col bordo e un alone. */
.nc-strada.e-blu, .nc-strada.e-verde, .nc-strada.e-azzurro, .nc-strada.e-giallo { border-width: 2px; }
.nc-strada.e-blu     { background: var(--primario); border-color: var(--primario); color: var(--su-primario); }
.nc-strada.e-blu > span:not(.nc-strada-ico) { color: var(--su-primario); opacity: .85; }
.nc-strada.e-blu .nc-strada-ico { background: var(--blu-700); border-color: var(--blu-700); color: var(--su-primario); }
.nc-strada.e-blu.on, .nc-strada.e-blu:hover { border-color: var(--accento); background: var(--primario); }
.nc-strada.e-blu.on { box-shadow: 0 0 0 3px var(--accento-tenue), var(--ombra-2); }
.nc-strada.e-verde   { background: var(--ok-tenue); border-color: var(--verde-300); }
.nc-strada.e-verde .nc-strada-ico { background: var(--accento-forte); border-color: var(--accento-forte); color: var(--su-primario); }
.nc-strada.e-verde.on, .nc-strada.e-verde:hover { border-color: var(--accento-forte); background: var(--ok-tenue); }
.nc-strada.e-azzurro { background: var(--superficie); border-color: var(--blu-300); }
.nc-strada.e-azzurro .nc-strada-ico { background: var(--blu-300); border-color: var(--blu-300); color: var(--blu-900); }
.nc-strada.e-azzurro.on, .nc-strada.e-azzurro:hover { border-color: var(--blu-500); background: var(--superficie); }
.nc-strada.e-giallo  { background: var(--attenzione-tenue); border-color: var(--ambra-300); }
.nc-strada.e-giallo .nc-strada-ico { background: var(--ambra-500); border-color: var(--ambra-500); color: var(--ambra-testo); }
.nc-strada.e-giallo.on, .nc-strada.e-giallo:hover { border-color: var(--ambra-700); background: var(--attenzione-tenue); }
/* Quella scelta si vede: contorno scuro, bollino «Scelta» in alto a destra,
   le altre si attenuano. Il colore da solo non bastava: con quattro schede
   gia' colorate il bordo un po' piu' scuro non si notava. */
.nc-strada { position: relative; }
/* stessa specificita' di «.nc-strada > span:not(.nc-strada-ico)» ma scritta dopo: vince */
.nc-strada > span.nc-strada-scelta {
    display: none; position: absolute; top: 10px; right: 10px; align-items: center; gap: 4px; margin: 0;
    height: 22px; padding: 0 9px; border-radius: var(--r-pill);
    background: var(--blu-900); color: var(--su-primario); font-size: var(--fs-xs); font-weight: 700; line-height: 1;
}
.nc-strada.on > span.nc-strada-scelta { display: inline-flex; }
.nc-strada.e-blu.on .nc-strada-scelta { background: var(--accento); color: var(--blu-900); }
.nc-strada.e-blu.on, .nc-strada.e-verde.on, .nc-strada.e-azzurro.on, .nc-strada.e-giallo.on {
    outline: 3px solid var(--blu-900); outline-offset: 2px; box-shadow: var(--ombra-3);
}
.nc-strada.e-blu.on { outline-color: var(--accento); }
[data-bs-theme="dark"] .nc-strada.e-verde.on, [data-bs-theme="dark"] .nc-strada.e-azzurro.on, [data-bs-theme="dark"] .nc-strada.e-giallo.on { outline-color: var(--blu-200); }
[data-bs-theme="dark"] .nc-strada-scelta { background: var(--blu-200); color: var(--blu-900); }

/* ---- il file: i due riquadri affiancati ---- */
.nc-carica { display: grid; gap: 12px; align-items: stretch; }
@media (min-width: 760px) { .nc-carica { grid-template-columns: 1.05fr .95fr; } }
.nc-drop {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: .25rem;
    padding: 20px 16px; border: 2px dashed var(--bordo-forte); border-radius: var(--r-lg);
    background: var(--velo); cursor: pointer; margin: 0; position: relative;
    transition: border-color .15s, background .15s;
}
.nc-drop input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.nc-drop:hover, .nc-drop.is-over { border-color: var(--blu-500); background: var(--hb-lavoro-ico); }
.nc-drop.is-ready { border-style: solid; border-color: var(--verde-200); background: var(--verde-50); }
.nc-drop-ico { font-size: var(--fs-3xl); color: var(--testo-2); line-height: 1; margin-bottom: .3rem; }
.nc-drop.is-ready .nc-drop-ico { color: var(--ok); }
.nc-drop-tit { font-weight: 700; font-size: .95rem; }
.nc-drop-sot { color: var(--testo-2); font-size: var(--fs-sm); }
.nc-drop-nota { color: var(--testo-2); font-size: .76rem; line-height: 1.45; margin-top: .5rem; }
.nc-scelto { border: 1px solid var(--bordo); border-radius: var(--r-lg); padding: 16px; display: flex; flex-direction: column; gap: 4px; background: var(--superficie); }
.nc-scelto-eti { font-size: .76rem; font-weight: 600; color: var(--testo-2); text-transform: uppercase; letter-spacing: .03em; }
.nc-scelto-nome { font-weight: 600; font-size: var(--fs-base); word-break: break-all; }
.nc-scelto-nome.e-vuoto { font-weight: 400; color: var(--testo-debole); }
.nc-scelto-dice { font-size: var(--fs-sm); color: var(--testo-2); line-height: 1.5; margin-top: 2px; }
.nc-scelto-cosa { margin-top: auto; padding-top: 12px; }
.nc-scelto-cosa div { display: flex; gap: 8px; font-size: var(--fs-sm); padding: 4px 0; }
.nc-scelto-cosa i { color: var(--ok); }

/* ---- come verra' ---- */
.nc-anteprima { position: sticky; top: 76px; }
.nc-ap-riga { display: flex; gap: 10px; padding: 9px 0; border-top: 1px solid var(--bordo); font-size: .86rem; }
.nc-ap-riga:first-of-type { border-top: 0; padding-top: 0; }
.nc-ap-eti { flex: 0 0 96px; color: var(--testo-2); font-size: var(--fs-sm); }
.nc-ap-val { flex: 1 1 auto; min-width: 0; font-weight: 600; word-break: break-word; }
.nc-ap-val.vuoto { font-weight: 400; color: var(--testo-debole); }
/* quanto risparmi: il numero in verde, gli articoli a magazzino in un elenco che scorre */
.rs-risparmio:not(.vuoto) { color: var(--ok); }
.rs-lista .nc-ap-riga:last-child { padding-bottom: 0; }
/* la finestra degli articoli a magazzino: testa e piede fermi, l'elenco scorre dentro */
.rs-modale .modal-content { overflow: hidden; }
.rs-modale .dp-mod-corpo { overflow-y: auto; min-height: 0; }
.rs-lista .nc-ap-eti { flex: 1 1 auto; min-width: 0; }
.rs-lista .nc-ap-val { flex: 0 0 auto; text-align: right; }
.rs-lista .nc-ap-val.vuoto { color: var(--testo-2); font-weight: 400; }
.rs-lista .rs-nota { display: block; color: var(--testo-2); font-size: var(--fs-xs); }
.nc-ap-stato {
    display: inline-flex; align-items: center; gap: .35rem; margin-bottom: 12px;
    height: 24px; padding: 0 10px; font-size: var(--fs-sm); font-weight: 600; border-radius: var(--r-pill);
    background: var(--superficie-2); color: var(--testo-2);
}
.nc-ap-dopo { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--bordo); font-size: var(--fs-sm); color: var(--testo-2); line-height: 1.5; }
.nc-ap-dopo b { color: var(--testo-2); }
.nc-ap-chiudi, .nc-ap-bt { display: none; }
.nc-bt-corto { display: none; }
.nc-velo { display: none; }

/* ---- la barra in fondo ---- */
.nc-barra-spazio { height: 80px; }
.nc-barra {
    position: fixed; left: var(--sidebar-width); right: 0; bottom: 0; z-index: var(--z-barra);
    background: var(--superficie); border-top: 1px solid var(--bordo);
    box-shadow: var(--ombra-3); padding: 12px 18px;
    transition: left .3s ease;
}
html.menu-sganciato .nc-barra { left: 0; }
.nc-barra-dentro { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.nc-barra-sx { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.nc-barra-testo { font-size: .86rem; color: var(--testo-2); }
.nc-barra-bozza { font-size: .82rem; font-weight: 600; color: var(--testo-2); }
.nc-barra-testo b { color: var(--primario); font-weight: 600; }
.nc-barra-bt { display: flex; align-items: center; gap: 8px; }

/* ---- al buio ---- */
[data-bs-theme="dark"] .nc-strada:hover { background: var(--superficie); }
[data-bs-theme="dark"] .nc-strada.on { background: rgba(var(--primario-rgb),.4); }
[data-bs-theme="dark"] .nc-strada-ico { color: var(--blu-200); }
[data-bs-theme="dark"] .nc-strada strong, [data-bs-theme="dark"] .nc-rq-testa h3,
[data-bs-theme="dark"] .nc-testa h2, [data-bs-theme="dark"] .nc-ap-val, [data-bs-theme="dark"] .nc-scelto-nome { color: var(--testo); }
[data-bs-theme="dark"] .nc-campo input, [data-bs-theme="dark"] .nc-campo textarea { background: var(--superficie); color: var(--testo); border-color: var(--bordo-forte); }
[data-bs-theme="dark"] .nc-drop, [data-bs-theme="dark"] .nc-nuovo, [data-bs-theme="dark"] .nc-auto { background: var(--superficie); }
[data-bs-theme="dark"] .nc-drop.is-ready { background: rgba(var(--ok-rgb),.2); border-color: var(--verde-500); }
[data-bs-theme="dark"] .nc-ap-stato { background: var(--velo); color: var(--testo); }
[data-bs-theme="dark"] .nc-campo label { color: var(--testo); }

/* «Per chi, e dove» e «Quando» affiancati: a sinistra i campi uno sotto
   l'altro, e le spiegazioni lunghe restano fuori, se no la colonna si allunga */
@media (min-width: 1200px) {
    .nc-affiancati { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-bottom: 16px; }
    .nc-affiancati > .nc-rq { margin-bottom: 0; }
    .nc-affiancati > .nc-rq:first-child .nc-griglia .c6 { grid-column: span 12; }
    .nc-affiancati .nc-campo > .nc-aiuto:not([id]) { display: none; }
}

/* ---- da telefono ---- */
@media (max-width: 900px) {
    .nc-doppia { grid-template-columns: minmax(0, 1fr); }
    .nc-griglia > * { grid-column: 1 / -1 !important; }
    .nc-testa-ico { display: none; }
    /* Il riepilogo e' un foglio che sale dal basso. top: auto e' il
       punto: senza, il top dello sticky restava e il foglio si incollava
       in alto. */
    .nc-anteprima {
        position: fixed; top: auto; left: 0; right: 0; bottom: 0; z-index: var(--z-pannello);
        max-height: 82vh; overflow: auto; padding: 0 12px 12px;
        background: var(--superficie); border-radius: var(--r-lg) var(--r-lg) 0 0;
        box-shadow: var(--ombra-4);
        transform: translateY(101%); transition: transform .2s ease-out;
    }
        .nc-anteprima.e-su { transform: none; }
    .nc-anteprima .nc-rq { border: 0; box-shadow: none; }
    .nc-ap-chiudi {
        display: flex; align-items: center; justify-content: center; gap: .4rem;
        width: 100%; height: 42px; margin-top: 10px; border: 1px solid var(--bordo-forte);
        border-radius: var(--r-pill); background: var(--superficie); font-size: var(--fs-base); cursor: pointer;
    }
    .nc-velo { display: block; position: fixed; inset: 0; z-index: var(--z-velo); background: rgba(16,24,40,.35); opacity: 0; pointer-events: none; transition: opacity .2s; }
    .nc-velo.e-su { opacity: 1; pointer-events: auto; }
    /* La barra: l'occhio del riepilogo (solo l'icona) e «Lascia perdere»
       sulla prima riga, il pulsante principale largo tutto sulla seconda.
       Tre pulsanti a riga fissa uscivano dallo schermo. */
    /* Sopra il menu fisso in basso (64px piu' la fascia di sicurezza
       del telefono), senza ombra e con lo stesso bordo: e' un pezzo del
       menu. Il copione la sposta piu' su quando si apre un sottomenu. */
    .nc-barra {
        left: 0; padding: 10px 12px;
        bottom: calc(64px + env(safe-area-inset-bottom));
        z-index: calc(var(--z-barra) - 1); box-shadow: none; border-top: 1px solid var(--bordo);
        transition: bottom .18s ease-out, left .3s ease;
    }
    .nc-barra-spazio { height: 140px; }
    /* Il riepilogo sale sopra tutto, menu compreso: ha il suo Chiudi. */
    .nc-anteprima { z-index: calc(var(--z-pannello) + 1); }
    .nc-velo { z-index: var(--z-pannello); }
    .nc-barra-testo { display: none; }
    .nc-barra-sx { width: 100%; }
    /* Una riga sola: a sinistra l'occhio del riepilogo e «Lascia
       perdere», a destra il pulsante che conferma, con la scritta corta. */
    .nc-barra-bt { width: 100%; flex-wrap: nowrap; gap: 8px; }
    .nc-barra-bt .hbt { flex: 0 0 auto; justify-content: center; min-width: 0; padding: 0 14px; }
    .nc-ap-bt { display: inline-flex; flex: 0 0 44px !important; width: 44px; padding: 0 !important; }
    .nc-ap-bt .nc-ap-bt-testo { display: none; }
    .nc-barra-bt .hbt-pieno { flex: 1 1 auto; margin-left: auto; }
    .nc-bt-lungo { display: none; }
    .nc-bt-corto { display: inline; }
    /* Con un sottomenu aperto la barra ci si appoggia sopra: il foglio
       perde gli angoli tondi in alto, se no fra i due restava uno
       spicchio vuoto per parte. */
    body.nc-sopra-foglio .mnav-sheet { border-top-left-radius: 0; border-top-right-radius: 0; box-shadow: none; }
}

/* ===== Pagina Import fabbisogno (e import in genere) ===== */
.imp-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.imp-title { font-size: 1.6rem; font-weight: 700; margin: 0 0 .25rem; }
.imp-sub { color: var(--testo-2); margin: 0; }
.imp-back { white-space: nowrap; }
.imp-card { background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-lg); padding: 1.5rem; }
.imp-steps { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; padding: 0 0 1.5rem; margin: 0 0 1.5rem; border-bottom: 1px solid var(--bordo); position: relative; }
.imp-steps li { position: relative; padding-top: 2.6rem; text-align: center; }
.imp-steps li::after { content: ""; position: absolute; top: 17px; left: calc(50% + 26px); right: calc(-50% + 26px); height: 2px; background: var(--superficie-2); }
.imp-steps li:last-child::after { display: none; }
.imp-steps li.is-done::after { background: var(--blu-200); }
.imp-step-num { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 36px; height: 36px; border-radius: 50%; background: var(--superficie-2); color: var(--testo); font-weight: 700; display: flex; align-items: center; justify-content: center; border: 2px solid var(--bordo); }
.imp-steps li.is-current .imp-step-num { background: var(--blu-700); border-color: var(--blu-700); color: #fff; box-shadow: 0 0 0 4px var(--blu-50); }
.imp-steps li.is-done .imp-step-num { background: var(--blu-50); border-color: var(--blu-200); color: var(--blu-700); }
.imp-step-title { display: block; font-weight: 700; font-size: .95rem; color: var(--testo); }
.imp-steps li.is-current .imp-step-title { color: var(--blu-700); }
.imp-step-sub { display: block; font-size: var(--fs-sm); color: var(--testo-2); }
@media (max-width: 767.98px) {
    .imp-steps { grid-template-columns: repeat(2, 1fr); gap: 1rem .5rem; }
    .imp-steps li::after { display: none; }
    .imp-step-sub { display: none; }
}
/* Il posto dove si carica un file: la zona di trascinamento e il
   riquadro del file preso stanno fianco a fianco, non in colonna. Prima
   il secondo cadeva sotto la piega dello schermo e chi importava non
   vedeva ne' che il file era arrivato ne' il pulsante per proseguire. */
/* L'import lasciato a meta': si vede in cima alla pagina e si riprende
   con un clic, oppure si butta via. */
.imp-sospeso { border: 1px solid var(--ambra-200); background: var(--ambra-50); border-radius: var(--r-lg);
               padding: .85rem 1.1rem; margin-bottom: 1rem; }
.imp-sospeso-testa { display: flex; align-items: center; gap: .5rem;
                     font-weight: 600; color: var(--ambra-800); margin-bottom: .6rem; }
.imp-sospeso-riga { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem;
                    padding: .5rem 0; border-top: 1px solid var(--ambra-100); }
.imp-sospeso-riga:first-of-type { border-top: 0; padding-top: 0; }
.imp-sospeso-file { display: flex; align-items: baseline; gap: .45rem; flex: 1 1 240px; min-width: 0; }
.imp-sospeso-file strong { word-break: break-all; }
.imp-sospeso-file small { color: var(--ambra-800); opacity: .8; }
.imp-sospeso-az { display: flex; align-items: center; gap: .35rem; margin-left: auto; }

.imp-carica { display: grid; gap: 1rem; align-items: stretch; }
@media (min-width: 768px) { .imp-carica { grid-template-columns: 1.05fr .95fr; } }
.imp-carica > .imp-file { margin-top: 0; }

.imp-drop { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .3rem; padding: 1.4rem 1rem; border: 2px dashed var(--bordo-forte); border-radius: var(--r-lg); background: var(--sfondo); cursor: pointer; transition: border-color .15s, background .15s; margin: 0; }
.imp-drop:hover, .imp-drop.is-over { border-color: var(--blu-700); background: var(--blu-50); }
.imp-drop.is-ready { border-style: solid; border-color: var(--verde-300); background: var(--verde-50); }
.imp-drop-ico { position: relative; font-size: 2.1rem; color: var(--testo-debole); line-height: 1; margin-bottom: .25rem; }
.imp-drop-ok { position: absolute; right: -8px; bottom: 2px; width: 24px; height: 24px; border-radius: 50%; background: var(--verde-400); color: #fff; font-size: var(--fs-xs); display: flex; align-items: center; justify-content: center; transform: rotate(45deg); }
.imp-drop-title { font-weight: 700; font-size: var(--fs-md); }
.imp-drop-sub { color: var(--testo-2); font-size: .85rem; }
.imp-drop-btn { margin: .55rem 0 .35rem; padding: .45rem 1.2rem; font-weight: 600; font-size: var(--fs-base); }
.imp-drop-note { color: var(--testo-2); font-size: var(--fs-sm); line-height: 1.45; }
.imp-file { margin-top: 1.25rem; border: 1px solid var(--bordo); border-radius: var(--r-lg); padding: 1rem 1.25rem; display: flex; flex-direction: column; }
.imp-file-title { font-weight: 700; margin-bottom: .75rem; }
.imp-file-box { background: var(--sfondo); border: 1px solid var(--bordo); border-radius: var(--r-md); padding: 1.1rem; text-align: center; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.imp-file-box > i { font-size: 1.8rem; color: var(--testo-debole); }
.imp-file-box.is-ready { background: var(--verde-50); border-color: var(--verde-200); }
.imp-file-box.is-ready > i { color: var(--verde-500); }
.imp-file-name { font-weight: 700; margin-top: .25rem; word-break: break-all; }
.imp-file-hint { color: var(--testo-2); font-size: var(--fs-base); }
.imp-section { border: 1px solid var(--bordo); border-radius: var(--r-lg); padding: 1rem 1.25rem; margin-bottom: 1rem; }
.imp-section-title { font-weight: 700; margin-bottom: .75rem; }
.imp-table { border: 1px solid var(--bordo); border-radius: var(--r-md); }
.imp-actions { display: flex; justify-content: flex-end; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.imp-warnings { margin-bottom: 1rem; font-size: var(--fs-base); color: var(--testo-2); }
.imp-warnings summary { cursor: pointer; }
.imp-warnings ul { max-height: 160px; overflow-y: auto; margin: .5rem 0 0; padding-left: 1.25rem; }
.imp-side-steps { list-style: none; counter-reset: passo; padding: 0; margin: 0; }
.imp-side-steps li { counter-increment: passo; position: relative; padding-left: 2.4rem; margin-bottom: .9rem; }
.imp-side-steps li::before { content: counter(passo); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--blu-100); color: var(--blu-700); font-weight: 700; font-size: .85rem; display: flex; align-items: center; justify-content: center; }
.imp-side-steps strong { display: block; }
.imp-side-steps span { color: var(--testo-2); font-size: var(--fs-base); }
.imp-side-list { list-style: none; padding: 0; margin: 0; }
.imp-side-list li { padding-left: 1.6rem; position: relative; margin-bottom: .35rem; }
.imp-side-list li::before { content: "\F26B"; font-family: "bootstrap-icons"; position: absolute; left: 0; color: var(--verde-500); }
[data-bs-theme="dark"] .imp-card, [data-bs-theme="dark"] .imp-file, [data-bs-theme="dark"] .imp-section { background: var(--superficie); }
[data-bs-theme="dark"] .imp-drop, [data-bs-theme="dark"] .imp-file-box { border-color: var(--bordo); }

/* Intestazione import: titolo a sinistra e pulsante "Torna" allineato a
   destra sulla stessa riga (prima il pulsante finiva sotto). */
.imp-head { flex-wrap: nowrap; align-items: center; }
.imp-head > div { flex: 1 1 auto; min-width: 0; }
.imp-back { flex-shrink: 0; margin-left: 1rem; }
@media (max-width: 575.98px) {
    .imp-head { flex-wrap: wrap; }
    .imp-back { margin-left: 0; }
}
/* Ricezione: tre passi invece di quattro */
.imp-steps-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 767.98px) { .imp-steps-3 { grid-template-columns: repeat(3, 1fr); } }

/* ===== Barra delle azioni: una sola azione principale ===== */
.az-spacer { height: 84px; }
.az-bar {
    position: fixed; left: var(--sidebar-width); right: 0; bottom: 0; z-index: var(--z-barra);
    background: var(--superficie); border-top: 1px solid rgba(0,0,0,.08);
    box-shadow: var(--ombra-3);
    padding: .6rem 1.25rem; transition: left .3s ease;
}
html.menu-sganciato .az-bar { left: 0; }
.az-inner { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.az-torna { color: var(--testo-2); text-decoration: none; font-size: var(--fs-base); display: inline-flex; align-items: center; gap: 6px; padding: 6px 4px; border-radius: var(--r-sm); }
.az-torna:hover { color: var(--testo); background: var(--velo); }
.az-dx { display: flex; align-items: center; gap: .5rem; margin-left: auto; flex-wrap: wrap; justify-content: flex-end; }
.az-principale { font-weight: 600; padding-inline: 1.4rem; box-shadow: var(--ombra-2); }
.az-principale.btn-success { box-shadow: var(--ombra-2); }
.az-menu .dropdown-item { border-radius: var(--r-sm); padding: 8px 10px; display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: none; border: 0; }
.az-menu .dropdown-item:hover { background: var(--velo); }
.az-menu form { margin: 0; }
.az-menu .az-pericolosa { color: var(--rosso-700); }
.az-menu .az-pericolosa:hover { background: var(--rosso-100); color: var(--rosso-800); }
@media (max-width: 767.98px) {
    .az-bar { left: 0; padding: .55rem .75rem; }
    .az-inner { gap: .5rem; }
    .az-torna span, .az-torna { font-size: .85rem; }
    .az-dx { width: 100%; }
    .az-principale { flex: 1 1 auto; }
    .az-spacer { height: 96px; }
}
[data-bs-theme="dark"] .az-bar { border-top-color: var(--bordo); box-shadow: var(--ombra-2); }
[data-bs-theme="dark"] .az-menu .az-pericolosa:hover { background: rgba(var(--no-rgb),.2); color: var(--rosso-200); }

/* Riga di stato: dove sei e qual e' il passo successivo */
.az-passo { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px; border-radius: var(--r-md); margin-bottom: 1rem; border: 1px solid; }
.az-passo-ico { font-size: 1.3rem; line-height: 1.2; }
.az-passo-testo { display: flex; flex-direction: column; gap: 2px; }
.az-passo-testo strong { font-size: var(--fs-md); }
.az-passo-testo span { color: var(--testo-2); font-size: var(--fs-base); }
.az-passo-testo em { font-style: normal; font-weight: 600; font-size: var(--fs-base); }
.az-lavoro { background: var(--blu-50); border-color: var(--blu-200); color: var(--blu-800); }
.az-attesa { background: var(--ambra-50); border-color: var(--ambra-200); color: var(--ambra-800); }
.az-ok     { background: var(--verde-50); border-color: var(--verde-200); color: var(--verde-700); }
.az-fermo  { background: var(--sfondo); border-color: var(--bordo); color: var(--testo); }
.az-stop   { background: var(--rosso-50); border-color: var(--rosso-200); color: var(--rosso-800); }
[data-bs-theme="dark"] .az-passo-testo span { color: var(--testo); }
[data-bs-theme="dark"] .az-lavoro { background: rgba(var(--primario-rgb),.14); border-color: rgba(var(--primario-rgb),.35); color: var(--blu-200); }
[data-bs-theme="dark"] .az-attesa { background: rgba(var(--attenzione-rgb),.14); border-color: rgba(var(--attenzione-rgb),.35); color: var(--ambra-200); }
[data-bs-theme="dark"] .az-ok     { background: rgba(var(--accento-rgb),.14); border-color: rgba(var(--accento-rgb),.35); color: var(--verde-200); }
[data-bs-theme="dark"] .az-fermo  { background: var(--velo); }
[data-bs-theme="dark"] .az-stop   { background: rgba(var(--no-rgb),.14); border-color: rgba(var(--no-rgb),.35); color: var(--rosso-200); }

/* ===== Import fabbisogno: riepilogo cliccabile, elenchi chiusi, aiuto in una finestra ===== */
.imp-card { position: relative; }
.imp-help {
    position: absolute; top: 14px; right: 14px; z-index: 2;
    width: 36px; height: 36px; border-radius: 50%;
    border: 1px solid var(--bordo); background: var(--sfondo); color: var(--testo-2);
    display: grid; place-items: center; font-size: 1.05rem; line-height: 1;
    transition: background-color .15s, color .15s, border-color .15s;
}
.imp-help:hover { background: var(--blu-700); border-color: var(--blu-700); color: #fff; }

.imp-lista { border: 1px solid var(--bordo); border-radius: var(--r-lg); margin: 12px 0; background: var(--superficie); }
.imp-lista > summary {
    cursor: pointer; list-style: none; padding: 12px 16px; font-weight: 600;
    display: flex; align-items: center; gap: 8px; border-radius: var(--r-lg);
}
.imp-lista > summary::-webkit-details-marker { display: none; }
.imp-lista > summary::after { content: '\F282'; font-family: 'bootstrap-icons'; margin-left: auto; color: var(--testo-debole); font-weight: 400; }
.imp-lista[open] > summary::after { content: '\F286'; }
.imp-lista > summary:hover { background: var(--velo); }
.imp-lista[open] > summary { border-bottom: 1px solid var(--bordo); border-radius: var(--r-lg) var(--r-lg) 0 0; }
.imp-lista-n { background: var(--blu-50); color: var(--blu-800); border-radius: var(--r-pill); padding: 1px 10px; font-size: var(--fs-sm); }
.imp-lista-info > summary i { color: var(--blu-500); }
.imp-lista-warn > summary i { color: var(--ambra-800); }
.imp-lista .imp-table { padding: 0 4px 4px; }
.imp-lista > p, .imp-lista > .form-text { padding: 0 16px 12px; margin: 0; }

.imp-aiuto-box { border: 1px solid var(--blu-100); background: var(--blu-50); border-radius: var(--r-lg); padding: 14px; height: 100%; }
.imp-aiuto-box.imp-aiuto-ok { background: var(--verde-50); border-color: var(--verde-100); }
.imp-aiuto-head { font-weight: 700; display: flex; align-items: center; gap: .5rem; margin-bottom: .6rem; }
.imp-aiuto-head i { color: var(--blu-700); }
.imp-aiuto-ok .imp-aiuto-head i { color: var(--verde-500); }

[data-bs-theme="dark"] .imp-help { color: var(--testo); }
[data-bs-theme="dark"] .imp-aiuto-box { background: rgba(var(--blu-500-rgb),.12); border-color: rgba(var(--blu-500-rgb),.3); }
[data-bs-theme="dark"] .imp-aiuto-box.imp-aiuto-ok { background: rgba(var(--ok-rgb),.12); border-color: rgba(var(--ok-rgb),.3); }

/* Da telefono la barra dei pulsanti sta SOPRA il menu in basso, non sotto:
   il menu e' alto 64px piu' l'area di sicurezza del telefono. */
@media (max-width: 991.98px) {
    .az-bar, .prefs-sticky-actions {
        /* Da tablet in giu' il menu laterale e' a scomparsa e il contenuto parte
           da sinistra: la barra deve partire da li' anche lei, non da 260px. */
        left: 0;
        bottom: calc(64px + env(safe-area-inset-bottom, 0px));
        z-index: calc(var(--z-barra) - 1);                      /* sotto il menu, che resta sempre visibile */
        padding-bottom: .6rem;
        border-bottom: 1px solid rgba(0,0,0,.06);
        box-shadow: var(--ombra-3);
    }
    .az-spacer, .prefs-sticky-spacer { height: 104px; }
}
[data-bs-theme="dark"] .az-bar, [data-bs-theme="dark"] .prefs-sticky-actions { border-bottom-color: var(--bordo); }

/* =============================================
   PAGINA DOCUMENTO (dp-*): intestazione compatta, dati in griglia,
   righe e movimenti in sezioni che si aprono
   ============================================= */
.dp-head { display: flex; align-items: center; gap: 14px; margin: 0 0 .9rem; }
.dp-tipo {
    flex: 0 0 auto; min-width: 52px; height: 52px; padding: 0 8px; border-radius: var(--r-lg);
    display: grid; place-items: center; font-weight: 800; font-size: var(--fs-md); letter-spacing: .02em;
    background: var(--blu-50); color: var(--blu-800); border: 1px solid var(--blu-200);
}
.dp-head-testo { min-width: 0; }
.dp-titolo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dp-titolo h2 { margin: 0; font-size: var(--fs-xl); font-weight: 700; line-height: 1.2; }
.dp-stato { font-size: var(--fs-xs); font-weight: 700; padding: 3px 10px; border-radius: var(--r-pill); text-transform: uppercase; letter-spacing: .03em; }
.dp-bozza { background: var(--ambra-100); color: var(--ambra-800); }
.dp-sotto { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 4px; color: var(--testo-2); font-size: var(--fs-base); }
.dp-sotto i { margin-right: 3px; }

    
.dp-card { background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-lg); padding: 14px 18px 16px; margin-bottom: .9rem; }
.dp-card-head { margin-bottom: 10px; }
.dp-card-head h3 { margin: 0; font-size: .95rem; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.dp-card-head h3 .bi { color: var(--blu-700); }

/* Form della bozza: quattro colonne ordinate */

/* Dati in sola lettura */

/* Sezioni che si aprono */
.dp-sezione { background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-lg); margin-bottom: .9rem; }
.dp-sezione > summary {
    list-style: none; cursor: pointer; padding: 12px 18px; border-radius: var(--r-lg);
    display: flex; align-items: center; gap: 8px; font-weight: 700;
}
.dp-sezione > summary::-webkit-details-marker { display: none; }
.dp-sezione > summary > .bi { color: var(--blu-700); }
.dp-sezione > summary::after { content: '\F282'; font-family: 'bootstrap-icons'; color: var(--testo-debole); font-weight: 400; margin-left: 12px; }
.dp-sezione[open] > summary::after { content: '\F286'; }
.dp-sezione > summary:hover { background: var(--velo); }
.dp-sezione[open] > summary { border-bottom: 1px solid var(--bordo); border-radius: var(--r-lg) var(--r-lg) 0 0; }
.dp-n { background: var(--blu-50); color: var(--blu-800); border-radius: var(--r-pill); padding: 1px 10px; font-size: var(--fs-sm); }
.dp-tabella thead th { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .03em; color: var(--testo-2); font-weight: 600; background: var(--sfondo); white-space: nowrap; }
.dp-tabella td:first-child, .dp-tabella th:first-child { padding-left: 18px; }
.dp-tabella td:last-child, .dp-tabella th:last-child { padding-right: 18px; }
.dp-tabella tbody tr:last-child td { border-bottom: 0; }
.dp-tabella .um-display { background: var(--superficie-2); }

/* Il riquadro risparmio e la riga di stato stanno piu' vicini */
.dp-head + .az-passo { margin-top: 0; }

@media (max-width: 575.98px) {
    .dp-head { gap: 10px; }
    .dp-tipo { min-width: 44px; height: 44px; font-size: var(--fs-base); border-radius: var(--r-md); }
    .dp-titolo h2 { font-size: 1.1rem; }
            .dp-card { padding: 12px 14px 14px; }
    .dp-sezione > summary { padding: 11px 14px; flex-wrap: wrap; }
    }

[data-bs-theme="dark"] .dp-tipo { background: rgba(var(--blu-500-rgb),.18); color: var(--blu-200); border-color: rgba(var(--blu-500-rgb),.35); }
[data-bs-theme="dark"] .dp-bozza { background: rgba(var(--attenzione-rgb),.18); color: var(--ambra-200); }
 [data-bs-theme="dark"] .dp-tabella .um-display { background: var(--sfondo); border-color: var(--bordo); }
[data-bs-theme="dark"] .dp-sezione[open] > summary { border-color: var(--bordo); }
[data-bs-theme="dark"] .dp-n { background: rgba(var(--blu-500-rgb),.2); color: var(--blu-200); }

/* Spazio in fondo alle pagine con la barra dei pulsanti, cosi' la barra fissa
   non copre l'ultimo contenuto. Sta sul contenitore della pagina e non dove
   la barra e' scritta nel codice (prima lasciava un buco a meta' pagina). */
.contenuto main:has(.az-bar) { padding-bottom: 96px; }
@media (max-width: 991.98px) {
    .contenuto main:has(.az-bar) { padding-bottom: calc(76px + 104px + env(safe-area-inset-bottom, 0px)); }
}

/* Import documenti XML in una finestra */

/* =============================================
   CHIUSURA ANNO (ca-*): stile import, pulsante al centro
   ============================================= */
.ca-card { max-width: none; }
.ca-intesta { text-align: center; padding: 8px 40px 4px; }
.ca-ico { width: 64px; height: 64px; margin: 0 auto 10px; border-radius: 18px; display: grid; place-items: center;
          background: var(--rosso-50); color: var(--rosso-700); font-size: 1.8rem; border: 1px solid var(--rosso-200); }
.ca-intesta h3 { font-size: 1.4rem; font-weight: 700; margin: 0 0 4px; }
.ca-intesta p { color: var(--testo-2); margin: 0; }

.ca-campi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; max-width: 760px; margin: 22px auto 0; }
.ca-campo { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.ca-campo span { font-size: var(--fs-sm); font-weight: 600; color: var(--testo-2); }

.ca-controlli { max-width: 760px; margin: 22px auto 0; display: flex; flex-direction: column; gap: 8px; }
.ca-controlli-titolo { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--testo-2); }
.ca-mag { display: flex; gap: 12px; align-items: flex-start; padding: 10px 14px; border-radius: var(--r-md); border: 1px solid; transition: opacity .15s; }
.ca-mag > .bi { font-size: var(--fs-lg); margin-top: 1px; }
.ca-mag-testo { display: flex; flex-direction: column; }
.ca-mag-testo small { color: var(--testo-2); }
.ca-mag.is-ok { background: var(--verde-50); border-color: var(--verde-200); } .ca-mag.is-ok > .bi { color: var(--verde-500); }
.ca-mag.is-stop { background: var(--ambra-50); border-color: var(--ambra-200); } .ca-mag.is-stop > .bi { color: var(--ambra-800); }
.ca-mag.is-fatto { background: var(--sfondo); border-color: var(--bordo); } .ca-mag.is-fatto > .bi { color: var(--testo-debole); }
.ca-mag.is-info { background: var(--blu-50); border-color: var(--blu-200); } .ca-mag.is-info > .bi { color: var(--blu-500); }
.ca-mag.is-spento { opacity: .4; }

.ca-azione { display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 26px auto 6px; text-align: center; max-width: 560px; }
.ca-conferma { display: flex; gap: 10px; align-items: flex-start; text-align: left; margin: 0; }
.ca-conferma .form-check-input { margin-top: .2rem; flex: 0 0 auto; }
.ca-bottone { min-width: 280px; font-weight: 700; padding: .8rem 1.6rem; border-radius: var(--r-lg); }
.ca-bottone:not(:disabled) { box-shadow: var(--ombra-3); }
.ca-riepilogo { color: var(--testo-2); }
.ca-storico { margin-top: 1rem; }

@media (max-width: 767.98px) {
    .ca-intesta { padding: 8px 36px 0; }
    .ca-campi { grid-template-columns: minmax(0, 1fr); }
    .ca-bottone { min-width: 0; width: 100%; }
}

[data-bs-theme="dark"] .ca-ico { background: rgba(var(--no-rgb),.16); border-color: rgba(var(--no-rgb),.35); color: var(--rosso-300); }
[data-bs-theme="dark"] .ca-campo span, [data-bs-theme="dark"] .ca-mag-testo small { color: var(--testo); }
[data-bs-theme="dark"] .ca-mag.is-ok { background: rgba(var(--ok-rgb),.12); border-color: rgba(var(--ok-rgb),.35); }
[data-bs-theme="dark"] .ca-mag.is-stop { background: rgba(var(--attenzione-rgb),.12); border-color: rgba(var(--attenzione-rgb),.35); }
[data-bs-theme="dark"] .ca-mag.is-fatto { background: var(--velo); }
[data-bs-theme="dark"] .ca-mag.is-info { background: rgba(var(--primario-rgb),.12); border-color: rgba(var(--primario-rgb),.35); }

/* Import fabbisogno: avviso di distinta già importata */
.imp-doppione {
    display: flex; gap: 14px; align-items: flex-start; margin: 0 auto 1.1rem; max-width: 820px;
    padding: 16px 18px; border-radius: var(--r-lg); background: var(--ambra-50); border: 1px solid var(--ambra-300);
    box-shadow: var(--ombra-3);
}
.imp-doppione > .bi { font-size: var(--fs-2xl); color: var(--ambra-800); margin-top: 2px; }
.imp-doppione-testo strong { display: block; font-size: var(--fs-md); color: var(--ambra-800); }
.imp-doppione-testo p { margin: 4px 0 10px; color: var(--testo-2); }
.imp-doppione-azioni { display: flex; gap: 8px; flex-wrap: wrap; }
.imp-evidenzia { outline: 3px solid var(--ambra-300); outline-offset: 6px; border-radius: var(--r-sm); }
@media (max-width: 575.98px) { .imp-doppione { padding: 14px; gap: 10px; } }
[data-bs-theme="dark"] .imp-doppione { background: rgba(var(--attenzione-rgb),.14); border-color: rgba(var(--attenzione-rgb),.4); }
[data-bs-theme="dark"] .imp-doppione-testo strong { color: var(--ambra-200); }
[data-bs-theme="dark"] .imp-doppione-testo p { color: var(--testo); }

/* Nella barra in fondo i pulsanti hanno tutti la stessa altezza: quello
   principale si distingue per colore e peso, non per dimensione. */
.az-bar .btn, .az-bar .dropdown-toggle { min-height: 40px; padding: .45rem 1rem; font-size: .95rem; line-height: 1.3; }
.az-bar .az-principale { font-weight: 600; padding-left: 1.4rem; padding-right: 1.4rem; }
.prefs-sticky-actions .btn { min-height: 40px; padding: .45rem 1rem; font-size: .95rem; }

/* ===== Nuovo documento: si sceglie a riquadri, non da una tendina di sigle ===== */
.nd-nascosto { display: none !important; }

/* Il colore del tipo documento. Arriva dall'anagrafica del tipo come
   --nd-colore; chi non ce l'ha resta grigio come prima. Serve a trovare a
   colpo d'occhio quello che si cerca, e a capire se il documento fa entrare
   o uscire merce senza doverlo leggere. */

/* Il gruppo di quelli che nascono da soli: sta sotto e si vede che e' un
   altro scaffale, non un'alternativa alla pari. */
.nd-avanzate { margin-top: 1rem; border-top: 1px dashed var(--bordo); padding-top: .85rem; }
.nd-avanzate > summary { cursor: pointer; font-size: .85rem; font-weight: 600; color: var(--testo-2); list-style: none; }
.nd-avanzate > summary::-webkit-details-marker { display: none; }
.nd-avanzate > summary::before { content: '\F282'; font-family: 'bootstrap-icons'; font-weight: 400; margin-right: 6px; color: var(--testo-debole); }
.nd-avanzate[open] > summary::before { content: '\F286'; }

/* ============================================================
   Aggiungere una riga da sotto, non da un pulsante in cima.

   Il pulsante verde grande in testa alla tabella si faceva notare piu'
   di quanto serva - aggiungere una riga e' la cosa piu' ordinaria che si
   fa qui dentro - e con molte righe caricate costringeva a risalire. Ora
   e' una riga in fondo alla tabella, dove lo sguardo e' gia'.
   ============================================================ */
.dp-riga-piu td { padding: 0; border-top: 1px dashed var(--bs-border-color, var(--bordo)); }

.dp-piu {
    display: flex; align-items: center; gap: .45rem;
    width: 100%; padding: .6rem .75rem;
    background: none; border: 0; border-radius: var(--r-sm);
    color: var(--bs-secondary-color, var(--testo-2));
    font-size: var(--fs-base); font-weight: 500; text-align: left;
    cursor: pointer; transition: background-color .12s, color .12s;
}
.dp-piu:hover { background: var(--bs-tertiary-bg, var(--velo)); color: var(--bs-body-color, var(--testo)); }
.dp-piu:focus-visible { outline: 2px solid var(--bs-primary, var(--blu-500)); outline-offset: -2px; }
.dp-piu i { font-size: var(--fs-md); }

/* La scorciatoia si legge solo se c'e' spazio: su un telefono ruberebbe
   la riga al pulsante. */
.dp-piu-nota { margin-left: auto; font-size: var(--fs-sm); opacity: .75; }
.dp-piu-nota kbd {
    padding: .05rem .3rem; border-radius: var(--r-xs); font-size: var(--fs-xs);
    background: var(--bs-secondary-bg, var(--superficie-2));
    color: var(--bs-body-color, var(--testo));
    border: 1px solid var(--bs-border-color, var(--bordo));
}
@media (max-width: 767px) { .dp-piu-nota { display: none; } }

/* La riga nuova dell'ordine a fornitore: la quantita' e, accanto,
   l'unita' di misura che si vede ma non si tocca - e' quella con cui si
   compra da quel fornitore. */
.of-qta { display: flex; gap: 6px; justify-content: flex-end; }
.of-qta .qta-input { max-width: 110px; }
.of-qta .um-display { width: 62px; text-align: center; cursor: default; }
.riga-nuova > td { background: var(--hb-velo, var(--sfondo)); vertical-align: top; }
[data-bs-theme="dark"] .riga-nuova > td { background: var(--velo); }

/* ============================================================
   Tornare al prezzo di listino.

   Il prezzo di una riga si puo' correggere - capita di comprare a un
   prezzo diverso da quello a catalogo - ma una volta cambiato non si
   tornava indietro se non riscrivendolo a memoria. La freccia sta dentro
   al campo, a destra, e compare solo quando il prezzo e' stato toccato.
   ============================================================ */

/* Il guscio serve alla freccia come riferimento: senza, si posiziona
   rispetto alla cella - che e' piu' alta - e finisce sotto al campo. */
.dp-prezzo-guscio { position: relative; display: block; }

.dp-torna-listino {
    position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    width: 22px; height: 22px; padding: 0; z-index: 3;
    display: flex; align-items: center; justify-content: center;
    background: none; border: 0; border-radius: 5px;
    color: var(--bs-secondary-color, var(--testo-2)); font-size: var(--fs-sm);
    cursor: pointer; line-height: 1;
}
.dp-torna-listino:hover {
    background: var(--bs-tertiary-bg, var(--velo));
    color: var(--bs-body-color, var(--testo));
}

/* Il campo si tinge appena: cosi' si vede a colpo d'occhio quali prezzi
   sono stati cambiati a mano. Lo spazio a destra e' per la freccia. */
.dp-prezzo-cambiato { padding-right: 28px; background-color: var(--ambra-50); }
[data-bs-theme="dark"] .dp-prezzo-cambiato { background-color: rgba(var(--attenzione-rgb),.10); }

/* Da dove viene il prezzo quando c'e' uno sconto concordato col fornitore.
   Sta sotto al campo, piccola: serve a spiegare, non a farsi guardare. */
.dp-sconto-nota {
    display: block; margin-top: 2px;
    font-size: var(--fs-xs); line-height: 1.2; white-space: nowrap;
    color: var(--verde-500); cursor: help;
}
[data-bs-theme="dark"] .dp-sconto-nota { color: var(--verde-300); }

/* =============================================
   LA PAGINA DELLA COMMESSA (cd-*): il mockup «dentro la commessa».
   Il percorso a cinque tappe, la fascia «cosa si fa adesso», i quattro
   numeri, i dati e i documenti affiancati alla stessa altezza, il
   materiale a linguette. Pulsanti e pastiglie sono quelli degli elenchi
   (hb-*, el-*). Da telefono il percorso va in colonna e la tabella del
   materiale diventa un elenco di schede.
   ============================================= */
.cd-testa { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.cd-testa h1 { margin: 0 0 5px; font-size: var(--fs-2xl); font-weight: 700; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cd-testa .cd-sotto { font-size: .86rem; color: var(--testo-2); }
.cd-testa .cd-sotto a, .cd-lk { color: var(--blu-500); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--blu-200); }
.cd-testa .cd-sotto a:hover, .cd-lk:hover { color: var(--primario); border-bottom-color: var(--primario); }
.cd-ico { display: inline-flex; gap: 4px; align-items: center; }
/* «Altre azioni»: lo stesso pulsante arrotondato degli altri, con la freccetta */
.cd-ico .cd-altre::after { display: none; }
.cd-ico .cd-altre .bi-chevron-down { font-size: .8em; transition: transform .15s; }
.cd-ico .cd-altre[aria-expanded="true"] .bi-chevron-down { transform: rotate(180deg); }
.cd-ico .el-ico { width: 32px; height: 32px; font-size: var(--fs-md); }
.cd-ico .el-ico-altro { background: var(--superficie-2); color: var(--testo-2); }
.cd-ico .el-ico-altro:hover, .cd-ico .el-ico-altro[aria-expanded="true"] { background: var(--velo); border-color: var(--bordo-forte); color: var(--primario); }

.cd-riq {
    background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-lg);
    box-shadow: var(--ombra-2); overflow: hidden; margin-bottom: 16px;
}
.cd-riq-testa {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    flex-wrap: wrap; padding: 12px 18px; border-bottom: 1px solid var(--bordo);
}
.cd-riq-testa h2 { margin: 0; font-size: .95rem; font-weight: 700; display: flex; align-items: center; gap: .45rem; }
.cd-riq-testa .cd-mini { font-size: var(--fs-sm); color: var(--testo-2); font-weight: 400; }
.cd-riq-corpo { padding: 18px; }

/* ---- il percorso ---- */
.cd-percorso { display: flex; align-items: stretch; padding: 4px; background: var(--velo); gap: 0; }
.cd-tappa { flex: 1 1 0; min-width: 0; padding: 12px 14px; background: var(--superficie); border: 1px solid var(--bordo); border-right: 0; }
.cd-tappa:first-child { border-radius: 11px 0 0 11px; }
.cd-tappa:last-child { border-right: 1px solid var(--bordo); border-radius: 0 11px 11px 0; }
.cd-tappa .q { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--testo-2); }
.cd-tappa .n { font-size: var(--fs-base); font-weight: 600; margin-top: 3px; display: flex; align-items: center; gap: .4rem; }
.cd-tappa .d { font-size: var(--fs-xs); color: var(--testo-2); margin-top: 2px; }
.cd-tappa.e-fatta .n { color: var(--ok); }
.cd-tappa.e-ora { background: var(--hb-lavoro-ico); border-color: var(--blu-200); }
.cd-tappa.e-ora .q, .cd-tappa.e-ora .n { color: var(--blu-500); }
.cd-tappa.e-poi .n, .cd-tappa.e-poi .d { color: var(--testo-debole); }
.cd-tappa.e-rossa .n { color: var(--no); }

/* ---- cosa si fa adesso ---- */
.cd-adesso {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    flex-wrap: wrap; padding: 16px 18px; border-top: 1px solid var(--bordo);
}
.cd-adesso.t-lavoro { background: var(--hb-lavoro-ico); }
.cd-adesso.t-compra { background: var(--hb-compra-ico); }
.cd-adesso.t-entra  { background: var(--hb-entra-velo, var(--verde-50)); }
.cd-adesso.t-esce   { background: var(--hb-esce-velo, var(--rosso-100)); }
.cd-adesso.t-fine   { background: var(--velo); }
.cd-adesso .q { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--testo-2); }
.cd-adesso .t { font-size: 1.05rem; font-weight: 700; margin-top: 2px; }
.cd-adesso .d { font-size: .84rem; color: var(--testo-2); margin-top: 3px; max-width: 62ch; }
.cd-adesso-bt [aria-disabled="true"] { opacity: .55; cursor: default; }
.cd-serve-riga { margin: 0 18px 16px; }
.cd-serve-riga[hidden] { display: none; }
.cd-adesso-bt { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.cd-adesso-bt form { margin: 0; } .cd-adesso-bt .hb-bt-pieno, .cd-adesso-bt .hb-bt-chiaro, .cd-adesso-bt .hbt-pieno, .cd-adesso-bt .hbt-chiaro, .cd-adesso-bt .hbt-giallo { height: 44px; padding: 0 22px; font-size: .95rem; font-weight: 600; }

/* ---- i numeri ---- */
.cd-numeri { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.cd-num .q { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--testo-2); margin-bottom: 4px; }
.cd-num .v { font-size: var(--fs-xl); font-weight: 700; line-height: 1.15; }
.cd-num .v.pic { font-size: 1.1rem; }
.cd-num .v small { font-size: .85rem; font-weight: 400; color: var(--testo-2); }
.cd-num .d { font-size: .76rem; color: var(--testo-2); margin-top: 2px; }
.cd-num .v.e-verde { color: var(--ok); }
.cd-num .v.e-blu { color: var(--blu-500); }
.cd-num .v.e-spento { color: var(--testo-debole); font-weight: 400; font-size: 1.05rem; }

/* ---- dati e documenti: stessa altezza ---- */
.cd-due { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 16px; align-items: stretch; margin-bottom: 16px; }
.cd-due .cd-riq { display: flex; flex-direction: column; margin: 0; }
.cd-due .cd-riq-corpo { flex: 1 1 auto; }
.cd-dati { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px 20px; }
.cd-dato .q { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--testo-2); }
.cd-dato .v { font-size: var(--fs-base); font-weight: 500; margin-top: 2px; }
.cd-dato .v.e-vuoto { color: var(--testo-debole); font-weight: 400; }
.cd-dato.c2 { grid-column: span 2; }
.cd-legami { display: flex; flex-direction: column; gap: 8px; }
.cd-legame {
    display: flex; align-items: center; gap: 12px; padding: 10px 12px;
    border: 1px solid var(--bordo); border-radius: var(--r-md); text-decoration: none; color: inherit; background: var(--superficie);
}
.cd-legame:hover { background: var(--velo); border-color: var(--bordo-forte); color: inherit; }
.cd-legame .ic { width: 34px; height: 34px; flex: 0 0 34px; border-radius: var(--r-sm); display: inline-flex; align-items: center; justify-content: center; font-size: var(--fs-md); }
.cd-legame .ic-blu { background: var(--hb-lavoro-ico); color: var(--blu-500); }
.cd-legame .ic-giallo { background: var(--hb-compra-ico); color: var(--hb-compra-scuro); }
.cd-legame .ic-verde { background: var(--verde-50); color: var(--ok); }
.cd-legame .ic-rosso { background: var(--rosso-100); color: var(--no); }
.cd-legame .ic-grigio { background: var(--superficie-2); color: var(--testo-2); }
.cd-legame .tt { display: block; font-size: var(--fs-base); font-weight: 600; }
.cd-legame .dd { display: block; font-size: .76rem; color: var(--testo-2); margin-top: 1px; }
.cd-legame .fr { margin-left: auto; color: var(--testo-debole); }
.cd-vuoto { padding: 16px; text-align: center; color: var(--testo-2); font-size: .85rem; margin: auto 0; }

/* ---- il materiale a linguette ---- */
.cd-schede { display: flex; gap: 2px; padding: 6px 8px 0; border-bottom: 1px solid var(--bordo); overflow-x: auto; }
.cd-schede a {
    padding: 9px 14px; font-size: .86rem; font-weight: 500; color: var(--testo-2);
    text-decoration: none; border-bottom: 2px solid transparent; white-space: nowrap; cursor: pointer;
}
.cd-schede a.on { color: var(--primario); font-weight: 600; border-bottom-color: var(--primario); }
.cd-schede a b { font-weight: 600; margin-left: .25rem; }
.cd-scheda { display: none; }
.cd-scheda.on { display: block; }
.cd-tab { width: 100%; border-collapse: collapse; }
.cd-tab thead th {
    text-align: left; font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
    color: var(--testo-2); background: var(--velo); padding: 10px 14px; border-bottom: 1px solid var(--bordo); white-space: nowrap;
}
.cd-tab tbody td { padding: 11px 14px; border-bottom: 1px solid var(--bordo); font-size: var(--fs-base); vertical-align: middle; }
.cd-tab tbody tr:last-child td { border-bottom: 0; }
.cd-tab th:first-child, .cd-tab td:first-child { padding-left: 18px; }
.cd-tab th:last-child, .cd-tab td:last-child { padding-right: 18px; }
.cd-tab .destra { text-align: right; }
.cd-tab .cod { font-weight: 600; white-space: nowrap; }
.cd-tab .des { color: var(--testo-2); }
.cd-tab .gia { color: var(--ok); font-weight: 600; }
.cd-tab .niente { color: var(--testo-debole); }
.cd-barretta { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.cd-barretta .vas { display: block; width: 64px; height: 4px; border-radius: var(--r-xs); background: var(--superficie-2); overflow: hidden; }
.cd-barretta .vas i { display: block; height: 100%; background: var(--ok); }
.cd-barretta .vas i.parz { background: var(--hb-compra); }
.cd-fondo {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
    padding: 11px 18px; border-top: 1px solid var(--bordo); font-size: var(--fs-sm); color: var(--testo-2);
}
.cd-azioni-riga { display: inline-flex; gap: 4px; }
.cd-azioni-riga form { margin: 0; }

/* ---- al buio ---- */
[data-bs-theme="dark"] .cd-riq, [data-bs-theme="dark"] .cd-tappa, [data-bs-theme="dark"] .cd-legame { background: var(--bs-tertiary-bg); }
[data-bs-theme="dark"] .cd-tappa.e-ora { background: rgba(var(--primario-rgb),.45); border-color: var(--blu-500); }
[data-bs-theme="dark"] .cd-tappa.e-ora .q, [data-bs-theme="dark"] .cd-tappa.e-ora .n { color: var(--blu-200); }
[data-bs-theme="dark"] .cd-adesso.t-lavoro { background: rgba(var(--primario-rgb),.35); }
[data-bs-theme="dark"] .cd-adesso.t-compra { background: rgba(var(--attenzione-rgb),.18); }
[data-bs-theme="dark"] .cd-adesso.t-entra { background: rgba(var(--ok-rgb),.22); }
[data-bs-theme="dark"] .cd-adesso.t-esce { background: rgba(var(--no-rgb),.22); }
[data-bs-theme="dark"] .cd-ico .el-ico-altro { background: var(--superficie); color: var(--testo); }

/* ---- da telefono ---- */
@media (max-width: 991.98px) {
    .cd-due { grid-template-columns: 1fr; }
    .cd-numeri { grid-template-columns: repeat(2, 1fr); gap: 14px; }
}
@media (max-width: 767.98px) {
    .cd-testa h1 { font-size: 1.25rem; }
    .cd-percorso { flex-direction: column; gap: 4px; background: transparent; padding: 0; }
    .cd-tappa { border-radius: var(--r-md) !important; border-right: 1px solid var(--bordo); }
    .cd-tappa.e-poi { display: none; }
    .cd-tappa.e-poi.e-prossima { display: block; }
    .cd-adesso { flex-direction: column; align-items: stretch; }
    .cd-adesso-bt, .cd-adesso-bt form { width: 100%; }
    .cd-adesso-bt .hb-bt-pieno, .cd-adesso-bt .hb-bt-chiaro, .cd-adesso-bt .hbt-pieno, .cd-adesso-bt .hbt-chiaro, .cd-adesso-bt .hbt-giallo { width: 100%; justify-content: center; }
    .cd-dati { grid-template-columns: 1fr; }
    .cd-dato.c2 { grid-column: auto; }
    .cd-riq-corpo { padding: 14px; }
    .cd-schede { flex-wrap: wrap; overflow: visible; }
    .cd-tab thead { display: none; }
    .cd-tab, .cd-tab tbody, .cd-tab tr, .cd-tab td { display: block; width: 100%; }
    .cd-tab tr { border: 1px solid var(--bordo); border-radius: var(--r-md); margin: 10px 14px; padding: 10px 12px; width: auto; }
    .cd-tab td { border: 0; padding: 3px 0; font-size: .86rem; }
    .cd-tab td.sol-riga { display: none; }
    .cd-tab td.cod { font-size: .95rem; }
    .cd-tab td.des { margin-bottom: 6px; }
    .cd-tab td[data-eti] { display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; }
    .cd-tab td[data-eti]::before { content: attr(data-eti); font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--testo-2); }
    .cd-barretta { flex-direction: row; align-items: center; gap: 8px; }
    .cd-tab th:first-child, .cd-tab td:first-child, .cd-tab th:last-child, .cd-tab td:last-child { padding-left: 0; padding-right: 0; }
}
@media (max-width: 420px) { .cd-numeri { grid-template-columns: 1fr; } }
[data-bs-theme="dark"] .cd-schede a.on { color: var(--testo); border-bottom-color: var(--testo); }
[data-bs-theme="dark"] .cd-num .v.e-blu { color: var(--blu-300); }
[data-bs-theme="dark"] .cd-testa .cd-sotto a, [data-bs-theme="dark"] .cd-lk { color: var(--blu-300); border-bottom-color: var(--blu-500); }

/* ---- elenco documenti: la famiglia del documento, a pillola sopra al numero.
   Verde entra, rosso esce, blu lavoro, viola fra magazzini, arancio correzione. ---- */
.el-tipo {
    display: inline-flex; align-items: center; gap: 5px; margin-bottom: 3px;
    font-size: var(--fs-xs); font-weight: 700; letter-spacing: .02em; padding: 2px 9px; border-radius: var(--r-pill); white-space: nowrap;
}
.el-tipo i { font-size: var(--fs-xs); }
.el-t-carico        { background: var(--verde-50); color: var(--ok); }
.el-t-scarico       { background: var(--rosso-100); color: var(--no); }
.el-t-ordine        { background: var(--blu-50); color: var(--blu-700); }
.el-t-trasferimento { background: var(--blu-50); color: var(--blu-500); }
.el-t-rettifica     { background: var(--ambra-50); color: var(--ambra-800); }
.el-t-altro         { background: var(--superficie-2); color: var(--testo-2); }
[data-bs-theme="dark"] .el-t-carico { background: rgba(var(--ok-rgb),.25); color: var(--verde-300); }
[data-bs-theme="dark"] .el-t-scarico { background: rgba(var(--no-rgb),.25); color: var(--rosso-300); }
[data-bs-theme="dark"] .el-t-ordine { background: rgba(var(--primario-rgb),.45); color: var(--blu-200); }
[data-bs-theme="dark"] .el-t-trasferimento { background: rgba(124,58,237,.25); color: var(--blu-100); }
[data-bs-theme="dark"] .el-t-rettifica { background: rgba(194,65,12,.25); color: var(--ambra-300); }
.el-doc-rif { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; line-height: 1.3; }
.el-doc-rif .el-tipo { flex: 1 0 100%; width: max-content; margin-bottom: 2px; }
.el-doc-rif small { display: inline; }
.el-arrow { font-size: var(--fs-xs); color: var(--testo-2); }
@media (max-width: 767.98px) { .el-doc-rif small { display: inline; margin-left: 6px; } }
@media (max-width: 767.98px) { .el-lista table.el-sc5 tbody tr.sub-row:not(.d-none) { display: block; } }
/* elenco documenti da computer: la prima colonna stringe sul contenuto, «chi, per cosa» prende lo spazio */
/* Le righe degli elenchi a cinque colonne (ordini a fornitore, documenti) alte come
   quelle delle commesse: due righe di testo per cella, sempre. Il numero e le azioni
   stringono sul contenuto; chi e «a che punto e'» si dividono il resto e, se il
   nome e' piu' lungo della colonna, finisce con i puntini (per intero dentro). La
   pastiglia dello stato e le tacche stanno sulla stessa riga, la riga che dice la
   cosa che conta sotto. */
@media (min-width: 768px) {
    .el-lista table.el-sc5 th:nth-child(1) { width: 112px; }
    .el-lista table.el-sc5 th:nth-child(2) { width: 58%; }
    .el-lista table.el-sc5 th:nth-child(3) { width: 42%; }
    .el-lista table.el-sc5 th:nth-child(4) { width: 96px; }
    .el-lista table.el-sc5 th:nth-child(5) { width: 1%; }
    .el-lista table.el-sc5 td.hb-rif, .el-lista table.el-sc5 td:nth-child(5) { white-space: nowrap; }
    .el-lista table.el-sc5 td.hb-chi, .el-lista table.el-sc5 td:nth-child(3) { max-width: 0; overflow: hidden; }
    .el-lista table.el-sc5 td.hb-chi { white-space: nowrap; text-overflow: ellipsis; }
    .el-lista table.el-sc5 td.hb-chi small { display: block; overflow: hidden; text-overflow: ellipsis; }
    .el-lista table.el-sc5 .hb-passo {
        display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 8px; row-gap: 3px; min-width: 0;
    }
    .el-lista table.el-sc5 .hb-passo .hb-stato { grid-column: 1; justify-self: start; }
    .el-lista table.el-sc5 .hb-passo .hb-tacche { grid-column: 2; }
    .el-lista table.el-sc5 .hb-passo .el-dice { grid-column: 1 / -1; margin-top: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
}

/* ---- la commessa: torna all'elenco in vista, modifica dell'intestazione in pagina ---- */
.cd-torna-riga { margin-bottom: 14px; }
.cd-torna { padding-left: 12px; }
.cd-mod-griglia { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; }
.cd-campo { display: flex; flex-direction: column; gap: 5px; }
.cd-campo.c2 { grid-column: span 2; }
.cd-campo label { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--testo-2); }
.cd-campo .cd-obbl { color: var(--no); }
.cd-campo input, .cd-campo select, .cd-campo textarea {
    width: 100%; height: 40px; padding: 0 12px; font-size: var(--fs-base); color: var(--primario); font-family: inherit;
    background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-md);
}
.cd-campo textarea { height: auto; padding: 9px 12px; resize: vertical; }
.cd-campo input:focus, .cd-campo select:focus, .cd-campo textarea:focus { outline: 0; border-color: var(--primario); box-shadow: 0 0 0 3px rgba(var(--primario-rgb),.09); }
.cd-mod-azioni { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--bordo); }
.cd-mod-dice { font-size: var(--fs-sm); color: var(--testo-2); }
.cd-mod-bt { display: flex; gap: 8px; }
[data-bs-theme="dark"] .cd-campo input, [data-bs-theme="dark"] .cd-campo select, [data-bs-theme="dark"] .cd-campo textarea { color: var(--testo); border-color: var(--bordo-forte); }
@media (max-width: 767.98px) { .cd-mod-griglia { grid-template-columns: 1fr; } .cd-campo.c2 { grid-column: auto; } .cd-mod-bt { width: 100%; } .cd-mod-bt .hb-bt-chiaro, .cd-mod-bt .hb-bt-pieno, .cd-mod-bt .hbt-chiaro, .cd-mod-bt .hbt-pieno { flex: 1 1 0; justify-content: center; } }

/* ---- l'ordine a fornitore: la barra della merce, il risparmio, il confronto ---- */
.cd-avanz { padding: 12px 18px 16px; border-top: 1px solid var(--bordo); }
.cd-avanz-testa { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: var(--fs-sm); color: var(--testo-2); margin-bottom: 7px; }
.cd-avanz-testa b { font-size: 1.05rem; color: var(--primario); }
.cd-avanz-vas { height: 10px; border-radius: var(--r-sm); background: var(--superficie-2); overflow: hidden; }
.cd-avanz-vas i { display: block; height: 100%; border-radius: var(--r-sm); background: var(--ok); }
.cd-avanz-vas i.parz { background: var(--hb-compra); }
.cd-avanz-vas i.zero { background: var(--no); width: 3px; }
.cd-confronto { display: flex; gap: 10px; align-items: flex-start; padding: 12px 18px; border-top: 1px solid var(--bordo); font-size: var(--fs-sm); color: var(--testo-2); line-height: 1.5; background: var(--velo); }
.cd-confronto i { color: var(--blu-500); font-size: var(--fs-md); margin-top: 1px; }
.cd-rs-corpo { display: grid; grid-template-columns: 260px minmax(0, 1fr); }
.cd-rs-sx { background: var(--verde-50); padding: 22px 20px; display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.cd-rs-eti { font-size: var(--fs-xs); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ok); display: flex; align-items: center; gap: 6px; }
.cd-rs-val { font-size: var(--fs-3xl); font-weight: 700; color: var(--ok); line-height: 1.1; }
.cd-rs-pct { font-size: var(--fs-sm); color: var(--verde-700); font-weight: 600; }
/* si e' speso piu' di SchueCal: non e' un risparmio, non e' verde */
.cd-rs-sx.e-piu { background: var(--attenzione-tenue); }
.cd-rs-sx.e-piu .cd-rs-eti, .cd-rs-sx.e-piu .cd-rs-val, .cd-rs-sx.e-piu .cd-rs-pct { color: var(--ambra-800); }
.cd-rs-dx { padding: 18px 20px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.cd-rs-sotto { font-size: .86rem; color: var(--testo-2); line-height: 1.5; max-width: 70ch; }
.cd-rs-sotto b { color: var(--primario); }
.cd-rs-fatti { display: flex; gap: 10px; flex-wrap: wrap; }
.cd-rs-fatto { display: flex; align-items: baseline; gap: 6px; padding: 6px 12px; border: 1px solid var(--bordo); border-radius: var(--r-pill); background: var(--superficie); font-size: var(--fs-sm); color: var(--testo-2); }
.cd-rs-fatto b { font-size: var(--fs-md); color: var(--primario); }
.cd-rs-azioni { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.cd-rs-azioni .hb-bt-pieno, .cd-rs-azioni .hb-bt-chiaro, .cd-rs-azioni .hbt-pieno, .cd-rs-azioni .hbt-chiaro { height: 40px; padding: 0 18px; font-size: var(--fs-base); font-weight: 600; }
.cd-rs-come { margin-left: auto; font-size: var(--fs-sm); color: var(--testo-2); text-decoration: none; }
.cd-rs-come:hover { color: var(--primario); }
.cd-rs-spiega { font-size: var(--fs-sm); color: var(--testo-2); line-height: 1.5; padding: 10px 12px; border-radius: var(--r-md); background: var(--velo); }
.cd-rs-dett { border-top: 1px solid var(--bordo); }
.cd-rs-dett-testa { padding: 10px 18px; font-size: var(--fs-sm); color: var(--testo-2); background: var(--velo); }
.cd-rs-dett .risp { color: var(--ok); font-weight: 600; }
.cd-rs-dett .zero { color: var(--testo-debole); }
.cd-tab tr.cd-riga-annullata td { opacity: .5; text-decoration: line-through; }
.cd-tab .giallo { color: var(--ambra-800); font-weight: 600; }
[data-bs-theme="dark"] .cd-rs-sx { background: rgba(var(--ok-rgb),.22); }
[data-bs-theme="dark"] .cd-rs-val, [data-bs-theme="dark"] .cd-rs-eti { color: var(--verde-300); }
[data-bs-theme="dark"] .cd-rs-pct { color: var(--verde-300); }
[data-bs-theme="dark"] .cd-rs-sx.e-piu .cd-rs-eti, [data-bs-theme="dark"] .cd-rs-sx.e-piu .cd-rs-val, [data-bs-theme="dark"] .cd-rs-sx.e-piu .cd-rs-pct { color: var(--attenzione); }
[data-bs-theme="dark"] .cd-rs-fatto { background: var(--velo); }
@media (max-width: 767.98px) { .cd-rs-corpo { grid-template-columns: 1fr; } .cd-rs-come { margin-left: 0; } .cd-rs-azioni .hb-bt-pieno, .cd-rs-azioni .hb-bt-chiaro, .cd-rs-azioni .hbt-pieno, .cd-rs-azioni .hbt-chiaro { width: 100%; justify-content: center; } }
/* il risparmio con il dettaglio aperto: la testa resta ancorata in alto mentre si scorre la lista */
.cd-riq.cd-rs-aperto { overflow: visible; }
.cd-rs-aperto .cd-rs-corpo { position: sticky; top: 60px; z-index: 5; background: var(--superficie); border-radius: var(--r-lg) var(--r-lg) 0 0; box-shadow: var(--ombra-3); }
.cd-rs-aperto .cd-rs-sx { border-radius: var(--r-lg) 0 0 0; }
.cd-rs-aperto .cd-rs-dett { border-radius: 0 0 var(--r-lg) var(--r-lg); overflow: hidden; }
[data-bs-theme="dark"] .cd-rs-aperto .cd-rs-corpo { background: var(--bs-tertiary-bg); }
@media (max-width: 767.98px) { .cd-rs-aperto .cd-rs-corpo { top: 56px; } .cd-rs-aperto .cd-rs-sx { border-radius: var(--r-lg) var(--r-lg) 0 0; } }

/* =============================================
   NUOVO DOCUMENTO (nd2-*): la pagina della nuova commessa con il primo
   riquadro «che documento e'»: i tipi raggruppati per quello che fanno al
   magazzino, con la sigla in un angolo e l'icona del colore della
   famiglia; le righe in una tabella pulita, scritte da tastiera.
   ============================================= */
.nd2-gruppo { margin-bottom: 14px; }
.nd2-gruppo-tit { display: flex; align-items: center; gap: 6px; margin: 0 0 7px 2px; font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--testo-2); }
.nd2-gruppo-tit.nd2-f-entra i { color: var(--ok); } .nd2-gruppo-tit.nd2-f-esce i { color: var(--no); }
.nd2-gruppo-tit.nd2-f-sposta i { color: var(--blu-500); } .nd2-gruppo-tit.nd2-f-corregge i { color: var(--ambra-800); } .nd2-gruppo-tit.nd2-f-lavoro i { color: var(--blu-500); }
.nd2-gruppo-nota { font-size: .76rem; color: var(--testo-2); margin: -4px 2px 8px; line-height: 1.45; }
.nc-strade.nd2-tipi { grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 8px; }
.nd2-tipo { position: relative; padding: 12px 12px 11px; cursor: pointer; margin: 0; }
.nd2-tipo input[type="radio"] { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nd2-tipo:has(input:checked) { border-color: var(--blu-500); background: var(--hb-lavoro-ico); }
.nd2-tipo:has(input:focus-visible) { box-shadow: 0 0 0 3px rgba(var(--primario-rgb),.25); }
.nd2-tipo .nc-strada-ico { width: 30px; height: 30px; font-size: .95rem; margin-bottom: 8px; }
.nd2-tipo > span:not(.nc-strada-ico):not(.nd2-sigla) { font-size: var(--fs-xs); margin-top: 2px; }
.nd2-tipo strong { font-size: .86rem; padding-right: 34px; }
.nd2-sigla { position: absolute; top: 9px; right: 9px; font-size: .64rem; font-weight: 700; letter-spacing: .04em; color: var(--testo-2); background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-pill); padding: 1px 7px; }
.nd2-tipo.nd2-f-entra .nc-strada-ico    { background: var(--verde-50); border-color: var(--verde-200); color: var(--ok); }
.nd2-tipo.nd2-f-esce .nc-strada-ico     { background: var(--rosso-100); border-color: var(--rosso-200); color: var(--no); }
.nd2-tipo.nd2-f-lavoro .nc-strada-ico   { background: var(--blu-50); border-color: var(--blu-200); color: var(--blu-500); }
.nd2-tipo.nd2-f-sposta .nc-strada-ico   { background: var(--blu-50); border-color: var(--blu-100); color: var(--blu-500); }
.nd2-tipo.nd2-f-corregge .nc-strada-ico { background: var(--ambra-50); border-color: var(--ambra-200); color: var(--ambra-800); }
.nd2-quando-nasce { margin-top: 12px; padding: 9px 12px; border-radius: var(--r-md); background: var(--velo); font-size: var(--fs-sm); color: var(--testo-2); line-height: 1.45; }
.nd2-quando-nasce a { color: var(--blu-500); font-weight: 600; }
.nd2-avviso { margin-top: 12px; padding: 9px 12px; border-radius: var(--r-md); background: var(--ambra-50); color: var(--ambra-800); font-size: .84rem; font-weight: 600; }
.nd2-fac { font-size: var(--fs-xs); font-weight: 500; color: var(--testo-2); margin-left: 4px; text-transform: none; letter-spacing: 0; }
.nd2 .nd-avanzate { margin-top: 14px; border-top: 1px dashed var(--bordo); padding-top: 10px; }
.nd2 .nc-rq-testa .nc-rq-nota { margin-left: auto; }
.nd2 .nc-rq-testa h3 .nc-rq-nota { margin-left: 6px; font-weight: 400; }

/* le righe */
.nd2-righe { width: 100%; border-collapse: collapse; }
.nd2-righe th { font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--testo-2); padding: 10px 10px 8px; border-bottom: 1px solid var(--bordo); text-align: left; background: var(--velo); }
.nd2-righe th:first-child, .nd2-righe td:first-child { padding-left: 18px; }
.nd2-righe th.num, .nd2-righe td.num { text-align: right; }
.nd2-righe td { padding: 7px 10px; border-bottom: 1px solid var(--bordo); vertical-align: middle; font-size: .86rem; }
.nd2-righe td .form-control, .nd2-righe td .form-select, .nd2-righe td .lazy-select-wrap input[type="text"] {
    height: 36px; padding: 0 10px; font-size: .86rem; border: 1px solid var(--bordo); border-radius: var(--r-sm); box-shadow: none;
}
.nd2-righe td input.num { text-align: right; }
.nd2-righe td .form-control:focus, .nd2-righe td .lazy-select-wrap input[type="text"]:focus { border-color: var(--primario); box-shadow: 0 0 0 3px rgba(var(--primario-rgb),.09); }
.nd2-righe td .form-control[readonly] { background: var(--velo); color: var(--testo-2); }
.nd2-righe td .um-display { text-align: center; }
.nd2-conv { display: block; font-size: var(--fs-xs); color: var(--blu-500); margin-top: 2px; }
.nd2-importo { font-weight: 600; white-space: nowrap; }
.nd2-via { width: 30px; height: 30px; border-radius: var(--r-sm); border: 1px solid var(--bordo); background: var(--superficie); color: var(--testo-2); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.nd2-via:hover { background: var(--rosso-100); border-color: var(--rosso-200); color: var(--no); }
.nd2-righe tfoot td { border: 0; }
.nd2-righe tfoot td.nd2-piu-td { padding: 10px 18px; }
.nd2-righe tfoot td.nd2-tot-td { padding: 6px 18px 12px; text-align: right; border-top: 1px solid var(--bordo); }
.nd2-piu { border: 1px dashed var(--bordo-forte); background: var(--superficie); color: var(--blu-500); border-radius: var(--r-pill); height: 32px; padding: 0 14px; font-size: var(--fs-sm); font-weight: 500; display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; }
.nd2-piu:hover { background: var(--hb-lavoro-ico); border-style: solid; }
.nd2-piu .dp-piu-nota { font-weight: 400; color: var(--testo-2); margin-left: 6px; }
.nd2-tot { font-size: .85rem; color: var(--testo-2); }
.nd2-tot b { color: var(--primario); font-size: .95rem; margin-left: 6px; }
.nd2-righe .dp-sconto-nota { display: block; font-size: var(--fs-xs); color: var(--ambra-800); text-align: right; margin-top: 2px; }
.nd2-righe .dp-prezzo-cambiato { border-color: var(--ambra-200); background: var(--ambra-50); }

/* l'anteprima: l'effetto a magazzino e cosa manca */
.nd2-effetto { margin-top: 12px; padding: 10px 12px; border-radius: var(--r-md); font-size: var(--fs-sm); line-height: 1.45; display: flex; gap: 9px; align-items: flex-start; }
.nd2-effetto i { font-size: var(--fs-md); margin-top: 1px; }
.nd2-effetto.e-carico { background: var(--verde-50); color: var(--verde-700); }
.nd2-effetto.e-scarico { background: var(--rosso-100); color: var(--rosso-800); }
.nd2-manca { margin-top: 10px; font-size: var(--fs-sm); color: var(--ambra-800); line-height: 1.45; }
.nd2 .hbt.nd-spento { opacity: .5; cursor: not-allowed; }
[data-bs-theme="dark"] .nd2-sigla, [data-bs-theme="dark"] .nd2-via, [data-bs-theme="dark"] .nd2-piu { border-color: var(--bordo-forte); color: var(--testo-2); }
[data-bs-theme="dark"] .nd2-tipo:has(input:checked) { background: rgba(var(--primario-rgb),.45); }
[data-bs-theme="dark"] .nd2-righe td .form-control[readonly] { background: var(--superficie); }
@media (max-width: 767.98px) {
    .nd2-righe th:nth-child(5), .nd2-righe td:nth-child(5), .nd2-righe th:nth-child(6), .nd2-righe td:nth-child(6) { display: none; }
    .nd2-righe th:first-child, .nd2-righe td:first-child { padding-left: 12px; }
    .nd2-righe tfoot td.nd2-piu-td { padding: 10px 12px; }
    .nd2-piu .dp-piu-nota { display: none; }
    .nc-strade.nd2-tipi { grid-template-columns: 1fr 1fr; }
}
/* nuovo documento: le tendine native vestite come i campi */
.nd2 .nc-campo select { width: 100%; height: 40px; padding: 0 12px; font-size: var(--fs-base); color: var(--primario); background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-md); }
.nd2 .nc-campo select:focus { outline: 0; border-color: var(--primario); box-shadow: 0 0 0 3px rgba(var(--primario-rgb),.09); }
[data-bs-theme="dark"] .nd2 .nc-campo select { color: var(--testo); border-color: var(--bordo-forte); }

/* nuovo documento: fornitore e articolo (ricerca sul server) vestiti come le tendine dei filtri */
.nd2 .lazy-select-wrap { position: relative; }
.nd2 .lazy-select-wrap input[type="text"] {
    width: 100%; height: 40px; padding: 0 34px 0 12px; font-size: var(--fs-base); color: var(--primario);
    background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-md); box-shadow: none;
}
.nd2 .lazy-select-wrap input[type="text"]:hover { border-color: var(--bordo-forte); }
.nd2 .lazy-select-wrap input[type="text"]:focus { outline: 0; border-color: var(--primario); box-shadow: 0 0 0 3px rgba(var(--primario-rgb),.09); }
.nd2 .lazy-select-wrap::after { content: '\F282'; font-family: 'bootstrap-icons'; position: absolute; right: 12px; top: 20px; transform: translateY(-50%); color: var(--testo-2); font-size: var(--fs-sm); pointer-events: none; }
.nd2 .lazy-select-wrap:has(.lazy-select-clear:not([style*="display: none"]))::after { display: none; }
.nd2 .lazy-select-clear { right: 12px; top: 50%; transform: translateY(-50%); }
.nd2 .nd2-righe .lazy-select-wrap input[type="text"] { height: 36px; font-size: .86rem; border-radius: var(--r-sm); }
.nd2 .nd2-righe .lazy-select-wrap::after { top: 18px; }
.nd2 .lazy-select-dropdown { border: 1px solid var(--bordo); border-radius: var(--r-md); box-shadow: var(--ombra-4); padding: 6px; margin-top: 4px; }
.nd2 .lazy-select-item { padding: 8px 10px; font-size: var(--fs-base); color: var(--primario); border-radius: var(--r-sm); cursor: pointer; }
.nd2 .lazy-select-item:hover, .nd2 .lazy-select-item:focus { background: var(--velo); }
.nd2 .lazy-select-empty, .nd2 .lazy-select-loading { padding: 12px 10px; text-align: center; font-size: .85rem; }
.nd2 .nc-campo .tnd { display: block; width: 100%; }
.nd2 .nc-campo .tnd-campo { height: 40px; }
.nd2 .nd2-righe .tnd { display: block; width: 100%; }
.nd2 .nd2-righe .tnd-campo { height: 36px; font-size: .86rem; border-radius: var(--r-sm); }
[data-bs-theme="dark"] .nd2 .lazy-select-wrap input[type="text"] { color: var(--testo); border-color: var(--bordo-forte); }
/* la ricerca dentro una tendina che sta in un campo del modulo: il campo le dava la sua altezza e il suo rientro, e l icona finiva sopra alla scritta */
.nc-campo .tnd-cerca input, .nd2 .tnd-cerca input, .cd-campo .tnd-cerca input { height: 34px; padding: 0 10px 0 32px; font-size: .85rem; border-radius: var(--r-sm); }

/* la pagina del documento: le tinte che la commessa e l ordine non avevano (sposta, corregge), la pillola del tipo nel titolo */
.cd-testa h1 .el-tipo { font-size: var(--fs-xs); vertical-align: middle; margin-right: 2px; }
.cd-adesso.t-sposta { background: var(--blu-50); }
.cd-adesso.t-corregge { background: var(--ambra-50); }
.hb-bt-pieno.hb-e-esce, .hbt-pieno.hb-e-esce { background: var(--no); border-color: var(--no); }
.hb-bt-pieno.hb-e-sposta, .hbt-pieno.hb-e-sposta { background: var(--blu-500); border-color: var(--blu-500); }
.hb-bt-pieno.hb-e-sposta:hover, .hbt-pieno.hb-e-sposta:hover { background: var(--blu-700); }
.hb-bt-pieno.hb-e-corregge, .hbt-pieno.hb-e-corregge { background: var(--ambra-800); border-color: var(--ambra-800); }
.hb-bt-pieno.hb-e-corregge:hover, .hbt-pieno.hb-e-corregge:hover { background: var(--ambra-800); }
.hb-bt-pieno.hb-e-lavoro, .hbt-pieno.hb-e-lavoro { background: var(--primario); border-color: var(--primario); }
.hb-bt-pieno.hb-e-compra, .hbt-pieno.hb-e-compra { background: var(--hb-compra, var(--ambra-800)); border-color: var(--hb-compra, var(--ambra-800)); }
.cd-num .v.e-rosso { color: var(--no); }
.cd-num .v.e-viola { color: var(--blu-500); }
.cd-num .v.e-arancio { color: var(--ambra-800); }
.cd-num .v.e-poi { opacity: .55; }
.cd-legame .ic-viola { background: var(--blu-50); color: var(--blu-500); }
.cd-legame .ic-arancio { background: var(--ambra-50); color: var(--ambra-800); }
.cd-tab .mov-piu { color: var(--ok); font-weight: 600; }
.cd-tab .mov-meno { color: var(--no); font-weight: 600; }
.cd-mod .cd-campo .tnd { display: block; width: 100%; }
.cd-mod .cd-campo .tnd-campo { height: 40px; }
.cd-mod .cd-campo[hidden] { display: none; }
.cd-riq .nd2 .nd2-righe th:first-child, .cd-riq .nd2 .nd2-righe td:first-child { padding-left: 18px; }
.cd-riq .nd2 .nd2-righe td .form-control-sm { height: 36px; }
.cd-testa > div:first-child { flex: 1 1 480px; min-width: 0; }

/* ---------- nuovo documento: il carico da ordine (due vie, la bolla, le righe in arrivo) ---------- */
.nd2 .cf-vie { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 14px 18px 4px; }
.nd2 .cf-via { display: flex; gap: 12px; align-items: center; text-align: left; padding: 12px 14px; border: 1px solid var(--bordo); border-radius: var(--r-md); background: var(--superficie); cursor: pointer; font: inherit; color: var(--primario); }
.nd2 .cf-via:hover { border-color: var(--bordo-forte); }
.nd2 .cf-via.on { border-color: var(--ok); background: var(--verde-50); box-shadow: 0 0 0 3px rgba(var(--ok-rgb),.1); }
.nd2 .cf-via-ico { width: 38px; height: 38px; border-radius: var(--r-md); display: inline-flex; align-items: center; justify-content: center; font-size: var(--fs-lg); background: var(--verde-50); color: var(--ok); flex: 0 0 auto; }
.nd2 .cf-via strong { display: block; font-size: var(--fs-base); }
.nd2 .cf-via small { display: block; font-size: .76rem; color: var(--testo-2); line-height: 1.4; margin-top: 2px; }
.nd2 .cf-drop { margin: 10px 18px 14px; padding: 22px 18px; border: 2px dashed var(--bordo-forte); border-radius: var(--r-lg); background: var(--velo); display: flex; gap: 16px; align-items: center; cursor: pointer; }
.nd2 .cf-drop:hover, .nd2 .cf-drop.e-sopra { border-color: var(--ok); background: var(--verde-50); }
.nd2 .cf-drop.e-lavora { opacity: .6; pointer-events: none; }
.nd2 .cf-drop > i { font-size: var(--fs-3xl); color: var(--ok); }
.nd2 .cf-drop strong { font-size: .95rem; }
.nd2 .cf-drop > div > span { color: var(--testo-2); margin: 0 8px; font-size: .85rem; }
.nd2 .cf-drop small { display: block; margin-top: 6px; font-size: .76rem; color: var(--testo-2); line-height: 1.4; }
.nd2 .cf-letto { margin: 10px 18px 12px; padding: 12px 14px; border-radius: var(--r-md); background: var(--verde-50); color: var(--verde-700); display: flex; gap: 12px; align-items: flex-start; font-size: .84rem; line-height: 1.5; }
.nd2 .cf-letto > i { font-size: 1.3rem; margin-top: 1px; }
.nd2 .cf-letto > div { flex: 1; }
.nd2 .cf-letto .hbt { flex: 0 0 auto; }
.nd2 .cf-letto-nota { margin-top: 5px; color: var(--testo-2); }
.nd2 .cf-letto-nota.e-rossa { color: var(--rosso-800); }
.nd2 .nd2-righe.cf th, .nd2 .nd2-righe.cf td { padding-left: 6px; padding-right: 6px; }
.nd2 .nd2-righe.cf th:first-child, .nd2 .nd2-righe.cf td:first-child { padding-left: 14px; width: 34px; }
.nd2 .nd2-righe.cf tr.cf-ord td { background: var(--velo); border-bottom: 1px solid var(--bordo); padding: 8px 14px; font-size: .84rem; }
.nd2 .cf-ord-dentro { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.nd2 .nd2-righe.cf tr.cf-ord small { color: var(--testo-2); }
.nd2 .nd2-righe.cf tr.cf-ord i { color: var(--ambra-800); margin-right: 4px; }
.nd2 .cf-tutto { border: 1px solid var(--bordo-forte); background: var(--superficie); border-radius: var(--r-pill); height: 28px; padding: 0 12px; font-size: .76rem; font-weight: 600; color: var(--ok); cursor: pointer; white-space: nowrap; }
.nd2 .cf-tutto:hover { background: var(--verde-50); }
.nd2 .nd2-righe.cf tr.cf-riga td { color: var(--testo-2); }
.nd2 .nd2-righe.cf tr.cf-riga.on td { color: var(--primario); background: var(--verde-50); }
.nd2 .nd2-righe.cf tr.vuota td { color: var(--testo-2); font-size: .84rem; padding: 16px 18px; }
.nd2 .cf-cod { display: block; font-weight: 600; }
.nd2 .cf-des { display: block; font-size: .76rem; color: var(--testo-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }
.nd2 .cf-gia { color: var(--ok); font-weight: 600; }
.nd2 .cf-niente { color: var(--testo-debole); }
.nd2 .cf-nota { display: block; font-size: var(--fs-xs); color: var(--testo-2); margin-top: 3px; white-space: nowrap; }
.nd2 .cf-nota.e-rossa { color: var(--no); }
.nd2 .cf-spunta, .nd2 .cf-chiudi { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: var(--fs-sm); margin: 0; }
.nd2 .cf-spunta input, .nd2 .cf-chiudi input { width: 18px; height: 18px; accent-color: var(--ok); margin: 0; }
.nd2 .nd2-righe.cf td input.cf-ricevo { width: 76px; padding: 0 6px; }
.nd2 .nd2-righe.cf td input.cf-prezzo { width: 78px; padding: 0 6px; }
.nd2 .nd2-righe.cf td input.cf-prezzo.e-diverso { border-color: var(--ambra-200); background: var(--ambra-50); }
.nd2 .nd2-righe.cf td input:disabled { background: var(--velo); color: var(--testo-debole); border-color: var(--bordo); }
.nd2 .nd2-righe.cf th.num, .nd2 .nd2-righe.cf td.num { white-space: nowrap; }
.nd2 .nd2-righe.cf { min-width: 640px; }
@media (max-width: 767.98px) {
    .nd2 .cf-vie { grid-template-columns: 1fr; padding: 12px 12px 4px; }
    .nd2 .cf-drop { margin: 10px 12px; flex-direction: column; text-align: center; }
    .nd2 .cf-letto { margin: 10px 12px; flex-wrap: wrap; }
    .nd2 .nd2-righe.cf th:nth-child(3), .nd2 .nd2-righe.cf td:nth-child(3), .nd2 .nd2-righe.cf th:nth-child(4), .nd2 .nd2-righe.cf td:nth-child(4) { display: none; }
    .nd2 .nd2-righe.cf { min-width: 520px; }
    .nd2 .cf-des { max-width: 120px; }
}
[data-bs-theme="dark"] .nd2 .cf-via, [data-bs-theme="dark"] .nd2 .cf-tutto { border-color: var(--bordo-forte); color: var(--testo); }
[data-bs-theme="dark"] .nd2 .cf-via.on { background: var(--verde-800); border-color: var(--verde-500); }
[data-bs-theme="dark"] .nd2 .cf-drop { background: var(--superficie); }
[data-bs-theme="dark"] .nd2 .cf-letto { background: var(--verde-800); color: var(--verde-300); }
[data-bs-theme="dark"] .nd2 .nd2-righe.cf tr.cf-riga.on td { background: var(--superficie); color: var(--testo); }
[data-bs-theme="dark"] .nd2 .nd2-righe.cf tr.cf-ord td { background: var(--superficie); }
/* il carico da ordine: colonne strette, il riquadro non sborda; sul telefono restano resta e ricevo */
#ndCf .nc-rq-testa h3 { white-space: nowrap; }
.nd2 .nd2-righe.cf { min-width: 0; table-layout: auto; }
.nd2 .nd2-righe.cf th { padding-top: 8px; padding-bottom: 6px; font-size: .64rem; letter-spacing: .04em; }
.nd2 .nd2-righe.cf th:nth-child(6) { width: 84px; } .nd2 .nd2-righe.cf th:nth-child(7) { width: 104px; } .nd2 .nd2-righe.cf th:nth-child(8) { width: 82px; } .nd2 .nd2-righe.cf th:nth-child(9) { width: 84px; }
.nd2 .nd2-righe.cf td input.cf-ricevo { width: 70px; } .nd2 .nd2-righe.cf td input.cf-prezzo { width: 72px; }
.nd2 .cf-des { max-width: 140px; }
.nd2 .cf-nota { white-space: normal; }
@media (max-width: 767.98px) { .nd2 .nd2-righe.cf th:nth-child(5), .nd2 .nd2-righe.cf td:nth-child(5), .nd2 .nd2-righe.cf th:nth-child(6), .nd2 .nd2-righe.cf td:nth-child(6) { display: table-cell; } .nd2 .nd2-righe.cf th:nth-child(7), .nd2 .nd2-righe.cf td:nth-child(7) { width: 90px; } .nd2 .nd2-righe.cf { min-width: 480px; } }

/* sette colonne: in ordine (con il gia' arrivato sotto), resta, ricevo ora (con il resto sotto), prezzo, importo */
.nd2 .nd2-righe.cf th:nth-child(5) { width: 100px; } .nd2 .nd2-righe.cf th:nth-child(6) { width: 84px; } .nd2 .nd2-righe.cf th:nth-child(7) { width: 88px; }
.nd2 .nd2-righe.cf th:nth-child(8), .nd2 .nd2-righe.cf th:nth-child(9) { width: auto; }
.nd2 .nd2-righe.cf td .cf-chiudi { margin-top: 4px; justify-content: flex-end; width: 100%; }
.nd2 .nd2-righe.cf td .cf-nota { text-align: right; }
@media (max-width: 767.98px) {
    .nd2 .nd2-righe.cf th:nth-child(4), .nd2 .nd2-righe.cf td:nth-child(4), .nd2 .nd2-righe.cf th:nth-child(5), .nd2 .nd2-righe.cf td:nth-child(5), .nd2 .nd2-righe.cf th:nth-child(6), .nd2 .nd2-righe.cf td:nth-child(6) { display: table-cell; }
    .nd2 .nd2-righe.cf th:nth-child(3), .nd2 .nd2-righe.cf td:nth-child(3), .nd2 .nd2-righe.cf th:nth-child(7), .nd2 .nd2-righe.cf td:nth-child(7) { display: none; }
    .nd2 .nd2-righe.cf { min-width: 0; }
    #ndCf .nc-rq-testa { flex-wrap: wrap; }
    #ndCf .nc-rq-testa > .nc-rq-nota:last-child { flex-basis: 100%; text-align: left; }
}
@media (max-width: 767.98px) { .nd2 .nd2-righe.cf th:nth-child(6), .nd2 .nd2-righe.cf td:nth-child(6) { display: none; } .nd2 .cf-des { max-width: 150px; } .nd2 .cf-tutto { height: 26px; padding: 0 9px; font-size: var(--fs-xs); } }

/* carico da ordine, via a mano: i filtri come quelli degli elenchi */
.nd2 .cf-filtri { padding: 4px 18px 0; }
.nd2 .cf-filtri .el-barra { margin-bottom: 10px; }
.nd2 .cf-filtri .el-pannello { margin-bottom: 12px; }
.nd2 .cf-filtri .el-fondo { justify-content: space-between; }
.nd2 .cf-filtri button.el-azzera { border: 0; background: none; padding: 0; cursor: pointer; font: inherit; }
.nd2 .cf-trovate { font-size: var(--fs-sm); color: var(--testo-2); }
.nd2 .cf-link { border: 0; background: none; padding: 0; color: var(--blu-500); font-weight: 600; text-decoration: underline; cursor: pointer; font: inherit; }
@media (max-width: 767.98px) { .nd2 .cf-filtri { padding: 4px 12px 0; } }

/* nuova commessa: «gia' importata» e righe fuori catalogo, in arancio, vicino al file */
.nc-gia { margin-top: 12px; margin-bottom: 0; flex-wrap: wrap; line-height: 1.5; justify-content: flex-start; text-align: left; font-weight: 500; }
.nc-gia > span { flex: 1 1 100%; }
.nc-gia-sost { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-sm); font-weight: 600; cursor: pointer; margin: 0; }
.nc-gia-sost input { width: 17px; height: 17px; accent-color: var(--hb-compra-scuro, var(--ambra-800)); margin: 0; }

/* ---------- finestre nello stile nuovo (.dp-mod): conferma dell'ordine, e le prossime ---------- */
.dp-mod .modal-content { border: 0; border-radius: 18px; box-shadow: var(--ombra-4); overflow: visible; }
.dp-mod .modal-dialog { max-width: 500px; }
.dp-mod-testa { display: flex; gap: 14px; align-items: flex-start; padding: 22px 22px 6px; }
.dp-mod-testa h5 { margin: 0 0 4px; font-size: 1.08rem; font-weight: 700; color: var(--primario); }
.dp-mod-testa p { margin: 0; font-size: .86rem; color: var(--testo-2); line-height: 1.45; }
.dp-mod-ico { width: 44px; height: 44px; flex: 0 0 auto; border-radius: var(--r-md); display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; }
.dp-mod-ico.t-lavoro { background: var(--hb-lavoro-ico); color: var(--blu-500); }
.dp-mod-ico.t-entra { background: var(--verde-50); color: var(--ok); }
.dp-mod-ico.t-esce { background: var(--rosso-100); color: var(--no); }
.dp-mod-x { margin-left: auto; border: 0; background: none; width: 32px; height: 32px; border-radius: var(--r-sm); color: var(--testo-2); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.dp-mod-x:hover { background: var(--velo); color: var(--primario); }
.dp-mod-corpo { padding: 14px 22px 6px; }
.dp-mod-riepilogo { display: grid; grid-template-columns: 1.6fr .6fr 1fr; gap: 0; border: 1px solid var(--bordo); border-radius: var(--r-md); background: var(--velo); margin-bottom: 16px; }
.dp-mod-riepilogo > div { padding: 10px 12px; min-width: 0; }
.dp-mod-riepilogo > div + div { border-left: 1px solid var(--bordo); }
.dp-mod-riepilogo span { display: block; font-size: .66rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--testo-2); margin-bottom: 2px; }
.dp-mod-riepilogo b { display: block; font-size: var(--fs-base); color: var(--primario); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-mod-campo { display: flex; flex-direction: column; gap: 6px; }
.dp-mod-campo label { font-size: var(--fs-sm); font-weight: 700; color: var(--testo-2); }
.dp-mod-campo .tnd { display: block; width: 100%; }
.dp-mod-campo .tnd-campo { height: 42px; }
.dp-mod-aiuto { font-size: var(--fs-sm); color: var(--testo-2); line-height: 1.45; }
.dp-mod-piede { display: flex; justify-content: flex-end; gap: 8px; padding: 16px 22px 20px; }
.dp-mod-piede .hb-bt-chiaro, .dp-mod-piede .hb-bt-pieno, .dp-mod-piede .hbt-chiaro, .dp-mod-piede .hbt-pieno { height: 42px; padding: 0 16px; }
@media (max-width: 575.98px) {
    .dp-mod-riepilogo { grid-template-columns: 1fr 1fr; }
    .dp-mod-riepilogo > div:first-child { grid-column: span 2; border-bottom: 1px solid var(--bordo); }
    .dp-mod-riepilogo > div:nth-child(2) { border-left: 0; }
    .dp-mod-piede { flex-direction: column-reverse; }
    .dp-mod-piede > * { width: 100%; justify-content: center; }
}
[data-bs-theme="dark"] .dp-mod .modal-content { background: var(--superficie); }
[data-bs-theme="dark"] .dp-mod-riepilogo { background: var(--superficie); }
[data-bs-theme="dark"] .dp-mod-riepilogo > div + div { border-color: var(--bordo); }
[data-bs-theme="dark"] .dp-mod-testa h5, [data-bs-theme="dark"] .dp-mod-riepilogo b { color: var(--testo); }
/* la ricezione: si arriva sui dati del documento, sotto all'intestazione fissa */
#ndDati, #ndStrade, #ndCommessa { scroll-margin-top: 76px; }
.dp-mod-riepilogo .price { display: inline-flex; gap: 3px; white-space: nowrap; }
.dp-mod-riepilogo { grid-template-columns: 1.4fr .5fr 1.3fr; }

/* gli avvisi: sotto la testata, cosi' il menu del profilo resta raggiungibile.
   Da computer al centro della pagina (a destra del menu), sulla
   riga del titolo: in alto a destra coprivano i pulsanti della pagina. */
#toastContainer.toast-container { top: 64px !important; }
@media (min-width: 992px) { #toastContainer.toast-container { right: auto !important; left: calc(50% + var(--sidebar-width, 0px) / 2) !important; transform: translateX(-50%); } }
@media (max-width: 991.98px) { #toastContainer.toast-container { top: 58px !important; } }

/* la rotellina dentro ai pulsanti che stanno lavorando */
.dp-rotella { display: inline-block; width: 1em; height: 1em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: dpGira .7s linear infinite; vertical-align: -0.125em; margin-right: .45em; flex: 0 0 auto; }
@keyframes dpGira { to { transform: rotate(360deg); } }
.dp-carica { pointer-events: none; opacity: .85; }
.dp-carica > i.bi:first-of-type { display: none; }

/* finestre: i colori che mancavano, il testo lungo */
.dp-mod-ico.t-compra { background: var(--hb-compra-ico); color: var(--hb-compra-scuro, var(--ambra-800)); }
.dp-mod-ico.t-sposta { background: var(--blu-50); color: var(--blu-500); }
.dp-mod-ico.t-corregge { background: var(--ambra-50); color: var(--ambra-800); }
.dp-mod-testo { font-size: var(--fs-base); color: var(--testo-2); line-height: 1.5; margin-top: 2px; }
.dp-mod-testo ul { margin: 6px 0; padding-left: 18px; }
.dp-mod-piccolo { font-size: var(--fs-sm); color: var(--testo-2); }
.dp-mod-piede .hb-bt-pieno.hb-e-entra, .dp-mod-piede .hbt-pieno.hb-e-entra { background: var(--ok); border-color: var(--ok); color: var(--su-primario); }
.dp-mod-piede .hb-bt-pieno.hb-e-esce, .dp-mod-piede .hbt-pieno.hb-e-esce { background: var(--no); border-color: var(--no); color: var(--su-primario); }
[data-bs-theme="dark"] .dp-mod-testo { color: var(--testo-2); }

/* ricezione: sei colonne, l'articolo stringe e «ricevo ora» ha il suo spazio */
/* la chiusura della commessa dentro «Nuovo documento» */
.nd2 .sp-testa { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 18px; border-bottom: 1px solid var(--bordo); font-size: .84rem; }
.nd2 .sp-testa a { color: var(--blu-500); font-weight: 600; }
.nd2 .sp-bt { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.nd2 .sp-manca { margin: 10px 18px 0; padding: 10px 12px; border-radius: var(--r-md); background: var(--hb-compra-ico); color: var(--hb-compra-testo); font-size: var(--fs-sm); line-height: 1.45; }
.nd2 .nd2-righe.sp { table-layout: fixed; width: 100%; }
.nd2 .nd2-righe.sp td:first-child { overflow: hidden; }
.nd2 .nd2-righe.sp .cf-des { max-width: 100%; }
.nd2 .nd2-righe.sp tr.e-zero td { color: var(--testo-2); }
.nd2 .nd2-righe.sp tr.e-manca td { background: var(--ambra-50); }
.nd2 .sp-rosso { color: var(--no); font-weight: 600; }
.nd2 .nd2-righe.sp td input.sp-qta { width: 100px; margin-left: auto; }
@media (max-width: 767.98px) {
    .nd2 .sp-testa { padding: 10px 12px; }
    .nd2 .nd2-righe.sp th:nth-child(2), .nd2 .nd2-righe.sp td:nth-child(2) { display: none; }
    .nd2 .nd2-righe.sp th:nth-child(5), .nd2 .nd2-righe.sp td:nth-child(5) { display: none; }
    .nd2 .nd2-righe.sp td input.sp-qta { width: 86px; }
}
.nd2 .nd2-righe.sp { table-layout: auto; }
.nd2 .nd2-righe.sp td:first-child { min-width: 170px; max-width: 240px; }
.nd2 .nd2-righe.sp th:nth-child(2), .nd2 .nd2-righe.sp th:nth-child(3) { width: 96px; } .nd2 .nd2-righe.sp th:nth-child(4) { width: 112px; } .nd2 .nd2-righe.sp th:nth-child(5) { width: 96px; }
.nd2 .nd2-righe.sp td input.sp-qta { width: 96px; }
@media (max-width: 767.98px) { .nd2 .nd2-righe.sp td:first-child { min-width: 0; } }
.nd2 .cf-solo-tel { display: none; }
@media (max-width: 767.98px) {
            .nd2 .cf-solo-tel { display: block; text-align: left !important; }
}
/* calendario: i giorni che non si possono scegliere (prima di oggi, per le consegne) */
.tnd-cal-n.e-spento, .tnd-cal-n:disabled { color: var(--testo-debole); background: none; cursor: not-allowed; text-decoration: line-through; text-decoration-color: rgba(154,163,175,.6); }
.tnd-cal-n.e-spento:hover { background: none; }
[data-bs-theme="dark"] .tnd-cal-n.e-spento { color: var(--testo); }

/* ricezione: le righe in arrivo a tutta larghezza, sette colonne che ci stanno */
.nd2 .nd2-righe.cf.cf7 { table-layout: fixed; width: 100%; min-width: 860px; }
.nd2 .nd2-righe.cf.cf7 th, .nd2 .nd2-righe.cf.cf7 td { display: table-cell; padding-left: 10px; padding-right: 10px; }
.nd2 .nd2-righe.cf.cf7 th:first-child, .nd2 .nd2-righe.cf.cf7 td:first-child { padding-left: 16px; }
.nd2 .nd2-righe.cf.cf7 col.c-sp  { width: 46px; }
.nd2 .nd2-righe.cf.cf7 col.c-art { width: auto; }
.nd2 .nd2-righe.cf.cf7 col.c-ord { width: 110px; }
.nd2 .nd2-righe.cf.cf7 col.c-arr { width: 120px; }
.nd2 .nd2-righe.cf.cf7 col.c-ric { width: 210px; }
.nd2 .nd2-righe.cf.cf7 col.c-pre { width: 116px; }
.nd2 .nd2-righe.cf.cf7 col.c-imp { width: 116px; }
.nd2 .nd2-righe.cf.cf7 td:nth-child(2) { overflow: hidden; }
.nd2 .nd2-righe.cf.cf7 .cf-cod, .nd2 .nd2-righe.cf.cf7 .cf-des { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.nd2 .nd2-righe.cf.cf7 td input.cf-ricevo { width: 100px; margin-left: auto; }
.nd2 .nd2-righe.cf.cf7 td input.cf-prezzo { width: 96px; margin-left: auto; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric .cf-chiudi { display: flex; justify-content: flex-end; white-space: nowrap; margin-top: 5px; }
.nd2 .nd2-righe.cf.cf7 td .cf-nota { white-space: normal; text-align: right; }
.nd2 .nd2-righe.cf.cf7 .nd2-importo { font-size: var(--fs-base); }
.nd2 .nd2-righe.cf.cf7 .cf-solo-tel { display: none; }
@media (max-width: 1199.98px) { .nd2 .nd2-righe.cf.cf7 col.c-ric { width: 180px; } .nd2 .nd2-righe.cf.cf7 col.c-pre, .nd2 .nd2-righe.cf.cf7 col.c-imp { width: 104px; } }
@media (max-width: 767.98px) {
    .nd2 .nd2-righe.cf.cf7 { table-layout: auto; min-width: 0; }
    .nd2 .nd2-righe.cf.cf7 th:nth-child(3), .nd2 .nd2-righe.cf.cf7 td:nth-child(3),
    .nd2 .nd2-righe.cf.cf7 th:nth-child(4), .nd2 .nd2-righe.cf.cf7 td:nth-child(4),
    .nd2 .nd2-righe.cf.cf7 th:nth-child(6), .nd2 .nd2-righe.cf.cf7 td:nth-child(6),
    .nd2 .nd2-righe.cf.cf7 th:nth-child(7), .nd2 .nd2-righe.cf.cf7 td:nth-child(7) { display: none; }
    .nd2 .nd2-righe.cf.cf7 td:nth-child(2) { width: 100%; max-width: 0; }
    .nd2 .nd2-righe.cf.cf7 td:nth-child(5) { width: 140px; min-width: 140px; }
    .nd2 .nd2-righe.cf.cf7 .cf-solo-tel { display: block; text-align: left; }
    .nd2 .nd2-righe.cf.cf7 th:first-child, .nd2 .nd2-righe.cf.cf7 td:first-child { padding-left: 12px; }
}

/* ricezione, di nuovo nella colonna: l articolo stretto, lo spazio alle quantita */
.nd2 .nd2-righe.cf.cf7 { min-width: 600px; font-size: .84rem; }
.nd2 .nd2-righe.cf.cf7 th, .nd2 .nd2-righe.cf.cf7 td { padding-left: 6px; padding-right: 6px; }
.nd2 .nd2-righe.cf.cf7 th:first-child, .nd2 .nd2-righe.cf.cf7 td:first-child { padding-left: 12px; }
.nd2 .nd2-righe.cf.cf7 th { font-size: .62rem; letter-spacing: .03em; }
.nd2 .nd2-righe.cf.cf7 col.c-sp  { width: 34px; }
.nd2 .nd2-righe.cf.cf7 col.c-art { width: 118px; }
.nd2 .nd2-righe.cf.cf7 col.c-ord { width: auto; }
.nd2 .nd2-righe.cf.cf7 col.c-arr { width: auto; }
.nd2 .nd2-righe.cf.cf7 col.c-ric { width: 124px; }
.nd2 .nd2-righe.cf.cf7 col.c-pre { width: 82px; }
.nd2 .nd2-righe.cf.cf7 col.c-imp { width: 84px; }
.nd2 .nd2-righe.cf.cf7 .cf-des { font-size: var(--fs-xs); }
.nd2 .nd2-righe.cf.cf7 td input.cf-ricevo { width: 76px; }
.nd2 .nd2-righe.cf.cf7 td input.cf-prezzo { width: 72px; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric .cf-chiudi { font-size: var(--fs-xs); gap: 4px; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric .cf-chiudi input { width: 15px; height: 15px; }
.nd2 .nd2-righe.cf.cf7 .cf-nota { font-size: .66rem; }
.nd2 .nd2-righe.cf.cf7 .nd2-importo { font-size: var(--fs-sm); }
@media (max-width: 1199.98px) { .nd2 .nd2-righe.cf.cf7 col.c-ric { width: 124px; } .nd2 .nd2-righe.cf.cf7 col.c-pre { width: 82px; } .nd2 .nd2-righe.cf.cf7 col.c-imp { width: 84px; } }
@media (max-width: 767.98px) { .nd2 .nd2-righe.cf.cf7 { min-width: 0; } .nd2 .nd2-righe.cf.cf7 col.c-art { width: auto; } }
.nd2 .nd2-righe.cf.cf7 { min-width: 0; }
.nd2 .nd2-righe.cf.cf7 col.c-art { width: 112px; } .nd2 .nd2-righe.cf.cf7 col.c-ric { width: 120px; } .nd2 .nd2-righe.cf.cf7 col.c-pre { width: 78px; } .nd2 .nd2-righe.cf.cf7 col.c-imp { width: 80px; }
.nd2 .nd2-righe.cf.cf7 th:last-child, .nd2 .nd2-righe.cf.cf7 td:last-child { padding-right: 14px; }
@media (max-width: 767.98px) { .nd2 .nd2-righe.cf.cf7 col.c-art { width: auto; } }

/* ricezione: ordinati e arrivati vicini, «ricevo ora» larga con chiudi/avviso accanto al campo */
.nd2 .nd2-righe.cf.cf7 col.c-sp  { width: 32px; }
.nd2 .nd2-righe.cf.cf7 col.c-art { width: 112px; }
.nd2 .nd2-righe.cf.cf7 col.c-ord { width: 64px; }
.nd2 .nd2-righe.cf.cf7 col.c-arr { width: 72px; }
.nd2 .nd2-righe.cf.cf7 col.c-ric { width: auto; }
.nd2 .nd2-righe.cf.cf7 col.c-pre { width: 78px; }
.nd2 .nd2-righe.cf.cf7 col.c-imp { width: 82px; }
.nd2 .nd2-righe.cf.cf7 th:nth-child(5) { text-align: left; padding-left: 14px; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric { text-align: left; padding-left: 14px; }
.nd2 .cf-ric-in { display: flex; align-items: center; gap: 8px; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric input.cf-ricevo { width: 68px; flex: 0 0 68px; margin: 0; }
.nd2 .cf-ric-dx { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric .cf-chiudi { display: inline-flex; justify-content: flex-start; margin: 0; white-space: nowrap; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric .cf-nota { text-align: left; margin: 0; white-space: nowrap; }
/* la riga dice com e andata: rosso tenue se arriva meno del dovuto, verde tenue se di piu */
.nd2 .nd2-righe.cf tr.cf-riga.on.e-meno td { background: var(--rosso-50); }
.nd2 .nd2-righe.cf tr.cf-riga.on.e-meno td:first-child { box-shadow: inset 3px 0 0 var(--rosso-300); }
.nd2 .nd2-righe.cf tr.cf-riga.on.e-piu td { background: var(--verde-50); }
.nd2 .nd2-righe.cf tr.cf-riga.on.e-piu td:first-child { box-shadow: inset 3px 0 0 var(--verde-300); }
.nd2 .nd2-righe.cf tr.cf-riga.e-piu .cf-nota.e-rossa { color: var(--ok); }
[data-bs-theme="dark"] .nd2 .nd2-righe.cf tr.cf-riga.on.e-meno td { background: rgba(var(--no-rgb),.14); }
[data-bs-theme="dark"] .nd2 .nd2-righe.cf tr.cf-riga.on.e-piu td { background: rgba(var(--ok-rgb),.16); }
@media (max-width: 767.98px) { .nd2 .nd2-righe.cf.cf7 td.cf-ric { width: 150px; min-width: 150px; padding-left: 6px; } .nd2 .cf-ric-in { flex-wrap: wrap; gap: 4px; } }
.nd2 .nd2-righe.cf.cf7 col.c-sp { width: 30px; } .nd2 .nd2-righe.cf.cf7 col.c-art { width: 98px; } .nd2 .nd2-righe.cf.cf7 col.c-ord { width: 58px; } .nd2 .nd2-righe.cf.cf7 col.c-arr { width: 66px; } .nd2 .nd2-righe.cf.cf7 col.c-pre { width: 70px; } .nd2 .nd2-righe.cf.cf7 col.c-imp { width: 76px; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric input.cf-ricevo { width: 60px; flex: 0 0 60px; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric .cf-nota { white-space: normal; line-height: 1.25; }
.nd2 .nd2-righe.cf.cf7 td.cf-ric { overflow: hidden; padding-right: 4px; }
.nd2 .nd2-righe.cf.cf7 td input.cf-prezzo { width: 62px; }
.nd2 .nd2-righe.cf.cf7 col.c-art { width: auto; } .nd2 .nd2-righe.cf.cf7 col.c-ric { width: 200px; }
@media (max-width: 1199.98px) { .nd2 .nd2-righe.cf.cf7 col.c-ric { width: 200px; } .nd2 .nd2-righe.cf.cf7 col.c-pre { width: 70px; } .nd2 .nd2-righe.cf.cf7 col.c-imp { width: 76px; } }
.nd2 .nd2-righe.cf.cf7 col.c-arr { width: 74px; } .nd2 .nd2-righe.cf.cf7 td:nth-child(4) .cf-nota { white-space: nowrap; }

/* ricezione: l articolo ha una larghezza fissa, lo spazio in piu va alle altre colonne */
.nd2 .nd2-righe.cf.cf7 { table-layout: fixed; width: 100%; }
.nd2 .nd2-righe.cf.cf7 col.c-sp { width: 30px; }
.nd2 .nd2-righe.cf.cf7 col.c-art { width: 120px; }
.nd2 .nd2-righe.cf.cf7 col.c-ord { width: 10%; }
.nd2 .nd2-righe.cf.cf7 col.c-arr { width: 12%; }
.nd2 .nd2-righe.cf.cf7 col.c-ric { width: 31%; }
.nd2 .nd2-righe.cf.cf7 col.c-pre { width: 11%; }
.nd2 .nd2-righe.cf.cf7 col.c-imp { width: 12%; }
.nd2 .nd2-righe.cf.cf7 td:nth-child(2) { overflow: hidden; }
.nd2 .nd2-righe.cf.cf7 td:nth-child(2) .cf-des { display: block; overflow-wrap: anywhere; }
.nd2 .nd2-righe.cf.cf7 col.c-ric { width: auto; }
.nd2 .nd2-righe.cf.cf7 col.c-art { width: 16%; } .nd2 .nd2-righe.cf.cf7 col.c-ord { width: 10%; } .nd2 .nd2-righe.cf.cf7 col.c-arr { width: 11%; } .nd2 .nd2-righe.cf.cf7 col.c-ric { width: 39%; } .nd2 .nd2-righe.cf.cf7 col.c-pre { width: 12%; } .nd2 .nd2-righe.cf.cf7 col.c-imp { width: 12%; }
.nd2 .nd2-righe.cf.cf7 td:nth-child(2) .cf-des, .nd2 .nd2-righe.cf.cf7 td:nth-child(2) .cf-cod { white-space: normal; text-overflow: clip; overflow: visible; max-width: none; line-height: 1.25; }

/* ricezione: ordinati, arrivati e ricevo ora alla stessa distanza (colonne uguali, numeri al centro) */
.nd2 .nd2-righe.cf.cf7 col.c-art { width: 16%; } .nd2 .nd2-righe.cf.cf7 col.c-ord { width: 12%; } .nd2 .nd2-righe.cf.cf7 col.c-arr { width: 12%; } .nd2 .nd2-righe.cf.cf7 col.c-ric { width: 36%; } .nd2 .nd2-righe.cf.cf7 col.c-pre { width: 12%; } .nd2 .nd2-righe.cf.cf7 col.c-imp { width: 12%; }
.nd2 .nd2-righe.cf.cf7 th:nth-child(3), .nd2 .nd2-righe.cf.cf7 th:nth-child(4), .nd2 .nd2-righe.cf.cf7 tr.cf-riga td:nth-child(3), .nd2 .nd2-righe.cf.cf7 tr.cf-riga td:nth-child(4) { text-align: center; }
.nd2 .nd2-righe.cf.cf7 th:nth-child(5) { padding-left: 10px; } .nd2 .nd2-righe.cf.cf7 td.cf-ric { padding-left: 10px; }

/* ---- Classi costruite nei template con un suffisso variabile (dg-s{{ w }},
   role-{{ ruolo }}, anteprima-{{ tema }}): la pulizia del 22/10/2026 le
   aveva prese per morte. ---- */
/* Ordini fornitore + cliente — riepilogo totali in cima alla testata */
.order-summary-card { border: 1px solid rgba(var(--blu-500-rgb),0.15); }
.order-totals-row { border-radius: var(--r-sm); }
.order-summary-card .fs-3 { line-height: 1.1; }


/* =============================================
   PAGINE A PASSI (im-*): importa catalogo, chiusura anno.
   Tre schede una sotto l'altra: quella in corso e' aperta, quella fatta
   resta sopra con la spunta verde. Solo ruoli, niente colori scritti.
   ============================================= */
.im-testata { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.im-testata h2 { margin: 0; font-weight: 700; }
.im-testata .im-sotto { color: var(--testo-2); font-size: var(--fs-sm); margin-top: 2px; max-width: 70ch; }
.im-testata .im-bt-gruppo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.im-passi { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 0; margin: 0 0 16px; }
.im-passi li { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: var(--r-md); background: var(--superficie); border: 1px solid var(--bordo); color: var(--testo-2); font-size: var(--fs-sm); }
.im-passi li b { display: block; color: var(--primario); font-size: var(--fs-base); }
.im-n { width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--velo); color: var(--testo-2); font-weight: 700; font-size: var(--fs-sm); flex: 0 0 auto; }
.im-passi li.is-on { border-color: var(--primario); }
.im-passi li.is-on .im-n { background: var(--primario); color: var(--su-primario); }
.im-passi li.is-fatto .im-n { background: var(--accento-tenue); color: var(--accento-forte); }
.im-card { background: var(--superficie); border: 1px solid var(--bordo); border-radius: var(--r-lg); margin-bottom: 16px; }
.im-card[hidden] { display: none; }
.im-card-testa { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--bordo); }
.im-card-testa h3 { margin: 0; font-size: var(--fs-md); font-weight: 700; color: var(--primario); }
.im-card-testa p { margin: 1px 0 0; font-size: var(--fs-sm); color: var(--testo-2); }
.im-card-testa .im-n { width: 34px; height: 34px; border-radius: var(--r-md); background: var(--primario-tenue); color: var(--primario); }
.im-card.is-fatta .im-card-testa .im-n { background: var(--accento-tenue); color: var(--accento-forte); }
.im-card-testa .im-stato { margin-left: auto; font-size: var(--fs-sm); color: var(--testo-2); white-space: nowrap; }
.im-card-corpo { padding: 16px 18px; }
.im-info { min-height: 40px; display: flex; align-items: center; padding: 8px 12px; border-radius: var(--r-md); background: var(--primario-tenue); color: var(--testo); font-size: var(--fs-sm); line-height: 1.35; }
.im-file { margin-top: 14px; border: 1px solid var(--bordo); border-radius: var(--r-md); overflow: hidden; }
.im-file[hidden] { display: none; }
.im-file-testa { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--ok-tenue); color: var(--ok); font-size: var(--fs-sm); flex-wrap: wrap; }
.im-file-testa > i { font-size: var(--fs-xl); }
.im-file-testa .hbt { margin-left: auto; }
.im-fogli { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 14px 4px; }
.im-fogli-tit { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--testo-2); padding: 10px 14px 0; }
.im-foglio { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: var(--r-pill); background: var(--superficie); border: 1px solid var(--bordo); font-size: var(--fs-xs); color: var(--testo); }
.im-foglio i { color: var(--ok); }
.im-foglio.e-no { color: var(--testo-debole); border-style: dashed; }
.im-foglio.e-no i { color: var(--testo-debole); }
.im-foglio.e-err i { color: var(--no); }
.im-barra { padding: 10px 14px 12px; }
.im-barra[hidden] { display: none; }
.im-barra-fondo { height: 8px; border-radius: var(--r-pill); background: var(--velo); overflow: hidden; }
.im-barra-piena { height: 100%; width: 0; background: var(--accento-forte); transition: width .3s; }
.im-barra-piena.e-gira { width: 35%; animation: imGira 1.2s ease-in-out infinite; }
@keyframes imGira { from { margin-left: -35%; } to { margin-left: 100%; } }
.im-barra-testo { display: flex; justify-content: space-between; font-size: var(--fs-xs); color: var(--testo-2); margin-top: 6px; }
.im-azione { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 10px 14px 14px; flex-wrap: wrap; }
.im-azione .aiuto { margin-right: auto; }
.im-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.im-tile { border: 1px solid var(--bordo); border-radius: var(--r-md); padding: 12px 14px; cursor: pointer; background: var(--superficie); text-align: left; font: inherit; color: var(--testo); position: relative; }
.im-tile:hover { background: var(--velo); }
.im-tile b { display: block; font-size: var(--fs-2xl); font-variant-numeric: tabular-nums; line-height: 1.1; }
.im-tile span { font-size: var(--fs-sm); color: var(--testo-2); display: block; margin-top: 2px; }
.im-tile small { display: block; font-size: var(--fs-xs); color: var(--testo-2); margin-top: 4px; }
.im-tile.e-nuovi b { color: var(--ok); }
.im-tile.e-agg b { color: var(--ambra-testo); }
.im-tile.e-ug b { color: var(--testo-2); }
.im-tile.e-err b { color: var(--no); }
.im-tile .im-spunta { position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; border-radius: var(--r-sm); border: 1px solid var(--bordo-forte); display: inline-flex; align-items: center; justify-content: center; font-size: var(--fs-xs); color: var(--su-primario); background: var(--superficie); }
.im-tile.on .im-spunta { background: var(--ok); border-color: var(--ok); }
.im-tile.off { opacity: .55; }
.im-filtri { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px 14px; margin-bottom: 10px; }
.im-filtri .an-campo label { font-size: var(--fs-xs); }
.im-da-a { display: flex; gap: 6px; }
.im-da-a input { min-width: 0; }
.im-toggles { display: flex; gap: 18px; flex-wrap: wrap; margin: 4px 0 14px; }
.im-toggles .an-interr { height: auto; font-size: var(--fs-sm); }
.im-piede { position: sticky; bottom: 0; display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 18px; border-top: 1px solid var(--bordo); background: var(--velo); border-radius: 0 0 var(--r-lg) var(--r-lg); z-index: 2; }
.im-piede .im-barra { flex: 1 1 100%; padding: 0; }
.im-somma { font-size: var(--fs-base); color: var(--testo); }
.im-somma b { color: var(--primario); }
.im-bt { display: flex; gap: 8px; flex-wrap: wrap; }
.im-esito { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 16px; }
.im-esito-big { padding: 18px; border-radius: var(--r-lg); background: var(--ok-tenue); }
.im-esito-big.e-attenzione { background: var(--attenzione-tenue); }
.im-esito-big h4 { margin: 0 0 6px; font-size: var(--fs-lg); color: var(--ok); display: flex; align-items: center; gap: 8px; }
.im-esito-big.e-attenzione h4 { color: var(--ambra-testo); }
.im-esito-big p { margin: 0; color: var(--testo); font-size: var(--fs-sm); }
.im-numeri { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.im-numeri div { background: var(--superficie); border-radius: var(--r-md); padding: 8px 10px; }
.im-numeri b { display: block; font-size: var(--fs-lg); color: var(--primario); font-variant-numeric: tabular-nums; }
.im-numeri span { font-size: var(--fs-xs); color: var(--testo-2); }
.im-poi-tit { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--testo-2); margin-bottom: 8px; }
.im-poi { display: flex; flex-direction: column; gap: 8px; }
.im-poi a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--bordo); border-radius: var(--r-md); text-decoration: none; color: var(--primario); font-size: var(--fs-sm); font-weight: 600; }
.im-poi a i { color: var(--primario); font-size: var(--fs-lg); }
.im-poi a small { display: block; color: var(--testo-2); font-size: var(--fs-xs); font-weight: 400; }
.im-poi a:hover { background: var(--velo); color: var(--primario); }
.im-su { color: var(--no); }
.im-giu { color: var(--ok); }
.im-errori { margin: 12px 0 0; padding: 12px 14px; border-radius: var(--r-md); background: var(--attenzione-tenue); color: var(--testo); font-size: var(--fs-sm); }
.im-errori ul { margin: 6px 0 0; padding-left: 18px; }
.im-guida p { font-size: var(--fs-sm); color: var(--testo); line-height: 1.55; margin: 0 0 10px; }
.im-guida b { color: var(--primario); }
.im-regole { list-style: none; padding: 0; margin: 0 0 12px; display: grid; gap: 6px; }
.im-regole li { display: flex; align-items: baseline; gap: 8px; font-size: var(--fs-sm); line-height: 1.45; }
.im-regole .an-pill { flex: 0 0 64px; justify-content: center; text-align: center; }
.im-tab td .an-pic.e-err { color: var(--no); }
.im-tab .an-des { max-width: 42ch; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
/* chiusura anno: la lista dei controlli e il pulsante al centro */
.im-controlli { display: flex; flex-direction: column; gap: 8px; }
.im-chiudi { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; max-width: 560px; margin: 0 auto; }
.im-chiudi .an-interr { height: auto; text-align: left; align-items: flex-start; gap: 10px; }
.im-chiudi .hbt { min-width: 280px; }
.im-chiudi .im-riepilogo { color: var(--testo-2); font-size: var(--fs-sm); }
@media (max-width: 991.98px) { .im-filtri { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767.98px) {
    .im-passi { grid-template-columns: 1fr; gap: 6px; }
    .im-passi li { padding: 8px 12px; }
    .im-tiles { grid-template-columns: 1fr 1fr; }
    .im-esito { grid-template-columns: 1fr; }
    .im-filtri { grid-template-columns: 1fr; }
    .im-card-corpo { padding: 12px; }
    .im-piede .hbt { width: 100%; justify-content: center; }
    .im-chiudi .hbt { min-width: 0; width: 100%; }
}

/* ===== MATERIALE DA RIORDINARE (rr-*): i numeri in cima sono filtri ===== */
.rr-tiles .im-tile.on { border-color: var(--primario); box-shadow: 0 0 0 2px var(--primario-tenue); }
.rr-tiles .rr-euro { font-size: var(--fs-xl); }
.rr-conviene { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; align-items: center; }
.rr-chip { border: 1px solid var(--verde-300); background: var(--ok-tenue); color: var(--ok); border-radius: var(--r-pill); padding: 1px 8px; font-size: var(--fs-xs); font-weight: 600; cursor: pointer; }
.rr-chip:hover { background: var(--verde-200); }
.rr-sugg { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 0; border-bottom: 1px solid var(--bordo); font-size: var(--fs-sm); }
.rr-sugg:last-child { border-bottom: 0; }
.rr-tab td .an-pic.e-err { color: var(--no); font-weight: 600; }
@media (max-width: 767.98px) { .rr-conviene { justify-content: flex-start; } }

/* ===== ASSISTENZA (as-*): il modulo e le richieste, la conversazione ===== */
.as-due { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 16px; align-items: start; }
.as-due .im-card { margin-bottom: 0; }
.as-invia { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.as-urg { color: var(--no); }
.as-tab .an-cod { white-space: normal; }
.as-chiusa { margin-bottom: 14px; background: var(--ok-tenue); color: var(--ok); }
/* Una chat: i miei messaggi a destra, blu pieni; quelli dell'assistenza a
   sinistra, verdi chiari. Due colori diversi: prima erano due grigi e non
   si capiva chi aveva scritto cosa. */
.as-conversazione { display: flex; flex-direction: column; gap: 14px; margin-bottom: 16px; }
.as-msg { max-width: 72%; padding: 12px 16px; border-radius: var(--r-lg); border: 1px solid var(--bordo); background: var(--superficie); box-shadow: var(--ombra-2); }
.as-msg.e-mio { align-self: flex-end; background: var(--primario); border-color: var(--primario); color: var(--su-primario); border-bottom-right-radius: var(--r-xs); }
.as-msg.e-loro { align-self: flex-start; background: var(--ok-tenue); border-color: var(--verde-200); border-bottom-left-radius: var(--r-xs); }
.as-msg.e-altri { align-self: flex-start; background: var(--superficie-2); border-color: var(--bordo); border-bottom-left-radius: var(--r-xs); }
.as-msg.e-altri .as-msg-chi strong { color: var(--testo); }
.as-msg-chi { display: flex; justify-content: space-between; gap: 12px; font-size: var(--fs-xs); color: var(--testo-2); margin-bottom: 4px; }
.as-msg-chi strong { color: var(--primario); display: inline-flex; align-items: center; gap: 6px; }
.as-msg.e-loro .as-msg-chi strong { color: var(--accento-forte); }
.as-msg.e-mio .as-msg-chi, .as-msg.e-mio .as-msg-chi strong, .as-msg.e-mio .as-msg-testo { color: var(--su-primario); }
.as-msg.e-mio .as-msg-chi span { opacity: .75; }
.as-msg-testo { white-space: pre-wrap; line-height: 1.5; color: var(--testo); }
[data-bs-theme="dark"] .as-msg.e-loro { background: rgba(var(--ok-rgb),.25); border-color: var(--verde-600); }
[data-bs-theme="dark"] .as-msg.e-loro .as-msg-chi strong { color: var(--verde-300); }
.as-foto { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }
.as-dettaglio .im-testata .im-sotto { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
@media (max-width: 991.98px) { .as-due { grid-template-columns: 1fr; } .as-msg { max-width: 100%; } }

/* il secondo pulsante in fondo alle righe: righe da un file */
.nd2 #eiVie .cf-drop .form-text { margin-top: 6px; }
#ndRigheFile .nd2-desc { color: var(--testo-2); font-size: var(--fs-sm); margin-left: 6px; }
#ndRigheFile .nd2-righe td, #ndRigheFile .nd2-righe th { padding: 8px 14px; }
#ndRigheFile .destra { text-align: right; }
/* scelto il tipo, l'elenco si chiude: il corpo del passo 1 sparisce del tutto */
.nd2 .nc-rq-corpo.nd2-chiuso { display: none; }
/* il rimando alla copia nel registro, in fondo ai documenti dell'ordine */
.cd-registro { padding: 10px 14px; border-top: 1px dashed var(--bordo); color: var(--testo-2); }
.cd-registro a { color: var(--primario); }