/* ==========================================================================
   LA LASTRA CHE SCIVOLA (vedi admin-core.js -> h.slide())
   --------------------------------------------------------------------------
   Richiesta del titolare (14/09/2026): "facciamola sempre a schermo intero.. cosi' e' gia'
   mobile.. sempre. evitiamo il modale piccolo... deve essere effetto slide".
   Quindi non un riquadro al centro, ma una lastra a TUTTO SCHERMO che entra scivolando da
   destra: su telefono e' gia' perfetta, su monitor grande si vede tutta la larghezza.
   Testata, x , corpo e piede sono quelli del modale (stesse classi), cosi' l'aspetto e'
   familiare e non ci sono due stili diversi nella stessa area.
   ========================================================================== */
.admin-slide {
    position: fixed;
    inset: 0;
    z-index: 950;                     /* sopra il modale (900) */
    display: flex;
    justify-content: flex-end;
    background: rgba(8, 8, 14, 0.5);
    opacity: 0;
    transition: opacity 220ms ease;
}
.admin-slide--dentro { opacity: 1; }

.admin-slide__box {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;                     /* schermo intero: niente versione "mobile" a parte */
    background: var(--mood-bg-card, #181825);
    border-left: 1px solid var(--mood-border, #2b2b3d);
    box-shadow: -18px 0 50px rgba(0, 0, 0, 0.45);
    transform: translateX(100%);
    transition: transform 280ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.admin-slide--dentro .admin-slide__box { transform: translateX(0); }

/* Il corpo scorre da solo: la testata e il piede restano fermi mentre si legge. */
.admin-slide__box > .admin-modal__head { flex: 0 0 auto; }
.admin-slide__box > .admin-modal__body {
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 1.6rem clamp(1rem, 4vw, 3rem) 2.6rem;
}
.admin-slide__box > .admin-modal__foot { flex: 0 0 auto; }

/* La lastra prende SEMPRE tutto lo schermo (anche su un monitor grande): a respirare e' il
   contenuto, che si tiene una colonna larga al centro. Cosi' non esiste una versione
   "mobile" a parte: e' la stessa, sempre. */
@media (prefers-reduced-motion: reduce) {
    .admin-slide, .admin-slide__box { transition: none; }
}
