/* ============================================================
 * AUTH PAGES STYLES (login / signup / forgot / reset)
 * ============================================================ */

.auth-wrap{
  min-height:100vh; display:grid; grid-template-columns:1.1fr 1fr;
  background:var(--bg);
}
/* Left brand panel */
.auth-brand{
  position:relative; overflow:hidden; color:#fff; padding:3rem;
  display:flex; flex-direction:column; justify-content:space-between;
  background:linear-gradient(135deg,#1565C0 0%, #1E88E5 55%, #FF5722 130%);
}
.auth-brand::after{
  content:""; position:absolute; width:520px; height:520px; right:-160px; top:-120px;
  border:60px solid rgba(255,255,255,.08); border-radius:50%;
}
.auth-brand::before{
  content:""; position:absolute; width:340px; height:140px; left:-60px; bottom:40px;
  border:34px solid rgba(184,148,90,.35); border-radius:50%; transform:rotate(-20deg);
}
.auth-brand .logo-row{ display:flex; align-items:center; gap:.8rem; z-index:2; }
.auth-brand .logo-row img{ width:54px; height:54px; background:#fff; border-radius:12px; padding:4px; }
.auth-brand h1{ font-size:2.1rem; margin-top:1rem; z-index:2; }
.auth-brand p{ opacity:.92; max-width:420px; z-index:2; }
.auth-brand ul{ list-style:none; display:flex; flex-direction:column; gap:.7rem; z-index:2; margin-top:1rem; }
.auth-brand ul li{ display:flex; gap:.6rem; align-items:center; }
.auth-brand ul li i{ background:rgba(255,255,255,.2); width:30px; height:30px; border-radius:8px;
  display:grid; place-items:center; }
.auth-brand .foot{ font-size:.82rem; opacity:.8; z-index:2; }

/* Right form panel */
.auth-form-panel{ display:flex; align-items:center; justify-content:center; padding:2.5rem 1.5rem; overflow-y:auto; }
.auth-card{ width:100%; max-width:440px; animation:fadeUp .5s ease both; }
.auth-card.wide{ max-width:760px; }
.auth-card h2{ font-size:1.6rem; }
.auth-card .sub{ color:var(--text-soft); margin-bottom:1.4rem; }
.auth-logo-mobile{ display:none; text-align:center; margin-bottom:1rem; }
.auth-logo-mobile img{ width:64px; margin:0 auto; }

.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }

/* Password field with toggle */
.pw-wrap{ position:relative; }
.pw-wrap .input{ padding-right:2.8rem; }
.pw-toggle{ position:absolute; right:.6rem; top:50%; transform:translateY(-50%);
  background:none; border:none; cursor:pointer; color:var(--text-soft); font-size:1rem; }

/* Strength meter */
.pw-meter{ height:7px; background:var(--border); border-radius:999px; overflow:hidden; margin-top:.5rem; }
.pw-meter span{ display:block; height:100%; width:0; border-radius:999px; transition:width .3s, background .3s; }
.pw-meter-label{ font-size:.76rem; margin-top:.3rem; font-weight:600; }

.auth-row{ display:flex; justify-content:space-between; align-items:center; font-size:.86rem; margin:.4rem 0 1rem; }
.checkbox{ display:flex; align-items:center; gap:.45rem; cursor:pointer; }
.auth-foot{ text-align:center; margin-top:1.2rem; font-size:.9rem; color:var(--text-soft); }

@media (max-width: 900px){
  .auth-wrap{ grid-template-columns:1fr; }
  .auth-brand{ display:none; }
  .auth-logo-mobile{ display:block; }
  .grid2{ grid-template-columns:1fr; }
}