/* ==========================================================================
   Migliorie — rifiniture comuni a TUTTI i temi del gestionale (Alise ed Eden)
   Da caricare SEMPRE, dopo style.css, documenti.css (e finestra.css se usato),
   e prima di eden.css (che si carica solo con il tema Eden).

   Solo forme, spazi, raggi, ombre, stati (hover, focus, disabilitato), etichette,
   campi, avvisi e correzioni di impaginazione. Nessun colore fisso di un tema e
   nessun ornamento: i colori vengono dai token di style.css (--brand, --focus,
   --line, --line-strong, --ink-2, --ink-3, --surface-2…), quindi con il tema Alise
   il focus è teal e i bottoni restano quelli di oggi, con Eden diventano pino.

   I pochi token che style.css non ha sono definiti qui con valori adatti ad Alise
   e ridefiniti in eden.css:
     --ink-4         segnaposto dei campi
     --line-hover    bordo dei campi e dei bottoni al passaggio del mouse
     --etichetta     etichette in maiuscoletto delle schede documento e dell'accesso
     --ombra-campo   ombra interna dei campi e dei bottoni
   Dettagli in design/eden/LEGGIMI.md, punto 6.
   ========================================================================== */

:root {
  --ink-4:       #A3A3AD;
  --line-hover:  #C2BDB4;
  --etichetta:   #63636E;
  --ombra-campo: rgba(19, 19, 29, .035);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink-4:       #6B6B76;
    --line-hover:  #4A4B5D;
    --etichetta:   var(--ink-3);
    --ombra-campo: rgba(0, 0, 0, .18);
  }
}

/* --------------------------------------------------------------------------
   1. Card e pannelli: raggio più morbido, ombra lunga dai token del tema
   -------------------------------------------------------------------------- */
.card {
  border-color: var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow);
}
.card.flat { box-shadow: none; }
a.card.kpi { transition: transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease); }
a.card.kpi:hover { transform: translateY(-2px); border-color: var(--line-strong); box-shadow: var(--shadow-lg); }

.campanella-pannello, .nuovo-pannello { border-color: var(--line); border-radius: 16px; box-shadow: var(--shadow-lg); }
.velo { -webkit-backdrop-filter: blur(4px) saturate(1.1); backdrop-filter: blur(4px) saturate(1.1); }
.card-velo { border-radius: 18px; box-shadow: var(--shadow-lg); }
.velo-mov { background: var(--surface-2); border-radius: 12px; }
.mov-modifica .mov-senza { border-color: var(--line); border-radius: 12px; }
.collegamenti code { background: var(--surface-2); border-radius: 6px; }
.attiva-qr { background: var(--surface-2); border-radius: 14px; }
.promemoria-titoli { background: var(--warn-bg); color: var(--warn); border-radius: 10px; }

/* --------------------------------------------------------------------------
   2. Avvisi: raggio 12, un bordo tenue del loro colore;
      quelli di solo testo (con un grassetto o un link dentro) diventano un paragrafo unico
   -------------------------------------------------------------------------- */
.alert { border-radius: 12px; border: 1px solid transparent; }
.alert-info   { border-color: color-mix(in srgb, var(--brand) 12%, transparent); }
.alert-warn   { border-color: color-mix(in srgb, var(--gold) 24%, transparent); }
.alert-danger { border-color: color-mix(in srgb, var(--neg) 15%, transparent); }
.alert:not(:has(> div, > .alert-actions, > form, > button, > .btn)) { display: block; position: relative; padding-left: 42px; }
.alert:not(:has(> div, > .alert-actions, > form, > button, > .btn))::before { position: absolute; left: 20px; top: calc(var(--s-4) + .5em); margin: 0; }

/* --------------------------------------------------------------------------
   3. Campi, select, textarea: bordi fini, alone di focus del tema, segnaposto tenui
   -------------------------------------------------------------------------- */
