/* Barkodsal authentication — clean, focused and consistent with the homepage. */
body.auth-page{
  --auth-navy:#172554;
  --auth-text:#25324a;
  --auth-muted:#667085;
  --auth-line:#dfe5f2;
  --auth-indigo:#4f46f5;
  --auth-gradient:linear-gradient(135deg,#2563ff 0%,#4f46f5 55%,#7c2df3 100%);
  min-height:100dvh!important;
  background:#fbfbff!important;
  background-image:radial-gradient(circle at 14% 20%,rgba(37,99,255,.08),transparent 28%),radial-gradient(circle at 88% 82%,rgba(124,45,243,.07),transparent 30%),linear-gradient(180deg,#fbfbff,#fff)!important;
  color:var(--auth-text)!important;
}
body.auth-page .auth-shell,body.auth-page .auth-shell-register{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:calc(100dvh - 72px)!important;
  padding:42px 24px 54px!important;
  background:transparent!important;
  background-image:none!important;
}
body.auth-page .auth-card.auth-card-centered{
  position:relative!important;
  display:block!important;
  width:min(560px,100%)!important;
  min-height:0!important;
  margin:0 auto!important;
  overflow:hidden!important;
  border:1px solid rgba(207,214,238,.96)!important;
  border-radius:26px!important;
  background:#fff!important;
  box-shadow:none!important;
  transform:none!important;
}
body.auth-register-page .auth-card.auth-card-centered-register{width:min(940px,100%)!important}
body.auth-page .auth-card.auth-card-centered::before{
  content:"";
  position:absolute;
  z-index:2;
  inset:0 0 auto;
  height:5px;
  background:var(--auth-gradient);
}
body.auth-page .auth-card-centered .auth-form-panel,
body.auth-page .auth-card-centered .auth-form-panel-register,
body.auth-page .auth-card-centered .auth-form-panel-no-heading{
  position:relative!important;
  display:block!important;
  min-height:0!important;
  max-height:none!important;
  padding:42px 46px 38px!important;
  overflow:visible!important;
  border:0!important;
  background:#fff!important;
  background-image:none!important;
  color:var(--auth-text)!important;
}
body.auth-register-page .auth-card-centered .auth-form-panel-register{padding:38px 44px 34px!important}
body.auth-page .auth-card-centered .auth-form-panel>*{width:100%!important;max-width:none!important}
body.auth-page .auth-back{
  position:static!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  width:max-content!important;
  margin:0 0 28px!important;
  padding:8px 11px!important;
  border:1px solid #e0e5f2!important;
  border-radius:10px!important;
  background:#f8f9ff!important;
  color:#4f46f5!important;
  font-size:.82rem!important;
  font-weight:750!important;
  text-decoration:none!important;
  transition:.18s ease!important;
}
body.auth-page .auth-back:hover{border-color:#b8c2fb!important;background:#eef1ff!important;color:#4338ca!important;transform:translateX(-2px)!important}
body.auth-page .auth-form{gap:16px!important}
body.auth-page .auth-register-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px 18px!important}
body.auth-page .auth-label{
  display:block!important;
  margin:0 0 7px!important;
  color:var(--auth-navy)!important;
  font-size:.82rem!important;
  font-weight:800!important;
  letter-spacing:.005em!important;
  text-shadow:none!important;
}
body.auth-page .auth-input-wrap{position:relative!important}
body.auth-page .auth-input-wrap>i{
  position:absolute!important;
  z-index:2!important;
  top:26px!important;
  left:16px!important;
  width:20px!important;
  transform:translateY(-50%)!important;
  color:#687bf0!important;
  font-size:1rem!important;
  text-align:center!important;
  pointer-events:none!important;
}

/* Validation messages are inserted inside the wrapper. Keep the icon centred
   on the fixed-height control instead of the wrapper's changing total height. */
body.auth-page .auth-input-wrap>.field-error{
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:6px 0 0!important;
  padding:0!important;
}
body.auth-page .auth-input-wrap>.field-error[hidden]{display:none!important}
body.auth-page .verification-resend-link{display:inline-block;margin-top:8px;color:#315bea!important;font-weight:800;text-decoration:underline;text-underline-offset:3px}
body.auth-page .auth-form .form-control,body.auth-page .auth-form .form-select{
  width:100%!important;
  min-height:52px!important;
  padding:12px 15px!important;
  border:1px solid #d8deeb!important;
  border-radius:13px!important;
  background:#fff!important;
  color:var(--auth-text)!important;
  -webkit-text-fill-color:var(--auth-text)!important;
  font-size:.92rem!important;
  box-shadow:0 1px 2px rgba(16,24,40,.02)!important;
  color-scheme:light!important;
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease!important;
}
body.auth-page .auth-input-wrap .form-control{padding-left:48px!important}
body.auth-page .auth-form .form-control:hover,body.auth-page .auth-form .form-select:hover{border-color:#bdc7e4!important}
body.auth-page .auth-form .form-control:focus,body.auth-page .auth-form .form-select:focus{
  border-color:#7184f2!important;
  background:#fff!important;
  box-shadow:0 0 0 4px rgba(79,70,245,.11)!important;
  outline:0!important;
}
body.auth-page .auth-form .form-control::placeholder{color:#98a2b3!important;-webkit-text-fill-color:#98a2b3!important;opacity:1!important}
body.auth-page .auth-form .form-select:disabled,body.auth-page .auth-form .form-control:read-only{
  border-color:#e2e6ef!important;
  background:#f5f7fb!important;
  color:#667085!important;
  -webkit-text-fill-color:#667085!important;
  opacity:1!important;
}
body.auth-page .auth-form .form-select option{background:#fff!important;color:#25324a!important}
body.auth-page .auth-options{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;margin:2px 0 0!important;color:var(--auth-muted)!important;font-size:.82rem!important}
body.auth-page .auth-options label,body.auth-page .auth-agreement label{display:flex!important;align-items:flex-start!important;gap:9px!important;margin:0!important;cursor:pointer!important}
body.auth-page input[type="checkbox"]{width:17px!important;height:17px!important;margin-top:1px!important;accent-color:#4f46f5!important}
body.auth-page .forgot-password-link,body.auth-page .auth-switch a,body.auth-page .auth-agreement a{color:#4f46f5!important;font-weight:800!important;text-decoration:none!important}
body.auth-page .forgot-password-link:hover,body.auth-page .auth-switch a:hover,body.auth-page .auth-agreement a:hover{color:#4338ca!important;text-decoration:underline!important;text-underline-offset:3px!important}
body.auth-page .auth-submit{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:54px!important;
  margin-top:2px!important;
  padding:12px 18px!important;
  border:1px solid #4f46f5!important;
  border-radius:13px!important;
  background:var(--auth-gradient)!important;
  color:#fff!important;
  font-size:.96rem!important;
  font-weight:850!important;
  box-shadow:0 12px 26px rgba(79,70,245,.24)!important;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease!important;
}
body.auth-page .auth-submit:hover,body.auth-page .auth-submit:focus-visible{filter:brightness(.96)!important;transform:translateY(-1px)!important;box-shadow:0 16px 32px rgba(79,70,245,.30)!important}
body.auth-page .auth-submit:disabled{opacity:.72!important;transform:none!important;cursor:wait!important}
body.auth-page .auth-submit span{color:#fff!important}
body.auth-page .auth-divider{display:flex!important;align-items:center!important;gap:13px!important;margin:20px 0!important;color:#98a2b3!important;font-size:.72rem!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.08em!important}
body.auth-page .auth-divider::before,body.auth-page .auth-divider::after{content:""!important;flex:1!important;height:1px!important;background:#e3e7f0!important}
body.auth-page .google-auth-button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:11px!important;
  min-height:52px!important;
  padding:11px 16px!important;
  border:1px solid #d8deeb!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#25324a!important;
  font-size:.9rem!important;
  font-weight:800!important;
  text-decoration:none!important;
  box-shadow:0 5px 16px rgba(30,41,89,.06)!important;
  transition:.18s ease!important;
}
body.auth-page .google-auth-button:hover{border-color:#b8c2fb!important;background:#f8f9ff!important;color:#172554!important;transform:translateY(-1px)!important;box-shadow:0 10px 24px rgba(30,41,89,.10)!important}
body.auth-page .google-auth-button svg{width:21px!important;height:21px!important;flex:0 0 21px!important}
body.auth-page .auth-switch{margin:20px 0 0!important;color:var(--auth-muted)!important;font-size:.85rem!important;text-align:center!important}
body.auth-register-page .auth-switch{margin-top:17px!important}
body.auth-page .auth-agreement{padding:12px 14px!important;border:1px solid #e1e6f2!important;border-radius:12px!important;background:#f8f9ff!important;color:#667085!important;font-size:.79rem!important;line-height:1.55!important}
body.auth-page .google-auth-notice,body.auth-page .reset-login-success{margin:0 0 18px!important;border-radius:12px!important}
body.auth-page #errorBox{padding:11px 13px!important;border-radius:11px!important;font-size:.84rem!important;font-weight:700!important}
@media(max-width:767px){body.auth-page .auth-shell,body.auth-page .auth-shell-register{align-items:flex-start!important;padding:24px 14px 36px!important}body.auth-page .auth-card.auth-card-centered{border-radius:21px!important}body.auth-page .auth-card-centered .auth-form-panel,body.auth-page .auth-card-centered .auth-form-panel-register,body.auth-page .auth-card-centered .auth-form-panel-no-heading{padding:30px 22px 28px!important}body.auth-page .auth-register-grid{grid-template-columns:1fr!important;gap:14px!important}body.auth-page .auth-field-wide{grid-column:auto!important}body.auth-page .auth-options{align-items:flex-start!important;flex-direction:column!important;gap:11px!important}}
@media(max-width:420px){body.auth-page .auth-card-centered .auth-form-panel,body.auth-page .auth-card-centered .auth-form-panel-register,body.auth-page .auth-card-centered .auth-form-panel-no-heading{padding-inline:17px!important}body.auth-page .auth-back{margin-bottom:22px!important}}


/* 2026-09-08: login/register cards use one continuous neutral border; no gradient top strip. */
body.auth-login-page .auth-card.auth-card-centered::before,
body.auth-register-page .auth-card.auth-card-centered::before{content:none!important;display:none!important;}
body.auth-login-page .auth-card.auth-card-centered,
body.auth-register-page .auth-card.auth-card-centered{border-top:1px solid rgba(207,214,238,.96)!important;}


/* v20: keep auth fields white in hover/focus/autofill states */
body.auth-page .auth-input-wrap:hover > .form-control,
body.auth-page .auth-input-wrap:focus-within > .form-control,
body.auth-page .auth-form input.form-control:hover,
body.auth-page .auth-form input.form-control:focus,
body.auth-page .auth-form input.form-control:active,
body.auth-page .auth-form input[type="email"]:hover,
body.auth-page .auth-form input[type="password"]:hover,
body.auth-page .auth-form input[type="text"]:hover {
  background:#fff!important;
  background-color:#fff!important;
  background-image:none!important;
  color:#172033!important;
  -webkit-text-fill-color:#172033!important;
  color-scheme:light!important;
}
body.auth-page .auth-form input.form-control:-webkit-autofill,
body.auth-page .auth-form input.form-control:-webkit-autofill:hover,
body.auth-page .auth-form input.form-control:-webkit-autofill:focus,
body.auth-page .auth-form input.form-control:-webkit-autofill:active {
  -webkit-text-fill-color:#172033!important;
  -webkit-box-shadow:0 0 0 1000px #fff inset!important;
  box-shadow:0 0 0 1000px #fff inset!important;
  caret-color:#172033!important;
  background-color:#fff!important;
  color-scheme:light!important;
}

/* v40: login fields must never display instructional placeholder text. */
body.auth-login-page #loginForm input.form-control::placeholder{
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  opacity:0!important;
}