/* =====================================================================
   Auth pages — login / register / forgot / reset
   ===================================================================== */
.auth-page{
  display:flex; align-items:center; justify-content:center; min-height:100vh;
  padding:1.5rem;
  background:linear-gradient(135deg,#2563eb 0%,#1e40af 100%);
}
.auth-card{
  background:#fff; padding:2rem; border-radius:16px; width:100%; max-width:400px;
  box-shadow:0 20px 50px rgba(0,0,0,.25); animation:authIn .35s ease;
}
.auth-card-wide{ max-width:640px; }
@keyframes authIn{ from{opacity:0; transform:translateY(12px);} to{opacity:1; transform:none;} }

.auth-logo{ text-align:center; margin-bottom:1.25rem; }
.auth-logo h4{ margin:.5rem 0 .1rem; font-weight:700; color:#0f172a; }
.auth-logo p{ color:#64748b; font-size:.85rem; margin:0; }

/* input groups with icons */
.auth-card .input-group-text{ background:#f8fafc; border-right:0; color:#64748b; }
.auth-card .form-control{ border-left:0; }
.auth-card .input-group:focus-within .input-group-text{ border-color:#86b7fe; }
.pw-toggle{ cursor:pointer; background:#f8fafc; border-left:0; color:#64748b; }

/* button loading state */
.btn-loading{ position:relative; pointer-events:none; opacity:.85; }
.btn-loading .spinner-border{ width:1rem; height:1rem; }

/* password strength meter */
.pw-meter{ height:6px; border-radius:3px; background:#e5e7eb; overflow:hidden; margin-top:.4rem; }
.pw-meter span{ display:block; height:100%; width:0; transition:width .25s, background .25s; }
.pw-hint{ font-size:.78rem; margin-top:.35rem; }
.pw-req{ font-size:.78rem; color:#64748b; margin-top:.4rem; }
.pw-req li.ok{ color:#16a34a; }
.pw-req li.ok i::before{ content:"\f00c"; } /* fa-check */

/* multi-step wizard */
.stepper{ display:flex; justify-content:space-between; margin-bottom:1.5rem; }
.stepper .step{ flex:1; text-align:center; position:relative; color:#94a3b8; font-size:.8rem; }
.stepper .step .dot{
  width:32px; height:32px; border-radius:50%; background:#e2e8f0; color:#64748b;
  display:flex; align-items:center; justify-content:center; margin:0 auto .35rem; font-weight:600;
}
.stepper .step.active .dot{ background:#2563eb; color:#fff; }
.stepper .step.done .dot{ background:#16a34a; color:#fff; }
.stepper .step:not(:last-child)::after{
  content:""; position:absolute; top:16px; left:50%; width:100%; height:2px; background:#e2e8f0; z-index:0;
}
.stepper .step.done:not(:last-child)::after{ background:#16a34a; }
