/* ============================================================
 * Vouchiro Auth Pages v2.2.4
 * Restyled to match Storefront / Feed / Layout / News.
 * Tokens prefixed --vap-* to namespace.
 * NOTE: This heredoc uses <<<CSS (no quotes) in PHP, so no $.
 * ============================================================ */

.vouchiro-auth-page{
  --vap-blue:#0067d8;
  --vap-blue-dark:#0054b3;
  --vap-navy:#012266;
  --vap-navy-2:#031838;
  --vap-teal:#01be97;
  --vap-teal-dark:#018d72;
  --vap-green:#0a9a70;
  --vap-green-soft:#e7f7f0;
  --vap-red:#e11d48;
  --vap-red-soft:#fef1f4;
  --vap-amber:#b45309;
  --vap-amber-soft:#fef3c7;
  --vap-text:#0a1830;
  --vap-text-strong:#07111f;
  --vap-muted:#65758a;
  --vap-muted-2:#94a3b8;
  --vap-line:#e3ecf6;
  --vap-line-strong:#cfddee;
  --vap-soft:#f7fafc;
  --vap-soft-2:#eef4fb;
  --vap-radius:9px;
  --vap-radius-card:14px;
  --vap-radius-pill:7px;
  --vap-shadow-card:0 1px 0 rgba(15,23,42,.02), 0 6px 18px rgba(15,23,42,.05);
  --vap-shadow-pop:0 1px 0 rgba(15,23,42,.02), 0 18px 44px rgba(15,23,42,.10);

  box-sizing:border-box;
  width:100%;
  max-width:var(--vouchiro-auth-max-width,960px);
  margin:24px auto;
  padding:0 14px;
  color:var(--vap-text);
  font-family:inherit;
}
.vouchiro-auth-page *{box-sizing:border-box;}

/* ============ Main two-column card ============ */
.vouchiro-auth-card{
  display:grid;
  grid-template-columns:minmax(250px,.85fr) minmax(330px,1fr);
  min-height:520px;
  background:#fff;
  border:1px solid var(--vap-line);
  border-radius:var(--vap-radius-card);
  overflow:hidden;
  box-shadow:var(--vap-shadow-pop);
}
.vouchiro-auth-page--register .vouchiro-auth-card{min-height:560px;}

/* ============ Left side (brand + image overlay) ============ */
.vouchiro-auth-side{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:100%;
  background:linear-gradient(160deg, var(--vap-navy) 0%, var(--vap-navy-2) 60%, #000a1d 100%);
  color:#fff;
  padding:30px 28px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:22px;
}
.vouchiro-auth-side.has-image::after{
  content:"";
  position:absolute;
  inset:-1px;
  background-image:var(--vouchiro-auth-side-image,none);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:var(--vouchiro-auth-side-focus-x,50%) var(--vouchiro-auth-side-focus-y,50%);
  transform:scale(var(--vouchiro-auth-side-zoom,1.08));
  transform-origin:var(--vouchiro-auth-side-focus-x,50%) var(--vouchiro-auth-side-focus-y,50%);
  z-index:0;
  pointer-events:none;
}
.vouchiro-auth-side::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(1,34,102,calc(var(--vouchiro-auth-side-overlay,.52) - .04)) 0%, rgba(3,24,56,var(--vouchiro-auth-side-overlay,.52)) 100%);
  z-index:1;
  pointer-events:none;
}
.vouchiro-auth-side > *{position:relative;z-index:2;}

/* Brand block */
.vouchiro-auth-brand{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
}
.vouchiro-auth-brand:empty{display:none;}
.vouchiro-auth-brand strong{
  font-size:16px;
  font-weight:800;
  line-height:1.1;
  letter-spacing:-.005em;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
}
.vouchiro-auth-logo-mark{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, var(--vap-blue), var(--vap-teal));
  border-radius:9px;
  font-weight:800;
  color:#fff;
  flex:0 0 auto;
  box-shadow:0 4px 12px rgba(0,103,216,.35);
  letter-spacing:-.02em;
}
.vouchiro-auth-logo-img{
  max-width:var(--vouchiro-auth-logo-width,154px) !important;
  max-height:56px !important;
  width:auto !important;
  height:auto !important;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.22));
}

