/*
 * Telefono (pagine): regole SOLO per schermi larghi meno di 768 px.
 * Il foglio e' caricato con media="(max-width: 767.98px)" da
 * resources/views/includes/telefono-css.blade.php: sul computer e sul
 * tablet non viene applicato, quindi la loro impaginazione non cambia.
 *
 * Zona: le "altre pagine del medico" (La mia pagina, Fatturazione,
 * Credenziali Sistema TS, Archivio, Abbonamento, Invita un collega,
 * Pausa, Assistenza, Password, Tutorial, collegamento calendari, mese
 * gratuito, Agenda (mese, settimana, giorno), Condizioni di servizio,
 * pagine vecchie: pazienti, visite, ricette, anamnesi, storia clinica,
 * cronologia, promemoria). Il Team del professionista ha il suo foglio,
 * telefono-team.css.
 * Solo disposizione e misure: stessi colori e stessi componenti di casa.
 * Misure di riferimento: testi >= 14 px, campi 16 px (niente zoom di
 * iPhone), bersagli da toccare >= 44 px, margini laterali 16 px.
 */

/* ================================================================
   0. COMUNE ALLE PAGINE DELLA ZONA
   ================================================================ */

/* Il "?" di aiuto resta un cerchietto, ma si tocca su 44 px. */
:is(.mp, .fatt-pagina, .tsx-pagina, .arch, .abb, .ref, .tut-pagina, .pau) .aiuto-funzione {
    position: relative;
    width: 30px;
    height: 30px;
    font-size: .875rem;
}
:is(.mp, .fatt-pagina, .tsx-pagina, .arch, .abb, .ref, .tut-pagina, .pau) .aiuto-funzione::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 44px;
    height: 44px;
    transform: translate(-50%, -50%);
}

/* Campi di scrittura a 16 px: sotto questa misura iPhone ingrandisce
   la pagina appena si tocca il campo. */
:is(.mp, .fatt-pagina, .tsx-pagina, .ref, .sync-page, #fattModal) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    font-size: 16px !important;
}
:is(.fatt-pagina, .tsx-pagina, #fattModal) :is(.form-input, .form-select):not(textarea) {
    min-height: 48px;
}

/* ================================================================
   1. FATTURAZIONE (pagina intera e dentro la finestra della scrivania)
   ================================================================ */
.fatt-pagina {
    max-width: 100%;
    min-width: 0;
    margin: 1rem auto 2rem;
    padding: 0 max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left));
}
.fatt-testa {
    flex-direction: column;
    align-items: stretch;
    gap: .9rem;
}
.fatt-testa h1 { font-size: 1.45rem; }
.fatt-testa p { font-size: .95rem; line-height: 1.55; }

/* I tre pulsanti: "Nuova fattura" in cima a tutta larghezza,
   gli altri due affiancati sotto. */
.fatt-azioni {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem;
}
.fatt-azioni > .btn {
    width: 100%;
    min-height: 48px;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .5rem .7rem;
    white-space: normal;
    text-align: center;
    line-height: 1.25;
    font-size: .95rem;
}
.fatt-azioni > #fattNuovaBtn { grid-column: 1 / -1; order: -1; }

.fatt-avviso { font-size: .92rem; }
.fatt-carta { padding: 1.1rem 1rem; border-radius: 14px; }
.fatt-carta .fatt-sotto { font-size: .92rem; }
.fatt-tessere { grid-template-columns: 1fr 1fr; gap: .6rem; }
.fatt-tessera { padding: .8rem .9rem; }
.fatt-tessera b { font-size: 1.15rem; }
.fatt-tessera span { display: block; font-size: .875rem; letter-spacing: .03em; line-height: 1.35; margin-top: .15rem; }

.fatt-campo label { font-size: .875rem; }
.fatt-campo .fatt-aiuto, .fatt-aiuto { font-size: .875rem; }
/* Le griglie con le colonne scritte nel markup si impilano. */
.fatt-pagina .fatt-griglia,
#fattModal .fatt-griglia { grid-template-columns: 1fr !important; }
.fatt-pagina .fatt-campo.e-largo[style*="flex-direction:row"] > .btn { width: 100%; min-height: 48px; }
.fatt-pagina #fattImpostazioni form > div:last-child { justify-content: stretch !important; }
.fatt-pagina #fattImpostazioni form > div:last-child > .btn { width: 100%; min-height: 48px; }
.fatt-pagina .fp-ts-esito { min-width: 0 !important; flex-basis: 100% !important; }

/* Il registro: la testata con l'anno va a capo senza stringere. */
.fatt-carta > div:first-child:has(> select) { gap: .6rem !important; }
.fatt-carta > div:first-child > select.form-select { min-height: 44px; }

/* Il registro diventa una pila di schede: una fattura per scheda,
   niente tabella da scorrere di lato. */
.fatt-tabella-scroll { max-height: none; overflow: visible; }
.fatt-tabella-scroll .patients-table,
.fatt-tabella-scroll .patients-table tbody { display: block; width: 100%; }
.fatt-tabella-scroll .patients-table thead { display: none; }
.fatt-tabella-scroll .patients-table tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:
        "num tot"
        "paz data"
        "pag pag"
        "ts ts"
        "az az";
    gap: .3rem .8rem;
    padding: .85rem .9rem;
    margin-bottom: .7rem;
    border: 1px solid var(--doc-border, rgba(148,163,184,.25));
    border-radius: 12px;
    background: rgba(148,163,184,.06);
}
.fatt-tabella-scroll .patients-table td {
    display: block;
    padding: 0;
    border: 0;
    min-width: 0;
    font-size: .95rem;
    background: transparent !important;
}
.fatt-tabella-scroll .patients-table td:nth-child(1) { grid-area: num; font-size: 1rem; }
.fatt-tabella-scroll .patients-table td:nth-child(2) { grid-area: data; text-align: right; color: var(--doc-text-muted, #94A3B8); }
.fatt-tabella-scroll .patients-table td:nth-child(3) { grid-area: paz; font-weight: 600; color: var(--doc-text-strong, #F1F5F9); overflow-wrap: anywhere; }
.fatt-tabella-scroll .patients-table td:nth-child(4) { grid-area: tot; text-align: right !important; font-size: 1.05rem; }
/* Pagamento e Sistema TS: una riga ciascuno, etichetta a sinistra
   e stato a destra (con "Segna pagata" / "Riprova" accanto). */
.fatt-tabella-scroll .patients-table td:nth-child(5),
.fatt-tabella-scroll .patients-table td:nth-child(6) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .35rem .5rem;
    min-height: 44px;
}
.fatt-tabella-scroll .patients-table td:nth-child(5) { grid-area: pag; margin-top: .35rem; }
.fatt-tabella-scroll .patients-table td:nth-child(6) { grid-area: ts; }
.fatt-tabella-scroll .patients-table td:nth-child(7) {
    grid-area: az;
    margin-top: .5rem;
    padding-top: .6rem;
    border-top: 1px dashed var(--doc-border, rgba(148,163,184,.25));
}
.fatt-tabella-scroll .patients-table td:nth-child(5)::before,
.fatt-tabella-scroll .patients-table td:nth-child(6)::before {
    margin-right: auto;
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--doc-text-muted, #94A3B8);
}
.fatt-tabella-scroll .patients-table td:nth-child(5)::before { content: "Pagamento"; }
.fatt-tabella-scroll .patients-table td:nth-child(6)::before { content: "Sistema TS"; }
.fatt-tabella-scroll .fatt-stato { font-size: .875rem; padding: .35rem .7rem; }
.fatt-tabella-scroll .fatt-stato.e-esclusa { white-space: normal; text-align: right; }
.fatt-tabella-scroll .patients-table td .btn { min-height: 44px; font-size: .9rem; }
.fatt-tabella-scroll .row-actions { justify-content: flex-start !important; gap: .6rem; flex-wrap: wrap; }
.fatt-tabella-scroll .row-actions .action-btn { width: 44px; height: 44px; font-size: 1rem; }
.fatt-tabella-scroll .fatt-esito { max-width: none; font-size: .875rem; margin-top: .4rem; }

/* Finestre della Fatturazione (nuova fattura, esporta): a tutto schermo,
   testata in alto e pulsanti in basso sempre a portata di pollice. */
#fattModal.modal-overlay,
#fattEsportaVelo.modal-overlay { padding: 0; align-items: stretch; }
#fattModal .modal-medium,
#fattEsportaVelo .modal-medium {
    max-width: 100% !important;
    width: 100%;
    min-height: 100%;
    max-height: none;
    margin: 0;
    border: 0;
    border-radius: 0;
}
#fattModal .modal-header,
#fattEsportaVelo .modal-header {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--doc-panel, #1E293B);
    padding: max(.8rem, env(safe-area-inset-top)) 1rem .8rem;
    gap: .6rem;
}
#fattModal .modal-header h2,
#fattEsportaVelo .modal-header h2 { font-size: 1.1rem; gap: .5rem; }
#fattModal .btn-close-modal,
#fattEsportaVelo .btn-close-modal { min-width: 44px; min-height: 44px; flex-shrink: 0; }
#fattModal .modal-body,
#fattEsportaVelo .modal-body { padding: 1rem; }
#fattModal .modal-footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: var(--doc-panel, #1E293B);
    padding: .75rem 1rem max(.75rem, env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: .6rem;
}
#fattModal .modal-footer .btn { width: 100%; min-height: 48px; margin: 0; }
/* Ogni prestazione: la descrizione a tutta larghezza, sotto importo e "togli". */
#fattModal .fatt-riga-voce {
    grid-template-columns: minmax(0, 1fr) 44px;
    grid-template-areas: "desc desc" "imp via";
    padding-bottom: .6rem;
    border-bottom: 1px dashed var(--doc-border, rgba(148,163,184,.25));
}
#fattModal .fatt-riga-voce .nf-desc { grid-area: desc; }
#fattModal .fatt-riga-voce .nf-imp { grid-area: imp; }
#fattModal .fatt-riga-voce .nf-via { grid-area: via; }
#fattModal .fatt-riga-voce .action-btn { width: 44px; height: 48px; }
#fattModal #nfAggiungiRiga { min-height: 44px; }
#fattModal .patient-option { min-height: 48px; }
#fattEsportaVelo .fatt-metodi,
.fatt-metodi { grid-template-columns: 1fr; }
.fatt-metodo { min-height: 56px; }
.fatt-metodo small { font-size: .875rem; }

