body { font-family: 'Inter', sans-serif; }
.glass { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); }
.mesh-bg {
    background-color: #f8fafc;
    background-image:
        radial-gradient(at 0% 0%, hsla(210,100%,93%,1) 0, transparent 50%),
        radial-gradient(at 100% 100%, hsla(210,100%,96%,1) 0, transparent 50%);
}

/* Dynamic Theme Overrides & Premium Styling */
.theme-primary-color { color: var(--site-primary) !important; }
.theme-primary-bg { background-color: var(--site-primary) !important; }
.theme-primary-bg-soft { background-color: var(--site-primary-soft) !important; }

/* Existing overrides for Tailwind's default blue classes */
.text-blue-600, .text-blue-700, .hover\:text-blue-600:hover {
    color: var(--site-primary) !important; 
}
.bg-blue-600, .bg-blue-500 {
    background-color: var(--site-primary) !important; 
}
.bg-blue-50 {
    background-color: var(--site-primary-soft) !important; 
}
.border-blue-100 {
    border-color: var(--site-primary) !important; 
    opacity: 0.3; 
}

/* New theme-aware input focus class */
.theme-primary-input-focus:focus {
    border-color: var(--site-primary) !important;
    box-shadow: 0 0 0 4px var(--site-primary-soft) !important;
    background-color: white !important;
    transform: translateY(-1px);
}

/* Input Premium Interaction */
.input-focus {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Text Selection */
::selection { 
    background-color: var(--site-primary); 
    color: white; 
}

/* New theme-aware button class */
.theme-btn-primary {
    background-color: var(--site-primary) !important;
    color: white !important;
    /* Existing hover/active styles from #btn_login, #btn_register will apply */
}

/* Premium Button Effects */
#btn_login, #btn_register {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    letter-spacing: 0.025em;
}

#btn_login:hover, #btn_register:hover { 
    filter: brightness(1.1); 
    transform: translateY(-2px);
    box-shadow: 0 12px 20px -8px var(--site-primary) !important;
}

#btn_login:active, #btn_register:active {
    transform: translateY(0) scale(0.98);
}

/* Form Transition Animation */
#loginForm, #registerForm {
    animation: premiumFadeIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes premiumFadeIn {
    from {
        opacity: 0;
        transform: translateY(15px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Premium Card Width Management */
#auth-container {
    width: 95%;
    margin: 0 auto;
    transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    backface-visibility: hidden;
}

/* Split Animation Classes */
#reveal-auth-btn.splitting #btn-part-top {
    transform: translateY(-100vh);
    opacity: 0;
}
#reveal-auth-btn.splitting #btn-part-bottom {
    transform: translateY(100vh);
    opacity: 0;
}

@media (min-width: 768px) {
    #auth-container.auth-wide {
        max-width: 740px !important; /* রেজিস্ট্রেশন মোডের জন্য নির্ধারিত সাইজ */
        width: 100% !important;
    }
}

/* Critical Loader CSS - Prevents Initial White Screen */
#page-loader {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    transition: opacity 0.5s ease, visibility 0.5s;
}
.loader-circle {
    width: 40px;
    height: 40px;
    border: 3px solid #f1f5f9;
    border-top-color: var(--site-primary);
    border-radius: 50%;
    animation: loader-spin 0.8s linear infinite;
}
@keyframes loader-spin { to { transform: rotate(360deg); } }
#page-loader.fade-out { opacity: 0; visibility: hidden; pointer-events: none; }

/* Keep content hidden until load */
body.loading > *:not(#page-loader) { opacity: 0; visibility: hidden; }