/* ===================================================================== Mockup de teléfono para desktop — menú móvil --------------------------------------------------------------------- Solo se activa cuando tiene la clase .gp-host, que añade el script de detección de index.php únicamente en pantallas grandes y en la ventana superior (no dentro del propio iframe ?gpframe=1). En teléfonos no se aplica nada de esto. ===================================================================== */ html.gp-host, html.gp-host body { margin: 0; height: 100%; overflow: hidden; background: #0c0c0f; } /* Oculta el render ancho del menú y los widgets fijos que "se escapan" del mockup en el contexto host (el contenido real vive en el iframe). */ html.gp-host body > .body-wrapper { display: none !important; } html.gp-host .gt_float_switcher, html.gp-host .gtranslate_wrapper, html.gp-host [id*="gt_float"] { display: none !important; } .gp-device-stage { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; padding: 24px; box-sizing: border-box; /* Mismo fondo que menu-app/admin/: la imagen se inyecta inline desde index.php (background_image de sesión); este color es solo respaldo. */ background-color: #0c0c0f; background-size: cover; background-position: center; background-repeat: no-repeat; z-index: 2147483000; } .gp-device { position: relative; display: flex; flex-direction: column; width: 414px; height: min(896px, calc(100vh - 48px)); padding: 12px; box-sizing: border-box; background: #0a0a0c; border-radius: 56px; box-shadow: 0 0 0 2px #303036, 0 24px 70px rgba(0, 0, 0, 0.6), inset 0 0 0 7px #000; } .gp-device__statusbar { position: relative; flex: 0 0 auto; height: 30px; } .gp-device__island { position: absolute; top: 4px; left: 50%; transform: translateX(-50%); width: 116px; height: 26px; background: #000; border-radius: 16px; } .gp-device__screen { flex: 1 1 auto; width: 100%; border: 0; border-radius: 8px 8px 42px 42px; background: #fff; display: block; overflow: hidden; scrollbar-width: none; } .gp-device__screen::-webkit-scrollbar { width: 0; height: 0; display: none; } /* Seguridad: nunca mostrar el mockup por debajo del umbral de desktop. */ @media (max-width: 1023px) { .gp-device-stage { display: none !important; } }