/* INIX Phase 3 Batch 1: responsive, accessible authentication shell.
   Loaded after legacy auth styles so existing desktop workflows remain intact. */
:root{
  --inix-auth-focus:#7dd3fc;
  --inix-auth-focus-shadow:rgba(125,211,252,.28);
  --inix-auth-control:48px;
  --inix-auth-radius:16px;
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body.inix-login-repair-body,
body.inix-create-account-body,
body.inix-otp-body,
body.inix-recover-account-body,
body.inix-staff-login-body,
body.inix-employee-login-body,
body.inix-admin-login-compact,
body.inix-ads-login-body,
body.inix-legacy-otp-login-body{
  min-height:100vh;
  min-height:100dvh;
  overflow-x:hidden;
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;
}
body.inix-auth-enhanced *{box-sizing:border-box}
body.inix-auth-enhanced main,
body.inix-auth-enhanced form,
body.inix-auth-enhanced section,
body.inix-auth-enhanced div{min-width:0}
body.inix-auth-enhanced img{max-width:100%;height:auto}
body.inix-auth-enhanced h1,
body.inix-auth-enhanced h2,
body.inix-auth-enhanced p,
body.inix-auth-enhanced label,
body.inix-auth-enhanced a,
body.inix-auth-enhanced button{overflow-wrap:anywhere}

body.inix-auth-enhanced input:not([type="hidden"]),
body.inix-auth-enhanced select,
body.inix-auth-enhanced textarea,
body.inix-auth-enhanced button,
body.inix-auth-enhanced .btn,
body.inix-auth-enhanced .staff-btn,
body.inix-auth-enhanced .quick a,
body.inix-auth-enhanced .signup-action-row a{
  min-height:var(--inix-auth-control)!important;
  font-size:16px!important;
  line-height:1.25;
}
body.inix-auth-enhanced input:not([type="hidden"]),
body.inix-auth-enhanced select,
body.inix-auth-enhanced textarea{
  width:100%;
  max-width:100%;
  padding:12px 14px!important;
}
body.inix-auth-enhanced button,
body.inix-auth-enhanced .btn,
body.inix-auth-enhanced .staff-btn,
body.inix-auth-enhanced .quick a,
body.inix-auth-enhanced .signup-action-row a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space:normal!important;
  text-overflow:clip!important;
  overflow:visible!important;
  padding:11px 14px!important;
  cursor:pointer;
  touch-action:manipulation;
}
body.inix-auth-enhanced label{
  display:block;
  margin:10px 0 7px;
  font-size:14px!important;
  font-weight:800;
  line-height:1.35;
}
body.inix-auth-enhanced :where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--inix-auth-focus)!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 5px var(--inix-auth-focus-shadow)!important;
}
body.inix-auth-enhanced input[aria-invalid="true"]{
  border-color:#f87171!important;
  box-shadow:0 0 0 3px rgba(248,113,113,.18)!important;
}
body.inix-auth-enhanced button[disabled],
body.inix-auth-enhanced .btn[disabled],
body.inix-auth-enhanced [aria-disabled="true"]{
  opacity:.62!important;
  cursor:not-allowed!important;
}
body.inix-auth-enhanced form[aria-busy="true"]{cursor:progress}
body.inix-auth-enhanced .msg,
body.inix-auth-enhanced .alert,
body.inix-auth-enhanced .staff-msg,
body.inix-auth-enhanced .account-warning,
body.inix-auth-enhanced .noticebox,
body.inix-auth-enhanced .otp-note{
  font-size:14px!important;
  line-height:1.55!important;
}
body.inix-auth-enhanced .msg.err,
body.inix-auth-enhanced .alert.danger,
body.inix-auth-enhanced .staff-msg.err{border-width:2px!important}
body.inix-auth-enhanced .inix-login-tab[aria-selected="true"]{position:relative}
body.inix-auth-enhanced [role="tabpanel"][hidden]{display:none!important}

