/* ==========================================================================
   Amministrazione e accesso — foglio dell'area (Fase 4, 23 settembre 2026)
   ==========================================================================
   Pagine: Login (/arca/login, views/templates/auth/login.xml)
           Gestione utenti (/admin/users, admin_users.xml + admin_users.css)
           Log accessi (/admin/logs, admin_logs.xml)
           Log bozze (/admin/bozze-log, admin_bozze_log.xml)
   Sostituisce gli <style> interni dei quattro template (gradienti, vetro
   sfocato, testate blu, `overflow-x: hidden !important` su html e body,
   `.row { margin: 0 }` globale, colori scritti a mano). Solo token: vale
   anche in tema scuro. Prefisso delle classi nuove: `adm-`.
   Le pagine admin lo caricano con <t t-set="stili_pagina"> (dopo il
   sistema); il login, che non usa base_layout, dal suo <head>.
   ========================================================================== */

/* ==========================================================================
   1. Login — schema Accesso: riquadro centrato che SCORRE, un solo pulsante
   ========================================================================== */

/* AUD-LOG-01: prima html e body avevano `overflow: hidden` e il riquadro
   (padding 3rem) stava in un contenitore alto il 100% della finestra: su
   schermi bassi il pulsante "Accedi" restava fuori e non si poteva scorrere.
   Ora la pagina cresce col contenuto e scorre. */
html.arca-ds.adm-accesso,
html.arca-ds.adm-accesso body {
    height: auto;
    min-height: 100%;
    overflow: visible;
}
html.arca-ds.adm-accesso body { margin: 0; background: var(--ground); }

.adm-accesso .login-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    padding: var(--sp-6) var(--sp-4);
}
/* margin:auto dentro un flex a colonna: centrato quando c'e' spazio, in
   cima e scorrevole quando non c'e' (align-items:center taglierebbe). */
.adm-accesso .login-box {
    margin: auto;
    width: 100%;
    max-width: 400px;
    padding: var(--sp-8) var(--sp-6) var(--sp-5);
    background: var(--surface);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
}
.adm-accesso .login-header { text-align: center; margin-bottom: var(--sp-6); }
.adm-accesso .logo-container { display: flex; justify-content: center; margin-bottom: var(--sp-4); }
/* Il marchio e' stampato su bianco: resta su una targhetta bianca anche in
   scuro (DESIGN_SYSTEM.md §2.3, come nella barra laterale). */
.adm-accesso .logo-container img {
    display: block;
    width: 80px;
    height: 80px;
    object-fit: contain;
    background: #ffffff;
    border-radius: var(--r-md);
}
html[data-tema="scuro"] .adm-accesso .logo-container img,
html[data-tema="scuro"].adm-accesso .logo-container img { border: 1px solid var(--line-strong); }
.adm-accesso__titolo {
    margin: 0;
    font-size: var(--fs-headline);
    font-weight: 600;
    line-height: 1.25;
    color: var(--ink);
}

.adm-accesso .alert { margin-bottom: var(--sp-5); }
.adm-accesso .form-group { margin-bottom: var(--sp-4); }
.adm-accesso .form-label { display: block; margin-bottom: var(--sp-1); }
/* Campi un po' piu' alti del banco di lavoro: e' la porta d'ingresso, e si
   usa anche da telefono. Nessun movimento al passaggio o al fuoco. */
html.arca-ds.adm-accesso .login-box .form-control {
    min-height: 40px;
    font-size: 14px;
    transform: none;
}
.adm-accesso__aiuto { margin: var(--sp-1) 0 0; font-size: var(--fs-sm); color: var(--muted); }

/* Mostra/nascondi password: accanto al campo, dentro il suo bordo destro. */
.adm-accesso__password { position: relative; }
html.arca-ds.adm-accesso .adm-accesso__password .form-control { padding-right: 44px; }
.adm-accesso__occhio {
    position: absolute;
    top: 50%;
    right: 4px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 32px;
    padding: 0;
    color: var(--muted);
    background: transparent;
    border: 0;
    border-radius: var(--r-sm);
    cursor: pointer;
}
.adm-accesso__occhio:hover { color: var(--ink); background: var(--surface-alt); }
.adm-accesso__occhio[aria-pressed="true"] { color: var(--accent); }

/* Pulsante Accedi: blu del sistema (avvia), testo normale, non maiuscolo.
   Prima: bianco su gradiente blu-verde 3,98→3,13:1 (AUD-LOG-05). */
html.arca-ds.adm-accesso .btn-login {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-2);
    width: 100%;
    min-height: 40px;
    margin-top: var(--sp-5);
    font-size: 14px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
}
html.arca-ds.adm-accesso .btn-login[disabled] { opacity: 1; cursor: progress; }
/* In corso: rotella a sinistra dell'etichetta "Accesso in corso...". */
html.arca-ds.adm-accesso .btn-login.loading::before {
    content: "";
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: adm-gira 0.7s linear infinite;
}
@keyframes adm-gira { to { transform: rotate(360deg); } }