input[type=search], input[type=text], input[type=email], input[type=password],
input[type=number], input[type=month], input[type=date], input[type=tel], input[type=url], select, textarea {
  border: 1px solid var(--line-strong);
  border-radius: 9px;
  background-color: var(--surface);
  color: var(--ink);
  box-shadow: inset 0 1px 1px var(--ombra-campo);
  transition: border-color .16s var(--ease), box-shadow .16s var(--ease), background-color .16s var(--ease);
}
input:hover, select:hover, textarea:hover { border-color: var(--line-hover); }
input:focus, select:focus, textarea:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3.5px var(--focus);
  outline: none;
}
input::placeholder, textarea::placeholder { color: var(--ink-4); opacity: 1; font-weight: 400; letter-spacing: 0; }
input:disabled, select:disabled, textarea:disabled,
input[readonly], textarea[readonly] {
  background-color: var(--surface-2);
  border-color: transparent;
  color: var(--ink-3);
  box-shadow: none;
}
input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; opacity: .85; }
textarea { min-height: 88px; padding: 10px 12px; line-height: 1.5; resize: vertical; }
input[type=checkbox], input[type=radio] { accent-color: var(--brand); width: 16px; height: 16px; }
input[type=date], input[type=month] { font-variant-numeric: tabular-nums; }

/* ricerca negli elenchi: abbastanza larga da mostrare tutto il segnaposto
   ("Cerca cliente, fornitore, numero, P.IVA" in Vendite e Acquisti); su telefono a tutta larghezza (punto 9) */
.filters input[type=search] { min-width: 360px; }
.filters input[type=search][data-live-filter="#tab-rubrica"] { min-width: 410px; }

/* caselle di spunta dentro un'etichetta: accanto al testo, non su una riga a sé */
.form-grid label:has(> input[type=checkbox]), .form-grid label:has(> input[type=radio]),
label.nowrap:has(> input[type=checkbox]) {
  display: flex; align-items: center; gap: 10px; color: var(--ink-2); font-size: var(--fs-sm); cursor: pointer;
}

/* campo file: "Scegli file" con lo stile dei bottoni */
input[type=file] { font: inherit; font-size: var(--fs-sm); color: var(--ink-3); }
input[type=file]::file-selector-button {
  font: inherit; font-weight: 600; font-size: var(--fs-xs); color: var(--ink);
  height: 30px; padding: 0 12px; margin-right: 16px;
  border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); cursor: pointer;
  transition: background-color .16s var(--ease), border-color .16s var(--ease);
}
input[type=file]::file-selector-button:hover { background: var(--surface-2); border-color: var(--line-hover); }

/* etichette dei campi: più leggibili */
.form-grid label, .mov-modifica > label { color: var(--ink-2); font-weight: 500; }
.doc-pagina .etichetta, .classifica label, .login-card label { color: var(--etichetta); font-weight: 600; letter-spacing: .08em; }
.campo.letto input { background: var(--surface-2); color: var(--ink-2); }
.righe-doc .cella { border-radius: 7px; box-shadow: none; }
.righe-doc .cella::placeholder { color: var(--ink-4); }
.righe-doc .cella:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--focus); }

/* --------------------------------------------------------------------------
   4. Bottoni, chip, segmenti
   -------------------------------------------------------------------------- */
.btn {
  border-radius: 10px;
  font-weight: 600;
  letter-spacing: .005em;
  border-color: var(--line-strong);
  box-shadow: 0 1px 1px var(--ombra-campo);
  transition: background-color .16s var(--ease), border-color .16s var(--ease), color .16s var(--ease), box-shadow .16s var(--ease), transform .16s var(--ease);
}
.btn:hover { background: var(--surface-2); border-color: var(--line-hover); }
/* il principale tiene il colore del tema (style.css); qui solo una leggera luce in alto */
.btn.primary { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 1px 2px rgba(0, 0, 0, .12); }
.btn.primary:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 2px 6px -2px rgba(0, 0, 0, .25); }
.btn.ghost { box-shadow: none; }
.btn.ghost:hover { background: var(--surface-2); }
.btn.small { border-radius: 8px; }
.btn[disabled], .btn:disabled { opacity: .45; cursor: not-allowed; }

.chip { border-color: var(--line-strong); color: var(--ink-2); }
.chip:hover { border-color: var(--line-hover); color: var(--ink); }

.segmenti { background: var(--surface-2); border-radius: 11px; }
.segmenti label { border-radius: 8px; }
.segmenti label:has(input:checked), .segmenti label.attivo {
  color: var(--brand-deep);
  box-shadow: 0 1px 2px rgba(19, 19, 29, .10), 0 0 0 1px rgba(19, 19, 29, .05);
}

/* --------------------------------------------------------------------------
   5. Stati vuoti nelle tabelle: celle di tabella centrate (prima erano flex dentro una cella)
   -------------------------------------------------------------------------- */