/* ================================================================
   2. CONTENITORI DELLE PAGINE NUOVE
   Il corpo della pagina ha gia' 20 px di margine sui telefoni
   (styles.css, body.page-system): i contenitori non ne aggiungono
   altri, cosi' le schede usano tutta la larghezza utile.
   ================================================================ */
/* (body.d-flex = il layout del sito; dentro la finestra della scrivania
   il guscio spoglio non ha quel margine e la Fatturazione tiene il suo) */
body.d-flex :is(.fatt-pagina, .tsx-pagina, .mp, .arch, .abb, .ref, .pau, .tut-pagina, .sync-page) {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
}
:is(.mp, .arch, .abb, .ref, .pau) { padding-top: .6rem; }
:is(.mp, .arch, .abb, .ref, .pau, .tsx-pagina, .fatt-pagina, .tut-pagina) h1 {
    font-size: 1.4rem;
    line-height: 1.3;
    flex-wrap: wrap;
}

/* Pulsanti "Torna alla scrivania" di testata: bersaglio pieno. */
:is(.mp .mp-torna, .pau .pau-torna) { min-height: 44px; }

/* ================================================================
   3. CREDENZIALI SISTEMA TS
   ================================================================ */
.tsx-pagina { margin-top: 1rem; }
.tsx-testa p, .tsx-sotto { font-size: .95rem; }
.tsx-carta { padding: 1.1rem 1rem; }
.tsx-carta h2 { flex-wrap: wrap; font-size: 1.05rem; }
.tsx-campo label { font-size: .875rem; }
.tsx-aiuto { font-size: .875rem; }
.tsx-usi { grid-template-columns: 1fr; }
.tsx-uso b { font-size: .95rem; }
.tsx-uso span { font-size: .875rem; }
.tsx-avviso { font-size: .92rem; }
.tsx-pagina .btn { min-height: 48px; }
.tsx-pagina form .btn,
.tsx-pagina .tsx-carta > .btn { width: 100%; justify-content: center; }

/* ================================================================
   4. LA MIA PAGINA (avatar, dati, profilo professionale, zona critica)
   ================================================================ */
.mp .mp-testa { gap: .7rem; margin-bottom: 1.1rem; }
.mp .mp-identita { gap: 1rem; }
.mp .mp-identita-testo { min-width: 0; }
.mp .mp-foto-azioni { width: 100%; }
.mp .mp-foto-btn { min-height: 48px; width: 100%; }
.mp .mp-foto-nota { font-size: .875rem; }
.mp .mp-scheda { padding: 1.1rem 1rem; }
.mp .mp-campo label { font-size: .875rem; }
.mp .mp-campo small, .mp .mp-scheda .mp-sotto { font-size: .875rem; }
.mp .mp-campo :is(input, select), .mp .mp-cerca { min-height: 48px; }
.mp .mp-salva { width: 100%; min-height: 50px; }
.mp .mp-fondo { flex-direction: column; align-items: stretch; }
.mp-zona-critica { padding: 1.1rem 1rem; }
.mp .mp-zona-critica-testo { font-size: .95rem; }
.mp-cancella-btn { width: 100%; min-height: 48px; justify-content: center; }
.mp-cancella-passi { display: flex; flex-direction: column; align-items: stretch; gap: .6rem; }
.mp-cancella-passi > button,
.mp-cancella-campo > * { width: 100%; min-height: 48px; }
.mp-cancella-campo { display: flex; flex-direction: column; gap: .6rem; }
.mp-cancella-campo[hidden] { display: none; }
.mp-cancella-campo input { font-size: 16px !important; }
.mp-cancella-attiva { flex-direction: column; align-items: stretch; }
.mp-cancella-attiva .mp-riattiva { width: 100%; min-height: 48px; }

/* ================================================================
   5. ARCHIVIO (anche durante la cancellazione dell'account)
   ================================================================ */
.arch .arch-sotto { font-size: .95rem; }
.arch-riga { gap: .5rem .8rem; padding: .85rem .9rem; }
.arch-riga-sotto { font-size: .875rem; }
/* Il pulsante resta sotto il nome, alto 44 px ma non a tutta larghezza:
   in un elenco lungo cento righe di pulsanti pieni stancano l'occhio. */
.arch-scarica {
    margin-left: 0;
    min-height: 44px;
    justify-content: center;
}
.arch-timer { align-items: flex-start; }
.arch-timer-testo { font-size: .95rem; }
.arch-sospeso-testo { flex-basis: 100%; font-size: .95rem; }
.arch-azioni { flex-direction: column; align-items: stretch; }
.arch-azioni form { width: 100%; }
:is(.arch-riattiva, .arch-secondario) { width: 100%; min-height: 48px; justify-content: center; }

/* ================================================================
   6. IL MIO ABBONAMENTO
   ================================================================ */
.abb .abb-sotto, .abb-quando { font-size: .95rem; }
.abb-stato { padding: 1.1rem 1rem; }
.abb-pill { font-size: .875rem; }
.abb-righe { grid-template-columns: 1fr 1fr; gap: .6rem; }
.abb-riga { padding: .8rem .9rem; }
.abb-riga dt { font-size: .875rem; }
.abb-nota { padding: 1rem; font-size: .95rem; }
.abb-azioni { flex-direction: column-reverse; align-items: stretch; gap: .6rem; }
.abb-azioni > .btn { width: 100%; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; margin: 0; }

/* ================================================================
   7. INVITA UN COLLEGA
   ================================================================ */
.ref .ref-sotto { font-size: .95rem; line-height: 1.6; }
.ref .ref-avviso { flex-wrap: wrap; }
.ref .ref-avviso button { margin-left: 0; width: 100%; min-height: 44px; }
.ref .ref-premio { flex-direction: column; align-items: flex-start; gap: .8rem; padding: 1.1rem 1rem; }
.ref .ref-premio-icona { width: 52px; height: 52px; }
.ref .ref-premio p { font-size: .95rem; }
.ref .ref-link { padding: 1.1rem 1rem; }
.ref .ref-link label { font-size: .875rem; }
.ref .ref-link-riga { flex-direction: column; align-items: stretch; }
.ref .ref-link input { min-width: 0; width: 100%; min-height: 48px; }
.ref .ref-btn { width: 100%; min-height: 48px; justify-content: center; }
/* I tre contatori: una riga ciascuno, numero a sinistra. */
.ref .ref-conta { grid-template-columns: 1fr; gap: .5rem; }
.ref .ref-tessera { display: flex; align-items: center; gap: .9rem; padding: .7rem 1rem; }
.ref .ref-tessera b { min-width: 2ch; font-size: 1.4rem; }
.ref .ref-tessera span { font-size: .875rem; }
.ref .ref-come { padding: 1.1rem 1rem; }
.ref .ref-come ol { font-size: .95rem; padding-left: 1.1rem; }