/* Shared card sizing: compact enough for mobile, readable at 200% zoom. */
body.inix-login-repair-body .loginwrap,
body.inix-create-account-body .create-account-wrap,
body.inix-otp-body .otp-shell,
body.inix-recover-account-body .recover-account-card,
body.inix-staff-login-body .staff-login-card,
body.inix-employee-login-body .login-card,
body.inix-admin-login-compact .card,
body.inix-ads-login-body .login-card,
body.inix-legacy-otp-login-body .wrap{
  width:min(720px,100%)!important;
  max-width:720px!important;
  margin-inline:auto!important;
}
body.inix-recover-account-body .recover-account-card{padding:clamp(16px,3vw,26px)!important}
body.inix-employee-login-body .login-card{margin:auto!important}
body.inix-legacy-otp-login-body .wrap{padding:0!important}

/* Password reveal control without changing submitted field names. */
.inix-password-field{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:stretch}
.inix-password-field>input{grid-column:1}
.inix-password-toggle{
  grid-column:2;
  min-width:76px!important;
  min-height:var(--inix-auth-control)!important;
  margin:0!important;
  border:1px solid rgba(125,211,252,.38)!important;
  border-radius:var(--inix-auth-radius)!important;
  background:rgba(15,34,49,.94)!important;
  color:#e0f2fe!important;
  font-size:13px!important;
  font-weight:900!important;
  padding:8px 11px!important;
}
.inix-auth-submit-status{display:block;margin-top:7px;font-size:12px;line-height:1.4;min-height:1.4em}
.inix-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Account login/create/OTP alignment. */
body.inix-login-repair-body .inix-login-field-grid,
body.inix-login-repair-body .twogrid,
body.inix-create-account-body .twogrid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}
body.inix-login-repair-body .loginlinks,
body.inix-create-account-body .signup-action-row,
body.inix-otp-body .otp-actions,
body.inix-admin-login-compact .quick{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  align-items:stretch!important;
}
body.inix-login-repair-body .loginlinks>* ,
body.inix-create-account-body .signup-action-row>* ,
body.inix-otp-body .otp-actions>* ,
body.inix-admin-login-compact .quick>*{
  width:100%!important;
  min-width:0!important;
  margin:0!important;
}
body.inix-login-repair-body .inix-login-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
body.inix-login-repair-body .inix-login-tab{min-height:48px!important}
body.inix-login-repair-body .centerlogo img,
body.inix-create-account-body .create-center-logo img,
body.inix-otp-body .otp-hero img,
body.inix-recover-account-body .recover-logo img{
  width:clamp(58px,12vw,78px)!important;
  height:clamp(58px,12vw,78px)!important;
}
body.inix-otp-body .otp-input{font-size:clamp(22px,7vw,30px)!important;letter-spacing:clamp(4px,2vw,10px)!important}
body.inix-otp-body .otp-flow{grid-template-columns:repeat(4,minmax(0,1fr))!important}

/* Staff/admin/employee/ads login pages. */
body.inix-staff-login-body .staff-login-wrap{min-height:calc(100dvh - 24px)!important;padding:0!important}
body.inix-staff-login-body .staff-login-logo,
body.inix-admin-login-compact .auth-master-logo{
  width:min(260px,78%)!important;
  max-height:112px!important;
  object-fit:contain!important;
}
body.inix-admin-login-compact .title,
body.inix-staff-login-body .staff-login-card h1,
body.inix-employee-login-body .login-card h1{
  font-size:clamp(25px,6vw,34px)!important;
  line-height:1.12!important;
}
body.inix-ads-login-body .login-card{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)!important}
body.inix-ads-login-body .login-form-wrap,
body.inix-ads-login-body .login-visual{min-width:0!important}
body.inix-employee-login-body .status-ladder{gap:7px!important}
body.inix-employee-login-body .status-ladder span{min-height:36px;display:inline-flex;align-items:center}

