/* ============================================================================ Login Page ============================================================================ */ .admin-login { min-height: 100vh; min-height: 100dvh; max-height: 100vh; max-height: 100dvh; display: flex; align-items: center; justify-content: center; padding: 1rem; background: var(--bg-primary); position: relative; overflow: hidden; box-sizing: border-box; } .admin-login .bg-orb { position: absolute; border-radius: 50%; filter: blur(80px); pointer-events: none; } .admin-login .bg-orb-1 { width: 400px; height: 400px; background: var(--orb-color-1); top: 10%; left: 20%; animation: float 20s ease-in-out infinite; } .admin-login .bg-orb-2 { width: 320px; height: 320px; background: var(--orb-color-2); bottom: 20%; right: 15%; animation: float 25s ease-in-out infinite reverse; } .admin-login-theme-btn { position: absolute; top: 1rem; right: 1rem; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; background: var(--glass-bg); backdrop-filter: blur(10px); border: 1px solid var(--glass-border); color: var(--text-secondary); cursor: pointer; border-radius: 50%; overflow: hidden; transition: var(--transition); z-index: 10; } .admin-login-theme-btn:hover { background: var(--glass-bg-solid); color: var(--text-primary); border-color: var(--border-color-hover); transform: scale(1.05); } .admin-login-card { width: 100%; max-width: 420px; max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); padding: 2rem; background: var(--glass-bg); backdrop-filter: blur(20px); border: 1px solid var(--glass-border); border-radius: var(--border-radius-lg); box-shadow: var(--glass-shadow); position: relative; z-index: 1; overflow-y: auto; } @media (min-width: 640px) { .admin-login-card { padding: 2.5rem; } } .admin-login-header { text-align: center; margin-bottom: 2rem; } .admin-login-logo { height: 48px; width: auto; margin-bottom: 1rem; } .admin-login-2fa-icon { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%; background: var(--accent-light); color: var(--accent-color); margin-bottom: 1rem; } .admin-login-title { font-size: 1.5rem; font-weight: 700; color: var(--text-primary); font-family: var(--font-heading); margin-bottom: 0.5rem; } .admin-login-subtitle { color: var(--text-secondary); font-size: 0.95rem; } .admin-back-link { color: var(--text-secondary); text-decoration: none; font-size: 0.875rem; transition: var(--transition); margin-top: 1.5rem; display: inline-block; } .admin-back-link:hover { color: var(--text-primary); text-decoration: underline; }