/* ================================================================
   8. SERVE UNA PAUSA?
   ================================================================ */
.pau .pau-testa { gap: .6rem; }
.pau .pau-intro { font-size: .95rem; }
.pau .pau-scelta em { font-size: .875rem; }
.pau .pau-scelta span { font-size: .9rem; }
.pau .pau-parola b { font-size: 1.2rem; }
.pau .pau-comandi { flex-direction: column; align-items: stretch; gap: .8rem; }
.pau .pau-bottoni { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.pau .pau-btn { min-height: 48px; justify-content: center; }
.pau .pau-psicologo span { font-size: .9rem; }
.pau .pau-psicologo a.pau-psicologo-btn { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; }
.pau .pau-link-team { display: inline-block; padding: .35rem 0; }
.pau .pau-nota { font-size: .9rem; }

/* ================================================================
   9. TUTORIAL
   ================================================================ */
.tut-pagina .tut-video-carta { padding: 1rem; }
.tut-pagina .tut-video-stato { font-size: .875rem; }
.tut-pagina .tut-video-testa h2 { font-size: 1rem; }

/* ================================================================
   10. COLLEGAMENTO CALENDARI (Apple Calendar)
   ================================================================ */
.sync-page { margin: 1rem auto 2rem; }
.sync-card { padding: 1.25rem 1rem; gap: 1rem; }
.sync-hint { font-size: .95rem; }
.sync-card .form-label { font-size: .875rem; }
.sync-card .form-control { min-height: 48px; }
.sync-card :is(.btn-sync, .btn-back) {
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ================================================================
   11. PAGINE VECCHIE: ELENCHI (pazienti, visite, ricette, anamnesi,
       promemoria). Le tabelle diventano schede: una riga = una scheda,
       nome in alto, poi "etichetta ... valore", azioni a portata.
       Ogni elenco si riconosce dal suo titolo (classe propria);
       i promemoria dal loro pulsante "Nuovo Promemoria".
   ================================================================ */
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) {
    --tp-bordo: rgba(148,163,184,.22);
    --tp-tenue: #94A3B8;
}
html[data-tema="giorno"] main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) {
    --tp-bordo: #C9D3DF;
    --tp-tenue: #475569;
}
html body main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .container.container {
    padding-left: 0 !important;  /* il foglio generale da' 16 px con !important */
    padding-right: 0 !important;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive {
    overflow: visible;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table,
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody {
    display: block;
    width: 100%;
    min-width: 0;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > thead {
    display: none;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr {
    display: block;
    position: relative;
    padding: .9rem 1rem;
    border-bottom: 1px solid var(--tp-bordo);
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr:last-child {
    border-bottom: 0;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td {
    display: block;
    position: relative;
    padding: .25rem 0 .25rem 42%;
    border: 0;
    min-height: 1.9rem;
    text-align: right;
    font-size: .95rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
    background: transparent;
    box-shadow: none;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td::before {
    position: absolute;
    left: 0;
    top: .3rem;
    width: 40%;
    text-align: left;
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--tp-tenue);
}
/* La prima cella e' il titolo della scheda: niente etichetta. */
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:first-child {
    padding: 0 3.6rem .35rem 0;
    text-align: left;
    font-size: 1.05rem;
    font-weight: 700;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:first-child a {
    display: inline-block;
    padding: .2rem 0;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:first-child::before {
    content: none;
}
/* Le azioni: pulsanti da 44 px. Un solo pulsante (l'occhio) sta in
   alto a destra della scheda; piu' pulsanti fanno una riga in fondo. */
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:last-child {
    padding: .5rem 0 0;
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:last-child::before {
    content: none;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:last-child :is(.btn, button) {
    min-width: 44px;
    min-height: 44px;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:last-child form {
    display: inline-flex;
    margin: 0;
}
main:is(:has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo)) .table-responsive > .table > tbody > tr > td:last-child {
    position: absolute;
    top: .75rem;
    right: 1rem;
    padding: 0;
}
main:is(:has(.paz-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:first-child {
    padding-right: 0;
}
main:is(:has(.paz-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive > .table > tbody > tr > td:last-child {
    margin-top: .35rem;
    border-top: 1px dashed var(--tp-bordo);
    padding-top: .65rem;
}
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .table-responsive .badge {
    font-size: .875rem;
    white-space: normal;
}

/* Le etichette, elenco per elenco (stesso ordine delle colonne). */
main:has(.paz-titolo) .table-responsive td:nth-child(2)::before { content: "Email"; }
main:has(.paz-titolo) .table-responsive td:nth-child(3)::before { content: "Assegnato il"; }
main:has(.paz-titolo) .table-responsive td:nth-child(4)::before { content: "Stato"; }
main:has(.cons-titolo) .table-responsive td:nth-child(2)::before { content: "Piattaforma"; }
main:has(.cons-titolo) .table-responsive td:nth-child(3)::before { content: "Quando"; }
main:has(.cons-titolo) .table-responsive td:nth-child(4)::before { content: "Stato"; }
main:has(.rx-titolo) .table-responsive td:nth-child(2)::before { content: "Farmaci"; }
main:has(.rx-titolo) .table-responsive td:nth-child(3)::before { content: "Stato"; }
main:has(.rx-titolo) .table-responsive td:nth-child(4)::before { content: "Data"; }
main:has(.anam-titolo) .table-responsive td:nth-child(2)::before { content: "Specialità"; }
main:has(.anam-titolo) .table-responsive td:nth-child(3)::before { content: "Stato"; }
main:has(.anam-titolo) .table-responsive td:nth-child(4)::before { content: "Data"; }
main:has(a.btn-primary[href$="/doctor/recalls/create"]) .table-responsive td:nth-child(2)::before { content: "Motivo"; }
main:has(a.btn-primary[href$="/doctor/recalls/create"]) .table-responsive td:nth-child(3)::before { content: "Canale"; }
main:has(a.btn-primary[href$="/doctor/recalls/create"]) .table-responsive td:nth-child(4)::before { content: "Stato"; }
main:has(a.btn-primary[href$="/doctor/recalls/create"]) .table-responsive td:nth-child(5)::before { content: "Scadenza"; }

/* Testate degli elenchi: titolo, contatore e pulsante uno sotto l'altro. */
main:is(:has(.paz-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .container > .d-flex.justify-content-between.mb-4 {
    flex-direction: column;
    align-items: stretch !important;
    gap: .8rem;
}
main:has(.paz-titolo) .container > .d-flex.justify-content-between.mb-4 > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .6rem;
}
main:is(:has(.paz-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .container > .d-flex.justify-content-between.mb-4 .btn-primary {
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
}
main:is(:has(.paz-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .container > .d-flex.justify-content-between.mb-4 h2 {
    font-size: 1.6rem;
}
main:is(:has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo)) .col-lg-8.py-5 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}
main:is(:has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo)) :is(.cons-titolo, .rx-titolo, .anam-titolo) {
    font-size: 1.6rem;
}
main:is(:has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo)) .lead {
    font-size: 1rem;
}
main:has(.cons-titolo) .col-lg-8.py-5 > .btn-primary {
    width: 100%;
    min-height: 48px;
}
/* Promemoria: i filtri vanno a capo e si toccano bene. */
main:has(a.btn-primary[href$="/doctor/recalls/create"]) .doc-card > .d-flex.gap-2.mb-3 {
    flex-wrap: wrap;
}
main:has(a.btn-primary[href$="/doctor/recalls/create"]) .doc-card > .d-flex.gap-2.mb-3 > .btn {
    flex: 1 1 calc(50% - .5rem);
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
main:has(a.btn-primary[href$="/doctor/recalls/create"]) .row.g-3.mb-3 .text-muted {
    font-size: .875rem !important;
}

/* La numerazione delle pagine va a capo invece di uscire dallo schermo. */
main:where(:has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(.paz-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .pagination {
    flex-wrap: wrap;
    justify-content: center;
    gap: .35rem;
    margin: 1rem 0;
}
main:where(:has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo), :has(.paz-titolo), :has(a.btn-primary[href$="/doctor/recalls/create"])) .pagination .page-link {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}

/* Pazienti: l'email (lunga) va sotto la sua etichetta, a tutta
   larghezza; le cinque azioni si dividono una riga in parti uguali. */
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:nth-child(2) {
    padding-left: 0;
    text-align: left;
}
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:nth-child(2)::before {
    position: static;
    display: block;
    width: auto;
}
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:last-child {
    flex-wrap: nowrap;
}
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:last-child > :is(a, form) {
    flex: 1 1 0;
    min-width: 0;
}
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:last-child form > button {
    width: 100%;
}
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:last-child .btn {
    padding-left: 0;
    padding-right: 0;
}
main:has(.paz-titolo) .card-body .table-responsive > .table > tbody > tr { padding: .9rem; }

/* ================================================================
   12. PAGINE VECCHIE: MODULI (nuova visita, nuovo paziente, nuovo
       promemoria, nuova ricetta). Campi a tutta larghezza, alti 48 px
       e scritti a 16 px; il pulsante d'invio a tutta larghezza.
   ================================================================ */
.doc-back-to-dashboard .btn { min-height: 44px; display: inline-flex; align-items: center; }

html body main:has(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .container {
    padding-left: 0 !important;  /* il foglio generale da' 16 px con !important */
    padding-right: 0 !important;
}
main:has(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .card-body {
    padding: 1rem;
}
main:has(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .card-header {
    flex-wrap: wrap;
    gap: .6rem;
    padding: .8rem 1rem;
}
main:has(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .card-header .btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) :is(.form-control, .form-select, select) {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 48px;
    padding: .6rem .85rem;
    font-size: 16px !important;
    line-height: 1.4;
    border: 1px solid rgba(148,163,184,.45);
    border-radius: 10px;
}
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) textarea.form-control {
    min-height: 96px;
}
html[data-tema="giorno"] :is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) :is(.form-control, .form-select, select) {
    border-color: #C9D3DF;
}
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) :is(label, .form-label) {
    font-size: .9rem;
}
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) :is(small, .form-text, .text-muted) {
    font-size: .875rem;
}
/* Etichetta e campo sulla stessa riga (es. "Piattaforma *" + tendina):
   il campo va sotto l'etichetta. */
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .form-label {
    display: block;
    margin-bottom: .35rem;
}
/* Scelte a pallino e caselle: bersagli piu' ampi. */
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .form-check {
    display: flex;
    align-items: center;
    gap: .55rem;
    min-height: 44px;
    margin-right: 1rem;
}
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .form-check-input {
    width: 22px;
    height: 22px;
    margin: 0;
    position: static;
    flex-shrink: 0;
}
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .form-check-label {
    font-size: .95rem;
}
/* Colonne del modulo: una sotto l'altra. */
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) .row > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
}
/* Il prefisso del cellulare e il numero restano affiancati. */
form[action$="/doctor/patients"] :is(.input-group, .d-flex):has(select[name="phone_dial"]) {
    display: flex;
    flex-wrap: nowrap;
    gap: .5rem;
}
form[action$="/doctor/patients"] select[name="phone_dial"] {
    flex: 0 0 7.5rem;
    width: 7.5rem !important;
}
/* Pulsanti d'invio: a tutta larghezza, il principale in alto. */
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) :is(.d-grid, .d-flex.justify-content-between, .d-flex.justify-content-end):has(> [type="submit"]) {
    display: flex;
    flex-direction: column-reverse;
    align-items: stretch;
    gap: .6rem;
}
:is(form[action$="/doctor/consultations"], form[action$="/doctor/patients"], form[action$="/doctor/recalls"], form[action$="/doctor/prescriptions"]) :is(.d-grid, .d-flex.justify-content-between, .d-flex.justify-content-end):has(> [type="submit"]) > .btn {
    width: 100%;
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    margin: 0;
    font-size: 1rem;
}
form[action$="/doctor/prescriptions"] :is(#add-medication, .remove-med) {
    min-height: 44px;
    min-width: 44px;
}
form[action$="/doctor/prescriptions"] #add-medication { width: 100%; }
form[action$="/doctor/prescriptions"] .med-suggest-nota { font-size: .875rem; }
form[action$="/doctor/prescriptions"] .med-voce b { font-size: .95rem; }
form[action$="/doctor/prescriptions"] .med-voce span { font-size: .875rem; }
form[action$="/doctor/prescriptions"] .med-voce { padding: .7rem .8rem; }
form[action$="/doctor/patients"] .input-group > .form-control { flex: 1 1 0; min-width: 0; }

/* ================================================================
   13. PAGINE VECCHIE: DETTAGLI (visita, ricetta, anamnesi, titolo del
       nuovo paziente)
   ================================================================ */
/* Le testate delle schede con titolo + "Indietro" vanno a capo. */
main:has(.doc-back-to-dashboard) .card > .card-header.d-flex {
    flex-wrap: wrap;
    gap: .6rem;
}
main:has(.doc-back-to-dashboard) .card > .card-header.d-flex > .btn,
main:has(.doc-back-to-dashboard) .col-lg-8 > a.btn.mb-3 {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}
main:has(.doc-back-to-dashboard) .row.justify-content-center > .col-lg-8 > .card .card-body {
    padding: 1rem;
}
/* Visita: "Segna completata" e "Cancella" a tutta larghezza. */
:is(form[action$="/complete"], form[action$="/cancel"]) > .btn {
    width: 100%;
    min-height: 50px;
    white-space: normal;
}
main:has(form[action$="/complete"]) .d-grid.gap-2 {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}
/* Ricetta: la tabella dei farmaci diventa una scheda per farmaco. */
main:has(.bi-prescription2) .card-body .table-bordered,
main:has(.bi-prescription2) .card-body .table-bordered > tbody {
    display: block;
    width: 100%;
    border: 0;
}
main:has(.bi-prescription2) .card-body .table-bordered > thead { display: none; }
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr {
    display: block;
    padding: .8rem .9rem;
    margin-bottom: .6rem;
    border: 1px solid rgba(148,163,184,.3);
    border-radius: 12px;
}
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td {
    display: block;
    position: relative;
    padding: .2rem 0 .2rem 38%;
    border: 0;
    font-size: .95rem;
    overflow-wrap: anywhere;
    background: transparent;
}
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td:empty { display: none; }
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td::before {
    position: absolute;
    left: 0;
    top: .25rem;
    width: 36%;
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
    opacity: .8;
}
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td:first-child {
    padding-left: 0;
    padding-bottom: .45rem;
    font-weight: 700;
    font-size: 1rem;
}
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td:nth-child(2)::before { content: "Dosaggio"; }
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td:nth-child(3)::before { content: "Frequenza"; }
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td:nth-child(4)::before { content: "Durata"; }
main:has(.bi-prescription2) .card-body .table-bordered > tbody > tr > td:nth-child(5)::before { content: "Note"; }
main:has(.bi-prescription2) .card-body .table-responsive:has(> .table-bordered) { overflow: visible; }
main:has(.bi-prescription2) .card-body > :is(form, a).btn,
main:has(.bi-prescription2) .card-body form > .btn,
main:has(.bi-prescription2) .card-body a.btn-lg {
    width: 100%;
    min-height: 50px;
    white-space: normal;
}
/* Nuovo paziente (tema giorno): il titolo era bianco su bianco. */
html[data-tema="giorno"] main:has(form[action$="/doctor/patients"]) .card-body > h4 {
    color: #1F2937;
}

/* ================================================================
   14. STORIA CLINICA DEL PAZIENTE (pagina vecchia)
   La barra del paziente e le testate delle sezioni hanno un fondo
   bianco scritto nel markup: di notte il testo chiaro spariva.
   ================================================================ */
main:has(#patient-floating-bar) .container-fluid { padding-left: 0; padding-right: 0; }
main:has(#patient-floating-bar) #patient-floating-bar {
    flex-wrap: wrap;
    gap: .6rem;
    padding: .7rem !important;
}
main:has(#patient-floating-bar) #patient-floating-bar > div:first-child { min-width: 0; flex: 1 1 auto; }
main:has(#patient-floating-bar) #patient-floating-bar > div:last-child { flex: 1 1 100%; }
main:has(#patient-floating-bar) #patient-floating-bar > div:last-child > .btn { width: 100%; min-height: 48px; }
main:has(#patient-floating-bar) #patient-floating-bar .btn-outline-secondary { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
main:has(#patient-floating-bar) #patient-floating-bar .fw-bold { font-size: 1rem !important; }
main:has(#patient-floating-bar) #patient-floating-bar .text-muted[style] { font-size: .875rem !important; }
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) #patient-floating-bar {
    background: #1E293B !important;
    border-color: rgba(148,163,184,.25) !important;
}
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) .card-header.bg-white {
    background: #0F1929 !important;
    border-bottom-color: rgba(148,163,184,.2);
}
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) .card-header.bg-white :is(h5, h6) {
    color: #E2E8F0;
}
main:has(#patient-floating-bar) .card-header { flex-wrap: wrap; gap: .5rem; padding: .75rem 1rem; }
main:has(#patient-floating-bar) .card-header .btn { min-height: 44px; }
main:has(#patient-floating-bar) .card-body { padding: 1rem; }
main:has(#patient-floating-bar) .card-body .btn { min-height: 44px; }
main:has(#patient-floating-bar) :is(.text-muted, small) { font-size: .875rem; }
main:has(#patient-floating-bar) textarea { font-size: 16px !important; }

/* ================================================================
   15. CRONOLOGIA DEL PAZIENTE (pagina vecchia)
   ================================================================ */
/* (!important: il foglio generale del sito, sotto i 992 px, da' 16 px
   con !important a ogni .container: si sommavano ai 20 del corpo.) */
html body main:has(.timeline-vertical) .container { padding-left: 0 !important; padding-right: 0 !important; }
main:has(.timeline-vertical) .card-body.p-4 { padding: 1rem !important; }
main:has(.timeline-vertical) .col-lg-8 > a.btn { min-height: 44px; display: inline-flex; align-items: center; }
main:has(.timeline-vertical) .timeline-vertical { padding-left: 44px; }
main:has(.timeline-vertical) .timeline-vertical::before { left: 17px; }
main:has(.timeline-vertical) .timeline-marker { left: -44px; width: 34px; height: 34px; font-size: 15px; }
main:has(.timeline-vertical) .timeline-item { margin-bottom: 14px; }
main:has(.timeline-vertical) .timeline-content .card-body { padding: .85rem !important; }
main:has(.timeline-vertical) .timeline-content .d-flex.justify-content-between { flex-wrap: wrap; gap: .3rem .6rem; }
main:has(.timeline-vertical) .timeline-content .date-badge { font-size: .875rem !important; }
main:has(.timeline-vertical) .timeline-content p.small,
main:has(.timeline-vertical) .timeline-content summary,
main:has(.timeline-vertical) .timeline-content details p { font-size: .875rem !important; }
main:has(.timeline-vertical) .timeline-content .btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    margin: .25rem .25rem 0 0;
    font-size: .9rem;
}
main:has(.timeline-vertical) .timeline-content:hover { transform: none; }

/* ================================================================
   16. MESE GRATUITO (tre stati: attivo, da attivare, terminato)
   La pagina ha gia' le sue regole per i telefoni: qui solo bersagli.
   ================================================================ */
#pvPagina .pv-metodo input[type="radio"] { width: 22px; height: 22px; }
#pvPagina .pv-metodo small { font-size: .875rem; }
#pvPagina .pv-condizioni { display: flex; align-items: center; gap: .6rem; min-height: 44px; }
#pvPagina .pv-condizioni input[type="checkbox"] { width: 22px; height: 22px; flex-shrink: 0; margin: 0; }
#pvPagina .pv-condizioni a,
#pvPagina .pv-nota a,
#pvPagina .pv-aiuto a { display: inline-block; padding: .3rem 0; }

/* ================================================================
   17. ASSISTENZA (vista del medico)
   ================================================================ */
#view-medico .ass-scheda .wa-copia { min-height: 44px; min-width: 64px; font-size: .875rem; }
#view-medico .ass-temi-tit { font-size: .875rem; }
#view-medico .ass-tema { min-height: 56px; }
#view-medico .ass-tema-testi span { font-size: .875rem; }
.arch-scarica { font-size: .9rem; }
#pvPagina .pv-metodo a { padding: .6rem 0; }

/* ================================================================
   18. TELEFONI MOLTO STRETTI (sotto i 360 px, es. 320)
   ================================================================ */
@media (max-width: 359.98px) {
    .fatt-azioni { grid-template-columns: 1fr; }
    .fatt-tessere { grid-template-columns: 1fr; }
    .abb-righe { grid-template-columns: 1fr; }
    .pau .pau-bottoni { grid-template-columns: 1fr; }
    #fattModal .modal-footer { grid-template-columns: 1fr; }
    #fattModal .modal-footer .btn-primary { order: -1; }
}

/* ================================================================
   19. PAGINE VECCHIE: COLORI LEGGIBILI SUL TELEFONO (WCAG AA)
   Le pagine vecchie usano i distintivi e i pulsanti di Bootstrap di
   serie: di notte il testo chiaro su verde chiaro non si leggeva, di
   giorno alcuni titoli erano bianco su bianco. Sul telefono si passa
   alla palette di casa; il computer resta com'e' (vedi resoconto).
   ================================================================ */
main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo),
           :has(a.btn-primary[href$="/doctor/recalls/create"]), :has(form[action$="/doctor/consultations"]),
           :has(form[action$="/doctor/patients"]), :has(form[action$="/doctor/recalls"]),
           :has(form[action$="/doctor/prescriptions"]), :has(.card-header a[href$="/doctor/consultations"]),
           :has(.bi-prescription2), :has(#patient-floating-bar), :has(.timeline-vertical),
           :has(a.btn[href$="/doctor/anamnesis"]), :has(form[action$="/settings/password"])) {
    --tp-ok-fondo: rgba(16,185,129,.16);   --tp-ok: #34D399;
    --tp-attesa-fondo: rgba(245,158,11,.16); --tp-attesa: #FBBF24;
    --tp-neutro-fondo: rgba(148,163,184,.18); --tp-neutro: #CBD5E1;
    --tp-info-fondo: rgba(34,211,238,.14);  --tp-info: #67E8F9;
    --tp-rosso-fondo: rgba(248,113,113,.16); --tp-rosso: #F87171;
    --tp-testo-tenue: #94A3B8;
    --tp-titolo: #F1F5F9;
    --tp-ciano: #22D3EE;
}
html[data-tema="giorno"] main:where(:has(.paz-titolo), :has(.cons-titolo), :has(.rx-titolo), :has(.anam-titolo),
           :has(a.btn-primary[href$="/doctor/recalls/create"]), :has(form[action$="/doctor/consultations"]),
           :has(form[action$="/doctor/patients"]), :has(form[action$="/doctor/recalls"]),
           :has(form[action$="/doctor/prescriptions"]), :has(.card-header a[href$="/doctor/consultations"]),
           :has(.bi-prescription2), :has(#patient-floating-bar), :has(.timeline-vertical),
           :has(a.btn[href$="/doctor/anamnesis"]), :has(form[action$="/settings/password"])) {
    --tp-ok-fondo: #D1FAE5;      --tp-ok: #047857;
    --tp-attesa-fondo: #FEF3C7;  --tp-attesa: #92400E;
    --tp-neutro-fondo: #E2E8F0;  --tp-neutro: #334155;
    --tp-info-fondo: #E6F4F7;    --tp-info: #0B6179;
    --tp-rosso-fondo: #FEE2E2;   --tp-rosso: #B91C1C;
    --tp-testo-tenue: #475569;
    --tp-titolo: #1F2937;
    --tp-ciano: #0E7490;
}
/* I distintivi di stato: pillole della palette di casa. */
main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) .badge:is(.bg-success, .badge-success) { background: var(--tp-ok-fondo, rgba(16,185,129,.16)) !important; color: var(--tp-ok, #34D399) !important; }
main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) .badge:is(.bg-warning, .badge-warning) { background: var(--tp-attesa-fondo, rgba(245,158,11,.16)) !important; color: var(--tp-attesa, #FBBF24) !important; }
main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) .badge:is(.bg-secondary, .badge-secondary, .bg-dark, .bg-light) { background: var(--tp-neutro-fondo, rgba(148,163,184,.18)) !important; color: var(--tp-neutro, #CBD5E1) !important; }
main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) .badge:is(.bg-info, .badge-info, .bg-primary, .badge-primary) { background: var(--tp-info-fondo, rgba(34,211,238,.14)) !important; color: var(--tp-info, #67E8F9) !important; }
main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) .badge:is(.bg-danger, .badge-danger) { background: var(--tp-rosso-fondo, rgba(248,113,113,.16)) !important; color: var(--tp-rosso, #F87171) !important; }
main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) .badge { font-weight: 700; padding: .3em .6em; }

/* Testi tenui e titoli: di giorno il grigio chiaro e il bianco sparivano. */
main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) :is(.text-muted, .lead.text-muted) { color: var(--tp-testo-tenue, #94A3B8) !important; }
html[data-tema="giorno"] main:has(.doc-back-to-dashboard, form[action$="/settings/password"]) :is(h2, h3, h4, h5, h6, .form-label, label, .fw-bold) { color: var(--tp-titolo, #1F2937); }
html[data-tema="giorno"] main:has(#patient-floating-bar) #patient-floating-bar { color: #1F2937; }

/* Pulsanti di Bootstrap di serie con testo scuro su fondo scuro,
   o verde/rosso di serie sotto soglia. */
html:not([data-tema="giorno"]) main:has(.doc-back-to-dashboard) :is(.btn-outline-dark, .btn-outline-primary, .btn-outline-secondary, .btn-light) {
    color: #22D3EE;
    border-color: rgba(34,211,238,.55);
}
html:not([data-tema="giorno"]) main:has(.doc-back-to-dashboard) :is(.btn-outline-dark, .btn-outline-primary, .btn-outline-secondary, .btn-light):hover { color: #A5F3FC; background: rgba(34,211,238,.1); }
/* Di giorno gli stessi pulsanti (Storia clinica, Ricette...) avevano il
   bordo quasi nero da 2 px di main.less, o il blu e il grigio di serie
   ("Torna alla Dashboard"): fantasma petrolio, come nel resto del sito. */
html[data-tema="giorno"] main:has(.doc-back-to-dashboard) :is(.btn-outline-dark, .btn-outline-primary, .btn-outline-secondary, .btn-light) {
    color: #0B6179;
    border-color: rgba(14,116,144,.55);
    background: transparent;
}
html[data-tema="giorno"] main:has(.doc-back-to-dashboard) :is(.btn-outline-dark, .btn-outline-primary, .btn-outline-secondary, .btn-light):hover { color: #0B5F75; border-color: #0E7490; background: #E6F4F7; }
main:has(.doc-back-to-dashboard) .btn-success { background: #047857 !important; border-color: #047857 !important; color: #FFFFFF !important; }
html:not([data-tema="giorno"]) main:has(.doc-back-to-dashboard) .btn-outline-danger { color: #F87171; border-color: rgba(248,113,113,.6); }
html[data-tema="giorno"] main:has(.doc-back-to-dashboard) .btn-outline-danger { color: #B91C1C; border-color: #B91C1C; }

/* Numerazione delle pagine: fondo della palette. */
html:not([data-tema="giorno"]) main:has(.doc-back-to-dashboard) .pagination .page-link { background: #1E293B; border-color: rgba(148,163,184,.3); color: #E2E8F0; }
html:not([data-tema="giorno"]) main:has(.doc-back-to-dashboard) .pagination .active .page-link { background: #0E7490; border-color: #0E7490; color: #FFFFFF; }
html:not([data-tema="giorno"]) main:has(.doc-back-to-dashboard) .pagination .disabled .page-link { color: #94A3B8; }
html[data-tema="giorno"] main:has(.doc-back-to-dashboard) .pagination .page-link { color: #0B6179; border-color: #C9D3DF; }
html[data-tema="giorno"] main:has(.doc-back-to-dashboard) .pagination .active .page-link { background: #0E7490; border-color: #0E7490; color: #FFFFFF; }

/* Il mio abbonamento, di notte: collegamento e "Scaduto" leggibili. */
html:not([data-tema="giorno"]) .abb-nota a:not(.btn) { color: #67E8F9; }
html:not([data-tema="giorno"]) .abb-azioni .btn-secondary { color: #22D3EE; }
html:not([data-tema="giorno"]) .abb-stato.e-guaio .abb-pill { color: #F87171; }
html[data-tema="giorno"] main:has(.timeline-vertical) .timeline-content p[style*="0dcaf0"] { color: #0B6179 !important; }
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) .btn-outline-success { color: #34D399; border-color: rgba(52,211,153,.6); }
html[data-tema="giorno"] main:has(#patient-floating-bar) .btn-outline-success { color: #047857; border-color: #047857; }

/* Fatturazione, "Come ha pagato il paziente?": resta una scheda al
   centro (quattro scelte, niente da scrivere), con la X da 44 px. */
#fattMetodoVelo.modal-overlay { padding: 1rem max(12px, env(safe-area-inset-left)); }
#fattMetodoVelo .modal-header { padding: .9rem 1rem; gap: .5rem; }
#fattMetodoVelo .modal-header h2 { font-size: 1.1rem; }
#fattMetodoVelo .modal-body { padding: 1rem; }
#fattMetodoVelo .fatt-metodo { flex-direction: row; justify-content: flex-start; gap: .8rem; padding: .8rem 1rem; }
#fattMetodoVelo .fatt-metodo i { width: 1.6rem; text-align: center; }
:is(#fattModal, #fattEsportaVelo, #fattMetodoVelo) .btn-close-modal {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.5rem;
}
/* Sistema TS: "Verifica credenziali", "Richiedi ID-SESSIONE" e
   "Salva ID-SESSIONE" a tutta larghezza, uno sotto l'altro. */
.tsx-pagina :is(#tsxVerifica, #tsxIdSessione, #tsxSalvaIdSessione) {
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    margin: 0;
}
.tsx-pagina div:has(> #tsxVerifica) { gap: .6rem !important; }
.tsx-stato { font-size: .875rem; }

/* ================================================================
   20. RIFINITURE: testi piccoli portati a 14 px, bersagli piccoli
   ================================================================ */
main:has(.doc-back-to-dashboard) :is(.badge, .pv-pillola-stato) { font-size: .875rem !important; }
main:has(.doc-back-to-dashboard) small,
main:has(.doc-back-to-dashboard) .small,
main:has(#patient-floating-bar) li { font-size: .875rem !important; }
main:has(#patient-floating-bar) a.ms-1 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    margin: -12px 0;
}
/* Nuovo paziente: le caselle si toccano sulla riga intera. */
form[action$="/doctor/patients"] .custom-control:has(> #sendEmail, > #scheduleVisit) { min-height: 44px; display: flex; align-items: center; }
/* Collegamenti dentro il testo: area di tocco piu' alta senza
   allargare le righe (la spinta in piu' si annulla col margine). */
:is(.abb-nota, #pvPagina .pv-aiuto) a:not(.btn) {
    display: inline-block;
    padding: .7rem 0;
    margin: -.7rem 0;
}
.pau .pau-link-team { padding: .6rem 0; margin: -.6rem 0; }
.pau .pau-psicologo a.pau-psicologo-btn { font-size: .95rem; }
.pau .pau-psicologo span span,
.pau .pau-scelta span { font-size: .9rem; }
#pvPagina .pv-etichetta { font-size: .875rem; }

/* ================================================================
   21. AGENDA (pagina intera: mese, settimana, giorno)
   Pagina con la sua tavolozza (--ag-*) e FullCalendar. Sul telefono:
   niente margini doppi, filtri in colonna, pulsanti da 44 px, colonne
   del calendario piu' larghe, testi leggibili; di giorno le schede
   diventano chiare come il resto del gestionale.
   ================================================================ */
.ag-page.container-fluid {
    padding: .6rem 0 1.5rem !important;
    min-height: 0;
}
.ag-topbar { padding: 1rem; gap: .9rem; }
.ag-topbar-brand h2 { display: flex; align-items: center; gap: .5rem; font-size: 1.3rem; }
.ag-topbar-brand h2 > i { margin: 0 !important; }
/* Filtri: Stato e Piattaforma affiancati, campi alti 48 px e a 16 px. */
.ag-filter-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    align-items: start;
}
.ag-filter-group > div { min-width: 0; }
.ag-filter-label { font-size: .8rem; margin-bottom: .3rem; }
.ag-page .ag-filter-select {
    width: 100%;
    min-width: 0 !important;
    min-height: 48px !important;
    font-size: 16px;
}
/* "Stato" e' una scelta multipla: il foglio generale del sito nasconde
   queste caselle (sono pensate per select2, che qui non c'e') e il filtro
   non si vedeva. Sul telefono torna la casella del sistema, con le spunte. */
.ag-page #filterStatus { visibility: visible; }
.ag-topbar-search { width: 100%; }
.ag-topbar-search #filterPatientDisplay {
    width: 100% !important;
    min-height: 48px;
    font-size: 16px !important;
    padding-left: 38px !important;
}
.ag-topbar-search i { left: 14px; font-size: 1rem; }
/* Riga delle azioni: azzera filtri, Privato, Nuova visita. */
.ag-topbar > .ms-auto {
    margin-left: 0 !important;
    flex-wrap: wrap;
    gap: .5rem !important;
}
.ag-topbar #filterSummary {
    order: -1;
    flex: 1 1 100%;
    justify-content: center;
    font-size: .875rem;
    padding: .35rem .6rem;
}
.ag-page .ag-filter-reset {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--ag-border);
    border-radius: 10px;
    font-size: 1.05rem;
}
.ag-topbar > .ms-auto > .btn-slim {
    flex: 1 1 0;
    min-width: 0;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: .4rem .6rem;
    font-size: .9rem;
    white-space: nowrap;
}
.ag-topbar > .ms-auto > .btn-slim > i { margin: 0 !important; }

/* Il calendario: la scheda con meno cornice, cosi' ogni colonna del mese
   e della settimana guadagna spazio. */
.ag-layout { gap: 14px; }
.ag-cal-wrap { padding: 12px 8px; border-radius: 14px; }
/* FullCalendar si disegna mentre la pagina e' ancora coperta dalla
   schermata di caricamento e misura una larghezza zero: senza queste
   righe il mese nasceva vuoto, con le visite ammucchiate a sinistra
   (la correzione vera e' nel JavaScript della pagina). */
.ag-cal-wrap .fc :is(.fc-col-header, .fc-daygrid-body, .fc-scrollgrid-sync-table, .fc-timegrid-body, .fc-timegrid-slots > table, .fc-timegrid-cols > table) {
    width: 100% !important;
}
/* ...e le settimane del mese riempiono l'altezza del calendario invece di
   lasciare un vuoto in fondo. */
.ag-cal-wrap .fc .fc-scroller-liquid-absolute > .fc-daygrid-body { height: 100%; }
.ag-cal-wrap .fc .fc-scroller-liquid-absolute > .fc-daygrid-body > .fc-scrollgrid-sync-table { height: 100% !important; }
.ag-cal-wrap .fc { --fc-today-bg-color: rgba(59,130,246,.1); }
/* Barra del calendario: il mese in alto, poi frecce e "Oggi", poi le
   tre viste a tutta larghezza. */
.ag-cal-wrap .fc .fc-toolbar.fc-header-toolbar {
    flex-wrap: wrap;
    gap: .6rem;
    margin-bottom: .8rem;
}
.ag-cal-wrap .fc .fc-toolbar-chunk { display: flex; align-items: center; gap: .4rem; flex: 1 1 100%; }
.ag-cal-wrap .fc .fc-toolbar-chunk:nth-child(1) { justify-content: space-between; }
.ag-cal-wrap .fc .fc-toolbar-chunk:nth-child(2) { order: -1; justify-content: center; }
.ag-cal-wrap .fc .fc-toolbar-chunk:nth-child(3) .fc-button-group { width: 100%; }
.ag-cal-wrap .fc .fc-toolbar-chunk:nth-child(3) .fc-button { flex: 1 1 0; }
.ag-cal-wrap .fc .fc-toolbar-title { font-size: 1.25rem; }
.ag-cal-wrap .fc .fc-button {
    min-width: 48px;
    min-height: 44px;
    justify-content: center;
    padding: .5rem .8rem;
    font-size: .9rem;
}
/* Intestazioni dei giorni: "LUN" e "21/09" su due righe, senza
   sovrapporsi nelle colonne strette della settimana. */
.ag-cal-wrap .fc .fc-col-header-cell-cushion {
    display: block;
    padding: 6px 0;
    font-size: .8rem;
    letter-spacing: 0;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
}
.ag-cal-wrap .fc .fc-daygrid-day-number { padding: 4px 5px; font-size: .875rem; }
.ag-cal-wrap .fc .fc-day-other .fc-daygrid-day-number { color: rgba(255,255,255,.5); }
.ag-cal-wrap .fc .fc-daygrid-day-frame { min-height: 64px; padding: 1px 2px; }
/* Mese: ogni impegno e' un tassello colorato con l'ora; il pallino
   bianco non serve (il colore e' il fondo) e rubava spazio all'ora. */
.ag-cal-wrap .fc .fc-daygrid-event {
    min-height: 26px;
    margin: 1px 0 0;
    padding: 2px 3px;
    font-size: .8rem;
    line-height: 22px;
    overflow: hidden;
}
.ag-cal-wrap .fc .fc-daygrid-event-dot { display: none; }
/* Nelle colonne del mese (circa 45 px) il nome si vedeva per una lettera:
   resta l'ora, al centro; il nome e' nella settimana, nel giorno e al clic. */
.ag-cal-wrap .fc .fc-daygrid-dot-event { justify-content: center; }
.ag-cal-wrap .fc .fc-daygrid-dot-event .fc-event-title { display: none; }
.ag-cal-wrap .fc .fc-daygrid-dot-event .fc-event-time { margin: 0; font-weight: 700; }
.ag-cal-wrap .fc .fc-daygrid-more-link { font-size: .8rem; }
/* Settimana e giorno: righe da 40 px, ore e impegni leggibili. */
.ag-cal-wrap .fc .fc-timegrid-slot { height: 40px; }
.ag-cal-wrap .fc .fc-timegrid-slot-label { font-size: .8rem; }
.ag-cal-wrap .fc .fc-timegrid-axis-cushion { font-size: .75rem; white-space: normal; max-width: 44px; color: var(--ag-text-muted); }
.ag-cal-wrap .fc .fc-timegrid-event {
    padding: 2px 3px;
    font-size: .8rem;
    line-height: 1.3;
}
/* Tinte dei tasselli un gradino piu' scure: il testo bianco regge i
   4,5:1 (l'ambra e il verde di serie, e il verde reso trasparente, no). */
.ag-page .ev-pending { background: #B45309 !important; }
.ag-page .ev-completed { background: #047857 !important; opacity: 1; }
.ag-legend-item:nth-child(2) .ag-legend-dot { background: #047857 !important; }
.ag-legend-item:nth-child(4) .ag-legend-dot { background: #B45309 !important; }

/* Colonna laterale: riepilogo, Aria e legenda. */
.ag-side-card { padding: 16px; }
.ag-side-title { font-size: 1rem; }
.ag-stat { min-height: 44px; font-size: .95rem; }
.ag-next-time { font-size: .8rem; }
.ag-next-meta,
.ag-next-empty,
.ag-aria-loading { font-size: .9rem; }
.ag-aria-name { font-size: 1rem; }
.ag-aria-sub { font-size: .8rem; }
.ag-aria-text { font-size: .95rem; }
.ag-aria-refresh {
    width: 44px;
    height: 44px;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
}
.ag-legend { gap: .6rem 1rem; font-size: .875rem; }
.ag-legend-dot { width: 10px; height: 10px; }

/* Cerca paziente (finestra): campo a 16 px, X da 44 px. */
#patientSearchModal .modal-dialog { margin: .75rem; }
#patientSearchModal #patientSearchInput { min-height: 48px; font-size: 16px !important; }
#patientSearchModal .modal-title > i { margin-right: .45rem !important; }
#patientSearchModal .close {
    min-width: 44px;
    min-height: 44px;
    margin: -10px -10px -10px auto;
}

/* Di giorno: schede chiare, bordi e campi della palette di giorno. La
   pagina nasce scura (colori scritti nella vista) e il titolo diventava
   scuro su scuro. */
html[data-tema="giorno"]:has(.ag-page) {
    --ag-bg: transparent;
    --ag-card: #FFFFFF;
    --ag-border: #D5DEE8;
    --ag-text: #1F2937;
    --ag-text-muted: #475569;
    --ag-text-strong: #0F172A;
    --ag-accent: #2563EB;
    --ag-accent-light: #1D4ED8;
}
html[data-tema="giorno"] .ag-page :is(.ag-topbar, .ag-cal-wrap, .ag-side-card) { box-shadow: 0 1px 3px rgba(15,23,42,.06); }
html[data-tema="giorno"] .ag-page .ag-filter-select,
html[data-tema="giorno"] .ag-topbar-search #filterPatientDisplay,
html[data-tema="giorno"] #patientSearchModal #patientSearchInput {
    background: #FFFFFF !important;
    border-color: #94A3B8 !important;
    color: #1F2937 !important;
}
html[data-tema="giorno"] .ag-page .ag-filter-select option { background: #FFFFFF; color: #1F2937; }
html[data-tema="giorno"] .ag-cal-wrap .fc {
    --fc-border-color: #E2E8F0;
    --fc-neutral-bg-color: #F8FAFC;
    --fc-today-bg-color: #EFF6FF;
}
html[data-tema="giorno"] .ag-cal-wrap .fc :is(.fc-scrollgrid, .fc-scrollgrid table, .fc-daygrid-day, .fc-timegrid-axis, .fc-scrollgrid-shrink),
html[data-tema="giorno"] .ag-cal-wrap .fc.fc-theme-standard :is(td, th) { border-color: #E2E8F0; }
html[data-tema="giorno"] .ag-cal-wrap .fc .fc-timegrid-slot { border-color: #EEF2F6; }
html[data-tema="giorno"] .ag-cal-wrap .fc .fc-button {
    background: #FFFFFF;
    border-color: #CBD5E1;
    color: #334155;
}
html[data-tema="giorno"] .ag-cal-wrap .fc .fc-button-active,
html[data-tema="giorno"] .ag-cal-wrap .fc .fc-button:hover {
    background: #EFF6FF;
    border-color: #2563EB;
    color: #1D4ED8;
}
html[data-tema="giorno"] .ag-cal-wrap .fc .fc-day-other .fc-daygrid-day-number { color: #64748B; }
html[data-tema="giorno"] .ag-page .ag-stat { border-bottom-color: #E2E8F0; }
html[data-tema="giorno"] .ag-page .ag-side-icon { color: #1D4ED8 !important; }
html[data-tema="giorno"] .ag-page .ag-aria-card { background: #F5F3FF; border-color: #DDD6FE; }
html[data-tema="giorno"] #patientSearchModal .modal-content { box-shadow: 0 10px 30px rgba(15,23,42,.18); }

/* ================================================================
   22. PAZIENTI, CRONOLOGIA E STORIA CLINICA: ritocchi
   ================================================================ */
/* Il nome del paziente (apre la scheda): bersaglio da 44 px. */
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:first-child a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0;
}
/* "Assegnato il" andava a capo e il suo "il" finiva sopra "Stato". */
main:has(.paz-titolo) .table-responsive > .table > tbody > tr > td:nth-child(3)::before { white-space: nowrap; }
/* Il pulsante della dettatura non aveva un bordo (classe senza stile):
   ora e' un cerchio come gli altri, nel viola della dettatura. */
main:has(.paz-titolo) .table-responsive .btn-outline-purple { border: 1px solid rgba(167,139,250,.6); color: #C4B5FD; }
html[data-tema="giorno"] main:has(.paz-titolo) .table-responsive .btn-outline-purple { border-color: #7C3AED; color: #6D28D9; }
/* "Reinvia le credenziali": di giorno il giallo di serie sul bianco non
   si vedeva (1,6:1). */
html[data-tema="giorno"] main:has(.paz-titolo) .table-responsive .btn-outline-warning { border-color: #B45309; color: #92400E; }

/* Cronologia: l'e-mail lunga del paziente usciva dalla scheda. */
main:has(.timeline-vertical) .row { margin-left: 0; margin-right: 0; }
main:has(.timeline-vertical) .row > [class*="col-"] { padding-left: 0; padding-right: 0; }
main:has(.timeline-vertical) .card-body .d-flex.gap-3 > img { flex-shrink: 0; }
main:has(.timeline-vertical) .card-body .d-flex.gap-3 > div { min-width: 0; }
main:has(.timeline-vertical) .card-body .d-flex.gap-3 p.text-muted { overflow-wrap: anywhere; }
main:has(.timeline-vertical) :is(h5, h6) > i.bi:first-child { margin-right: .45rem; }

/* Storia clinica: le icone dei titoli di sezione staccate dal testo. */
main:has(#patient-floating-bar) .card-header :is(h5, h6) > i.bi:first-child { margin-right: .45rem !important; }
/* "Trascrizione in corso..." restava sempre visibile (d-flex vince su
   d-none): si vede solo mentre la dettatura lavora davvero. */
main:has(#patient-floating-bar) .dictation-processing.d-none { display: none !important; }
/* Linguette Trascrizione / Nota: i colori della casa al posto del blu e
   del bianco di Bootstrap (di notte la linguetta spenta era un blocco
   bianco, quella accesa sotto soglia di contrasto). */
main:has(#patient-floating-bar) .dictation-mobile-tabs { gap: .5rem; }
main:has(#patient-floating-bar) .dictation-mobile-tabs .nav-link {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    border-radius: 10px;
    border: 1px solid rgba(34,211,238,.45);
    background: transparent;
    color: #67E8F9;
    font-weight: 700;
}
main:has(#patient-floating-bar) .dictation-mobile-tabs .nav-link.active {
    background: linear-gradient(135deg,#0E7490,#2563EB);
    border-color: transparent;
    color: #FFFFFF;
}
html[data-tema="giorno"] main:has(#patient-floating-bar) .dictation-mobile-tabs .nav-link:not(.active) { border-color: #0E7490; color: #0B6179; background: #FFFFFF; }
/* Di notte la casella della trascrizione era bianca. */
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) .dictation-transcript-box.bg-light {
    background: #0F1929 !important;
    border-color: rgba(148,163,184,.3) !important;
    color: #E2E8F0;
}
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) .dictation-placeholder { color: #94A3B8 !important; }
/* Di notte i contatori ("0 parole") e il distintivo rosso sotto i 4,5:1. */
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) .badge.bg-light.text-muted { color: #CBD5E1 !important; }
html:not([data-tema="giorno"]) main:has(#patient-floating-bar) .badge:is(.bg-danger, .badge-danger) { color: #FCA5A5 !important; }
/* Formato della nota e "Struttura" sulla stessa riga: la tendina si
   stringe, il pulsante resta intero. */
main:has(#patient-floating-bar) .input-group:has(.dictation-format-select) { flex-wrap: nowrap; }
main:has(#patient-floating-bar) .input-group:has(.dictation-format-select) > .form-select { flex: 1 1 0; width: 1%; min-width: 0; }
main:has(#patient-floating-bar) .input-group:has(.dictation-format-select) > .btn { flex: 0 0 auto; }
main:has(#patient-floating-bar) .dictation-format-select { min-height: 44px; font-size: 16px; }
main:has(#patient-floating-bar) .dictation-col .btn { min-height: 44px; }

/* ================================================================
   23. FATTURAZIONE: ritocchi
   ================================================================ */
/* La prima volta il modulo del profilo e' una scheda dentro la scheda:
   sul telefono la scheda interna perde cornice e margini doppi. */
.fatt-pagina .fatt-carta > .fatt-carta {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    margin: .6rem 0 0;
}
/* Di giorno il pulsante dell'opposizione era solo un'icona, senza fondo. */
html[data-tema="giorno"] .fatt-tabella-scroll .action-btn.is-invito { background: #E6F4F7; color: #0B6179; }
/* Il mio abbonamento, di notte: "Attivo" nel verde un gradino piu' chiaro
   (quello di serie restava sotto i 4,5:1 sulla sua pillola). */
html:not([data-tema="giorno"]) .abb-stato.e-ok .abb-pill { color: #34D399; }

/* ================================================================
   24. CONDIZIONI DI SERVIZIO (pagina di accettazione)
   ================================================================ */
body.d-flex .cnd { padding-left: 0; padding-right: 0; }
.cnd .cnd-torna { min-height: 44px; }
.cnd .cnd-testa h1 { font-size: 1.4rem; }
.cnd .cnd-nota,
.cnd .cnd-clausole,
.cnd .cnd-errore { font-size: .875rem; }
.cnd .cnd-casella { min-height: 44px; }
/* Le novita' tornano un elenco puntato (i pallini ciano della vista):
   un foglio generale li toglieva e restava solo il rientro. */
.cnd .cnd-novita { list-style: disc outside; padding-left: 1.1rem; }
.cnd .cnd-casella input { width: 22px; height: 22px; }
