/* =============================================================================
   SEDNACLOUD AREA — lo stile dell'app dei clienti e dei fornitori
   =============================================================================
   PENSATA PER IL TELEFONO (Bruno, 14/10/2026): si parte da 360 px e si allarga
   (tablet da 640, computer da 1024). Colori, carattere, raggi e ombre sono i
   TOKEN del portale (sedna.tokens.css, collegato dal csproj): tema scuro compreso,
   con la classe .sedna-theme-dark su <html>. Qui non si scrivono colori fissi.

   Regole che valgono ovunque:
   - niente scorrimento orizzontale della pagina (le tabelle diventano schede);
   - tutto ciò che si tocca è alto almeno 44 px;
   - nessuna azione solo al passaggio del mouse (l'hover è solo un di più).
   ============================================================================= */

*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    background: var(--sedna-bg);
    color: var(--sedna-text);
    font-family: var(--sedna-font-sans);
    -webkit-text-size-adjust: 100%;
    overflow-x: hidden;
}

body { min-height: 100vh; min-height: 100dvh; }

a { color: var(--sedna-primary); }

h1, h2, h3 { margin: 0; color: var(--sedna-text); letter-spacing: -0.01em; }

.ar-muted { color: var(--sedna-text-secondary); }
.ar-piccolo { font-size: var(--sedna-text-sm); }
.ar-num { text-align: right; font-variant-numeric: tabular-nums; }
.ar-ok { color: var(--sedna-success-600); }
.ar-testo-errore { color: var(--sedna-error); }
.ar-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.ar-solo-desktop { display: none !important; }
@media (min-width: 1024px) {
    .ar-solo-desktop { display: initial !important; }
    .ar-solo-mobile { display: none !important; }
}

