/* ==========================================================================
   Persona sign-in / forgot / reset password - v2 UI (matches dashboard-v2.css)
   Skin only. Scope: <body class="login_page pn-auth"> on index.cfm, reset.cfm,
   resetPassword.cfm. Load AFTER loginNew.css and ul-theme-v2.css.
   ========================================================================== */

.pn-auth{
  --ink:#1E2A38; --muted:#535D6B; --cream:#F7F5F1; --surface:#FBFAF7; --field:#FFFFFF;
  --border:#E4E0D8; --field-line:#CDD3DD; --icon:#6B7380;
  --action:#B4532F; --action-h:#9A472A; --focus:#F0B79F;
  --sans:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
}

/* ---------- Page + card ---------- */
html body.pn-auth{background:var(--cream)!important;color:var(--ink);font-family:var(--sans)!important;-webkit-font-smoothing:antialiased}
html body.pn-auth .account_signin{min-height:100vh;background:var(--cream)!important;background-image:none!important;padding:32px 16px;box-sizing:border-box}
html body.pn-auth .login_wrapper{
  width:480px!important;max-width:100%!important;padding:48px 48px 44px!important;box-sizing:border-box;
  background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:20px!important;
  box-shadow:0 1px 2px rgba(30,42,56,.04),0 24px 48px -32px rgba(30,42,56,.22)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html body.pn-auth .login_wrapper :is(p,span,a,button,input,label){font-family:var(--sans)!important}

/* ---------- Logo ---------- */
html body.pn-auth .login_logo{margin:0 0 28px!important}
html body.pn-auth .login_logo img{height:48px!important;width:auto!important;margin:0!important;filter:none!important}

/* ---------- Heading ---------- */
html body.pn-auth .pn-auth-head{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;margin:0 0 24px}
html body.pn-auth .pn-eyebrow{font:600 13px/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--action)!important}
html body.pn-auth .pn-auth-title{margin:0;font:700 30px/1.08 var(--sans);letter-spacing:-.025em;color:var(--ink)!important}
html body.pn-auth .pn-auth-title em{font:inherit;font-style:normal;color:var(--action)}
html body.pn-auth .login_wrapper p.pn-auth-sub{margin:0;font:400 15px/1.45 var(--sans);color:var(--muted)!important}
html body.pn-auth .login_wrapper .email-txtii{font:400 15px/1.45 var(--sans)!important;color:var(--muted)!important;text-align:center;margin:0 0 24px!important}
html body.pn-auth .login_wrapper .pn-auth-head ~ .email-txtii{margin-top:-12px!important}

/* ---------- Fields ---------- */
html body.pn-auth .login_wrapper .form-group{margin-bottom:0}
html body.pn-auth .login_wrapper .signin_fields .row{margin:0}
html body.pn-auth .login_wrapper .signin_fields .row>[class*=col]{padding:0}
html body.pn-auth .login_wrapper :is(.email-field,.password-field){position:relative;margin-bottom:14px!important}
html body.pn-auth .login_wrapper :is(.email-field,.password-field,.otp-field) input.form-control,
html body.pn-auth .login_wrapper :is(.email-field,.password-field,.otp-field) input.form-control:is(:focus,:valid){
  height:52px;margin:0!important;padding:12px 16px 12px 46px!important;
  background:var(--field)!important;border:1px solid var(--field-line)!important;border-radius:12px!important;
  color:var(--ink)!important;font:400 16px/1.4 var(--sans)!important;box-shadow:none!important}
html body.pn-auth .login_wrapper .password-field input.form-control{padding-right:52px!important}
html body.pn-auth .login_wrapper .otp-field input.form-control{padding-left:16px!important;text-align:center;letter-spacing:.25em}
html body.pn-auth .login_wrapper input.form-control::placeholder{color:var(--icon)!important;opacity:1}
html body.pn-auth .login_wrapper input.form-control:focus{border-color:var(--action)!important;outline:2px solid var(--focus)!important;outline-offset:0}
html body.pn-auth input:-webkit-autofill,
html body.pn-auth input:-webkit-autofill:is(:focus,:active){-webkit-box-shadow:0 0 0 1000px #fff inset!important;box-shadow:0 0 0 1000px #fff inset!important;-webkit-text-fill-color:var(--ink)!important}

/* line icons (replace the old filled green email/lock images) */
html body.pn-auth :is(.email-field,.password-field)::before{
  content:"";position:absolute;left:16px;top:50%;bottom:auto;transform:translateY(-50%);width:18px;height:18px;z-index:2;pointer-events:none;
  background-position:center;background-repeat:no-repeat;background-size:18px 18px}
html body.pn-auth .email-field::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7380' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2.5'/%3E%3Cpath d='M4 7l8 6 8-6'/%3E%3C/svg%3E")}
html body.pn-auth .password-field::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7380' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E")}

/* show / hide (eye image on sign-in, "Show" text on reset password) */
html body.pn-auth .show_hide{right:16px!important;top:50%!important;transform:translateY(-50%)!important;margin:0!important;line-height:0;color:var(--action)!important;font:600 14px/1 var(--sans)!important}
html body.pn-auth .show_hide img{width:20px;height:20px;opacity:.75}
html body.pn-auth .show_hide:hover img{opacity:1}

/* forgot password link */
html body.pn-auth .login_wrapper .form-group.text-end{margin-top:2px}
html body.pn-auth .login_wrapper .form-group a{color:var(--action)!important;font:600 14px/1.4 var(--sans)!important;text-decoration:none!important}
html body.pn-auth .login_wrapper .form-group a:hover{color:var(--action-h)!important;text-decoration:underline!important;text-underline-offset:3px}

/* ---------- CTA ---------- */
html body.pn-auth .submit_btn{margin-top:28px!important;display:block!important;width:100%!important;place-self:stretch!important;justify-self:stretch!important}
html body.pn-auth .login_wrapper .primary_cta{
  display:block;width:100%!important;max-width:none!important;height:52px;padding:0 24px!important;border:0!important;border-radius:999px!important;
  background:var(--action)!important;color:#fff!important;font:600 16px/1 var(--sans)!important;letter-spacing:0;
  box-shadow:none!important;transition:background-color .15s ease}
html body.pn-auth .login_wrapper .primary_cta:hover,html body.pn-auth .login_wrapper .primary_cta:focus-visible{background:var(--action-h)!important}
html body.pn-auth .login_wrapper .primary_cta:disabled{opacity:.55;cursor:not-allowed}

/* ---------- Messages / OTP ---------- */
html body.pn-auth .submit_msg{justify-content:center;margin:0!important;padding:0!important;min-height:0!important}
html body.pn-auth .submit_msg .message:not(:empty){margin:0 0 16px;font:500 14px/1.4 var(--sans)}
html body.pn-auth :is(.otp-timer,.otp-resend){color:var(--muted)!important;font-family:var(--sans)!important}
html body.pn-auth .otp-resend{background:none;border:0;display:block;margin:12px auto 0;font-weight:600}
html body.pn-auth .otp-resend:not(:disabled){color:var(--action)!important}

/* ---------- Mobile ---------- */
@media (max-width:575.98px){
  html body.pn-auth .account_signin{align-items:center!important;justify-content:center!important;min-height:100vh;min-height:100svh;padding:24px 16px}
  html body.pn-auth .login_wrapper{padding:32px 20px 28px!important;border-radius:16px!important}
  html body.pn-auth .login_logo{margin-bottom:22px!important}
  html body.pn-auth .login_logo img{height:40px!important}
  html body.pn-auth .pn-auth-title{font-size:26px}
}