.adm-accesso .login-footer {
    margin-top: var(--sp-6);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--line);
    text-align: center;
}
.adm-accesso .login-footer p { margin: 0; font-size: var(--fs-sm); color: var(--muted); }
.adm-accesso .login-footer a { color: var(--accent); font-weight: 600; text-decoration: none; }
.adm-accesso .login-footer a:hover { text-decoration: underline; }
.adm-accesso .login-footer a i { margin-left: 4px; font-size: 0.85em; }

@media (max-width: 479.98px) {
    .adm-accesso .login-container { padding: var(--sp-4) var(--sp-3); }
    .adm-accesso .login-box { padding: var(--sp-6) var(--sp-4) var(--sp-4); }
}
/* Finestre basse (telefono in orizzontale, zoom alto): meno aria in alto. */
@media (max-height: 560px) {
    .adm-accesso .login-container { padding-top: var(--sp-3); padding-bottom: var(--sp-3); }
    .adm-accesso .login-box { padding-top: var(--sp-5); }
    .adm-accesso .login-header { margin-bottom: var(--sp-4); }
    .adm-accesso .logo-container img { width: 56px; height: 56px; }
}
@media (prefers-reduced-motion: reduce) {
    html.arca-ds.adm-accesso .btn-login.loading::before { animation-duration: 2s; }
}

/* ==========================================================================
   2. Pagine di amministrazione — parti comuni
   ========================================================================== */
html.arca-ds .adm-pagina { min-width: 0; }
html.arca-ds .adm-pagina .ads-testata__azioni .btn i { margin-right: 6px; }
html.arca-ds .adm-pagina .ads-testata__sotto i { color: var(--muted); }

/* Riga di stato (Gestione utenti): un messaggio su una riga, non una card
   alta 80 px. role="status": gli esiti sono annunciati. */
html.arca-ds .adm-stato {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 10px;
    min-height: 36px;
    padding: 6px 12px;
    background: var(--surface);
    border: 1px solid var(--line-strong);
    border-radius: var(--r-md);
    font-size: var(--fs-body);
    color: var(--ink);
}
html.arca-ds .adm-stato__etichetta {
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: var(--ls-label);
    text-transform: uppercase;
    color: var(--muted);
}
html.arca-ds .adm-stato .status-message { margin: 0; flex: 1 1 240px; min-width: 0; color: var(--ink); }
html.arca-ds .adm-stato .status-spinner { color: var(--accent); }
html.arca-ds .adm-stato .status-badge { margin-left: auto; }

/* Pannello con tabella */
html.arca-ds .adm-pagina .ads-pannello { overflow: hidden; }
html.arca-ds .adm-pagina .ads-pannello__testa .badge { font-family: var(--f-dato); }
html.arca-ds .adm-pagina .ads-pannello__corpo { padding: 10px 12px; }
html.arca-ds .adm-pagina .table-responsive { margin: 0; }
html.arca-ds .adm-pagina .table { margin-bottom: 0; }
html.arca-ds .adm-pagina .table > thead > tr > th {
    font-size: var(--fs-xs);
    white-space: nowrap;
}
html.arca-ds .adm-pagina .table > tbody > tr > td { vertical-align: middle; }
html.arca-ds .adm-pagina .dataTables_wrapper > .row { margin-left: 0; margin-right: 0; align-items: center; }
html.arca-ds .adm-pagina .dataTables_wrapper > .row > [class*="col-"] { padding-left: 0; padding-right: 0; }
html.arca-ds .adm-pagina .dataTables_wrapper > .row + .row { margin-top: 6px; }

/* Codici e date: cifre ferme */
html.arca-ds .adm-codice { font-family: var(--f-dato); font-size: var(--fs-body); color: var(--ink); background: transparent; padding: 0; }
html.arca-ds .adm-dato { font-family: var(--f-dato); font-variant-numeric: tabular-nums; color: var(--ink-2); white-space: nowrap; }

/* Cella che porta un messaggio (caricamento, vuoto, errore) */
html.arca-ds .adm-pagina td.adm-cella-stato { padding: 12px !important; white-space: normal; height: auto; }
html.arca-ds .adm-pagina td.loading-cell { height: auto; padding: 24px 16px !important; white-space: normal; text-align: center; }

/* Gruppo di azioni di riga: pulsanti solo icona 28 px con nome (aria-label) */
html.arca-ds .adm-azioni { display: inline-flex; align-items: center; gap: 4px; flex-wrap: nowrap; }
html.arca-ds .adm-azioni .btn-outline-danger { margin-left: 6px; }

