.auth-pattern-bg {
    background-image: url("../img/shattered.0f5bfbc17cf1.png");
    background-repeat: repeat;
    background-size: auto;
}

.auth-brand-logo {
    height: 56px;
}

/* Exceção para o checkbox customizado de "Lembrar-me" do login */
.auth-remember-checkbox {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 2.75rem !important;
    height: 1.5rem !important;
    border: 1px solid #d1d5db !important;
    border-radius: 9999px !important;
    background-color: #ffffff !important;
    cursor: pointer !important;
    transition: background-color 300ms ease !important;
    padding: 0 !important;
}

.auth-remember-checkbox:checked {
    background-color: #1e3a8a !important;
    border-color: #1e3a8a !important;
    background-image: none !important;
}

.auth-remember-checkbox:hover,
.auth-remember-checkbox:focus-visible {
    box-shadow: none !important;
    outline: none !important;
}

.auth-remember-checkbox:disabled {
    opacity: 1 !important;
    cursor: pointer !important;
}

/* Aurora / Login background */
.aurora-blob {
    will-change: transform, opacity, filter;
    transform-origin: center;
}

.animate-blob {
    animation: blobMove 12s infinite ease-in-out;
}

.animate-blob-delay {
    animation: blobMove 18s infinite ease-in-out;
}

@keyframes blobMove {
    0% { transform: translate3d(0,0,0) scale(1); opacity: .9; }
    25% { transform: translate3d(30px, -20px, 0) scale(1.05); opacity: .85; }
    50% { transform: translate3d(-20px, 20px, 0) scale(0.98); opacity: .9; }
    75% { transform: translate3d(15px, 30px, 0) scale(1.02); opacity: .92; }
    100% { transform: translate3d(0,0,0) scale(1); opacity: .9; }
}

.noise {
    background-image: radial-gradient(rgba(255,255,255,0.02) 1px, transparent 1px);
    background-size: 6px 6px;
    pointer-events: none;
}

/* Soften the main glow and add subtle vignette */
.aurora-glow {
    background: radial-gradient(ellipse at center, rgba(0,102,255,0.18) 0%, rgba(0,71,179,0.12) 40%, rgba(0,59,153,0.9) 100%);
}

/* Make blobs less intrusive on small screens */
@media (max-width: 768px) {
    .aurora-blob { opacity: .6; }
    .animate-blob, .animate-blob-delay { animation-duration: 14s; }
}