/* Side copy */
.vouchiro-auth-side.no-brand .vouchiro-auth-side-copy{
  margin-top:46px;
}
.vouchiro-auth-side-copy span,
.vouchiro-auth-form-head span{
  display:block;
  margin:0 0 8px;
  color:#374151;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.vouchiro-auth-side-copy span{
  color:#9cc8ff;
  text-shadow:0 1px 2px rgba(0,0,0,.25);
}
.vouchiro-auth-side-copy h2{
  margin:0 0 11px;
  font-size:30px;
  line-height:1.08;
  color:#fff;
  font-weight:800;
  letter-spacing:-.025em;
  text-shadow:0 2px 8px rgba(0,0,0,.22);
}
.vouchiro-auth-side-copy p{
  margin:0;
  max-width:360px;
  color:rgba(255,255,255,.86);
  font-size:14px;
  line-height:1.55;
  text-shadow:0 1px 2px rgba(0,0,0,.2);
}

/* Feature points list */
.vouchiro-auth-points{
  display:grid;
  gap:9px;
  margin-top:auto;
}
.vouchiro-auth-points div{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.07);
  border-radius:9px;
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.vouchiro-auth-points b{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:7px;
  background:linear-gradient(135deg, rgba(1,190,151,.85), rgba(10,154,112,.85));
  font-size:11px;
  font-weight:800;
  color:#fff;
  flex:0 0 auto;
  box-shadow:0 2px 6px rgba(1,190,151,.32);
}
.vouchiro-auth-points span{
  font-size:13px;
  font-weight:600;
  color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.18);
}

/* ============ Right side (main form area) ============ */
.vouchiro-auth-main{
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:#fff;
  padding:32px 34px;
}
.vouchiro-auth-main > .vouchiro-auth-form-head,
.vouchiro-auth-main > .vouchiro-auth-notice,
.vouchiro-auth-main > .vouchiro-auth-form,
.vouchiro-auth-main > .vouchiro-auth-switch,
.vouchiro-auth-main > .vouchiro-auth-socials,
.vouchiro-auth-main > .vouchiro-auth-divider{
  width:100%;
  max-width:var(--vouchiro-auth-form-width,384px);
  margin-left:auto;
  margin-right:auto;
}
.vouchiro-auth-page--register .vouchiro-auth-main > .vouchiro-auth-form-head,
.vouchiro-auth-page--register .vouchiro-auth-main > .vouchiro-auth-notice,
.vouchiro-auth-page--register .vouchiro-auth-main > .vouchiro-auth-form,
.vouchiro-auth-page--register .vouchiro-auth-main > .vouchiro-auth-switch,
.vouchiro-auth-page--register .vouchiro-auth-main > .vouchiro-auth-socials,
.vouchiro-auth-page--register .vouchiro-auth-main > .vouchiro-auth-divider{
  max-width:min(100%, calc(var(--vouchiro-auth-form-width,384px) + 42px));
}
.vouchiro-auth-page--2fa .vouchiro-auth-main > .vouchiro-auth-form-head,
.vouchiro-auth-page--2fa .vouchiro-auth-main > .vouchiro-auth-notice,
.vouchiro-auth-page--2fa .vouchiro-auth-main > .vouchiro-auth-form{max-width:400px;}

/* Form head */
.vouchiro-auth-form-head{
  margin-bottom:20px !important;
  text-align:left;
}
.vouchiro-auth-form-head h1{
  margin:0;
  color:var(--vap-text-strong);
  font-size:26px;
  line-height:1.18;
  font-weight:800;
  letter-spacing:-.02em;
}
.vouchiro-auth-form-head p{
  margin:9px 0 0;
  color:var(--vap-muted);
  font-size:13.5px;
  line-height:1.55;
}

/* Form */
.vouchiro-auth-form{
  display:grid;
  gap:13px;
  margin:0;
}
.vouchiro-auth-grid2{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:10px;
}