/* Errore dentro una modale aperta (AUD-ADU-04): sta nel piede, accanto a
   "Salva", non dietro la modale. */
html.arca-ds .modal-footer .adm-errore-modale { flex: 1 1 100%; margin: 0 0 4px; text-align: left; }
/* Errore accanto al campo */
html.arca-ds .adm-campo-errore {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-top: 4px;
    font-size: var(--fs-sm);
    color: var(--crit-ink);
}

/* Filtri (Log accessi) */
html.arca-ds .adm-filtri { align-items: flex-end; }
html.arca-ds .adm-campo { display: flex; flex-direction: column; min-width: 0; flex: 0 1 200px; }
html.arca-ds .adm-campo--largo { flex: 1 1 240px; }
html.arca-ds .adm-campo .form-label { margin-bottom: 2px; }
html.arca-ds .adm-filtri__avviso {
    flex: 1 1 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    font-size: var(--fs-sm);
    color: var(--warn-ink);
}
html.arca-ds .adm-filtri__avviso i { color: var(--warn-icon); }
html.arca-ds .adm-applicati { font-size: var(--fs-sm); color: var(--muted); margin-left: auto; }

/* Pastiglia della sezione nel log: la chiave interna, in monospaziato */
html.arca-ds .adm-pagina .section-badge { font-family: var(--f-dato); }

/* Indicatori (Log accessi): non portano a un elenco, quindi non sono
   pulsanti. Nessun colore di stato: sono conteggi. */
html.arca-ds .adm-pagina .ads-indicatori { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
html.arca-ds .adm-pagina .ads-kpi { min-height: 64px; }
html.arca-ds .adm-pagina .ads-kpi__valore { font-size: 22px; }

/* ==========================================================================
   3. Log bozze
   ========================================================================== */
html.arca-ds .adm-contatore {
    display: inline-flex;
    align-items: center;
    padding: 1px 8px;
    border-radius: var(--r-pill);
    font-family: var(--f-dato);
    font-variant-numeric: tabular-nums;
    font-size: var(--fs-sm);
    font-weight: 600;
    line-height: 20px;
    color: var(--ink-2);
    background: var(--surface-alt);
    border: 1px solid var(--line-strong);
    white-space: nowrap;
}
html.arca-ds .adm-pagina .last-update-info small { font-size: inherit; color: inherit; }
html.arca-ds .adm-campo-riga { display: inline-flex; align-items: center; gap: 6px; }
html.arca-ds .adm-campo-riga .form-label { margin: 0; white-space: nowrap; }
html.arca-ds .adm-campo-riga .form-select { width: auto; min-width: 76px; }
html.arca-ds .adm-riepilogo { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; font-size: var(--fs-sm); color: var(--muted); }
html.arca-ds .adm-riepilogo__etichetta {
    font-size: var(--fs-xs);
    font-weight: 600;
    letter-spacing: var(--ls-label);
    text-transform: uppercase;
    color: var(--muted);
}
html.arca-ds .adm-num { font-family: var(--f-dato); font-variant-numeric: tabular-nums; font-weight: 600; margin-right: 3px; }

html.arca-ds #tabella-bozze-log { font-size: var(--fs-body); }
html.arca-ds #tabella-bozze-log thead th { text-align: left; vertical-align: middle; }
html.arca-ds #tabella-bozze-log thead th.text-center { text-align: center; }
html.arca-ds #tabella-bozze-log tbody td {
    height: var(--h-riga);
    padding: 2px 8px;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--ink);
}
html.arca-ds #tabella-bozze-log tbody td.text-center { text-align: center; }
html.arca-ds #tabella-bozze-log tbody td:last-child { overflow: visible; text-overflow: clip; }
html.arca-ds #tabella-bozze-log td:nth-child(6),
html.arca-ds #tabella-bozze-log td:nth-child(7),
html.arca-ds #tabella-bozze-log td:nth-child(8) { font-family: var(--f-dato); font-variant-numeric: tabular-nums; color: var(--ink-2); }
html.arca-ds #tabella-bozze-log .adm-numero { font-family: var(--f-dato); font-weight: 600; color: var(--ink); }
html.arca-ds #tabella-bozze-log td.dataTables_empty { white-space: normal; height: auto; }
/* Righe per stato (AUD-ADB-07): prima opacita' 0,65 sulle eliminate e fondo
   verde al 7% sulle salvate. La pastiglia della colonna Stato lo dice a parole. */
html.arca-ds #tabella-bozze-log tr.adm-riga--eliminata > td { color: var(--muted); background: var(--surface-alt); }
html.arca-ds #tabella-bozze-log tr.adm-riga--eliminata .adm-numero { color: var(--muted); text-decoration: line-through; }
html.arca-ds #tabella-bozze-log tr.adm-riga--salvata > td { background: var(--ok-soft); }
html.arca-ds #tabella-bozze-log tbody tr:hover > td { background: var(--accent-soft); }

