/* CAMBIOS GENERALES */
body {
    background-color: white;
    min-height: auto;
    position: relative;
    /* Reducimos márgenes en móvil para ganar espacio */
    margin-top: 10px;
    margin-bottom: 10px;
}

/* Las imágenes siempre se ajustan al ancho disponible */
img {
    height: auto;
    max-width: 100%;
}

/* CONFIGURACIÓN RESPONSIVE (MEDIA QUERIES) */

/* 1. Para pantallas GRANDES (Escritorio) */
@media (min-width: 1201px) {
    .container-header, .site-grid, .footer {
        width: 1200px;
        margin: auto;
    }
}

/* 2. Para pantallas MEDIANAS Y PEQUEÑAS (Tablets y Móviles) */
@media (max-width: 1200px) {
    .container-header, .site-grid, .footer {
        width: 95% !important; /* Deja un pequeño margen a los lados */
        margin-left: auto;
        margin-right: auto;
    }
    
    body {
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

/* CABEZAL DE LOS BANNER */
.container-header {
    box-shadow: inset 0 5px 5px rgba(0,0,0,.03);
    position: relative;
    z-index: 10;
    border-left: 3px solid #00000029; 
    border-top: 3px solid #00000029;
    border-right: 3px solid #00000029;
    background: white;
}

/* CUERPO DEL SITIO */
.site-grid {
    margin-bottom: auto;
    border-left: 3px solid #00000029;
    border-right: 3px solid #00000029;
    border-bottom: 3px solid #00000029;
}

/* PIE DE PÁGINA */
.footer {
    display: none; /* Mantengo tu configuración actual */
    color: #cfcfcf;
    margin-top: 1em; 
    border-right: 3px solid #00000029;
    border-left: 3px solid #00000029;
    border-bottom: 3px solid #00000029;
    margin-bottom: 30px;
}

/* OCULTAR BOTONES WEBAUTHN */
button[class*="plg_system_webauthn_login_button"] {
    padding: .4rem;
    display: none;
}