/* Field */
.vouchiro-auth-field{
  display:grid;
  gap:6px;
  margin:0;
  color:var(--vap-text);
}
.vouchiro-auth-field > span{
  font-size:12px;
  font-weight:700;
  color:var(--vap-text-strong);
}
.vouchiro-auth-field input{
  width:100%;
  height:42px;
  border:1px solid #d6dde8;
  border-radius:var(--vap-radius);
  background:#ffffff;
  color:#111827;
  padding:0 12px;
  font-size:14px;
  font-weight:500;
  outline:none;
  transition:border-color .12s ease;
  background-clip:padding-box;
}
.vouchiro-auth-field input::placeholder{color:var(--vap-muted-2);}
.vouchiro-auth-field input:focus{
  border-color:#9aa4b2;
  box-shadow:none;
}
.vouchiro-auth-field small{
  color:var(--vap-muted);
  font-size:11.5px;
  line-height:1.4;
}

/* Suggest button (handle suggestion) — compact button next to the field */
.vouchiro-auth-suggest-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) 72px;
  gap:8px;
  align-items:stretch;
  width:100%;
}
.vouchiro-auth-suggest-wrap input{
  width:100%;
  min-width:0;
}
.vouchiro-auth-suggest-button{
  box-sizing:border-box !important;
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  height:42px !important;
  min-height:42px !important;
  line-height:1 !important;
  border:1px solid #d6dde8 !important;
  border-radius:var(--vap-radius) !important;
  background:#f3f4f6 !important;
  color:#374151 !important;
  font-size:12px !important;
  font-weight:700 !important;
  padding:0 8px !important;
  cursor:pointer;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  letter-spacing:.005em;
  box-shadow:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  transition:background .15s ease, border-color .15s ease;
}
.vouchiro-auth-suggest-button:hover{
  background:#e5e7eb !important;
  border-color:#cbd5e1 !important;
  transform:none !important;
  box-shadow:none !important;
}

/* Password */
.vouchiro-auth-password-wrap{
  position:relative;
  display:block;
}
.vouchiro-auth-password-wrap input{padding-right:42px;}
.vouchiro-auth-password-toggle{
  position:absolute;
  top:50%;
  right:11px;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--vap-muted);
  cursor:pointer;
  display:grid;
  place-items:center;
  box-shadow:none;
  transition:color .15s ease, opacity .15s ease, transform .12s ease;
}
.vouchiro-auth-password-toggle:hover,
.vouchiro-auth-password-toggle.is-visible{
  background:transparent;
  color:#374151;
}
.vouchiro-auth-password-toggle:hover{transform:translateY(-50%) scale(1.04);}
.vouchiro-auth-eye-icon{
  width:19px;
  height:19px;
  display:block;
}
.vouchiro-auth-password-toggle .vouchiro-auth-eye-open{display:none !important;}
.vouchiro-auth-password-toggle .vouchiro-auth-eye-closed{display:block !important;}
.vouchiro-auth-password-toggle.is-visible .vouchiro-auth-eye-open{display:block !important;}
.vouchiro-auth-password-toggle.is-visible .vouchiro-auth-eye-closed{display:none !important;}

.vouchiro-auth-eye-icon[hidden]{display:none !important;}
.vouchiro-auth-eye-icon path,
.vouchiro-auth-eye-icon circle{
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Inline rows + links */
.vouchiro-auth-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-size:12.5px;
}
.vouchiro-auth-row a,
.vouchiro-auth-switch a,
.vouchiro-auth-back-link,
.vouchiro-auth-light-link{
  color:#374151;
  font-weight:700;
  text-decoration:none;
  transition:color .15s ease;
}
.vouchiro-auth-row a:hover,
.vouchiro-auth-switch a:hover,
.vouchiro-auth-back-link:hover,
.vouchiro-auth-light-link:hover{
  color:var(--vap-blue-dark);
  text-decoration:underline;
}

/* Checkboxes */
.vouchiro-auth-check{
  display:flex !important;
  align-items:flex-start;
  gap:9px;
  margin:0;
  color:var(--vap-text);
  font-size:12.5px;
  line-height:1.45;
}
.vouchiro-auth-check input{
  accent-color:#0067d8;
  margin-top:2px;
  width:15px;
  height:15px;
  flex:0 0 auto;
}
.vouchiro-auth-terms{margin-top:1px;}

