/* ==========================================================================
   Calendario Lezioni - stile del calendario operatori e del totem
   (ottobre 2026)

   Un'unica scheda per lezione in tutte le viste, con una striscia colorata
   per famiglia di evento (categoria_evento() in helpers/Functions.php) e
   intestazioni delle aule come le targhe sulle porte.
   Togliendo questo file dal layout si torna quasi del tutto allo stile precedente.
   ========================================================================== */

:root {
    --cal-inchiostro: #1e2b37;
    --cal-ardesia: #2f3c48;
    --cal-ardesia-chiaro: #46525e;
    --cal-nebbia: #eef1f4;
    --cal-linea: #d9dfe5;
    --cal-testo-tenue: #5b6875;
    --cal-adesso: #c2410c;
    --cal-adesso-chiaro: #fdf1ea;

    --cat-lezione: #2563a6;        --cat-lezione-sfondo: #eef4fb;
    --cat-esame: #b42318;          --cat-esame-sfondo: #fdf0ef;
    --cat-esercitazione: #6d4bb3;  --cat-esercitazione-sfondo: #f4f0fb;
    --cat-corso: #0f766e;          --cat-corso-sfondo: #ebf6f4;
    --cat-evento: #a16207;         --cat-evento-sfondo: #fbf5e8;
}

.cal-cat-lezione       { --cat: var(--cat-lezione);       --cat-sfondo: var(--cat-lezione-sfondo); }
.cal-cat-esame         { --cat: var(--cat-esame);         --cat-sfondo: var(--cat-esame-sfondo); }
.cal-cat-esercitazione { --cat: var(--cat-esercitazione); --cat-sfondo: var(--cat-esercitazione-sfondo); }
.cal-cat-corso         { --cat: var(--cat-corso);         --cat-sfondo: var(--cat-corso-sfondo); }
.cal-cat-evento        { --cat: var(--cat-evento);        --cat-sfondo: var(--cat-evento-sfondo); }


/* --------------------------------------------------------------------------
   Griglia comune alle tre viste (giorno, settimana, mese)
   -------------------------------------------------------------------------- */

table.cal-griglia {
    border: 1px solid var(--cal-linea) !important;
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    color: var(--cal-inchiostro);
    font-variant-numeric: tabular-nums;
}

table.cal-griglia > thead > tr,
table.cal-griglia > thead > tr > th {
    background: var(--cal-ardesia) !important;
    color: #fff !important;
    border: 0 !important;
}

table.cal-griglia > thead > tr > th {
    padding: 8px 6px !important;
    vertical-align: middle;
    font-weight: 600;
    border-left: 1px solid var(--cal-ardesia-chiaro) !important;
}

table.cal-griglia > thead > tr > th:first-child {
    border-left: 0 !important;
}

table.cal-griglia > tbody > tr > td,
table.cal-griglia > tr > td {
    border: 0 !important;
    border-top: 1px solid var(--cal-linea) !important;
    border-left: 1px solid var(--cal-linea) !important;
    background-clip: padding-box;
}

table.cal-griglia td:first-child {
    border-left: 0 !important;
}

/* Zebra leggera al posto delle righe grigie di Bootstrap */
table.cal-griglia.table-striped tbody tr:nth-of-type(odd),
table.cal-griglia.table-striped > tr:nth-of-type(odd) {
    background-color: #fafbfc;
}

/* Targa d'aula: "AULA" piccolo sopra, nome grande */
.cal-aula-eyebrow {
    display: block;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    opacity: 0.65;
    line-height: 1.2;
}

.cal-aula-nome {
    display: block;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.25;
}

.cal-giorno-nome {
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
}

.cal-giorno-data {
    display: block;
    font-size: 11px;
    opacity: 0.7;
}

/* Colonna degli orari */
table.cal-griglia td.td_orario {
    background: var(--cal-nebbia) !important;
    color: var(--cal-testo-tenue);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    width: 1%;
    padding: 6px 10px !important;
}

table.cal-griglia td.td_orario p {
    margin: 0;
    font-size: 13px;
}

/* Ora corrente: solo quando si guarda la giornata di oggi (vedi highlightCurrentTimeSlot) */
table.cal-griglia td.td_orario.current-time-slot {
    background: var(--cal-adesso) !important;
    color: #fff !important;
}

