/* ============================================================
   ÓpticaPro — Escala automática de escritorio 80% V2
   Objetivo: que una laptop ~1440x900 a zoom 100% de Chrome
   se vea como la interfaz a zoom 80%, sin tocar la lógica.

   - Solo escritorio medio.
   - Se desactiva sola si el navegador ya está al 80% (el viewport
     CSS crece por encima del rango).
   - No se aplica en tablet/móvil ni impresión.
   ============================================================ */

:root {
    --op-desktop-density-scale: 0.80;
    --op-desktop-density-inverse: 1.25;
}

@media screen
       and (min-width: 1100px)
       and (max-width: 1650px)
       and (min-height: 650px)
       and (max-height: 1050px) {

    html {
        overflow: hidden !important;
    }

    body {
        /* Equivale visualmente al zoom 80% del navegador. */
        zoom: var(--op-desktop-density-scale);

        /* Compensa la reducción para seguir llenando el monitor. */
        width: calc(100vw * var(--op-desktop-density-inverse)) !important;
        min-width: calc(100vw * var(--op-desktop-density-inverse)) !important;
        height: calc(100vh * var(--op-desktop-density-inverse)) !important;
        min-height: calc(100vh * var(--op-desktop-density-inverse)) !important;
        max-width: none !important;
    }

    /* Overlays fijos: mantienen cobertura completa después de escalar. */
    #opticapro-startup-loader,
    .sidebar-overlay,
    .modal-overlay,
    .personal-email-gate {
        width: calc(100vw * var(--op-desktop-density-inverse)) !important;
        height: calc(100vh * var(--op-desktop-density-inverse)) !important;
        max-width: none !important;
        max-height: none !important;
    }

    /* Evita que el contenido genere una barra horizontal por redondeos. */
    .main-wrapper {
        min-width: 0 !important;
    }
}

/* Impresión siempre a escala real. */
@media print {
    html,
    body {
        zoom: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }
}
