/* Fondo general moderno (usa el color primario de los botones Bootstrap) */
.login-page-bg {
    background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
}

/* Efectos visuales de inputs */
.login-input-group {
    transition: all 0.3s ease;
    background-color: #fff;
    border: 2px solid #e2e8f0 !important;
}

.login-input-group:focus-within {
    border-color: var(--bs-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb, 13, 110, 253), 0.15);
}

.login-input-group input:focus {
    box-shadow: none !important;
    outline: none !important;
}

/* Fix inner border radius and border clash */
.login-input-group .form-control {
    border-radius: 0 !important;
    border: none !important;
    background-color: transparent !important;
}

/* Override Chrome autofill ugly background color */
.login-input-group input:-webkit-autofill,
.login-input-group input:-webkit-autofill:hover,
.login-input-group input:-webkit-autofill:focus,
.login-input-group input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
    -webkit-text-fill-color: #333 !important;
    border-radius: 0 !important;
}

.hover-primary:hover {
    color: var(--primary-color) !important;
}

.hover-shadow-lg:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    transform: translateY(-2px);
}

.transition-all {
    transition: all 0.3s ease;
}

/* Botones más negros para login y recuperar contraseña */
.no-theme.btn-dark {
    background-color: #000 !important;
    border-color: #000 !important;
    color: #fff !important;
}
.no-theme.btn-dark:hover,
.no-theme.btn-dark:focus {
    background-color: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
}