/*
 * Sidebar Filament — indicatore voce attiva
 * ------------------------------------------------------------------
 * Barretta verticale viola brand (--jo-primary-600) a sinistra della
 * voce di navigazione selezionata, in entrambi i pannelli (admin + hotel).
 *
 * Markup Filament v3: <li class="fi-sidebar-item fi-sidebar-item-active">
 *   <a class="fi-sidebar-item-button">. La barretta è un ::before assoluto
 * sul button, a tutta altezza della voce e arrotondato, così non sposta il
 * layout né tocca il background/rounded già applicati da Filament.
 */

.fi-sidebar-item-active > .fi-sidebar-item-button {
    position: relative;
}

.fi-sidebar-item-active > .fi-sidebar-item-button::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    border-radius: var(--jo-radius-full);
    background: var(--jo-primary-600);
}

/*
 * Badge di navigazione: wrap NATURALE quando il testo non c'entra (es.
 * "Richiesta attivazione" di GatedByModule, che su una riga sbordava).
 *
 * Il blade del badge Filament avvolge lo slot in <span class="grid">
 * <span class="truncate"> e truncate = nowrap + ellipsis: senza questo
 * override il testo non andava mai a capo. white-space NORMAL (non
 * pre-line: preserverebbe anche i newline di indentazione del template,
 * gonfiando il badge con righe vuote sopra e sotto). I badge a una riga
 * ("Attiva il modulo", "In attesa", contatori) usano spazi nbsp e non si
 * spezzano comunque.
 */
.fi-sidebar-item .fi-badge,
.fi-sidebar-item .fi-badge .truncate {
    white-space: normal;
    text-align: center;
    line-height: 1.2;
}

.fi-sidebar-item .fi-badge .truncate {
    overflow: visible;
    text-overflow: clip;
}

/*
 * Sidebar compressa — il logo compatto sostituisce visivamente il chevron
 * del pulsante di espansione. Il button Filament resta intatto, quindi
 * conserva click, focus da tastiera, tooltip e aria-label nativi.
 *
 * `fi-sidebar-open` viene aggiunta da Alpine quando la sidebar è aperta;
 * limitiamo la regola al desktop perché su mobile la sidebar chiusa è fuori
 * viewport e continua a essere gestita dal topbar standard.
 */
@media (min-width: 1024px) {
    .fi-sidebar:not(.fi-sidebar-open)
        .fi-sidebar-header
        > .fi-icon-btn:first-of-type {
        width: 2.75rem;
        height: 2.75rem;
        border-radius: var(--jo-radius-lg, 0.5rem);
        background-color: #f4f4f4;
        background-image: url('/logoJoorna_side.jpeg');
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        box-shadow: 0 0 0 1px rgb(15 23 42 / 8%);
    }

    .fi-sidebar:not(.fi-sidebar-open)
        .fi-sidebar-header
        > .fi-icon-btn:first-of-type
        > svg {
        opacity: 0;
    }

    .fi-sidebar:not(.fi-sidebar-open)
        .fi-sidebar-header
        > .fi-icon-btn:first-of-type:focus-visible {
        outline: 2px solid var(--jo-primary-600, #7400ff);
        outline-offset: 2px;
    }
}