/* --- Fondo Animado Full Screen --- */

html, body {
    /* Forzamos a que el fondo cubra toda la pantalla siempre */
    height: 100% !important;
    margin: 0 !important;
    
}

/*.main-container {
    min-height: calc(100vh - 120px);
}

#main-container::after {
    content: "";
    display: block;
    clear: both;
}*/

.footer {
    width: 100%;
}

body.login-page {
    /* Usamos min-height para que si la pantalla es pequeña, el fondo siga */
    min-height: 100% !important;
    background: linear-gradient(-45deg, #C52A7A, #4a148c, #7b1fa2, #2c3e50) !important;
    background-size: 400% 400% !important;
    animation: gradientAnimation 15s ease infinite !important;
    display: flex;
    align-items: center;
    justify-content: center;
}



/* Mantenemos la animación igual */
@keyframes gradientAnimation {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* --- Ajuste de la Caja de Login --- */
.login-container {
    width: 100%;
    max-width: 450px; /* Tamaño ideal para que no se estire de más */
}

.widget-box {
    background-color: rgba(255, 255, 255, 0.95) !important; /* Casi blanco sólido pero con un toque pro */
    border: none !important;
    border-radius: 12px !important; /* Bordes más redondeados */
    box-shadow: 0 10px 30px rgba(0,0,0,0.4) !important; /* Sombra más profunda */
}
.btn-success.btn-inverse:hover {
    background-color: #88E788 !important; /* Verde claro al pasar el ratón */
    color: #000000 !important;            /* Cambia las letras a negro */
    transform: translateY(-2px);         /* Pequeño salto hacia arriba */
    transition: all 0.3s ease;            /* Suaviza la transición */
    border-color: #76d676 !important;     
}
.custom-footer-container {
    display: flex !important;           /* Usamos Flexbox */
    flex-direction: column !important;  /* Apilamos logo y texto verticalmente */
    align-items: center !important;     /* CENTRA TODO HORIZONTALMENTE */
    justify-content: center !important; /* Centra verticalmente si hay altura */
    background-color: linear-gradient(-45deg, #C52A7A, #4a148c, #7b1fa2, #2c3e50) !important;
    padding: 20px !important;
    border-top: 1px solid #e5e5e5 !important;
    width: 100% !important;
    clear: both !important;
    text-align: center !important;      /* Refuerzo para navegadores viejos */
    margin-top: auto;
}