/**
 * ============================================================================
 * GUITA EN MANO - FORZAR ESTILOS TRON EN LOGIN
 * Override completo de estilos antiguos
 * ============================================================================
 */

/* FORZAR FONDO OSCURO EN LOGIN */
body.login-page {
    background: #0a0e27 !important;
    background-image: none !important;
    background-color: #0a0e27 !important;
    min-height: 100vh !important;
}

body.login-page::before {
    content: '' !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: radial-gradient(ellipse at center, #1a1f3a 0%, #0a0e27 50%, #000 100%) !important;
    z-index: -2 !important;
}

/* Eliminar TODOS los fondos celestes */
.login-page,
.login-page *,
.login-page .login-container,
.login-page .login-box {
    background-color: transparent !important;
    background-image: none !important;
}

/* Fondo del cuadro de login con glassmorphism */
.login-page .card {
    background: rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(20px) saturate(180%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37) !important;
}

.login-page .card-body {
    background: transparent !important;
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Texto blanco en login */
.login-page,
.login-page .login-box-msg,
.login-page p,
.login-page label,
.login-page a {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Inputs translúcidos */
.login-page input.form-control {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 2px solid rgba(255, 255, 255, 0.2) !important;
    color: white !important;
}

.login-page input.form-control:focus {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: #a855f7 !important;
    box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.2) !important;
}

.login-page input.form-control::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* Botón con gradiente neón */
.login-page .btn-primary {
    background: linear-gradient(135deg, #a855f7, #3b82f6) !important;
    border: 2px solid rgba(255, 255, 255, 0.2) !important;
    color: white !important;
    box-shadow: 0 4px 15px rgba(168, 85, 247, 0.4) !important;
}

.login-page .btn-primary:hover {
    background: linear-gradient(135deg, #ec4899, #ef4444) !important;
    box-shadow: 0 6px 20px rgba(236, 72, 153, 0.6) !important;
    transform: translateY(-2px) !important;
}

/* Enlaces */
.login-page a {
    color: #a855f7 !important;
}

.login-page a:hover {
    color: #ec4899 !important;
    text-shadow: 0 0 20px rgba(236, 72, 153, 0.8) !important;
}

/* Input group text (iconos) */
.login-page .input-group-text {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 2px solid rgba(255, 255, 255, 0.2) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Alert de error */
.login-page .alert {
    background: rgba(239, 68, 68, 0.3) !important;
    color: #fff !important;
    border: 1px solid rgba(239, 68, 68, 0.5) !important;
}