/* ─── Avvio (prima che Blazor parta) ─────────────────────────────────────── */
.ar-boot {
    min-height: 100vh; min-height: 100dvh;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem;
    background: linear-gradient(135deg, #1565c0 0%, #1976d2 55%, #0d47a1 100%);
    color: #fff;
}
.ar-boot img { filter: brightness(0) invert(1); }
.ar-boot__parola { font-size: 1.75rem; font-weight: 700; }
.ar-boot__parola span, .ar-pubblico__parola span, .ar-testata__parola span { font-weight: 500; opacity: 0.72; margin-left: 0.12em; }
.ar-boot__area { font-size: 0.875rem; opacity: 0.75; }
.ar-boot__barra { width: 180px; height: 3px; border-radius: 99px; background: rgba(255, 255, 255, 0.2); overflow: hidden; margin-top: 1rem; }
.ar-boot__barra span { display: block; width: 40%; height: 100%; background: #fff; border-radius: 99px; animation: ar-scorri 1.6s ease-in-out infinite; }
@keyframes ar-scorri { from { transform: translateX(-120%); } to { transform: translateX(300%); } }

#blazor-error-ui {
    display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1000;
    padding: 0.9rem 1rem; background: var(--sedna-error); color: #fff; font-size: var(--sedna-text-sm);
}
#blazor-error-ui a { color: #fff; margin-left: 1rem; }
#blazor-error-ui .dismiss { float: right; cursor: pointer; text-decoration: none; }

.ar-ambiente {
    background: var(--sedna-warning-500, #f59e0b); color: #1f1300;
    font-size: 0.75rem; font-weight: 600; text-align: center; padding: 0.25rem 0.5rem; letter-spacing: 0.02em;
}

/* ─── Bottoni e campi ────────────────────────────────────────────────────── */
.ar-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
    min-height: 44px; padding: 0.55rem 1.1rem;
    border-radius: var(--sedna-radius-lg); border: 1px solid transparent;
    font: inherit; font-weight: 600; font-size: 0.95rem; line-height: 1.2;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    transition: background-color var(--sedna-transition-fast, 120ms) ease, border-color var(--sedna-transition-fast, 120ms) ease;
}
.ar-btn:disabled { opacity: 0.55; cursor: not-allowed; }
.ar-btn--primario { background: var(--sedna-primary); color: var(--sedna-on-primary, #fff); }
.ar-btn--primario:not(:disabled):hover { background: var(--sedna-primary-hover); }
.ar-btn--secondario { background: var(--sedna-surface); color: var(--sedna-text); border-color: var(--sedna-border); }
.ar-btn--secondario:not(:disabled):hover { background: var(--sedna-surface-hover); }
.ar-btn--pericolo { background: var(--sedna-surface); color: var(--sedna-error); border-color: var(--sedna-error); }
.ar-btn--testo { background: transparent; color: var(--sedna-primary); padding-inline: 0.5rem; }
.ar-btn--pieno { width: 100%; }

.ar-icona-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border: 0; border-radius: var(--sedna-radius-lg);
    background: transparent; color: var(--sedna-text); font-size: 1.5rem; cursor: pointer;
}

.ar-form { display: flex; flex-direction: column; gap: 1rem; margin-top: 1rem; }
.ar-campo { display: flex; flex-direction: column; gap: 0.35rem; font-size: var(--sedna-text-sm); font-weight: 600; color: var(--sedna-text-secondary); }
.ar-campo small { font-weight: 400; }
.ar-campo input {
    width: 100%; min-height: 48px; padding: 0.65rem 0.85rem;
    font: inherit; font-size: 1rem; font-weight: 400; color: var(--sedna-text);
    background: var(--sedna-surface); border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg);
}
.ar-campo input:focus { outline: none; border-color: var(--sedna-primary); box-shadow: var(--sedna-focus-ring, 0 0 0 3px rgba(21, 101, 192, 0.25)); }
.ar-campo__con-azione { position: relative; display: block; }
.ar-campo__con-azione input { padding-right: 3rem; }
.ar-campo__azione {
    position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
    width: 44px; height: 44px; border: 0; background: transparent; color: var(--sedna-text-secondary); font-size: 1.15rem; cursor: pointer;
}

.ar-nota {
    display: flex; gap: 0.6rem; align-items: flex-start;
    padding: 0.75rem 0.9rem; border-radius: var(--sedna-radius-lg); font-size: var(--sedna-text-sm); margin-top: 0.75rem;
}
.ar-nota i { font-size: 1.1rem; line-height: 1.2; }
.ar-nota--errore { background: var(--sedna-state-error-bg); color: var(--sedna-error); }
.ar-nota--ok { background: var(--sedna-state-success-bg); color: var(--sedna-success-700); }
.ar-errore-riga { color: var(--sedna-error); font-size: var(--sedna-text-sm); margin: 0.4rem 0 0; }

.ar-spinner {
    display: inline-block; width: 28px; height: 28px; border-radius: 50%;
    border: 3px solid var(--sedna-border); border-top-color: var(--sedna-primary);
    animation: ar-gira 0.8s linear infinite;
}
.ar-spinner--piccolo { width: 16px; height: 16px; border-width: 2px; border-color: currentColor; border-top-color: transparent; }
@keyframes ar-gira { to { transform: rotate(360deg); } }

/* ─── Pagine pubbliche (accesso, imposta password) ───────────────────────── */
.ar-pubblico {
    min-height: 100vh; min-height: 100dvh;
    display: flex; flex-direction: column; align-items: center;
    padding: 1.5rem 1rem;
    background:
        radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.10) 0%, transparent 35%),
        linear-gradient(135deg, #1565c0 0%, #1976d2 55%, #0d47a1 100%);
}
.ar-pubblico__marchio { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; color: #fff; margin: 1rem 0 1.5rem; }
.ar-pubblico__marchio img { filter: brightness(0) invert(1); }
.ar-pubblico__parola { font-size: 1.6rem; font-weight: 700; }
.ar-pubblico__area { font-size: 0.85rem; opacity: 0.8; }
.ar-pubblico__corpo { width: 100%; max-width: 420px; }
.ar-pubblico__piede { margin-top: auto; padding-top: 1.5rem; display: flex; gap: 1rem; align-items: center; color: rgba(255, 255, 255, 0.85); }
.ar-pubblico__piede .ar-muted { color: rgba(255, 255, 255, 0.7); font-size: 0.75rem; }
.ar-pubblico__piede .ar-tema { color: #fff; }

.ar-auth-card {
    background: var(--sedna-surface); color: var(--sedna-text);
    border-radius: var(--sedna-radius-xl, 16px); box-shadow: var(--sedna-shadow-xl);
    padding: 1.5rem 1.25rem;
}
@media (min-width: 640px) { .ar-auth-card { padding: 2rem; } }
.ar-auth-title { font-size: 1.5rem; margin-bottom: 0.35rem; }
.ar-auth-link { margin-top: 1.25rem; text-align: center; font-size: var(--sedna-text-sm); }
.ar-auth-link a { display: inline-block; padding: 0.6rem; }

.ar-tema {
    display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px;
    border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; padding: 0;
}

/* ─── Guscio dopo il login ───────────────────────────────────────────────── */
.ar-avvio { min-height: 60vh; display: flex; align-items: center; justify-content: center; }

.ar-shell { min-height: 100vh; min-height: 100dvh; }

.ar-testata {
    position: sticky; top: 0; z-index: 30;
    display: flex; align-items: center; gap: 0.5rem;
    min-height: 56px; padding: 0 0.5rem 0 0.25rem;
    background: var(--sedna-surface); border-bottom: 1px solid var(--sedna-border);
    padding-top: env(safe-area-inset-top);
}
.ar-testata__marchio { display: flex; align-items: center; gap: 0.45rem; color: var(--sedna-text); text-decoration: none; padding: 0.5rem; min-height: 44px; }
.ar-testata__parola { font-weight: 700; font-size: 1.1rem; }
.ar-testata__ditta { flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 0.6rem; }
.ar-testata__nome-ditta { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ar-testata__cambia { font-size: var(--sedna-text-sm); white-space: nowrap; padding: 0.75rem 0.25rem; }
.ar-testata__persona { color: var(--sedna-text-secondary); font-size: var(--sedna-text-sm); white-space: nowrap; padding-right: 0.75rem; }

.ar-menu {
    position: fixed; z-index: 40; top: 0; bottom: 0; left: 0;
    width: min(300px, 86vw);
    display: flex; flex-direction: column; gap: 2px;
    padding: calc(0.75rem + env(safe-area-inset-top)) 0.6rem 1rem;
    background: var(--sedna-surface); border-right: 1px solid var(--sedna-border);
    box-shadow: var(--sedna-shadow-xl);
    overflow-y: auto;
    transform: translateX(-105%);
    transition: transform 200ms ease;
}
.ar-shell--menu .ar-menu { transform: translateX(0); }
.ar-velo { display: none; }
.ar-shell--menu .ar-velo { display: block; position: fixed; inset: 0; z-index: 35; background: rgba(0, 0, 0, 0.4); }

.ar-menu__persona { display: flex; gap: 0.75rem; align-items: center; padding: 0.5rem 0.6rem 1rem; border-bottom: 1px solid var(--sedna-border); margin-bottom: 0.5rem; }
.ar-menu__persona > i { font-size: 2rem; color: var(--sedna-primary); }
.ar-menu__nome { font-weight: 600; }
.ar-menu__titolo { margin: 1rem 0.6rem 0.25rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--sedna-text-tertiary, var(--sedna-text-secondary)); }
.ar-menu__voce {
    display: flex; align-items: center; gap: 0.75rem;
    min-height: 44px; padding: 0.55rem 0.7rem; border-radius: var(--sedna-radius-lg);
    color: var(--sedna-text); text-decoration: none; font: inherit; font-size: 0.95rem;
    background: transparent; border: 0; width: 100%; text-align: left; cursor: pointer;
}
.ar-menu__voce > i { font-size: 1.15rem; color: var(--sedna-text-secondary); width: 1.25rem; text-align: center; }
.ar-menu__voce:hover { background: var(--sedna-surface-hover); }
.ar-menu__voce--attiva { background: var(--sedna-primary-subtle); color: var(--sedna-primary); font-weight: 600; }
.ar-menu__voce--attiva > i { color: var(--sedna-primary); }
.ar-menu__voce--presto { color: var(--sedna-text-secondary); cursor: default; }
.ar-menu__voce--presto:hover { background: transparent; }
.ar-menu__voce--presto small { margin-left: auto; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; }
.ar-menu__testo { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ar-menu__voce--tema { padding: 0 0.7rem; }
.ar-menu__voce--tema .ar-tema { gap: 0.75rem; width: 100%; }
.ar-menu__voce--tema .ar-tema i { color: var(--sedna-text-secondary); width: 1.25rem; text-align: center; font-size: 1.15rem; }
.ar-menu__voce--esci { color: var(--sedna-error); }
.ar-menu__voce--esci > i { color: var(--sedna-error); }
.ar-menu__versione { margin-top: auto; padding: 1rem 0.7rem 0; }

.ar-contenuto { padding: 1rem 1rem calc(1.5rem + env(safe-area-inset-bottom)); max-width: 1200px; margin: 0 auto; }

@media (min-width: 1024px) {
    .ar-shell { display: grid; grid-template-columns: 260px 1fr; grid-template-rows: auto 1fr; }
    .ar-testata { grid-column: 1 / -1; padding-left: 0.75rem; }
    .ar-menu {
        position: sticky; top: 56px; height: calc(100vh - 56px); z-index: 1;
        width: auto; transform: none; box-shadow: none; padding-top: 0.75rem;
    }
    .ar-velo, .ar-shell--menu .ar-velo { display: none; }
    .ar-contenuto { padding: 1.75rem 2rem 2.5rem; width: 100%; }
}

/* ─── Pagine ─────────────────────────────────────────────────────────────── */
.ar-pagina { display: flex; flex-direction: column; gap: 1rem; }
.ar-pagina--stretta { max-width: 560px; }
.ar-pagina--con-barra { padding-bottom: 5.5rem; }
@media (min-width: 1024px) { .ar-pagina--con-barra { padding-bottom: 0; } }
.ar-pagina__testa h1 { font-size: 1.5rem; line-height: 1.25; }
@media (min-width: 640px) { .ar-pagina__testa h1 { font-size: 1.75rem; } }
.ar-pagina__testa p { margin: 0.35rem 0 0; }
.ar-pagina__testa--azioni { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.ar-occhiello { margin: 0 0 0.2rem; font-size: var(--sedna-text-sm); color: var(--sedna-text-secondary); font-weight: 500; }
.ar-briciole a { display: inline-flex; align-items: center; gap: 0.4rem; min-height: 44px; text-decoration: none; font-size: var(--sedna-text-sm); font-weight: 600; }

.ar-pannello {
    background: var(--sedna-surface); border: 1px solid var(--sedna-border);
    border-radius: var(--sedna-radius-xl, 16px); padding: 1rem;
}
@media (min-width: 640px) { .ar-pannello { padding: 1.25rem 1.5rem; } }
.ar-sezione { display: flex; flex-direction: column; gap: 0.6rem; }
.ar-sezione__titolo { font-size: 1rem; font-weight: 700; margin-bottom: 0.6rem; }
.ar-sezione > .ar-sezione__titolo { margin-bottom: 0; }
.ar-azioni { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 0.75rem; }

/* Avvisi a tutta pagina: area non attiva, rete, 429, vuoto */
.ar-avviso {
    display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0.6rem;
    padding: 2rem 1.25rem; background: var(--sedna-surface); border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-xl, 16px);
}
.ar-avviso h2 { font-size: 1.15rem; }
.ar-avviso p { margin: 0; color: var(--sedna-text-secondary); max-width: 46ch; }
.ar-avviso__icona { font-size: 2.25rem; color: var(--sedna-warning-600, #d97706); }
.ar-avviso--quieto .ar-avviso__icona { color: var(--sedna-primary); }

/* Scheletri */
.ar-scheletro { display: flex; flex-direction: column; gap: 0.6rem; }
.ar-osso { display: block; height: 0.9rem; border-radius: 6px; background: var(--sedna-surface-hover); animation: ar-pulsa 1.2s ease-in-out infinite; }
.ar-osso--corto { width: 40%; }
.ar-osso--grande { height: 2rem; width: 55%; margin: 0.5rem 0; }
.ar-riga-scheletro { display: flex; flex-direction: column; gap: 0.5rem; padding: 1rem; background: var(--sedna-surface); border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg); }
.ar-card--scheletro { min-height: 140px; }
@keyframes ar-pulsa { 50% { opacity: 0.45; } }
@media (prefers-reduced-motion: reduce) { .ar-osso, .ar-boot__barra span, .ar-spinner { animation: none; } }

/* ─── Scelta della ditta ─────────────────────────────────────────────────── */
.ar-elenco-ditte { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.ar-ditta {
    display: flex; align-items: center; gap: 0.9rem; width: 100%; min-height: 64px;
    padding: 0.8rem 1rem; border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-xl, 16px);
    background: var(--sedna-surface); color: var(--sedna-text); font: inherit; text-align: left; cursor: pointer;
}
.ar-ditta:hover { border-color: var(--sedna-primary); }
.ar-ditta--corrente { border-color: var(--sedna-primary); box-shadow: 0 0 0 1px var(--sedna-primary) inset; }
.ar-ditta__icona { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--sedna-primary-subtle); color: var(--sedna-primary); font-size: 1.25rem; flex: none; }
.ar-ditta__testo { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ar-ditta__nome { font-weight: 600; font-size: 1.05rem; overflow-wrap: anywhere; }
.ar-ditta__freccia { color: var(--sedna-text-secondary); }

/* ─── Dashboard: card ────────────────────────────────────────────────────── */
.ar-card-griglia { display: grid; grid-template-columns: 1fr; gap: 0.85rem; }
@media (min-width: 640px) { .ar-card-griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .ar-card-griglia { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.ar-card {
    display: flex; flex-direction: column; gap: 0.3rem;
    padding: 1rem 1.1rem; min-height: 128px;
    background: var(--sedna-surface); color: var(--sedna-text); text-decoration: none;
    border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-xl, 16px);
    box-shadow: var(--sedna-shadow-xs);
}
.ar-card--link { transition: border-color 120ms ease, box-shadow 120ms ease; }
.ar-card--link:hover { border-color: var(--sedna-primary); box-shadow: var(--sedna-shadow-md); }
.ar-card--link:focus-visible { outline: 3px solid var(--sedna-primary); outline-offset: 2px; }
.ar-card--presto { background: var(--sedna-bg-subtle, var(--sedna-surface)); }
.ar-card--scaduto { border-color: var(--sedna-error); }
.ar-card--scaduto .ar-card__numero { color: var(--sedna-error); }
.ar-card__testa { display: flex; align-items: center; gap: 0.6rem; }
.ar-card__icona { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--sedna-primary-subtle); color: var(--sedna-primary); font-size: 1.05rem; flex: none; }
.ar-card--presto .ar-card__icona { background: var(--sedna-surface-hover); color: var(--sedna-text-secondary); }
.ar-card__titolo { flex: 1; min-width: 0; font-weight: 600; overflow-wrap: anywhere; }
.ar-card__freccia { color: var(--sedna-text-secondary); }
.ar-card__numero { font-size: 2.25rem; font-weight: 700; line-height: 1.1; margin-top: 0.4rem; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.ar-card__sotto { display: flex; flex-wrap: wrap; gap: 0.35rem; font-size: var(--sedna-text-sm); }
.ar-card__presto { margin-top: auto; font-size: var(--sedna-text-sm); color: var(--sedna-text-secondary); font-weight: 500; }
.ar-card__codici { list-style: none; margin: 0.5rem 0 0; padding: 0.5rem 0 0; border-top: 1px dashed var(--sedna-border); font-size: var(--sedna-text-sm); }
.ar-card__codici li { display: flex; justify-content: space-between; padding: 0.15rem 0; }

/* ─── Elenchi: schede sul telefono, colonne sul computer ─────────────────── */
.ar-filtri { display: flex; flex-direction: column; gap: 0.6rem; }
.ar-filtri__date { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: flex-end; }
.ar-campo--data { flex: 1 1 140px; }
.ar-campo--cerca { position: relative; }
.ar-campo--cerca > i { position: absolute; left: 0.85rem; top: 50%; transform: translateY(-50%); color: var(--sedna-text-secondary); }
.ar-campo--cerca input { padding-left: 2.4rem; }
@media (min-width: 1024px) {
    .ar-filtri { flex-direction: row; align-items: flex-end; }
    .ar-campo--cerca { flex: 1; }
    .ar-filtri__date { flex: none; }
    .ar-campo--data { flex: 0 0 170px; }
}

.ar-righe { display: flex; flex-direction: column; gap: 0.55rem; }
.ar-righe__testa { display: none; }
.ar-riga {
    display: grid; grid-template-columns: 1fr auto; grid-template-areas: "numero importo" "data soggetto" ;
    gap: 0.2rem 0.75rem; align-items: baseline;
    padding: 0.85rem 1rem; min-height: 64px;
    background: var(--sedna-surface); color: var(--sedna-text); text-decoration: none;
    border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg);
}
.ar-riga:hover { border-color: var(--sedna-primary); }
.ar-riga__numero { grid-area: numero; font-weight: 600; }
.ar-riga__importo { grid-area: importo; font-weight: 700; }
.ar-riga__data { grid-area: data; color: var(--sedna-text-secondary); font-size: var(--sedna-text-sm); }
.ar-riga__soggetto { grid-area: soggetto; color: var(--sedna-text-secondary); font-size: var(--sedna-text-sm); text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ar-riga__freccia { display: none; }
@media (min-width: 1024px) {
    .ar-righe { gap: 0; border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg); overflow: hidden; background: var(--sedna-surface); }
    .ar-righe__testa, .ar-riga {
        display: grid; grid-template-columns: 120px 140px minmax(0, 1fr) 150px 24px; grid-template-areas: none;
        gap: 1rem; align-items: center; padding: 0.7rem 1rem; border-radius: 0; border: 0;
    }
    .ar-righe__testa { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--sedna-text-secondary); background: var(--sedna-table-header-bg, var(--sedna-bg-subtle)); }
    .ar-riga { min-height: 48px; border-top: 1px solid var(--sedna-border); }
    .ar-riga:hover { background: var(--sedna-table-row-hover, var(--sedna-surface-hover)); }
    .ar-riga__numero, .ar-riga__importo, .ar-riga__data, .ar-riga__soggetto { grid-area: auto; font-size: inherit; }
    .ar-riga__data, .ar-riga__soggetto { color: var(--sedna-text); text-align: left; }
    .ar-riga__freccia { display: block; color: var(--sedna-text-secondary); }
}

.ar-pagine { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.5rem; }

/* ─── Dettaglio del documento ────────────────────────────────────────────── */
.ar-dati { display: grid; grid-template-columns: 1fr; gap: 0.75rem; margin: 0; }
@media (min-width: 640px) { .ar-dati { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ar-dati dt { font-size: 0.75rem; font-weight: 600; color: var(--sedna-text-secondary); text-transform: uppercase; letter-spacing: 0.04em; }
.ar-dati dd { margin: 0.15rem 0 0; overflow-wrap: anywhere; }

.ar-righe-doc { display: flex; flex-direction: column; gap: 0.55rem; }
.ar-righe-doc__testa { display: none; }
.ar-riga-doc {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.4rem 0.75rem;
    padding: 0.85rem 1rem; background: var(--sedna-surface); border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg);
}
.ar-riga-doc__articolo { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 0.1rem; }
.ar-riga-doc__descrizione { font-weight: 600; overflow-wrap: anywhere; }
.ar-riga-doc > .ar-num { text-align: left; font-size: var(--sedna-text-sm); }
.ar-riga-doc > .ar-num::before { content: attr(data-etichetta); display: block; font-size: 0.7rem; font-weight: 600; color: var(--sedna-text-secondary); text-transform: uppercase; letter-spacing: 0.04em; }
.ar-riga-doc__importo { font-weight: 700; }
@media (min-width: 1024px) {
    .ar-righe-doc { gap: 0; border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg); overflow: hidden; background: var(--sedna-surface); }
    .ar-righe-doc__testa, .ar-riga-doc {
        display: grid; grid-template-columns: minmax(0, 1fr) 90px 140px 160px 140px; gap: 1rem; align-items: center;
        padding: 0.65rem 1rem; border-radius: 0; border: 0;
    }
    .ar-righe-doc__testa { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--sedna-text-secondary); background: var(--sedna-table-header-bg, var(--sedna-bg-subtle)); }
    .ar-riga-doc { border-top: 1px solid var(--sedna-border); }
    .ar-riga-doc__articolo { grid-column: auto; }
    .ar-riga-doc > .ar-num { text-align: right; font-size: inherit; }
    .ar-riga-doc > .ar-num::before { display: none; }
}

.ar-due-colonne { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 900px) { .ar-due-colonne { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
.ar-tabella-iva { width: 100%; border-collapse: collapse; font-size: var(--sedna-text-sm); }
.ar-tabella-iva th { text-align: left; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--sedna-text-secondary); padding: 0.35rem 0; }
.ar-tabella-iva th.ar-num { text-align: right; }
.ar-tabella-iva td { padding: 0.45rem 0; border-top: 1px solid var(--sedna-border); }
.ar-totali dl { margin: 0; display: flex; flex-direction: column; gap: 0.4rem; }
.ar-totali dl > div { display: flex; justify-content: space-between; gap: 1rem; }
.ar-totali dt { color: var(--sedna-text-secondary); }
.ar-totali dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 600; }
.ar-totali__grande { padding-top: 0.6rem; margin-top: 0.3rem; border-top: 1px solid var(--sedna-border); }
.ar-totali__grande dt, .ar-totali__grande dd { color: var(--sedna-text); font-size: 1.15rem; font-weight: 700; }

/* Sul telefono il totale e «Scarica PDF» restano sempre raggiungibili, in basso. */
.ar-barra-fissa {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
    padding: 0.6rem 1rem calc(0.6rem + env(safe-area-inset-bottom));
    background: var(--sedna-surface); border-top: 1px solid var(--sedna-border); box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
}
.ar-barra-fissa__totale { display: flex; flex-direction: column; font-weight: 700; font-variant-numeric: tabular-nums; }
.ar-barra-fissa__totale small { font-weight: 500; color: var(--sedna-text-secondary); font-size: 0.72rem; }

/* ─── Secondo fattore ────────────────────────────────────────────────────── */
.ar-stato-sf { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 0.75rem; font-size: 1.05rem; }
.ar-stato-sf--attivo i { color: var(--sedna-success-600); }
.ar-qr { display: flex; justify-content: center; padding: 0.75rem; background: #fff; border-radius: var(--sedna-radius-lg); margin-bottom: 0.75rem; }
.ar-qr svg { width: 200px; height: 200px; }
.ar-chiave { font-size: 0.95rem; word-break: break-all; background: var(--sedna-surface-hover); padding: 0.4rem 0.6rem; border-radius: 6px; }
.ar-codici { list-style: none; padding: 0; margin: 0.75rem 0 1rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.4rem; }
.ar-codici code { display: block; text-align: center; padding: 0.4rem; background: var(--sedna-surface-hover); border-radius: 6px; }

/* =============================================================================
   LE VOCI A2-A5 (14/10/2026): saldo, partite, casse, conferimenti, liquidazioni,
   ordini. Stesse regole di sopra: schede al posto delle tabelle, 44 px per il
   pollice, nessuno scorrimento orizzontale a 360 px.
   ============================================================================= */

/* ─── Pillole di stato ───────────────────────────────────────────────────── */
.ar-pillola {
    display: inline-flex; align-items: center; gap: 0.3rem;
    padding: 0.15rem 0.6rem; border-radius: 99px;
    font-size: 0.75rem; font-weight: 600; line-height: 1.5; white-space: nowrap;
    background: var(--sedna-surface-hover); color: var(--sedna-text-secondary);
}
.ar-pillola--rossa { background: var(--sedna-state-error-bg); color: var(--sedna-error); }
.ar-pillola--verde { background: var(--sedna-state-success-bg); color: var(--sedna-success-700, var(--sedna-success-600)); }
.ar-pillola--gialla { background: var(--sedna-state-warning-bg, var(--sedna-surface-hover)); color: var(--sedna-warning-700, var(--sedna-warning-600, #b45309)); }
.ar-pillola--blu { background: var(--sedna-primary-subtle); color: var(--sedna-primary); }
.ar-pillola--grigia { background: var(--sedna-surface-hover); color: var(--sedna-text-secondary); }

.ar-negativo { color: var(--sedna-error); }
.ar-spazio-sopra { margin-top: 0.75rem; }

/* ─── Bottoni-filtro («chip»): grandi abbastanza per il pollice ─────────── */
.ar-chip-riga { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.ar-chip {
    min-height: 44px; padding: 0.45rem 0.95rem;
    border-radius: 99px; border: 1px solid var(--sedna-border);
    background: var(--sedna-surface); color: var(--sedna-text);
    font: inherit; font-size: 0.9rem; font-weight: 500; cursor: pointer; white-space: nowrap;
}
.ar-chip--scelto { background: var(--sedna-primary-subtle); border-color: var(--sedna-primary); color: var(--sedna-primary); font-weight: 600; }
.ar-chip-riga--piccola { margin-top: 0.4rem; }
.ar-chip-riga--piccola .ar-chip { min-height: 36px; padding: 0.25rem 0.8rem; font-size: 0.82rem; }
.ar-filtri--periodo { gap: 0.75rem; }

/* ─── La cifra grande (saldo, da pagare) ─────────────────────────────────── */
.ar-cifra { display: flex; flex-direction: column; gap: 0.2rem; }
.ar-cifra p { margin: 0; }
.ar-cifra__etichetta { font-size: var(--sedna-text-sm); font-weight: 600; color: var(--sedna-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; }
.ar-cifra__valore { font-size: 2.5rem; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.ar-cifra__sotto { display: flex; align-items: center; gap: 0.5rem; font-variant-numeric: tabular-nums; font-weight: 600; }
.ar-cifra--rossa { border-color: var(--sedna-error); }
.ar-cifra--rossa .ar-cifra__valore { color: var(--sedna-error); }

/* ─── Schede (movimenti, partite, conferimenti, ordini…) ─────────────────── */
.ar-schede { display: flex; flex-direction: column; gap: 0.55rem; }
@media (min-width: 1024px) { .ar-schede { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; } }
.ar-scheda {
    display: flex; flex-direction: column; gap: 0.3rem;
    padding: 0.85rem 1rem; min-height: 56px; min-width: 0;
    background: var(--sedna-surface); color: var(--sedna-text); text-decoration: none;
    border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg);
}
.ar-scheda--link:hover { border-color: var(--sedna-primary); }
.ar-scheda--link:focus-visible { outline: 3px solid var(--sedna-primary); outline-offset: 2px; }
.ar-scheda--spenta { opacity: 0.65; }
.ar-scheda--allarme { border-left: 4px solid var(--sedna-error); }
.ar-scheda__riga { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; min-width: 0; }
.ar-scheda__riga > :first-child { min-width: 0; overflow-wrap: anywhere; }
.ar-scheda__riga > :last-child:not(:first-child) { flex: none; text-align: right; }
.ar-scheda__titolo { font-weight: 600; }
.ar-scheda__importo { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; display: inline-flex; flex-direction: column; align-items: flex-end; }
.ar-scheda__pillole { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin-top: 0.15rem; }
.ar-scheda__azione { margin-top: 0.35rem; }

/* ─── Casse ──────────────────────────────────────────────────────────────── */
.ar-card__numero--parole { font-size: 1.6rem; overflow-wrap: anywhere; }
.ar-casse--rendere .ar-card__numero, .ar-card__numero.ar-casse--rendere { color: var(--sedna-warning-700, var(--sedna-warning-600, #b45309)); }
.ar-casse--ricevere .ar-card__numero, .ar-card__numero.ar-casse--ricevere { color: var(--sedna-primary); }
.ar-casse--pari .ar-card__numero, .ar-card__numero.ar-casse--pari { color: var(--sedna-success-600); }
.ar-casse-mov { font-size: 0.9rem; }
.ar-casse-mov--uscita { color: var(--sedna-warning-700, var(--sedna-warning-600, #b45309)); }
.ar-casse-mov--entrata { color: var(--sedna-success-600); }

/* ─── Ordini ─────────────────────────────────────────────────────────────── */
.ar-azioni-grandi { display: flex; flex-direction: column; gap: 0.6rem; }
.ar-azioni-grandi .ar-btn { width: 100%; }
@media (min-width: 640px) { .ar-azioni-grandi { flex-direction: row; } .ar-azioni-grandi .ar-btn { width: auto; } }

.ar-tre-numeri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; margin-top: 0.2rem; }
.ar-tre-numeri > div { display: flex; flex-direction: column; min-width: 0; }
.ar-tre-numeri small { font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--sedna-text-secondary); }
.ar-tre-numeri span { font-variant-numeric: tabular-nums; font-weight: 600; overflow-wrap: anywhere; }

.ar-avviso--ok .ar-avviso__icona { color: var(--sedna-success-600); }

/* La ricerca degli articoli resta in cima mentre si scorre. */
.ar-cerca-fissa {
    position: sticky; top: calc(56px + env(safe-area-inset-top)); z-index: 10;
    padding: 0.5rem 0; background: var(--sedna-bg);
}

.ar-articolo { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6rem; }
@media (min-width: 420px) { .ar-articolo { grid-template-columns: minmax(0, 1fr) auto; align-items: center; } }
.ar-articolo__testo { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.ar-articolo__testo > span { overflow-wrap: anywhere; }
.ar-articolo--nel-carrello { border-color: var(--sedna-primary); box-shadow: 0 0 0 1px var(--sedna-primary) inset; }
.ar-articolo__nota { grid-column: 1 / -1; }
.ar-articolo__nota input { min-height: 44px; }

.ar-quantita { display: flex; align-items: center; gap: 0.4rem; justify-self: start; }
@media (min-width: 420px) { .ar-quantita { justify-self: end; } }
.ar-quantita__btn {
    display: grid; place-items: center; width: 48px; height: 48px; flex: none;
    border-radius: 50%; border: 1px solid var(--sedna-border);
    background: var(--sedna-surface); color: var(--sedna-text); font-size: 1.25rem; cursor: pointer;
}
.ar-quantita__btn--piu { background: var(--sedna-primary); color: var(--sedna-on-primary, #fff); border-color: var(--sedna-primary); }
.ar-quantita__btn:disabled { opacity: 0.4; cursor: not-allowed; }
.ar-quantita__campo { display: flex; flex-direction: column; align-items: center; }
.ar-quantita__campo input {
    width: 4.5rem; min-height: 48px; padding: 0.4rem; text-align: center;
    font: inherit; font-size: 1.1rem; font-weight: 600; font-variant-numeric: tabular-nums;
    color: var(--sedna-text); background: var(--sedna-surface); border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg);
}
.ar-quantita__campo input:focus { outline: none; border-color: var(--sedna-primary); box-shadow: var(--sedna-focus-ring, 0 0 0 3px rgba(21, 101, 192, 0.25)); }
.ar-quantita__campo small { font-size: 0.7rem; color: var(--sedna-text-secondary); }

/* Il carrello in basso, fisso, anche sul computer (accanto al menu). */
.ar-pagina--con-barra-sempre { padding-bottom: 6rem; }
@media (min-width: 1024px) { .ar-barra-fissa--sempre { left: 260px; padding-inline: 2rem; } }

.ar-barrate { margin: 0; padding-left: 1.1rem; color: var(--sedna-text-secondary); font-size: var(--sedna-text-sm); }
.ar-barrate li { padding: 0.2rem 0; }

.ar-form-ordine { display: flex; flex-direction: column; gap: 0.9rem; }
.ar-campo textarea {
    width: 100%; padding: 0.65rem 0.85rem; resize: vertical;
    font: inherit; font-size: 1rem; font-weight: 400; color: var(--sedna-text);
    background: var(--sedna-surface); border: 1px solid var(--sedna-border); border-radius: var(--sedna-radius-lg);
}
.ar-campo textarea:focus { outline: none; border-color: var(--sedna-primary); box-shadow: var(--sedna-focus-ring, 0 0 0 3px rgba(21, 101, 192, 0.25)); }