@media (max-width:680px){
  body.inix-login-repair-body,
  body.inix-create-account-body,
  body.inix-otp-body,
  body.inix-recover-account-body,
  body.inix-staff-login-body,
  body.inix-employee-login-body,
  body.inix-admin-login-compact,
  body.inix-ads-login-body,
  body.inix-legacy-otp-login-body{
    align-items:flex-start!important;
    justify-content:center!important;
  }
  body.inix-login-repair-body .loginwrap,
  body.inix-create-account-body .create-account-wrap,
  body.inix-otp-body .otp-shell,
  body.inix-recover-account-body .recover-account-card,
  body.inix-staff-login-body .staff-login-card,
  body.inix-employee-login-body .login-card,
  body.inix-admin-login-compact .card,
  body.inix-ads-login-body .login-card{
    padding:16px!important;
    border-radius:22px!important;
  }
  body.inix-login-repair-body .inix-login-field-grid,
  body.inix-login-repair-body .twogrid,
  body.inix-create-account-body .twogrid{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  body.inix-login-repair-body .identity-label-full{display:inline!important}
  body.inix-login-repair-body .identity-label-short{display:none!important}
  body.inix-login-repair-body .loginlinks,
  body.inix-create-account-body .signup-action-row,
  body.inix-otp-body .otp-actions,
  body.inix-admin-login-compact .quick{
    grid-template-columns:1fr!important;
  }
  body.inix-otp-body .otp-flow{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.inix-admin-login-compact .panel{padding:14px!important}
  body.inix-staff-login-body .staff-login-card p{font-size:14px!important}
  body.inix-ads-login-body .login-card{display:block!important}
  body.inix-ads-login-body .login-visual{display:none!important}
  body.inix-ads-login-body .login-form-wrap{padding:0!important}
  body.inix-legacy-otp-login-body .card{padding:15px!important;border-radius:20px!important}
}

@media (max-width:380px){
  body.inix-auth-enhanced input:not([type="hidden"]),
  body.inix-auth-enhanced select,
  body.inix-auth-enhanced textarea,
  body.inix-auth-enhanced button,
  body.inix-auth-enhanced .btn,
  body.inix-auth-enhanced .staff-btn{font-size:15px!important}
  body.inix-login-repair-body .inix-login-tabs{gap:6px!important;padding:5px!important}
  body.inix-login-repair-body .inix-login-tab{font-size:14px!important;padding-inline:7px!important}
  .inix-password-field{grid-template-columns:minmax(0,1fr)}
  .inix-password-toggle{grid-column:1;width:100%!important}
}

@media (max-height:720px) and (min-width:681px){
  body.inix-login-repair-body,
  body.inix-create-account-body,
  body.inix-otp-body,
  body.inix-recover-account-body,
  body.inix-staff-login-body,
  body.inix-employee-login-body,
  body.inix-admin-login-compact,
  body.inix-ads-login-body{
    align-items:flex-start!important;
  }
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  body.inix-auth-enhanced *,body.inix-auth-enhanced *::before,body.inix-auth-enhanced *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

@media (forced-colors:active){
  body.inix-auth-enhanced :where(a,button,input,select,textarea){forced-color-adjust:auto}
  body.inix-auth-enhanced :where(a,button,input,select,textarea):focus-visible{outline:3px solid Highlight!important}
}

/* Final touch-target override against legacy compact rules. */
body.inix-auth-enhanced.inix-login-repair-body #mainLoginLinks .btn,
body.inix-auth-enhanced.inix-login-repair-body #mainLoginLinks button,
body.inix-auth-enhanced.inix-create-account-body .create-account-wrap .btn,
body.inix-auth-enhanced.inix-create-account-body .signup-action-row .btn{
  min-height:48px!important;
  height:auto!important;
  padding:11px 14px!important;
  font-size:15px!important;
  line-height:1.35!important;
}
@media (max-width:680px){
  body.inix-auth-enhanced.inix-login-repair-body #mainLoginLinks{
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
}