/* =========================================================================
   فرم‌ساز نابغه — Auth pages
   ========================================================================= */

.auth-wrap {
  min-height: 100vh; display: flex; align-items: stretch;
}
.auth-side {
  flex: 1; display: none; position: relative; overflow: hidden;
  background: linear-gradient(165deg, var(--ink) 0%, #1c2a1c 60%, #24331f 100%);
  padding: 56px; color: #F1EEE3;
}
html[data-theme="dark"] .auth-side { background: linear-gradient(165deg, #101815 0%, #16231d 60%, #1c2a20 100%); }
.auth-side::before {
  content: ''; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(0deg, transparent 0 38px, rgba(241,238,227,.05) 39px 40px),
                     repeating-linear-gradient(90deg, transparent 0 38px, rgba(241,238,227,.035) 39px 40px);
}
.auth-side-inner { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
.auth-badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(240,194,92,.14); color: #F0C25C; padding: 8px 16px; border-radius: var(--radius-pill); font-size: .78rem; font-weight: 700; width: fit-content; }
.auth-side h2 { font-size: 2rem; color: #fff; max-width: 420px; line-height: 1.5; margin-top: 22px; }
.auth-side p { color: rgba(241,238,227,.68); max-width: 380px; }
.auth-quote { border-right: 3px solid #F0C25C; padding-right: 16px; margin-top: 30px; }
.auth-quote b { color: #fff; display: block; margin-bottom: 4px; }

.auth-feature-list { display: flex; flex-direction: column; gap: 14px; margin-top: 26px; }
.auth-feature-list div { display: flex; align-items: center; gap: 12px; color: rgba(241,238,227,.85); font-size: .88rem; }
.auth-feature-list i { width: 34px; height: 34px; border-radius: 10px; background: rgba(240,194,92,.14); color: #F0C25C; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.auth-main { flex: 1; display: flex; align-items: center; justify-content: center; padding: 30px 20px; }
.auth-box { width: 100%; max-width: 400px; }
.auth-logo { display: flex; align-items: center; gap: 10px; justify-content: center; margin-bottom: 26px; }
.auth-logo img { width: 40px; height: 40px; border-radius: 12px; }
.auth-logo b { font-size: 1.15rem; }
.auth-box h1 { font-size: 1.4rem; text-align: center; margin-bottom: 6px; }
.auth-box .sub { text-align: center; color: var(--ink-faint); font-size: .87rem; margin-bottom: 26px; }

.auth-screen { display: none; }
.auth-screen.active { display: block; animation: fade-up .3s var(--ease-std); }
@keyframes fade-up { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.auth-foot-link { text-align: center; margin-top: 20px; font-size: .84rem; color: var(--ink-faint); }
.auth-foot-link a { color: var(--gold-deep); font-weight: 700; }
html[data-theme="dark"] .auth-foot-link a { color: var(--gold); }

.otp-timer { text-align: center; font-size: .8rem; color: var(--ink-faint); margin-top: 14px; }
.otp-timer button { color: var(--gold-deep); font-weight: 700; background: none; border: none; }
html[data-theme="dark"] .otp-timer button { color: var(--gold); }

.staff-badge { display: flex; align-items: center; gap: 10px; background: var(--violet-soft); color: var(--violet-deep); padding: 12px 16px; border-radius: var(--radius-sm); font-size: .8rem; margin-bottom: 22px; }
html[data-theme="dark"] .staff-badge { color: var(--violet); }

@media (min-width: 920px) { .auth-side { display: flex; } }