/* Stile minimo, nessun requisito di design system per l'MVP
   (doc/prd.md#User Interface Design Goals). */

/* x-cloak (Story 8.5, code review): nasconde un elemento con x-show finche'
   Alpine non ha finito di inizializzarsi, evitando un flash-of-visible-
   content (es. la BulkActionBar visibile per un istante con "0 movimenti
   selezionati" prima che Alpine valuti selectedCount > 0). */
[x-cloak] {
  display: none !important;
}

/* ConfirmationSummary (Story 8.6): <dialog> nativo, bordo standard di
   default, bordo/accento piu' marcato per la variante "warning" (azioni
   distruttive - eliminazioni), coerente col token di stato "ambiguous"
   gia' usato altrove per segnalare attenzione. */
.confirmation-summary {
  border: 1px solid #ddd;
  border-radius: 6px;
  padding: 1.5rem;
  max-width: 32rem;
}

.confirmation-summary--warning {
  border: 2px solid var(--color-status-ambiguous);
}

.confirmation-summary::backdrop {
  background: rgb(0 0 0 / 40%);
}

/* EmptyState (Story 8.7): stessa distinzione di tono richiesta dalla UX
   Spec, non solo di colore - "accomplishment" (coda di lavoro svuotata,
   un traguardo) riusa il token di stato "reconciled" gia' esistente
   (nessun nuovo colore, stesso principio di riuso di Story 8.4/8.6);
   "filtered" (nessun risultato per i filtri correnti) resta neutro,
   nessun accento, per non trasmettere un falso senso di traguardo. */
.empty-state {
  padding: 2rem 1rem;
  text-align: center;
}

.empty-state__title {
  font-weight: 600;
  margin: 0;
}

.empty-state__description {
  margin: 0.25rem 0 0;
  font-size: 0.9rem;
}

.empty-state--accomplishment .empty-state__title {
  color: var(--color-status-reconciled);
}

/* "filtered" resta volutamente senza accento (code review): un colore
   qui trasmetterebbe un falso senso di traguardo e riuserebbe un token
   di stato (--color-status-pending) con un significato gia' diverso
   altrove nell'app (movimento in sospeso). */

/* Fallback statico (Ledger Navy) per il tema (Story 7.1, AC3): il blocco
   <style>:root{...}</style> iniettato server-side in base.html sovrascrive
   questi valori con quelli letti dal DB - questo garantisce che la pagina
   resti utilizzabile anche se la query del tema fallisse, nessun single
   point of failure sulla sola query DB per il rendering base. */
:root {
  --color-primary: #1C3A5E;
  --color-surface: #0D1B2A;
  --color-status-reconciled: #15803D;
  --color-status-ambiguous: #B45309;
  --color-status-pending: #6B7280;
  /* Larghezza sidebar (Story 8.2, doc/architecture.md riga 313 / UX Spec):
     CSS custom properties dedicate cosi' il resto del layout (<main>,
     flex: 1) resta reattivo al cambio di stato espansa/collassata senza
     ricalcoli manuali - il valore effettivo e' letto da Alpine.js via
     :style binding in partials/sidebar.html. */
  --sidebar-w-expanded: 240px;
  --sidebar-w-collapsed: 64px;
}

body {
  font-family: system-ui, sans-serif;
  margin: 0;
}

/* Sidebar (Story 8.2, sostituisce il top-nav .app-nav di Story 5.1/7.1):
   stessa logica gia' applicata al vecchio nav - var(--color-surface) per
   lo sfondo cosi' un cambio preset resta immediatamente visibile su tutta
   l'app. La larghezza e il layout flex sono gestiti da classi utility
   Tailwind (Story 8.1) direttamente nel template, qui solo le regole non
   esprimibili in modo pulito con arbitrary value. */
.app-nav__area-label {
  font-weight: 600;
}

.app-sidebar__link,
.app-sidebar__toggle {
  color: inherit;
}

.app-sidebar__row:hover {
  background-color: rgb(255 255 255 / 10%);
}

/* Focus visibile esplicito (Story 8.2, AC3/NFR8): nessuna regola in
   questo foglio rimuove l'outline di default del browser, ma lo rendiamo
   esplicito e ad alto contrasto su sfondo scuro invece di affidarci al
   solo default (che su alcuni browser puo' essere poco visibile su
   var(--color-surface)). Selettore su `.app-sidebar a`/`button` (non solo
   `.app-sidebar__link`/`__toggle`): i link dei contatori sono emessi da
   webapp/templates/operativo/_badges.html, un template diverso che non
   conosce le classi della sidebar - code review Story 8.2, prima di
   questo fix restavano senza focus visibile esplicito. */
.app-sidebar a:focus-visible,
.app-sidebar button:focus-visible {
  outline: 2px solid #FFFFFF;
  outline-offset: 2px;
}

