/* ============================================================
   InsTaurus — CSS del preventivatore.
   ------------------------------------------------------------
   Questo file era 897 righe. Ne restano ~60: tutto il resto era
   IRRAGGIUNGIBILE, verificato classe per classe contro l'intero
   progetto (HTML e JS, escluso www/ che e' output di build).

   Perche' era morto. La UI del preventivatore non e' piu' questa:
   e' quella di app/preventivo2/preventivo2.js, che usa il namespace
   `p2-*` e si inietta il CSS da sola a runtime (costante P2_CSS).
   Erano rimasti qui gli stili della versione precedente, con i loro
   contenitori: #page-preventivi, #saved-list, #page-archivio,
   #page-foto e #archivio-files-list NON esistono nel DOM, quindi
   ogni regola scopata sotto di loro non dipingeva nulla.

   Erano morte anche, per assenza totale di markup corrispondente:
   i namespace prev-*, row-*, psb-*, tipo-card*, fld-check/full/hint/mini,
   card-head/title/subtitle, moduli-empty, meta-*, area-info, chip-legno,
   btn-rm, btn-icon-rm; l'elemento <header> (l'unico del progetto sta
   in landing.html, che non carica questo file); .tab-nav e .tab-btn,
   .brand*, .header-meta, .badge, .container, .page, .dot; e
   .btn-primary / .btn-ghost / .imp-pill / .active, che compaiono si'
   nel progetto ma SOLO in landing.html — la quale ha il proprio
   <style> e non collega questo foglio.

   Cosa resta, e perche':
   - .btn-add   -> index.html, moduli-instaurus.js, moduli-impostazioni.js,
                   moduli2.js, moduli-documento-wizard.js, wizard-onboarding.js
   - .fld       -> index.html (<label class="fld">), moduli-impostazioni.js
   - .empty     -> index.html, moduli*.js
   - #prev2-container .card -> le card scritte dentro il contenitore del
                   preventivatore da index.html e prev2-import-catalogo.js

   Le regole superstiti sono copiate ALLA LETTERA dall'originale: questa
   potatura non deve cambiare un pixel.
   ============================================================ */

@layer componenti {


/* ====== Bottoni ======
   Nell'originale questa regola apriva un gruppo di quattro selettori
   (.btn-primary, .btn-ghost, .btn-ghost-sm, .btn-add): gli altri tre
   non hanno markup, resta .btn-add. */
.btn-add {
  font-family: inherit;
  font-weight: 600;
  font-size: 13px;
  border-radius:var(--radius-sm);
  padding: 9px 16px;
  cursor: pointer;
  transition: transform 0.1s, box-shadow 0.15s, background 0.15s;
  background: var(--surface, var(--surface));
  color: var(--oro-ink, var(--action-text));
  border: 1px dashed var(--action);
}
@media (hover: hover) { .btn-add:hover { background: var(--blueprint-tint, var(--action-soft)); border-style: solid; } }

/* ====== Campo di form ======
   .fld batte .inp per specificita' (0,1,1 contro 0,1,0) sugli input
   generati da moduli-impostazioni.js: non e' ridondante. */
/* ATTENZIONE al `:not(label)`, non e' un vezzo.
   Prima dei layer questa regola era `.fld { display:flex }` e sui campi del
   login PERDEVA, perche' index.html scrive `label.fld { display:block }` che
   ha specificita' piu' alta (0,1,1 contro 0,1,0). Con i layer la specificita'
   non decide piu' fra fogli diversi: decide l'ordine dei layer, e `componenti`
   viene dopo `base`. Senza questo `:not`, i campi del login diventerebbero
   flex e crescerebbero di 8px l'uno.
   Cosi' resta scritto nero su bianco quello che gia' succedeva: i `label.fld`
   (login) sono block, i `div.fld` (moduli-impostazioni) sono flex. */
.fld {
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.fld:not(label) {
  display: flex;
}
.fld label {
  font-size: 11px;
  color: var(--text-muted, var(--ink-muted));
  font-weight: 600;
  letter-spacing: 0.02em;
}
.fld input, .fld select, .fld textarea {
  background: var(--surface-2, var(--surface));
  border: 1px solid var(--border, var(--line));
  border-radius:var(--radius-sm);
  padding: 9px 11px;
  font: inherit;
  color: var(--text, var(--ink));
  width: 100%;
  box-sizing: border-box;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.fld input:focus, .fld select:focus, .fld textarea:focus {
  outline: none;
  border-color: var(--oro-deep, var(--action-strong));
  box-shadow: 0 0 0 3px var(--alone);
}

/* ====== Stato vuoto ======
   `background` e `border` avevano !important per battere il `.empty` di
   index.html. Non serve piu': `componenti` viene dopo `base`. */
.empty {
  text-align: center;
  color: var(--text-muted, var(--ink-muted));
  font-size: 13px;
  font-style: italic;
  padding: 28px 16px;
  background: var(--surface-2, var(--surface));
  border: 1px dashed var(--border, var(--line));
  border-radius:var(--radius);
}

/* ====== Card dentro il contenitore del preventivatore ======
   Scopate su #prev2-container per non toccare lo shell dell'app. */
#prev2-container .card {
  background: var(--surface, var(--surface));
  border: 1px solid var(--border, var(--line));
  border-radius:var(--radius-lg);
  box-shadow: 0 1px 3px var(--ombra);
  overflow: hidden;
  margin-bottom: 18px;
}
/* Il corpo della card ha padding coerente.
   NB: il `:not(.card-head)` e' vacuo — l'app scrive .card-h, non
   .card-head — quindi il padding cade anche sull'intestazione. E'
   il comportamento attuale e va lasciato com'e': correggerlo qui
   sposterebbe dei pixel, e questa potatura non deve farlo. */
#prev2-container .card > *:not(.card-head) {
  padding-left: 18px;
  padding-right: 18px;
}
#prev2-container .card > *:not(.card-head):last-child {
  padding-bottom: 16px;
}

}
/* fine @layer componenti */