td.empty { display: table-cell; text-align: center; padding: 44px 16px 40px !important; }
.timeline li.empty { display: block; text-align: center; padding: 28px 0 8px; border: 0; }
.campanella-lista .empty { display: block; text-align: center; padding: 26px 16px 22px; }
.card-body.empty { padding: 72px 24px 64px; font-size: var(--fs-md); }
.card-body.empty a { display: inline-block; margin-top: 8px; font-size: var(--fs-base); }

/* --------------------------------------------------------------------------
   6. Schede documento (documenti.css)
   -------------------------------------------------------------------------- */
.cifra { background: var(--surface-2); border-radius: 12px; }
.totali { background: var(--surface-2); border-radius: 12px; }
.totali .voce + .voce { border-top-color: var(--line); }
.pillola { border-color: var(--line); }
.promemoria { border-radius: 10px; }
.revolut { border-radius: 12px; }
.doc-barra { border-radius: 16px; }
.doc-foglio { box-shadow: 0 0 0 1px var(--line), var(--shadow); }
.riep-nota, .mov-lista li { border-top-color: var(--line); }
/* moduli Nuova fattura / Nuova ricevuta / Nuova fattura d'acquisto: le card e la barra del totale
   erano attaccate; ora hanno lo stesso respiro delle altre card (--doc-gap: 16 px, 12 su telefono) */
.doc-pagina .form-doc { display: flex; flex-direction: column; gap: var(--doc-gap); }
.doc-pagina .form-doc > * { margin-top: 0; margin-bottom: 0; }

/* --------------------------------------------------------------------------
   7. Accesso e attivazione
   -------------------------------------------------------------------------- */
.login .login-card input { height: 46px; border-radius: 12px; }
.login-entra { height: 48px; border-radius: 12px; }
.login-error { border-radius: 10px; }
/* "se attivo" accanto all'etichetta, non su una riga a sé */
.login-card label:has(.facoltativo) { flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: 6px; }
.login-card label:has(.facoltativo) > input { flex: 1 0 100%; }

/* --------------------------------------------------------------------------
   8. Telefono
   -------------------------------------------------------------------------- */
@media (max-width: 560px) {
  /* anno e campanella vicini, non allargati; le chip di Scadenze vanno a capo invece di tagliarsi */
  .page-actions > .anno-sel, .page-actions > .campanella { flex: 0 0 auto; }
  .page-actions > .chip { flex: 0 0 auto; }
  /* 9. ricerca a tutta larghezza */
  .filters input[type=search], .filters input[type=search][data-live-filter] { flex: 1 1 100%; min-width: 0; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  a.card.kpi:hover { transform: none; }
}

/* fattura non ancora aperta: pallino rosso prima della data */
.pallino-nuova { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #d93025; margin-right: 6px; vertical-align: middle; }

/* elenco fatture: Stato stretto quanto il suo badge, più spazio al nome del cliente o fornitore */
.table.elenco th.col-nome { width: 42%; }
.table.elenco th.col-stato { width: 1%; }
.table.elenco th.col-stato, .table.elenco td.col-stato { padding-left: 8px; padding-right: 8px; }   /* la nota di credito ha già "NC" nel numero */
.table.elenco th:last-child, .table.elenco td:last-child { padding-right: 32px; }
@media (max-width: 760px) { .table.elenco th.col-nome { width: auto; } }
.table.elenco td.col-numero { overflow-wrap: anywhere; min-width: 175px; }   /* i numeri lunghissimi vanno a capo e lasciano spazio al nome */

/* piede delle card (azioni sotto una tabella o un modulo) */
.card-foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); padding: var(--s-4) var(--s-6); border-top: 1px solid var(--line); }

/* scheda documento con PDF più largo: la data della scadenza resta leggibile anche nella cifra più stretta */
.cifra input[type=date] { padding: 0 3px; font-size: 12.5px; letter-spacing: -.01em; }
.cifra input[type=date]::-webkit-calendar-picker-indicator { margin-left: 2px; padding: 0; }
.cifra:has(input[type=date]) { padding-left: 10px; padding-right: 10px; }