.login-page {
  max-width: 320px;
  margin: 4rem auto;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.login-error {
  color: #b00020;
}

/* Errori di form nelle pagine Amministrazione (Story 9.2): stesso pattern
   di .login-error - la classe .form-error era gia' nei template (category/
   source/user form, theme.html) fin da Story 5.2/5.3/6.1/7.1 ma senza
   alcuna regola CSS associata (testo nero indistinguibile dal resto),
   stesso gap gia' risolto per .badge/.bulk-actions-bar in Story 8.4/9.1. */
.form-error {
  color: #b00020;
  font-weight: 600;
}

/* Vista albero categorie (Story 10.1): nodo selezionato - stesso principio
   di riuso di .empty-state--accomplishment/.confirmation-summary--warning,
   qui riusa --color-primary (gia' il colore di brand primario) invece di
   introdurre un nuovo token, coerente con lo stato attivo gia' stilizzato
   per la sidebar (aria-current, Story 8.2). */
.app-tree-node[aria-current="true"] {
  background-color: var(--color-primary);
  color: #FFFFFF;
  font-weight: 600;
}

.app-tree-node:hover {
  background-color: rgb(0 0 0 / 5%);
}

/* AC6 (code review Story 7.1): senza un colore di testo esplicito, il
   bottone eredita il colore di testo default del browser (tipicamente
   nero) su uno sfondo scuro (tutti e 3 i preset lo sono) - contrasto
   insufficiente per WCAG 2.1 AA. Bianco su Ledger Navy/Indigo/Slate Teal
   garantisce un rapporto di contrasto ampiamente sopra 4.5:1 su ognuno. */
.theme-preset-swatch {
  color: #FFFFFF;
  border: 2px solid transparent;
  border-radius: 4px;
  padding: 0.75rem 1.25rem;
  font-weight: 600;
  cursor: pointer;
}

.theme-preset-swatch[aria-pressed="true"] {
  border-color: #FFFFFF;
}

/* Estensione del tema oltre il nav (richiesta dopo il primo deploy su
   Hetzner): link, bottoni e header di tabella usano var(--color-primary)/
   var(--color-surface), cosi' un cambio preset si vede su tutta
   l'interfaccia e non solo nella barra di navigazione. Nessuna classe
   .btn/.danger esiste nella codebase (ogni <button> e' un
   <button type="submit"> semplice, senza distinzione) - uno stile
   generico sull'elemento e' quindi sicuro, nessuna regressione visiva su
   varianti che non esistono. */
a {
  color: var(--color-primary);
}

button,
input[type="submit"] {
  background-color: var(--color-primary);
  color: #FFFFFF;
  border: none;
  border-radius: 4px;
  padding: 0.5rem 1rem;
  font: inherit;
  cursor: pointer;
}

button:hover,
input[type="submit"]:hover {
  filter: brightness(0.9);
}

table thead th {
  background-color: var(--color-surface);
  color: #FFFFFF;
  text-align: left;
  padding: 0.5rem;
  font-size: var(--font-size-th);
}

/* Story 7.3: gli header ordinabili (macro sortable_header, <th><a>...</a>)
   mostravano il blu della regola globale "a" invece del bianco ereditato
   da table thead th - una dichiarazione diretta su <a> batte sempre
   l'ereditarienza dal genitore, indipendentemente dalla specificita'.
   inherit (non #FFFFFF hardcoded) cosi' l'header segue automaticamente il
   colore reale di table thead th se mai diventasse un token personalizzabile. */
table thead th a {
  color: inherit;
}

table td {
  padding: 0.4rem 0.6rem;
  font-size: var(--font-size-td);
}

/* Badge di stato riconciliazione (Story 5.8, `.badge`/`.badge--{status}`
   gia' nei template ma senza alcuna regola CSS - stesso gap del nav prima
   del fix, badge invisibili/non colorati). AC4 (Story 7.1): i 3 stati
   semantici dei movimenti usano i token FISSI --color-status-*, mai
   quelli variabili per preset - restano riconoscibili indipendentemente
   dal tema attivo. */
.badge {
  display: inline-block;
  padding: 0.15rem 0.6rem;
  border-radius: 4px;
  font-size: 0.85rem;
  font-weight: 600;
  color: #FFFFFF;
}

.badge--reconciled {
  background-color: var(--color-status-reconciled);
}

.badge--ambiguous {
  background-color: var(--color-status-ambiguous);
}

.badge--pending {
  background-color: var(--color-status-pending);
}

.badge--not_applicable {
  /* Scurito in Story 8.4: #9CA3AF falliva il contrasto AA con testo
     bianco (2.54:1); #4B5563 passa (7.56:1). */
  background-color: #4B5563;
}

/* "stale" non e' uno stato di riconciliazione movimento (AC4): copre
   import parziali/falliti e fonti non aggiornate (Story 4.2/6.2) - colore
   neutro indipendente dal tema, non uno dei 3 token fissi. */
.badge--stale {
  background-color: #4B5563;
}

/* Stato di verifica giustificativo (Story 18.1, document_status_pill):
   asse indipendente dalla riconciliazione, ma riusa gli STESSI 3 token
   fissi --color-status-* (nessun nuovo colore introdotto) - stessa
   semantica visiva: verificato=verde (come riconciliato), da verificare=
   ambra (come ambiguo, "richiede attenzione"), assente=grigio (come
   pending/not_applicable, stato neutro di partenza). */
.badge--verified {
  background-color: var(--color-status-reconciled);
}

.badge--present_unverified {
  background-color: var(--color-status-ambiguous);
}

.badge--missing {
  background-color: var(--color-status-pending);
}

/* Contatori sidebar (Story 8.4, count_pill): stessa componente visiva
   .badge, colore var(--color-primary) invece di uno stato semantico - un
   conteggio non e' uno dei 4 stati fissi (AC3: riuso della forma, non
   del colore). */
.badge--count {
  background-color: var(--color-primary);
}