/* Unified action buttons — same rhythm across login, register, 2FA, and role choice */
.vouchiro-auth-submit,
.vouchiro-auth-page .vap-btn-login,
.vouchiro-auth-page .vap-btn-register,
.vouchiro-auth-page .vap-btn-2fa{
  width:100%;
  height:44px;
  border:1px solid #0067d8;
  border-radius:var(--vap-radius);
  background:linear-gradient(135deg, #0067d8 0%, #01be97 100%);
  color:#fff;
  font-size:14px;
  font-weight:750;
  letter-spacing:.005em;
  line-height:1;
  cursor:pointer;
  text-align:center;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  box-shadow:none;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.vouchiro-auth-submit:hover,
.vouchiro-auth-page .vap-btn-login:hover,
.vouchiro-auth-page .vap-btn-register:hover,
.vouchiro-auth-page .vap-btn-2fa:hover{
  background:linear-gradient(135deg, #0058bb 0%, #00a985 100%);
  border-color:#00a985;
  color:#fff;
  transform:none;
  box-shadow:none;
}
.vouchiro-auth-submit.is-link{
  padding:0 18px;
  width:auto;
}

/* Switch link area at bottom */
.vouchiro-auth-switch{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid var(--vap-line);
  text-align:center;
  color:var(--vap-muted);
  font-size:13px;
}
.vouchiro-auth-switch span{margin-right:5px;}

/* Notice (info/success/error) */
.vouchiro-auth-notice{
  margin-bottom:14px !important;
  border:1px solid #fcd34d;
  background:var(--vap-amber-soft);
  color:var(--vap-amber);
  border-radius:var(--vap-radius);
  padding:11px 13px;
  font-size:12.8px;
  font-weight:600;
  line-height:1.48;
  display:flex;
  align-items:flex-start;
  gap:8px;
}
.vouchiro-auth-notice::before{
  content:"⚠";
  font-size:14px;
  line-height:1.2;
  flex:0 0 auto;
}
.vouchiro-auth-notice.is-success{
  border-color:#b6e8d4;
  background:var(--vap-green-soft);
  color:var(--vap-green);
}
.vouchiro-auth-notice.is-success::before{content:"✓";color:var(--vap-green);font-weight:800;}
.vouchiro-auth-notice.is-error{
  border-color:#f5b6c5;
  background:var(--vap-red-soft);
  color:var(--vap-red);
}
.vouchiro-auth-notice.is-error::before{content:"✕";color:var(--vap-red);font-weight:800;}

/* Honeypot */
.vouchiro-auth-hp{
  position:absolute !important;
  left:-9999px !important;
  opacity:0 !important;
}

/* Social login buttons */
.vouchiro-auth-socials{
  display:grid;
  gap:8px;
  margin-bottom:14px !important;
}
.vouchiro-auth-social{
  height:42px;
  border:1px solid #d6dde8;
  border-radius:var(--vap-radius);
  background:#ffffff;
  color:#111827;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-size:13px;
  font-weight:700;
  text-decoration:none;
  transition:border-color .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
  box-shadow:none;
}
.vouchiro-auth-social:hover{
  border-color:#cbd5e1;
  background:#f3f4f6;
  color:#111827;
  text-decoration:none;
  box-shadow:none;
}
.vouchiro-auth-social span{
  width:24px;
  height:24px;
  border-radius:6px;
  background:#f3f4f6;
  color:#374151;
  display:grid;
  place-items:center;
  font-size:11px;
  font-weight:800;
  flex:0 0 auto;
  transition:background .15s ease, color .15s ease;
}
.vouchiro-auth-social:hover span{
  background:#e5e7eb;
  color:#111827;
}

/* Divider with centered text */
.vouchiro-auth-divider{
  position:relative;
  text-align:center;
  margin:0 auto 14px !important;
  color:var(--vap-muted-2);
  font-size:11.5px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.vouchiro-auth-divider::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:1px;
  background:var(--vap-line);
}
.vouchiro-auth-divider span{
  position:relative;
  background:#fff;
  padding:0 12px;
}

/* 2FA code input grid */
.vouchiro-auth-code-field{gap:10px;}
.vouchiro-auth-code-grid{
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  gap:9px;
}
.vouchiro-auth-code-grid input{
  height:56px !important;
  text-align:center !important;
  font-size:22px !important;
  font-weight:800 !important;
  padding:0 !important;
  line-height:56px !important;
  border-radius:10px !important;
  border:1px solid var(--vap-line) !important;
  background:var(--vap-soft) !important;
  color:var(--vap-text-strong) !important;
  font-variant-numeric:tabular-nums;
  transition:border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.vouchiro-auth-code-grid input:focus{
  border-color:#9aa4b2 !important;
  background:#fff !important;
  box-shadow:none !important;
}

/* Back link */
.vouchiro-auth-back-link{
  display:inline-flex;
  justify-content:center;
  margin-top:4px;
  font-size:13px;
}

/* Simple card (single-column confirmation pages) */
.vouchiro-auth-simple-card{
  max-width:460px;
  margin:24px auto;
  background:#fff;
  border:1px solid var(--vap-line);
  border-radius:var(--vap-radius-card);
  padding:32px;
  box-shadow:var(--vap-shadow-pop);
}
.vouchiro-auth-simple-card > span{
  color:#374151;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.vouchiro-auth-simple-card h1{
  margin:8px 0 10px;
  font-size:26px;
  line-height:1.18;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--vap-text-strong);
}
.vouchiro-auth-simple-card p{
  margin:0 0 20px;
  color:var(--vap-muted);
  font-size:14px;
  line-height:1.55;
}
.vouchiro-auth-simple-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

/* Comfortable density */
.vouchiro-auth-page.is-density-comfortable .vouchiro-auth-main{padding:38px 38px;}
.vouchiro-auth-page.is-density-comfortable .vouchiro-auth-form{gap:16px;}
.vouchiro-auth-page.is-density-comfortable .vouchiro-auth-field input{height:46px;}
.vouchiro-auth-page.is-density-comfortable .vouchiro-auth-submit{height:46px;}

/* ============ Role selection cards (key brand interaction) ============ */
.vouchiro-auth-role-form{gap:14px;}
.vouchiro-auth-role-options{
  display:grid;
  gap:10px;
}
.vouchiro-auth-role-card{
  position:relative;
  display:grid !important;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:13px;
  border:1px solid var(--vap-line);
  border-radius:var(--vap-radius);
  background:#fff;
  padding:14px;
  cursor:pointer;
  box-shadow:var(--vap-shadow-card);
  transition:border-color .18s ease, box-shadow .22s ease, background .18s ease, transform .18s ease;
  overflow:hidden;
}
/* Animated green left bar */
.vouchiro-auth-role-card::before{
  display:none; /* light bar removed */
}
.vouchiro-auth-role-card:hover{
  border-color:rgba(10,154,112,.5);
  background:#fbfdfd;
}
.vouchiro-auth-role-card input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.vouchiro-auth-role-icon{
  width:38px;
  height:38px;
  border-radius:9px;
  display:grid;
  place-items:center;
  background:#f3f4f6;
  color:#374151;
  font-size:14px;
  font-weight:800;
  transition:background .18s ease, color .18s ease;
}
.vouchiro-auth-role-copy{
  display:grid;
  gap:3px;
  min-width:0;
}
.vouchiro-auth-role-copy strong{
  font-size:14px;
  color:var(--vap-text-strong);
  font-weight:700;
  line-height:1.2;
}
.vouchiro-auth-role-copy small{
  font-size:12.2px;
  line-height:1.45;
  color:var(--vap-muted);
}
.vouchiro-auth-role-card em{
  font-style:normal;
  border:1px solid #fcd34d;
  background:var(--vap-amber-soft);
  color:var(--vap-amber);
  border-radius:7px;
  padding:5px 9px;
  font-size:10.5px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  white-space:nowrap;
}
/* Selected state — flat green border + light tint + filled green icon (no glow) */
.vouchiro-auth-role-card:has(input:checked){
  border-color:var(--vap-green);
  background:#f1faf6;
}
.vouchiro-auth-role-card:has(input:checked) .vouchiro-auth-role-icon{
  background:var(--vap-green);
  color:#fff;
}

/* ============ Reduced motion ============ */
@media (prefers-reduced-motion: reduce){
  .vouchiro-auth-page *{transition:none !important;}
  .vouchiro-auth-role-card::before{transform:scaleY(1);}
}

/* ============ Responsive ============ */
@media (max-width:900px){
  .vouchiro-auth-page{max-width:680px;margin:16px auto;}
  .vouchiro-auth-card{grid-template-columns:1fr;min-height:0;}
  .vouchiro-auth-main{padding:28px 24px;}
  .vouchiro-auth-side{min-height:220px;padding:24px;}
  .vouchiro-auth-side-copy h2{font-size:24px;}
  .vouchiro-auth-logo-img{max-height:46px !important;}
}
@media (max-width:620px){
  .vouchiro-auth-page{margin:10px auto;padding:0 10px;max-width:100%;}
  .vouchiro-auth-card{border-radius:11px;box-shadow:var(--vap-shadow-card);}
  .vouchiro-auth-main{padding:22px 16px;}
  .vouchiro-auth-main > .vouchiro-auth-form-head,
  .vouchiro-auth-main > .vouchiro-auth-notice,
  .vouchiro-auth-main > .vouchiro-auth-form,
  .vouchiro-auth-main > .vouchiro-auth-switch,
  .vouchiro-auth-main > .vouchiro-auth-socials,
  .vouchiro-auth-main > .vouchiro-auth-divider{max-width:100%;}
  .vouchiro-auth-form-head{margin-bottom:16px !important;}
  .vouchiro-auth-form-head h1{font-size:22px;}
  .vouchiro-auth-grid2{grid-template-columns:1fr;gap:12px;}
  .vouchiro-auth-page.mobile-image-top .vouchiro-auth-side{
    min-height:var(--vouchiro-auth-mobile-image-height,168px);
    height:var(--vouchiro-auth-mobile-image-height,168px);
    padding:16px 18px;
  }
  .vouchiro-auth-page.mobile-image-top .vouchiro-auth-points,
  .vouchiro-auth-page.mobile-image-top .vouchiro-auth-side-copy p,
  .vouchiro-auth-page.mobile-image-top .vouchiro-auth-side-copy span{display:none !important;}
  .vouchiro-auth-page.mobile-image-top .vouchiro-auth-side-copy h2{
    font-size:20px;
    line-height:1.1;
    max-width:92%;
  }
  .vouchiro-auth-page.mobile-image-hidden .vouchiro-auth-side{display:none;}
  .vouchiro-auth-page.mobile-image-background .vouchiro-auth-card{
    position:relative;
    isolation:isolate;
    background:transparent;
    overflow:hidden;
  }
  .vouchiro-auth-page.mobile-image-background .vouchiro-auth-side{
    display:block;
    position:absolute;
    inset:0;
    min-height:0;
    height:auto;
    padding:0;
    z-index:0;
  }
  .vouchiro-auth-page.mobile-image-background .vouchiro-auth-side > *{display:none !important;}
  .vouchiro-auth-page.mobile-image-background .vouchiro-auth-side::before{background:rgba(3,24,56,.55);}
  .vouchiro-auth-page.mobile-image-background .vouchiro-auth-main{
    position:relative;
    z-index:2;
    background:rgba(255,255,255,.97);
    margin:10px;
    border:1px solid rgba(227,236,246,.82);
    border-radius:10px;
  }
  .vouchiro-auth-code-grid{gap:6px;}
  .vouchiro-auth-code-grid input{height:50px !important;font-size:20px !important;line-height:50px !important;}
}
@media (max-width:420px){
  .vouchiro-auth-page{padding:0 8px;}
  .vouchiro-auth-main{padding:20px 14px;}
  .vouchiro-auth-field input,
  .vouchiro-auth-submit{height:42px;}
  .vouchiro-auth-code-grid{gap:5px;}
  .vouchiro-auth-code-grid input{height:44px !important;font-size:18px !important;line-height:44px !important;}
  .vouchiro-auth-page.mobile-image-top .vouchiro-auth-side{min-height:142px;height:142px;}
}

/* v2 compatibility: variables generated by VAP_CSS + safer admin-controlled sizing. */
.vouchiro-auth-page{
  max-width:var(--vouchiro-auth-max-width, var(--vap-layout-max, 960px));
}
.vouchiro-auth-main > .vouchiro-auth-form-head,
.vouchiro-auth-main > .vouchiro-auth-notice,
.vouchiro-auth-main > .vouchiro-auth-form,
.vouchiro-auth-main > .vouchiro-auth-switch,
.vouchiro-auth-main > .vouchiro-auth-socials,
.vouchiro-auth-main > .vouchiro-auth-divider{
  max-width:var(--vouchiro-auth-form-width, var(--vap-form-max, 384px));
}
.vouchiro-auth-page.mobile-image-top .vouchiro-auth-side{
  min-height:var(--vouchiro-auth-mobile-image-height, var(--vap-mobile-image-h, 168px));
}
.vouchiro-auth-form-logo-img{max-width:var(--vouchiro-auth-logo-width, var(--vap-form-logo-width,154px)) !important;height:auto !important;display:block;}
.vouchiro-auth-notice b{display:none;}
.vouchiro-auth-social.vap-btn-social{width:100%;}

/* v2.1.1: built-in no-external-resource security challenge */
.vouchiro-auth-captcha {
    display: grid;
    gap: 8px;
    width: 100%;
    margin: 8px 0 2px;
    padding: 12px;
    border: 1px solid rgba(148, 163, 184, 0.32);
    border-radius: var(--vouchiro-auth-input-radius, 12px);
    background: rgba(15, 23, 42, 0.035);
}
.vouchiro-auth-captcha label {
    font-size: 13px;
    font-weight: 700;
    color: var(--vap-muted, #64748b);
}
.vouchiro-auth-captcha input[type="text"] {
    width: 100%;
    min-height: 42px;
    border-radius: var(--vouchiro-auth-input-radius, 12px);
    border: 1px solid var(--vouchiro-auth-input-border, rgba(148, 163, 184, 0.38));
    background: var(--vouchiro-auth-input-bg, #ffffff);
    color: var(--vouchiro-auth-input-text, #0f172a);
    padding: 0 12px;
}


/* ============ Signup avatar picker ============ */
.vouchiro-auth-avatar-field > span{display:block;font-size:13px;font-weight:600;color:#334155;margin-bottom:6px;}
.vouchiro-auth-avatars{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:10px;}
.vouchiro-auth-avatar{position:relative;cursor:pointer;border:2px solid #e3e9f1;border-radius:50%;padding:3px;display:block;background:#fff;transition:border-color .15s ease, box-shadow .15s ease;}
.vouchiro-auth-avatar svg{display:block;width:100%;height:auto;border-radius:50%;}
.vouchiro-auth-avatar input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none;}
.vouchiro-auth-avatar:hover{border-color:#bcd0e6;}
.vouchiro-auth-avatar:has(input:checked){border-color:var(--vap-green,#0a9a70);box-shadow:0 0 0 3px rgba(10,154,112,.18);}
.vouchiro-auth-avatar:focus-within{border-color:var(--vap-green,#0a9a70);box-shadow:0 0 0 3px rgba(10,154,112,.18);}
.vouchiro-auth-avatar-off{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1/1;border-radius:50%;background:#f1f4f9;color:#64748b;font-size:11px;font-weight:700;}

/* ============ Two-step registration ============ */
.vouchiro-auth-steps{display:flex;gap:7px;justify-content:center;margin:0 0 16px;}
.vouchiro-auth-step-dot{width:8px;height:8px;border-radius:50%;background:#d7e0ec;transition:background .2s ease;}
.vouchiro-auth-step-dot.is-active{background:var(--vap-green,#0a9a70);}
.vouchiro-auth-step{
  display:grid;
  gap:13px;
}
.vouchiro-auth-step[hidden]{display:none;}
.vouchiro-auth-step > .vouchiro-auth-submit[data-vouchiro-step-next]{
  margin-top:4px;
}
.vouchiro-auth-step-actions{display:flex;gap:10px;align-items:stretch;margin-top:8px;}
.vouchiro-auth-step-actions .vouchiro-auth-submit{flex:1 1 auto;margin-top:0;}
.vouchiro-auth-back-step{flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #d7e0ec;color:#475569;border-radius:10px;padding:0 18px;font-size:14px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease;}
.vouchiro-auth-back-step:hover{background:#f1f4f9;border-color:#bcd0e6;}

/* Vouchiro Auth v2.5.1: keep the create-account Continue button separated from the fields above. */
.vouchiro-auth-page--register .vouchiro-auth-step[data-step="1"],
.vouchiro-auth-page--register .vouchiro-auth-step[data-step="2"]{
  display:grid;
  gap:13px;
}
.vouchiro-auth-page--register .vouchiro-auth-step[hidden]{display:none !important;}
.vouchiro-auth-page--register .vouchiro-auth-step > .vouchiro-auth-submit[data-vouchiro-step-next]{
  margin-top:4px !important;
}
.vouchiro-auth-page--register .vouchiro-auth-step-actions{
  margin-top:8px !important;
}





/* v2.5.6: quiet patterned CAPTCHA for password reset requests. */
.vouchiro-auth-page--reset .vouchiro-auth-captcha--lost-password{
    display:grid;
    grid-template-columns:78px minmax(0, 1fr);
    align-items:stretch;
    gap:8px;
    width:100%;
    margin:4px 0 6px;
    padding:0;
    border:0;
    background:transparent;
}
.vouchiro-auth-captcha--lost-password .vouchiro-auth-captcha-code{
    min-height:52px;
    margin:0;
    border:1px solid #d8e0ea;
    border-radius:7px;
    background-color:#f8fafc;
    background-image:
        radial-gradient(circle at 7px 7px, rgba(100,116,139,.18) 1px, transparent 1.5px),
        linear-gradient(135deg, rgba(148,163,184,.11) 25%, transparent 25%),
        linear-gradient(225deg, rgba(148,163,184,.09) 25%, transparent 25%);
    background-size:14px 14px, 18px 18px, 18px 18px;
    background-position:0 0, 0 0, 9px 9px;
    display:grid;
    place-items:center;
    gap:1px;
    padding:6px 8px;
    user-select:none;
    cursor:default;
    box-shadow:0 1px 0 rgba(15,23,42,.025);
}
.vouchiro-auth-captcha--lost-password .vouchiro-auth-captcha-code span{
    display:none;
}
.vouchiro-auth-captcha--lost-password .vouchiro-auth-captcha-code strong{
    display:block;
    font-size:14px;
    line-height:1;
    font-weight:800;
    letter-spacing:.06em;
    color:#e66b1a;
    text-shadow:0 1px 0 rgba(255,255,255,.8);
    font-variant-numeric:tabular-nums;
}
.vouchiro-auth-captcha--lost-password input[type="text"]{
    min-height:52px;
    border-radius:7px;
    border:1px solid var(--vouchiro-auth-input-border, rgba(148, 163, 184, 0.38));
    background:var(--vouchiro-auth-input-bg, #fff);
    padding:0 14px;
    font-size:14px;
    font-weight:500;
}
.vouchiro-auth-captcha--lost-password input[type="text"]:focus{
    outline:none;
    border-color:#b7c6d8;
    box-shadow:none;
}
@media (max-width:420px){
    .vouchiro-auth-page--reset .vouchiro-auth-captcha--lost-password{
        grid-template-columns:70px minmax(0, 1fr);
        gap:7px;
    }
    .vouchiro-auth-captcha--lost-password .vouchiro-auth-captcha-code,
    .vouchiro-auth-captcha--lost-password input[type="text"]{
        min-height:50px;
    }
}

/* Reset password screen: use the same polished auth design as login/register. */
.vouchiro-auth-page--reset .vouchiro-auth-card{min-height:520px;}
.vouchiro-auth-page--reset .vouchiro-auth-main{justify-content:center;}
.vouchiro-auth-page--reset .vouchiro-auth-form{gap:16px;}
.vouchiro-auth-page--reset .vouchiro-auth-form-head{margin-bottom:18px;}
.vouchiro-auth-page--reset .vouchiro-auth-submit + .vouchiro-auth-switch{margin-top:18px;}
.vouchiro-auth-page--reset .vouchiro-auth-notice + .vouchiro-auth-submit{margin-top:12px;}
@media (max-width: 760px){
  .vouchiro-auth-page--reset .vouchiro-auth-card{min-height:0;}
}