/* ============================================================================
   EngageHub — Authentication screens
   ========================================================================== */

.auth-body { background: var(--bg); }
.auth-split { display: grid; grid-template-columns: 1.1fr 1fr; min-height: 100vh; }

/* ---- Promo panel ---------------------------------------------------------- */
.auth-promo {
    position: relative; overflow: hidden;
    background: linear-gradient(150deg, #4f46e5 0%, #7c3aed 45%, #db2777 100%);
    color: #fff; padding: 3rem 3.5rem; display: flex; flex-direction: column;
}
.auth-promo__glow { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .55; }
.auth-promo__glow--1 { width: 420px; height: 420px; background: #ec4899; top: -120px; right: -80px; }
.auth-promo__glow--2 { width: 380px; height: 380px; background: #6366f1; bottom: -140px; left: -100px; }
.auth-promo__brand { display: flex; align-items: center; gap: .7rem; font-family: var(--font-sans); font-weight: 800; font-size: 1.3rem; position: relative; z-index: 1; }
.auth-promo__brand .sidebar__logo { background: rgba(255,255,255,.16); backdrop-filter: blur(6px); box-shadow: none; }
.auth-promo__content { margin-top: auto; margin-bottom: auto; position: relative; z-index: 1; max-width: 480px; }
.auth-promo__content h1 { font-size: 2.6rem; line-height: 1.12; margin-bottom: 1.1rem; }
.auth-promo__content h1 em { font-style: normal; background: linear-gradient(90deg,#fde68a,#fbcfe8); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.auth-promo__content > p { font-size: 1.02rem; opacity: .9; line-height: 1.65; }
.auth-promo__features { margin-top: 1.8rem; display: flex; flex-direction: column; gap: .8rem; }
.auth-promo__features li { display: flex; align-items: center; gap: .7rem; font-weight: 500; opacity: .95; }
.auth-promo__features i { color: #6ee7b7; font-size: 1.2rem; }

.auth-promo__wheel { position: absolute; right: -120px; bottom: -120px; z-index: 0; }
.mini-wheel { width: 340px; height: 340px; border-radius: 50%; position: relative; border: 10px solid rgba(255,255,255,.12); animation: slowspin 22s linear infinite; overflow: hidden; }
.mini-wheel span { position: absolute; top: 0; left: 50%; width: 50%; height: 50%; transform-origin: left bottom; background: rgba(255,255,255,.06); border-left: 1px solid rgba(255,255,255,.1); }
.mini-wheel span:nth-child(odd) { background: rgba(255,255,255,.12); }
@keyframes slowspin { to { transform: rotate(360deg); } }

/* ---- Form panel ----------------------------------------------------------- */
.auth-form-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2.5rem; position: relative; }
.auth-theme { position: absolute; top: 1.5rem; right: 1.5rem; }
.auth-card { width: 100%; max-width: 420px; }
.auth-card__head { text-align: center; margin-bottom: 1.8rem; }
.auth-card__head h2 { font-size: 1.8rem; margin-bottom: .4rem; }
.auth-card__head p { color: var(--text-muted); }
.auth-copy { margin-top: 2rem; color: var(--text-muted); font-size: .82rem; }
.auth-alt { text-align: center; margin-top: 1.5rem; color: var(--text-soft); font-size: .9rem; }
.auth-alt a { color: var(--brand); font-weight: 600; }
.auth-divider { display: flex; align-items: center; gap: 1rem; margin: 1.5rem 0; color: var(--text-muted); font-size: .82rem; }
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.auth-forgot { text-align: right; margin-top: -.6rem; margin-bottom: 1rem; }
.auth-forgot a { color: var(--brand); font-size: .84rem; font-weight: 500; }

.demo-hint { background: var(--gradient-brand-soft); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: .8rem 1rem; font-size: .82rem; color: var(--text-soft); margin-bottom: 1.4rem; display: flex; gap: .6rem; align-items: center; }
.demo-hint i { color: var(--brand); font-size: 1.1rem; }
.demo-hint b { color: var(--text); }

@media (max-width: 900px) {
    .auth-split { grid-template-columns: 1fr; }
    .auth-promo { display: none; }
    .auth-form-wrap { min-height: 100vh; }
}