/* ==========================================================================
   📱 SYSTEM FRAME: INVOLUCRO TELEFONICO UNIVERSALE PER DESKTOP (T1 -> T11)
   ========================================================================== */

/* Di base, sui cellulari, il contenitore è invisibile e non fa nulla */
.universal-phone-wrapper {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 0;
}

/* 🖥️ Da 992px in su (PC, Mac e Tablet orizzontali) scatta la sagoma del telefono */
@media (min-width: 992px) {
    body {
        background-color: #121212 !important; /* Sfondo scuro elegante fuori dal telefono */
    }

    .universal-phone-wrapper {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        min-height: 100vh !important;
        padding: 20px 0 !important;
        box-sizing: border-box !important;
    }

    /* La scatola rigida che simula lo schermo dello smartphone */
    .universal-phone-screen {
        width: 375px !important;
        height: 812px !important;
        background-color: inherit;
        border: 12px solid #2d2d2d !important; /* Scocca del telefono */
        border-radius: 40px !important;
        overflow-y: auto !important; /* Sblocca lo scorrimento interno */
        overflow-x: hidden !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
        position: relative !important;
        box-sizing: border-box !important;
    }

    /* Nasconde la scrollbar interna del telefono per estetica premium (Chrome/Safari) */
    .universal-phone-screen::-webkit-scrollbar {
        display: none !important;
        width: 0 !important;
    }
    /* Nasconde la scrollbar per Firefox */
    .universal-phone-screen {
        scrollbar-width: none !important;
    }
}