/* Colonna e cella del giorno di oggi (settimana e mese) */
table.cal-griglia th.cal-oggi {
    background: var(--cal-adesso) !important;
}

table.cal-griglia td.cal-oggi {
    background-color: var(--cal-adesso-chiaro) !important;
}


/* --------------------------------------------------------------------------
   Scheda della lezione (uguale in tutte le viste)
   -------------------------------------------------------------------------- */

.cal-evento {
    position: relative;
    display: block;
    text-align: left;
    background: var(--cat-sfondo, var(--cat-lezione-sfondo));
    border-left: 4px solid var(--cat, var(--cat-lezione));
    border-radius: 4px;
    padding: 6px 8px 7px 9px;
    line-height: 1.3;
    font-weight: 400;
    color: var(--cal-inchiostro);
}

.cal-evento-tipo {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--cat, var(--cat-lezione));
    margin-bottom: 2px;
}

/* Università accanto al tipo («LEZIONE UNISS»): stesso colore del tipo, più marcata.
   Vale per calendario, lista e totem (sigla_ateneo_html() in helpers/Functions.php) */
.cal-sigla {
    margin-left: 0.4em;
    font-weight: 900;
}

/* Filtro per università sopra il calendario: le lezioni delle altre restano al loro posto, sbiadite.
   Quelle senza università (es. un convegno senza docente) si vedono sempre. */
.cal-filtro-ateneo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0 auto 12px;
}

.cal-filtro-ateneo .etichetta {
    margin-right: 4px;
    font-size: 14px;
    font-weight: 700;
    color: var(--cal-inchiostro);
}

.cal-filtro-ateneo button {
    padding: 4px 14px;
    border: 1px solid var(--cal-linea);
    border-radius: 20px;
    background: #fff;
    color: var(--cal-inchiostro);
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.cal-filtro-ateneo button:hover {
    background: var(--cal-nebbia);
}

.cal-filtro-ateneo button[aria-pressed="true"] {
    background: var(--cal-ardesia);
    border-color: var(--cal-ardesia);
    color: #fff;
}
/* Le regole che sbiadiscono le altre università le scrive calendario.php, una per sigla dell'elenco */

/* Telefoni stretti (es. 360 punti): i tre pulsanti Giornaliera / Settimanale / Mensile non ci stavano
   e facevano scorrere di lato tutta la pagina, filtri compresi. Meno spazio ai lati; sotto i 360 punti
   anche senza icona. */
@media (max-width: 419.98px) {
    body.lezioni-calendario #btn_view_day,
    body.lezioni-calendario #btn_view_week,
    body.lezioni-calendario #btn_view_month {
        padding-left: .4rem;
        padding-right: .4rem;
    }

    /* Indietro / Avanti larghi quanto il loro testo (mai tagliati) e il riquadro della data prende lo
       spazio che resta: a 360 punti si leggeva «04-11-202». Gli stili sono scritti nei tag di
       calendario.php (min-width 100px), quindi qui serve !important. */
    body.lezioni-calendario #date_selectors_container .date-selector > .btn {
        flex: 0 0 auto;
        min-width: auto !important;
        padding-left: .55rem !important;
        padding-right: .55rem !important;
    }

    body.lezioni-calendario #date_selectors_container .date-selector > .input-group {
        flex: 1 1 auto !important;
        min-width: 0;
    }

    body.lezioni-calendario #date_selectors_container .date-selector .input-group > .form-control {
        min-width: 0;
        padding-left: .3rem !important;
        padding-right: .3rem !important;
    }
}

/* Vista settimanale sui telefoni stretti: l'intervallo «02-11-2026 — 08-11-2026» non ci stava;
   Indietro / Avanti restano solo con la freccia (il testo resta per chi usa la lettura vocale) */
@media (max-width: 399.98px) {
    body.lezioni-calendario #week_selector > .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 38px; /* come il riquadro della data */
        font-size: 0 !important;
    }

    body.lezioni-calendario #week_selector > .btn .fa {
        font-size: 14px;
    }
}

@media (max-width: 359.98px) {
    body.lezioni-calendario #btn_view_day .fa,
    body.lezioni-calendario #btn_view_week .fa,
    body.lezioni-calendario #btn_view_month .fa {
        display: none;
    }
}

.cal-evento-titolo {
    display: block;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
}

