/* Mobile Overscroll Fix - Fondo negro para el pull-to-refresh */

html, body {
    background-color: #000000 !important;
    background-attachment: fixed;
}

/* Mantener el fondo negro pero permitir refresh */
html {
    background-color: #000000 !important;
    -webkit-overflow-scrolling: touch;
}

body {
    background-color: #000000 !important;
    background-attachment: fixed;
    /* NO usar overscroll-behavior: none para permitir pull-to-refresh */
}

/* Para dispositivos móviles específicamente */
@media only screen and (max-width: 768px) {
    html, body {
        background-color: #000000 !important;
        /* Removido overscroll-behavior para permitir refresh */
    }

    /* Asegurar que el contenedor principal también tenga fondo negro */
    #app {
        background-color: #000000 !important;
        min-height: 100vh;
    }

    main {
        background-color: #000000 !important;
    }
}

/* Fix específico para iOS Safari - versión más permisiva */
@supports (-webkit-touch-callout: none) {
    html, body {
        background-color: #000000 !important;
        /* Removido overscroll-behavior para permitir pull-to-refresh */
    }

    /* NO fijar la posición del body para permitir scroll nativo */
    #app {
        background-color: #000000 !important;
        min-height: 100vh;
    }
}

/* Mantener fondo negro sin bloquear el refresh nativo */
@media screen and (max-width: 768px) {
    body {
        background-color: #000000 !important;
        /* Usar auto en lugar de contain o none para permitir pull-to-refresh */
        overscroll-behavior-y: auto;
    }
}