/* Modale di dettaglio */
html.arca-ds #modalBozzaDettaglio .modal-header.adm-esito-eliminata { background: var(--surface-alt); border-bottom: 2px solid var(--line-campo); }
html.arca-ds #modalBozzaDettaglio .modal-body h6 { font-size: var(--fs-title); color: var(--ink); border-color: var(--line) !important; }
html.arca-ds #modalBozzaDettaglio .modal-body h6 i { color: var(--muted); }
html.arca-ds #modalBozzaDettaglio .modal-body strong { color: var(--ink); }
html.arca-ds #modalBozzaDettaglio .modal-body code { color: var(--accent); font-family: var(--f-dato); }
html.arca-ds #modalBozzaDettaglio .modal-body table { font-size: var(--fs-sm); }
html.arca-ds #modalBozzaDettaglio .modal-body table th { white-space: nowrap; }
html.arca-ds #modalBozzaDettaglio .modal-body td.text-end { font-family: var(--f-dato); font-variant-numeric: tabular-nums; }
html.arca-ds .adm-caricamento { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 24px 8px; color: var(--muted); }

/* ==========================================================================
   4. Telefono e tablet
   ========================================================================== */
@media (max-width: 767.98px) {
    html.arca-ds .adm-pagina .ads-testata__azioni { margin-left: 0; }
    html.arca-ds .adm-campo,
    html.arca-ds .adm-campo--largo { flex: 1 1 140px; }
    html.arca-ds .adm-filtri .btn { flex: 1 1 100%; }
    html.arca-ds .adm-campo-riga { flex: 1 1 140px; }
    html.arca-ds .adm-campo-riga .form-select { flex: 1 1 auto; }
    html.arca-ds .adm-applicati { margin-left: 0; flex: 1 1 100%; }
    html.arca-ds .adm-stato .status-badge { margin-left: 0; }
    html.arca-ds .adm-pagina .dataTables_wrapper .dataTables_filter input { min-width: 0; width: 100%; margin-left: 0; }
    html.arca-ds .adm-pagina .dataTables_wrapper .dataTables_filter label { display: flex; flex-direction: column; align-items: stretch; gap: 2px; width: 100%; }
    html.arca-ds .adm-pagina .dataTables_wrapper .dataTables_paginate,
    html.arca-ds .adm-pagina .dataTables_wrapper .dataTables_info { text-align: center; }
}

/* ==========================================================================
   5. Griglia nuova (ArcaElenco / AG Grid) — 24/9/2026, lotto L6
   Solo classi adm-griglia-* e regole sotto .ae-elenco: il login non ne usa
   nessuna. Le tabelle classiche (DataTables) restano come sopra.
   ========================================================================== */
/* Ricerca e righe per pagina sopra la griglia (con le classiche li disegna
   DataTables dentro la tabella) */
html.arca-ds .adm-griglia-comandi {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-bottom: 8px;
}
html.arca-ds .adm-griglia-comandi[hidden] { display: none; }
html.arca-ds .adm-griglia-comandi .ads-comandi__cerca { max-width: 420px; }

/* Il piede della griglia (conteggio e pagine) dentro il corpo del pannello */
html.arca-ds .adm-pagina .ae-elenco .ae-piede { padding: 8px 2px 0; background: transparent; border-top: 0; }

/* Codici e date nella griglia: cifre ferme */
html.arca-ds .ae-elenco .adm-codice { white-space: nowrap; }

/* Log bozze: righe per stato come la tabella classica (AUD-ADB-07) */
html.arca-ds .ae-elenco .ag-row.adm-riga--eliminata { color: var(--muted); background: var(--surface-alt); }
html.arca-ds .ae-elenco .ag-row.adm-riga--eliminata .adm-numero { color: var(--muted); text-decoration: line-through; }
html.arca-ds .ae-elenco .ag-row.adm-riga--salvata { background: var(--ok-soft); }
html.arca-ds .ae-elenco .ag-row.adm-riga--eliminata:hover,
html.arca-ds .ae-elenco .ag-row.adm-riga--salvata:hover { background: var(--accent-soft); }
html.arca-ds #griglia-bozze-log .adm-numero { font-family: var(--f-dato); font-weight: 600; color: var(--ink); }
html.arca-ds #griglia-bozze-log .adm-riga--eliminata .adm-numero { color: var(--muted); }
html.arca-ds .ae-elenco .adm-data-griglia { font-family: var(--f-dato); font-variant-numeric: tabular-nums; color: var(--ink-2); }

@media (max-width: 767.98px) {
    html.arca-ds .adm-griglia-comandi .ads-comandi__cerca { max-width: none; flex: 1 1 100%; }
    html.arca-ds .adm-pagina .ae-elenco .ae-piede { justify-content: center; text-align: center; }
}