.cal-evento-docente,
.cal-evento-meta {
    display: block;
    font-size: 12px;
    color: var(--cal-testo-tenue);
    margin-top: 2px;
}

.cal-evento-meta strong {
    color: var(--cal-inchiostro);
    font-weight: 600;
}

.cal-evento-nota {
    display: block;
    font-size: 11px;
    font-style: italic;
    color: var(--cal-testo-tenue);
    margin-top: 3px;
}

/* Riga superiore: orario, tipo, durata */
.cal-evento-testa {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 2px;
}

.cal-evento-testa .cal-evento-tipo {
    margin: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cal-evento-ora {
    font-size: 11px;
    font-weight: 700;
    color: var(--cal-inchiostro);
    white-space: nowrap;
}

.cal-evento-durata {
    font-size: 10px;
    font-weight: 700;
    color: var(--cat, var(--cat-lezione));
    border: 1px solid var(--cat, var(--cat-lezione));
    border-radius: 3px;
    padding: 0 4px;
    line-height: 1.4;
}

/* Pulsanti modifica/elimina: in alto a destra, visibili al passaggio del mouse */
.cal-evento .icona,
table.cal-griglia td.cal-occupata > .icona {
    position: absolute;
    top: 3px;
    right: 3px;
    bottom: auto;
    padding: 0;
    z-index: 5;
}

.cal-evento .icona .btn,
table.cal-griglia td.cal-occupata > .icona .btn {
    padding: 1px 6px;
    font-size: 11px;
    line-height: 1.5;
}

/* Telefono e tablet (niente mouse): niente icone modifica/elimina dentro la cella.
   Comparivano col primo tocco proprio sotto il dito e, sulle lezioni piccole, lo stesso
   tocco apriva la modifica invece di selezionare la lezione. Selezionata la lezione,
   "Modifica" ed "Elimina" sono nella barra in alto (calendar-mobile-enhancements.js). */
@media (hover: none) {
    table.cal-griglia td.cal-occupata > .icona,
    table.cal-griglia [data-lesson-id] .icona {
        display: none !important;
    }
}

.click-move-instructions .btn-azione {
    min-height: 38px;
    padding: 6px 14px;
    border: 0;
    border-radius: 8px;
    background: #fff;
    color: var(--cal-inchiostro);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

.click-move-instructions .btn-azione-elimina {
    background: #fdeeed;
    color: #b42318;
}

.click-move-instructions .btn-azione .fa {
    margin-right: 4px;
}


/* --------------------------------------------------------------------------
   Vista giornaliera
   -------------------------------------------------------------------------- */

table.cal-griglia[data-view-type="giornaliera"] td.td_cella {
    position: relative;
    padding: 3px !important;
    vertical-align: top;
    font-weight: 400;
}

/* Lo sfondo della scheda lo disegna la cella, così copre tutte le ore della lezione.
   Con height: 100% sulla scheda Firefox, nelle celle su più ore (rowspan), la riduceva
   ai soli margini interni e il testo usciva sopra le righe sotto. */
table.cal-griglia[data-view-type="giornaliera"] td.cal-occupata::before {
    content: "";
    position: absolute;
    top: 3px;
    right: 3px;
    bottom: 3px;
    left: 3px;
    background: var(--cat-sfondo, var(--cat-lezione-sfondo));
    border-left: 4px solid var(--cat, var(--cat-lezione));
    border-radius: 4px;
    pointer-events: none;
}

table.cal-griglia[data-view-type="giornaliera"] td.cal-occupata .cal-evento {
    background: transparent;
    border-left-color: transparent;
}

/* Testo in alto nelle lezioni lunghe (.table tr td impone vertical-align: middle !important) */
table.cal-griglia[data-view-type="giornaliera"] td.cal-occupata {
    vertical-align: top !important;
}

table.cal-griglia[data-view-type="giornaliera"] td.cal-vuota:hover {
    background: var(--cal-nebbia);
}

table.cal-griglia[data-view-type="giornaliera"] td.cal-vuota .icona {
    padding: 2px;
}

/* Giorno passato in sola lettura (ruoli con "solo oggi e futuro") */
.cal-avviso-bloccato {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 auto 10px;
    padding: 8px 12px;
    border-radius: 6px;
    background: var(--cal-nebbia);
    color: var(--cal-testo-tenue);
    font-size: 13px;
    max-width: 98%;
}

table.cal-griglia.cal-bloccato .cal-evento,
table.cal-griglia.cal-bloccato td.cal-occupata::before {
    filter: grayscale(0.6);
    opacity: 0.75;
}


/* --------------------------------------------------------------------------
   Vista settimanale
   -------------------------------------------------------------------------- */

table.cal-griglia[data-view-type="settimanale"] td.td_cella {
    padding: 4px !important;
    vertical-align: top;
    font-weight: 400;
}

table.cal-griglia[data-view-type="settimanale"] .lezione-box.cal-evento {
    margin-bottom: 4px;
    cursor: grab;
}

table.cal-griglia[data-view-type="settimanale"] .cal-evento-titolo {
    font-size: 12px;
}

table.cal-griglia[data-view-type="settimanale"] .cal-evento-meta {
    font-size: 11px;
}

/* Lezione iniziata nell'ora precedente: solo un richiamo sottile */
.cal-continua {
    display: block;
    text-align: left;
    border-left: 4px solid var(--cat, var(--cat-lezione));
    padding: 2px 8px;
    margin-bottom: 4px;
    font-size: 11px;
    color: var(--cal-testo-tenue);
}


/* --------------------------------------------------------------------------
   Vista mensile
   -------------------------------------------------------------------------- */

table.cal-griglia[data-view-type="mensile"] td.td_cella {
    padding: 4px !important;
    vertical-align: top !important;
    text-align: left;
    position: relative;
}

table.cal-griglia[data-view-type="mensile"] td.cal-fuori-mese {
    background: var(--cal-nebbia) !important;
}

.cal-giorno-num {
    font-size: 13px;
    font-weight: 700;
    color: var(--cal-testo-tenue);
    text-align: right;
    margin: 0 2px 4px;
}

td.cal-oggi .cal-giorno-num {
    color: var(--cal-adesso);
}

.cal-evento.cal-mini {
    padding: 3px 6px 4px 7px;
    margin-bottom: 3px;
    border-left-width: 3px;
    cursor: pointer;
}

.cal-mini .cal-evento-titolo {
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cal-mini .cal-evento-meta {
    font-size: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 0;
}

.cal-mini .cal-evento-ora {
    font-size: 10px;
}

.cal-mini .icona .btn {
    padding: 0 4px;
    font-size: 9px;
}


/* --------------------------------------------------------------------------
   Legenda
   -------------------------------------------------------------------------- */

.cal-legenda {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    padding: 10px 4px;
    font-size: 13px;
    color: var(--cal-inchiostro);
}

.cal-legenda-voce {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}

.cal-legenda-colore {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    background: var(--cat, var(--cat-lezione));
    align-self: center;
}

.cal-legenda-voce small {
    color: var(--cal-testo-tenue);
}


/* --------------------------------------------------------------------------
   Pagina iniziale
   -------------------------------------------------------------------------- */

.cal-dash-oggi td {
    vertical-align: middle;
}

.cal-dash-tipo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cal-dash-tipo::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 2px;
    background: var(--cat, var(--cat-lezione));
}

#mini-datepicker .flatpickr-calendar.inline {
    margin: 0 auto;
    box-shadow: none;
    max-width: 320px;
}


/* --------------------------------------------------------------------------
   Moduli: campi con ricerca (selectize, es. Docente) uguali agli altri campi
   -------------------------------------------------------------------------- */

body .selectize-control.single .selectize-input {
    min-height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background: #fff !important;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    box-shadow: none !important;
}

body .selectize-control.single .selectize-input input,
body .selectize-control.single .selectize-input > .item {
    font-size: 1rem;
    line-height: 1.5;
}

body .selectize-dropdown {
    font-size: 1rem;
}


/* --------------------------------------------------------------------------
   Totem (lezioni/ledisplay, tema chiaro): display 55" a schermo intero,
   da leggere da chi passa in corridoio.
   - misure in vh: si adattano alla risoluzione (Full HD o 4K)
   - intestazione + tabella occupano sempre esattamente lo schermo:
     --totem-alto (calcolato da adattaTotemAlloSchermo() in ledisplay.php) è lo
     spazio sopra la tabella, --righe (in led_calendario.php) il numero di fasce orarie
   - le schede sono "appoggiate" sopra la cella e non possono allungare la riga;
     il testo non viene mai tagliato: adattaTestoSchede() (ledisplay.php) riduce
     --scala della singola scheda finché tutto il contenuto ci sta
   -------------------------------------------------------------------------- */

body.lezioni-ledisplay {
    overflow: hidden;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) .led-header {
    padding: 0.8vh 0 0.8vh;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) .led-header-logos img {
    height: 6.2vh;
}

.led-header-title {
    flex: 1;
    text-align: right;
    line-height: 1.05;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) .led-header-title {
    color: var(--cal-ardesia);
}

.led-header-title strong {
    display: block;
    white-space: nowrap;
    font-size: 4.2vh;
    font-weight: 800;
    letter-spacing: -0.01em;
}

/* Orologio "Sono le ... di ..." spostato sotto il titolo (adattaTotemAlloSchermo) */
.led-header-orologio {
    display: block;
    white-space: nowrap;
    margin-top: 0.4vh;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) #LiveClockIE {
    display: inline;
    width: auto !important;
    text-align: right !important;
    background: transparent !important;
    white-space: nowrap;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) #LiveClockIE,
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) #LiveClockIE font {
    font-size: 2.7vh !important;
    line-height: 1.2;
    color: var(--cal-ardesia) !important;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) #txtHint {
    padding-bottom: 0 !important;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem {
    --totem-intestazione: 6.2vh;
    width: 100%;
    height: calc(100vh - var(--totem-alto, 140px));
    table-layout: fixed;
    border: 2px solid var(--cal-ardesia) !important;
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: 8px;
    overflow: hidden;
    color: var(--cal-inchiostro);
    font-variant-numeric: tabular-nums;
    margin-bottom: 0;
}

