/* ==============================================
   EFEITO VIDRO CRISTALINO ULTRA-TRANSPARENTE
   Máxima transparência com efeito glass
   APENAS quando glass effect está habilitado
============================================== */

/* Regra principal - vidro cristalino SEM BLUR */
.glass-effect .auth-form-container {
    background: rgba(255, 255, 255, 0.02) !important;
    -webkit-backdrop-filter: blur(1px) saturate(180%) !important;
    backdrop-filter: blur(1px) saturate(180%) !important;
    box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.1),
        0 0 80px rgba(59, 130, 246, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.5),
        inset 0 -1px 0 rgba(255, 255, 255, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

/* Mobile - vidro ainda mais transparente */
@media (max-width: 768px) {
    .glass-effect .auth-form-container {
        background: rgba(255, 255, 255, 0.015) !important;
        -webkit-backdrop-filter: blur(0.5px) saturate(170%) !important;
        backdrop-filter: blur(0.5px) saturate(170%) !important;
        border: 1px solid rgba(255, 255, 255, 0.15) !important;
    }
}

/* Mobile portrait - transparência máxima */
@media (max-width: 480px) {
    .glass-effect .auth-form-container {
        background: rgba(255, 255, 255, 0.01) !important;
        -webkit-backdrop-filter: blur(0.5px) saturate(160%) !important;
        backdrop-filter: blur(0.5px) saturate(160%) !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
    }
}

/* Inputs - vidro suave para legibilidade com blur mínimo */
.glass-effect .auth-field-input {
    background: rgba(255, 255, 255, 0.5) !important;
    -webkit-backdrop-filter: blur(1px) saturate(150%) !important;
    backdrop-filter: blur(1px) saturate(150%) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.glass-effect .auth-field-input:focus {
    background: rgba(255, 255, 255, 0.6) !important;
    -webkit-backdrop-filter: blur(1.5px) saturate(160%) !important;
    backdrop-filter: blur(1.5px) saturate(160%) !important;
    border: 1px solid rgba(59, 130, 246, 0.5) !important;
    box-shadow: 
        0 0 0 3px rgba(59, 130, 246, 0.1),
        inset 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* Labels com melhor contraste */
.glass-effect .auth-field-label {
    color: rgba(255, 255, 255, 0.95) !important;
    text-shadow: 
        0 1px 3px rgba(0, 0, 0, 0.5),
        0 0 20px rgba(0, 0, 0, 0.3) !important;
    font-weight: 500 !important;
}

/* Remove qualquer regra de dark mode que force opacidade */
@media (prefers-color-scheme: dark) {
    .glass-effect .auth-form-container {
        background: rgba(255, 255, 255, 0.02) !important;
    }
}

/* Efeito de reflexo de vidro */
.glass-effect .auth-form-container::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50%;
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.1) 0%,
        rgba(255, 255, 255, 0.05) 20%,
        transparent 50%
    );
    pointer-events: none;
    border-radius: 24px 24px 0 0;
}

/* Botão submit com vidro e blur mínimo */
.glass-effect .auth-submit-button {
    background: rgba(59, 130, 246, 0.8) !important;
    -webkit-backdrop-filter: blur(1px) !important;
    backdrop-filter: blur(1px) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.glass-effect .auth-submit-button:hover {
    background: rgba(59, 130, 246, 0.9) !important;
    -webkit-backdrop-filter: blur(2px) !important;
    backdrop-filter: blur(2px) !important;
    box-shadow: 
        0 4px 20px rgba(59, 130, 246, 0.4),
        0 0 40px rgba(59, 130, 246, 0.2) !important;
}