/* OVLoud - Auth Pages */
.auth-wrapper {
    min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: var(--bg-primary); padding: var(--space-6);
    position: relative; overflow: hidden;
}

.auth-wrapper::before {
    content: ''; position: absolute; width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(124,92,252,0.15) 0%, transparent 70%);
    top: -200px; right: -200px; pointer-events: none;
}

.auth-wrapper::after {
    content: ''; position: absolute; width: 500px; height: 500px;
    background: radial-gradient(circle, rgba(0,212,255,0.1) 0%, transparent 70%);
    bottom: -150px; left: -150px; pointer-events: none;
}

.auth-card {
    width: 100%; max-width: 440px; background: var(--bg-secondary);
    border: 1px solid var(--border); border-radius: var(--radius-xl);
    padding: var(--space-10); position: relative; z-index: 1;
    box-shadow: var(--shadow-xl); animation: scaleIn 0.4s ease;
}

.auth-logo { text-align: center; margin-bottom: var(--space-8); }
.auth-logo .logo-icon {
    width: 56px; height: 56px; margin: 0 auto var(--space-4);
    background: var(--accent-gradient); border-radius: var(--radius-lg);
    display: flex; align-items: center; justify-content: center;
    font-weight: var(--font-extrabold); font-size: var(--text-2xl); color: white;
    box-shadow: var(--shadow-glow);
}

.auth-logo h1 {
    font-family: var(--font-display); font-size: var(--text-2xl);
    background: var(--accent-gradient); -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; background-clip: text;
}

.auth-logo p { color: var(--text-tertiary); font-size: var(--text-sm); margin-top: var(--space-2); }

.auth-form .form-group { margin-bottom: var(--space-5); }

.auth-form .form-input {
    padding: 13px 16px; background: var(--bg-tertiary); border-radius: var(--radius-md);
}

.auth-remember {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: var(--space-6);
}

.auth-remember a { font-size: var(--text-sm); color: var(--accent-primary); }

.auth-footer {
    text-align: center; margin-top: var(--space-6); padding-top: var(--space-6);
    border-top: 1px solid var(--border); font-size: var(--text-sm); color: var(--text-secondary);
}

.auth-footer a { color: var(--accent-primary); font-weight: var(--font-semibold); }

.auth-divider {
    display: flex; align-items: center; gap: var(--space-4);
    margin: var(--space-6) 0; color: var(--text-tertiary); font-size: var(--text-sm);
}

.auth-divider::before, .auth-divider::after {
    content: ''; flex: 1; height: 1px; background: var(--border);
}

.password-strength { margin-top: var(--space-2); }
.password-strength .strength-bar {
    height: 4px; background: var(--bg-hover); border-radius: var(--radius-full); overflow: hidden;
}
.password-strength .strength-fill {
    height: 100%; border-radius: var(--radius-full); transition: all var(--transition-base);
}
.password-strength .strength-text { font-size: var(--text-xs); margin-top: var(--space-1); }
.strength-weak .strength-fill { width: 25%; background: var(--error); }
.strength-fair .strength-fill { width: 50%; background: var(--warning); }
.strength-good .strength-fill { width: 75%; background: var(--info); }
.strength-strong .strength-fill { width: 100%; background: var(--success); }