body { font-family: 'Inter', sans-serif; }

/* PERFORMANCE FIX: 
   - Separated .auth-content from .view. 
   - Removed display: none from .auth-content to allow immediate rendering of the login form.
*/
.view { display: none; animation: fadeIn 0.5s; }
.auth-content { animation: fadeIn 0.5s; }

/* PERFORMANCE FIX: 
   - Explicitly hide secondary authentication views by default.
   - This ensures #login-content (which is not in this list) shows up immediately.
*/
#forgot-password-content,
#forgot-confirm-content,
#reset-password-content,
#reset-success-content {
    display: none;
}

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

#sidebar { transition: width 0.3s ease-in-out; }
#main-content { transition: padding-left 0.3s ease-in-out; }

.sidebar-collapsed #sidebar { width: 5rem; }
.sidebar-collapsed #main-content { padding-left: 5rem; }
.sidebar-collapsed .sidebar-text, .sidebar-collapsed .sidebar-profile-details { display: none; }
.sidebar-collapsed .sidebar-brand-full { display: none; }
.sidebar-collapsed .sidebar-brand-collapsed { display: flex; }
.sidebar-collapsed .sidebar-link { justify-content: center; }
.sidebar-collapsed .sidebar-link ion-icon { margin-right: 0; }
.sidebar-collapsed .sidebar-logout { justify-content: center; }
.sidebar-collapsed .sidebar-profile-link { justify-content: center; }

.sidebar-brand-collapsed { display: none; }

@media (max-width: 1024px) {
    #sidebar {
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;
        position: fixed;
        width: 16rem;
    }
    #main-content { padding-left: 0; }
    .sidebar-open #sidebar { transform: translateX(0); }
    .sidebar-collapsed #sidebar { width: 16rem; }
    .sidebar-collapsed #main-content { padding-left: 0; }
    .sidebar-collapsed .sidebar-text, .sidebar-collapsed .sidebar-profile-details { display: block; }
    .sidebar-collapsed .sidebar-brand-full { display: flex; }
    .sidebar-collapsed .sidebar-brand-collapsed { display: none; }
    .sidebar-collapsed .sidebar-link { justify-content: flex-start; }
    .sidebar-collapsed .sidebar-link ion-icon { margin-right: 1rem; }
}