/* documenti allegati nella scheda */
.allegati { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.allegati li { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.allegati .togli { margin-left: auto; }
.allegati-carica { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; }
.allegati-carica input[type=text] { flex: 1 1 200px; }

/* colonna SdI degli elenchi: badge compatti, per lasciare spazio al nome */
.badge.mini { padding: 1px 7px; gap: 0; font-size: 11px; }
.badge.mini::before { display: none; }
.table.elenco th.col-sdi, .table.elenco td.col-sdi { padding-left: 4px; padding-right: 4px; }

/* logo della barra: solo "ALISE" (senza EDITORE), appena più grande di prima */
.sidebar .brand .logo.solo-alise { width: auto; height: 19px; }
@media (max-width: 860px) { .sidebar .brand .logo.solo-alise { height: 16px; } }

/* modello F24 digitale (scheda F24): valori da copiare con un tocco */
.f24-mod .f24-testa { display: flex; flex-wrap: wrap; gap: var(--s-5); align-items: end; }
.f24-mod .f24-testa > div { display: grid; gap: 2px; }
.f24-mod .copia { font: inherit; font-variant-numeric: tabular-nums; background: var(--surface-2); border: 1px solid transparent;
  border-radius: 8px; padding: 3px 9px; cursor: copy; color: var(--ink); text-align: left; transition: background .15s, border-color .15s; }
.f24-mod .copia:hover { border-color: var(--brand); background: var(--brand-soft); }
.f24-mod .copia.copiato { background: var(--brand); color: #fff; }
.f24-mod .copia.copiato::after { content: " · copiato"; font-size: 11px; }
.f24-mod .f24-saldo { font-size: 1.35rem; font-weight: 700; color: var(--brand-deep, var(--brand)); }
.f24-mod .f24-sez { border-top: 1px solid var(--line); padding: var(--s-2) 0; }
.f24-mod .f24-sez > summary { cursor: pointer; display: flex; gap: var(--s-3); align-items: baseline; list-style: none; padding: 4px 0; }
.f24-mod .f24-sez > summary::-webkit-details-marker { display: none; }
.f24-mod .f24-sez > summary::before { content: "›"; display: inline-block; width: 10px; color: var(--ink-3); transition: transform .15s; }
.f24-mod .f24-sez[open] > summary::before { transform: rotate(90deg); }
.f24-mod .f24-campi { display: grid; grid-template-columns: minmax(120px, max-content) minmax(0, 1fr); gap: 4px var(--s-3); margin: var(--s-2) 0 0; align-items: center; }
.f24-mod .f24-campi.riga + .f24-campi.riga { border-top: 1px dashed var(--line); padding-top: var(--s-2); }
.f24-mod .f24-campi dt { font-size: var(--fs-sm); color: var(--ink-3); }
.f24-mod .f24-campi dd { margin: 0; }
.f24-mod .copia.imp { font-weight: 700; }
.f24-mod .f24-vuote { margin: var(--s-2) 0 0; }
.f24-carica .f24-carica-riga { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; }
.f24-mano { margin-top: var(--s-5); }
.f24-mano > summary { cursor: pointer; margin-bottom: var(--s-4); }

/* Banca: ricerca di un documento da collegare al movimento */
.velo-cerca { display: flex; gap: var(--s-2); margin: var(--s-3) 0; }
.velo-cerca input[type=search] { flex: 1; min-width: 0; }

/* credito Openapi accanto all'ingranaggio, in fondo alla barra */
.foot-credito { font-size: 15px; font-weight: 700; color: rgba(255, 255, 255, .9); text-decoration: none; white-space: nowrap; margin-left: auto; }
.foot-credito:hover { color: #fff; text-decoration: none; }
.foot-credito.basso { color: #FFD2C8; font-weight: 700; }

/* Collegamenti: un servizio per riga, come il menu Impostazioni (17/10/2026) */
.coll-elenco .imp-voce { grid-template-columns: auto minmax(0, 1fr) auto; }
.coll-sigla { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; font-weight: 700; font-size: 14px;
  color: #fff; background: var(--ink-3, #8a857c); }
.coll-revolut { background: #1f262d; } .coll-openapi { background: #2d6cdf; } .coll-shopify { background: #5e8e3e; }
.coll-resend { background: #111; } .coll-icloud { background: #3a8ee6; } .coll-anthropic { background: #c96442; }
.coll-claude { background: #d97757; } .coll-claude_code { background: #A49677; }
.coll-stato { display: flex; align-items: center; gap: 10px; }
.coll-indietro { color: inherit; text-decoration: none; }
.coll-indietro:hover { text-decoration: underline; }
@media (max-width: 600px) { .coll-stato .badge { display: none; } }