/*
 * Override di accessibilita' per l'intero pannello: bottoni piu' grandi e
 * inequivocabili, stati di hover/focus piu' evidenti, testo leggibile.
 * Densita' (spaziatura) e dimensione del font sono PERSONALIZZABILI per
 * utente (tranne che per i Genitori, vedi App\Support\UiPreferences e
 * User::canCustomizeUiDensity()): ogni pagina inietta un <style> inline con
 * i valori risolti come custom property CSS (--ui-*), che qui si leggono
 * con var(--ui-x, FALLBACK) — il fallback e' sempre il livello piu'
 * accessibile ("comfortable"/"lg"), cosi' se per qualche motivo quello
 * style inline non arriva l'interfaccia resta comunque leggibile, non
 * collassa sulla versione piu' compatta.
 *
 * Le regole di pura accessibilita' senza costo di spazio (contorno di
 * focus, sottolineatura dei link, peso del testo dei bottoni) restano
 * sempre uguali, non dipendono dalla densita' scelta.
 */

html {
    font-size: var(--ui-font-scale, 110%);
}

/* --- Bottoni testuali/con icona (Salva, Nuovo, Annulla, azioni nelle
   tabelle...): piu' "carne" da cliccare, testo piu' marcato. --- */
.fi-btn {
    min-height: var(--ui-btn-min-height, 2.75rem);
    padding-block: var(--ui-btn-padding-block, 0.65rem) !important;
    padding-inline: var(--ui-btn-padding-inline, 1.1rem) !important;
    font-weight: 600 !important;
    font-size: var(--ui-btn-font-size, 0.9375rem) !important;
    border-radius: var(--ui-btn-radius, 0.625rem) !important;
}

.fi-btn.fi-size-xs,
.fi-btn.fi-size-sm {
    min-height: calc(var(--ui-btn-min-height, 2.75rem) - 0.25rem);
    padding-block: calc(var(--ui-btn-padding-block, 0.65rem) - 0.1rem) !important;
    padding-inline: calc(var(--ui-btn-padding-inline, 1.1rem) - 0.2rem) !important;
}

/* I bottoni "outlined" (es. Annulla) hanno solo un bordo sottile: su schermi
   luminosi o per chi ha difficolta' visive puo' sparire. Bordo piu' spesso
   e piu' scuro. */
.fi-btn.fi-outlined {
    box-shadow: inset 0 0 0 1.5px currentColor;
}

/* Stato al passaggio del mouse/dito piu' marcato, cosi' e' chiaro che
   l'elemento sta per essere attivato. */
.fi-btn:not(.fi-disabled):not([disabled]):hover {
    filter: brightness(0.97);
}

/* --- Bottoni a sola icona (es. azioni compatte, chiudi modali): area di
   tocco proporzionata alla densita' scelta. --- */
.fi-icon-btn {
    min-width: var(--ui-icon-btn-size, 2.75rem);
    min-height: var(--ui-icon-btn-size, 2.75rem);
}

/* --- Le azioni nelle tabelle (Modifica, Elimina, ecc.) di default sono
   semplici link colorati senza sfondo: per chi non ha familiarita' con le
   interfacce web non risultano ovviamente cliccabili. In
   UsersTable/FaqsTable le abbiamo rese bottoni veri (->button()); qui si
   rinforza lo stesso lo stile dei link "nudi" rimasti altrove
   nell'applicazione (es. testi con azioni inline). Non dipende dalla
   densita': non costa spazio. --- */
.fi-link.fi-force-enabled,
.fi-link:not(.fi-disabled):not([disabled]) {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* --- Contorno di focus ben visibile per chi naviga con tastiera o fatica a
   individuare dove si trova il cursore. Non dipende dalla densita'. --- */
.fi-btn:focus-visible,
.fi-icon-btn:focus-visible,
.fi-link:focus-visible {
    outline: 3px solid currentColor !important;
    outline-offset: 2px !important;
}

/* --- Campi di input: comodi da leggere e da centrare col dito o con il
   puntatore del mouse, in proporzione alla densita' scelta. --- */
input.fi-input,
.fi-select-input {
    padding-block: var(--ui-input-padding-block, 0.65rem) !important;
}

.fi-input-wrp {
    border-radius: var(--ui-input-radius, 0.625rem);
}

/* --- Righe delle tabelle: altezza in proporzione alla densita' scelta. --- */
.fi-ta-cell {
    padding-block: var(--ui-cell-padding-block, 0.2rem);
}

/* --- Le voci di navigazione della barra laterale: area di tocco e testo
   in proporzione alla densita' scelta. --- */
.fi-sidebar-item-btn {
    padding: var(--ui-sidebar-item-padding, 0.65rem) !important;
}

.fi-sidebar-item-label {
    font-size: var(--ui-sidebar-item-font-size, 0.9375rem) !important;
}