/* Riga delle aule */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem > thead > tr {
    height: var(--totem-intestazione);
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem > thead > tr,
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem > thead > tr > th {
    background: var(--cal-ardesia) !important;
    color: #fff !important;
    border: 0 !important;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem > thead > tr > th {
    padding: 0.3vh 0.4vw !important;
    border-left: 1px solid var(--cal-ardesia-chiaro) !important;
    vertical-align: middle;
    overflow: hidden;
    white-space: nowrap;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem > thead > tr > th:first-child {
    width: 8%;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-aula-eyebrow {
    font-size: 1.2vh;
    letter-spacing: 0.2em;
    opacity: 0.75;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-aula-nome {
    font-size: 2.8vh;
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Fasce orarie: tutte della stessa altezza, insieme riempiono lo spazio restante */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem > tbody > tr {
    height: calc((100vh - var(--totem-alto, 140px) - var(--totem-intestazione)) / var(--righe, 11));
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td {
    border: 0 !important;
    border-top: 1px solid var(--cal-linea) !important;
    border-left: 1px solid var(--cal-linea) !important;
    padding: 0 !important;
    vertical-align: middle;
    font-weight: 400;
    overflow: hidden;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.td_orario_lcd {
    border-left: 0 !important;
    background: var(--cal-nebbia) !important;
    color: var(--cal-ardesia);
    white-space: nowrap;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.td_orario_lcd p {
    font-size: 2.6vh;
    font-weight: 800;
    margin: 0;
    line-height: 1.1;
}

/* Ora corrente */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.td_orario_lcd.current-time-slot {
    background: var(--cal-adesso) !important;
    color: #fff !important;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.td_orario_lcd.current-time-slot::after {
    content: "ADESSO";
    display: block;
    font-size: 1.3vh;
    font-weight: 800;
    letter-spacing: 0.18em;
}

/* Ore già passate: più tenui */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.td_orario_lcd.slot-passato {
    opacity: 0.45;
}

/* Scheda della lezione appoggiata sopra la cella: non può allungare la riga */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.cal-occupata {
    position: relative;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-evento {
    position: absolute;
    top: 0.25vh;
    bottom: 0.25vh;
    left: 0.25vw;
    right: 0.25vw;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    column-gap: 0.6vw;
    padding: 0.35vh 0.5vw 0.35vh 0.8vw;
    border-left-width: 0.45vw;
    border-radius: 5px;
    line-height: 1.1;
    overflow-wrap: anywhere;
    --scala: 1;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-separatore {
    margin: 0.4vh 0;
    border: 0;
    border-top: 1px solid currentColor;
    opacity: 0.35;
}

/* Ordine nella scheda: in alto in piccolo "IN CORSO" e il tipo (Lezione, Esame, ...; in inglese
   con tipo_evento_en()), poi il nome del corso (il più grande), sotto il docente, infine le note */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-evento-tipo {
    order: 1;
    margin: 0;
    font-size: calc(1.3vh * var(--scala));
    line-height: 1.5;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-evento-docente {
    order: 4;
    flex-basis: 100%;
    margin: 0.2vh 0 0;
    font-size: calc(1.55vh * var(--scala));
    line-height: 1.25;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-evento-titolo {
    order: 3;
    flex-basis: 100%;
    font-size: calc(1.9vh * var(--scala));
    font-weight: 700;
    line-height: 1.1;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem .cal-evento-nota {
    order: 5;
    flex-basis: 100%;
    font-size: calc(1.4vh * var(--scala) * var(--scala-nota, 1));
    margin-top: 0.3vh;
}

/* Lezione di una sola ora: niente note, c'è spazio solo per l'essenziale */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.cal-occupata:not(.cal-lunga) .cal-evento-nota {
    display: none;
}

/* Lezione di più ore: corso più grande, fino a 3 righe, e note visibili */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.cal-lunga .cal-evento-titolo {
    font-size: calc(2.1vh * var(--scala));
}

/* Lezione in corso: bordo evidenziato e etichetta "IN CORSO" in alto a destra */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.lezione-in-corso .cal-evento {
    box-shadow: inset 0 0 0 0.3vh var(--cal-adesso);
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.lezione-in-corso .cal-evento::before {
    content: "IN CORSO";
    order: 0;
    padding: 0 0.4vw;
    border-radius: 3px;
    background: var(--cal-adesso);
    color: #fff;
    font-size: calc(1.2vh * var(--scala));
    font-weight: 800;
    letter-spacing: 0.1em;
    line-height: 1.6;
}

/* Lezione già finita: più tenue */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.lezione-finita .cal-evento {
    opacity: 0.45;
}

/* Tema scuro del totem: le schede restano trasparenti sullo sfondo scuro */
.ledisplay-theme-dark .cal-evento {
    background: transparent;
    color: inherit;
}

.ledisplay-theme-dark .cal-evento-docente,
.ledisplay-theme-dark .cal-evento-nota {
    color: inherit;
    opacity: 0.85;
}

/* Testo esteso: i tre colori della barra (testo_esteso_html() in helpers/Functions.php).
   Restano grandi quanto il resto della nota, anche sul totem. */
.nota-rosso { color: #b42318; }
.nota-verde { color: #0f766e; }
.nota-blu { color: #2563a6; }

.ledisplay-theme-dark .nota-rosso { color: #ff9a8f; }
.ledisplay-theme-dark .nota-verde { color: #6fd6c4; }
.ledisplay-theme-dark .nota-blu { color: #8fbcf0; }

/* Pagina iniziale: mini calendario "Vai a un giorno" */
.cal-mini-calendario {
    max-width: 340px;
    margin: 0 auto;
}

.cal-mini-calendario > input {
    display: none !important;
}

/* Vista giornaliera su schermi grandi: testo più grande e più scuro, da leggere senza avvicinarsi */
@media screen and (min-width: 1200px) {
    table.cal-griglia[data-view-type="giornaliera"] .cal-aula-eyebrow {
        font-size: 11px;
    }
    table.cal-griglia[data-view-type="giornaliera"] .cal-aula-nome {
        font-size: 18px;
    }
    table.cal-griglia[data-view-type="giornaliera"] td.td_orario,
    table.cal-griglia[data-view-type="giornaliera"] td.td_orario p {
        font-size: 16px;
    }
    /* Colore solo sulla cella: il <p> lo eredita, così l'ora attuale resta bianca sul rosso */
    table.cal-griglia[data-view-type="giornaliera"] td.td_orario {
        color: var(--cal-ardesia);
    }
    table.cal-griglia[data-view-type="giornaliera"] .cal-evento {
        padding: 8px 10px 9px 12px;
    }
    table.cal-griglia[data-view-type="giornaliera"] .cal-evento-tipo {
        font-size: 12px;
        margin-bottom: 3px;
    }
    table.cal-griglia[data-view-type="giornaliera"] .cal-evento-titolo {
        font-size: 16px;
        line-height: 1.3;
    }
    table.cal-griglia[data-view-type="giornaliera"] .cal-evento-docente {
        font-size: 14px;
        color: var(--cal-ardesia-chiaro);
        margin-top: 3px;
    }
    table.cal-griglia[data-view-type="giornaliera"] .cal-evento-nota {
        font-size: 13px;
        color: var(--cal-ardesia-chiaro);
    }
}

/* Smartphone: schede più compatte */
@media screen and (max-width: 575.98px) {
    .cal-evento {
        padding: 4px 6px 5px 7px;
    }
    .cal-evento-tipo {
        font-size: 9px;
    }
    .cal-evento-titolo {
        font-size: 12px;
    }
    .cal-evento-docente,
    .cal-evento-meta {
        font-size: 11px;
    }
    .cal-aula-nome {
        font-size: 13px;
    }
}

/* --------------------------------------------------------------------------
   Totem in due lingue (Impostazioni -> Display): ogni N secondi la pagina prende
   la classe totem-en (avviaAlternanzaLingue in ledisplay.php). Cambiano solo le
   scritte fisse (.t-it / .t-en, ADESSO, IN CORSO, orologio): intestazione e
   tabella restano ferme.
   -------------------------------------------------------------------------- */

.t-en {
    display: none;
}

.totem-en .t-it {
    display: none;
}

.totem-en .t-en {
    display: inline;
}

.t-it,
.t-en {
    transition: opacity 0.25s ease;
}

.totem-dissolvenza .t-it,
.totem-dissolvenza .t-en,
.totem-dissolvenza table.cal-totem td.td_orario_lcd.current-time-slot::after,
.totem-dissolvenza table.cal-totem td.lezione-in-corso .cal-evento::before {
    opacity: 0;
}

/* Intestazione ad altezza fissa: titolo e tabella non si spostano mai */
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) .led-header {
    height: 10.5vh;
    box-sizing: border-box;
    overflow: hidden;
    align-items: center;
}

.led-header-orologio {
    height: 3.6vh;
    line-height: 3.6vh;
    overflow: hidden;
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) #orologio-en {
    font-size: 2.7vh;
    line-height: 1.2;
    color: var(--cal-ardesia);
    white-space: nowrap;
}

/* Interruttore IT · EN: fisso all'estrema destra, evidenzia la lingua attiva */
.totem-lingua {
    display: inline-flex;
    vertical-align: middle;
    margin-left: 0.8vw;
    border: 2px solid var(--cal-ardesia);
    border-radius: 6px;
    overflow: hidden;
    font-size: 1.5vh;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
}

.totem-lingua span {
    padding: 0.4vh 0.55vw;
    color: var(--cal-ardesia);
    transition: background-color 0.25s ease, color 0.25s ease;
}

html:not(.totem-en) .totem-lingua-it,
.totem-en .totem-lingua-en {
    background: var(--cal-ardesia);
    color: #fff;
}

/* ADESSO e IN CORSO in inglese */
.totem-en body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.td_orario_lcd.current-time-slot::after,
.totem-en body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.lezione-in-corso .cal-evento::before {
    content: "NOW";
}

body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.td_orario_lcd.current-time-slot::after,
body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) table.cal-totem td.lezione-in-corso .cal-evento::before {
    transition: opacity 0.25s ease;
}
/* Impostazioni: riquadro "Totem in due lingue" */
.totem-lingue-impostazioni {
    background: var(--cal-adesso-chiaro);
    border-left: 4px solid var(--cal-adesso);
    border-radius: 4px;
    padding: 10px 0;
    margin-left: 0;
    margin-right: 0;
}

/* L'orologio (liveclock.js) chiude il testo con due <br>: sul totem andrebbe a capo
   e spingerebbe l'interruttore IT · EN fuori dall'intestazione */
body.lezioni-ledisplay #LiveClockIE br {
    display: none;
}

/* In inglese si nasconde l'orologio italiano (la regola con #LiveClockIE sopra lo terrebbe visibile) */
.totem-en body.lezioni-ledisplay .page:not(.ledisplay-theme-dark) #LiveClockIE {
    display: none;
}
