/* =========================================================
   ORILYT — AUTH EXTRAS (login/verify/forgot/reset)
   Moved from inline <style> + inline style= replacements
   Depends on: assets/css/auth.css
   ========================================================= */

/* Password toggle */
.pw-wrap{ position:relative; }
.pw-wrap input{ padding-right:48px; }

.pw-toggle{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  border:0;
  background:transparent;
  padding:6px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  opacity:.85;
}

.pw-toggle:focus{
  outline: none;
  border-color: rgba(79,70,229,.55);
  border-radius:10px;
}

/* Links row under password */
.auth-links-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:10px;
  font-size: var(--font-size-xs);
}

.auth-links-row a{
  color: var(--muted);
  text-decoration:none;
}
.auth-links-row a:hover{ text-decoration:underline; }

/* Pending verify block (replaces inline styles) */
.auth-pending-actions{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.auth-btn-inline{
  display:inline-flex;
  text-decoration:none;
  justify-content:center;
}

.auth-form-reset{ margin:0; }
.auth-btn-full{ width:100%; }
.auth-hint-tight{ margin-top:-4px; }

/* Utility for hiding (replaces svg style="display:none") */
.is-hidden{ display:none !important; }

/* =========================================================
   Forgot password — submit overlay (moved from <style>)
   ========================================================= */

.audit-overlay{
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,.55);
  display: flex;
  align-items: center;
  justify-content: center;
}
.audit-overlay.is-hidden{ display:none; }

.audit-overlay-box{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
  padding:32px 36px;
  border-radius:16px;
  background:#fff;
  border:1px solid rgba(15,23,42,.10);
  box-shadow:0 20px 40px rgba(15,23,42,.12);
  text-align:center;
}

.audit-overlay-text{
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--orilyt-title, #1D2939);
}
.audit-overlay-text small{
  display:block;
  margin-top:6px;
  font-size: var(--font-size-xs);
  font-weight:500;
  color: var(--orilyt-muted, #747487);
}

.audit-spinner{
  width:42px;
  height:42px;
  border-radius:50%;
  border:3px solid rgba(15,23,42,.15);
  border-top-color: var(--orilyt-primary, #4F46E5);
  animation:audit-spin .9s linear infinite;
}
@keyframes audit-spin{ to{ transform:rotate(360deg);} }

/* inline replacement */
.auth-mt-12{ margin-top:12px; }

/* =========================================================
   Reset password — strength meter + toggle buttons
   ========================================================= */

.pw-meter { margin-top: 8px; }

.pw-bar{
  height: 8px;
  border-radius: 999px;
  background: rgba(148,163,184,0.25);
  overflow: hidden;
}

.pw-bar > div{
  height: 100%;
  width: 0%;
  background: #ef4444;
  transition: width .2s ease, background .2s ease;
}

.pw-note{
  font-size: var(--font-size-xs);
  margin-top: 6px;
  color: var(--muted);
}
.pw-note.weak { color: #ef4444; }
.pw-note.ok { color: #f59e0b; }
.pw-note.good { color: #22c55e; }

/* Override pw-wrap for reset screen (slightly different than login) */
.pw-wrap { position: relative; }
.pw-wrap input { padding-right: 46px; }

.pw-toggle{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 1px solid rgba(148,163,184,0.35);
  background: rgba(255,255,255,0.06);
  color: inherit;
  cursor: pointer;
}

.pw-toggle:focus{
  outline: none;
  border-color: rgba(79,70,229,0.55);
}

.pw-toggle svg{ width: 18px; height: 18px; }

/* inline replacements for reset success block */
.auth-mt-10{ margin-top:10px; }