/* Vozua Chama — desktop split-login patch v4.9.1
   Scope: login page only. Keeps the existing backend/auth flow unchanged. */

html:has(body.vozua-login-v491),
body.vozua-login-v491{
  width:100%;
  min-width:0;
  height:100%;
  margin:0;
  background:#fff;
}

body.vozua-login-v491{
  min-height:100vh;
  min-height:100dvh;
  color:#173a68;
  overflow:hidden;
  overscroll-behavior:none;
}

.vozua-login-v491 *{box-sizing:border-box}

.v491-auth-shell{
  position:fixed;
  inset:0;
  display:grid;
  grid-template-columns:minmax(420px,1.02fr) minmax(520px,.98fr);
  width:100%;
  height:100vh;
  height:100dvh;
  overflow:hidden;
  background:#fff;
}

.v491-auth-visual{
  position:relative;
  min-width:0;
  height:100%;
  overflow:hidden;
  display:flex;
  align-items:center;
  padding:clamp(32px,5vh,68px) clamp(44px,6vw,96px);
  background:
    radial-gradient(circle at 19% 13%,rgba(77,155,255,.95) 0,rgba(31,112,230,.78) 18%,rgba(31,112,230,0) 38%),
    radial-gradient(circle at 78% 92%,rgba(21,103,224,.62),rgba(21,103,224,0) 36%),
    linear-gradient(145deg,#0a2f73 0%,#0750bb 48%,#0b78ee 100%);
  isolation:isolate;
}

.v491-auth-visual:before{
  content:"";
  position:absolute;
  z-index:-1;
  width:min(54vw,720px);
  height:min(54vw,720px);
  right:-34%;
  top:-9%;
  border-radius:50%;
  border:clamp(42px,5vw,78px) solid rgba(255,255,255,.12);
  box-shadow:0 0 0 70px rgba(255,255,255,.045);
}

.v491-auth-visual:after{
  content:"";
  position:absolute;
  left:-8%;
  right:-8%;
  bottom:-7%;
  height:32%;
  opacity:.54;
  background:
    repeating-radial-gradient(ellipse at 36% 100%,transparent 0 18px,rgba(255,255,255,.18) 19px 20px,transparent 21px 34px);
  transform:rotate(-4deg);
  transform-origin:center bottom;
  pointer-events:none;
}

.v491-visual-copy{
  position:relative;
  z-index:2;
  width:min(100%,590px);
  color:#fff;
}

.v491-brand-mark{
  width:clamp(138px,14vw,205px);
  height:auto;
  max-height:118px;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 15px 25px rgba(0,31,88,.22));
}

.v491-visual-copy h1{
  margin:clamp(22px,4vh,42px) 0 5px;
  color:#fff;
  font-size:clamp(34px,4.2vw,62px);
  line-height:1;
  letter-spacing:-.045em;
  font-weight:850;
}

.v491-visual-copy>p{
  margin:0;
  color:rgba(255,255,255,.82);
  font-size:clamp(13px,1.25vw,18px);
  line-height:1.55;
  font-weight:550;
}

.v491-visual-line{
  display:block;
  width:56px;
  height:4px;
  margin:25px 0 25px;
  border-radius:999px;
  background:#69b9ff;
  box-shadow:0 0 24px rgba(86,183,255,.65);
}

.v491-visual-points{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 16px;
  max-width:540px;
  color:rgba(255,255,255,.82);
  font-size:clamp(11px,1vw,14px);
  font-weight:650;
}

.v491-visual-points span{display:flex;align-items:center;gap:16px;white-space:nowrap}
.v491-visual-points span:not(:last-child):after{content:"•";color:#83c8ff;font-size:13px}

.v491-auth-main{
  position:relative;
  min-width:0;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(18px,3vh,36px) clamp(28px,4.2vw,68px);
  background:
    radial-gradient(circle at 100% 0%,rgba(216,232,255,.5),transparent 31%),
    linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}

.v491-login-card{
  width:min(100%,548px);
  max-height:calc(100dvh - 32px);
  padding:clamp(22px,3.2vh,38px) clamp(28px,3.1vw,45px) clamp(18px,2.6vh,30px);
  border:1px solid #edf1f6;
  border-radius:24px;
  background:rgba(255,255,255,.96);
  box-shadow:0 22px 65px rgba(24,67,121,.10);
}

.v491-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:clamp(18px,2.4vh,26px);
}

.v491-mobile-brand{display:none}

.v491-security-chip{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#f9fbfe;
  color:#60738a;
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}
.v491-security-chip:before{content:"●";margin-right:7px;color:#1868bf;font-size:8px}

.v491-login-heading h2{
  margin:0;
  color:#112f60;
  font-size:clamp(30px,2.65vw,42px);
  line-height:1.04;
  letter-spacing:-.045em;
  font-weight:850;
}

.v491-login-heading p{
  margin:9px 0 0;
  color:#7d8aa0;
  font-size:clamp(12px,1vw,14px);
  line-height:1.5;
}

.v491-login-alert{margin:0 0 13px!important;border-radius:11px!important;padding:10px 12px!important;font-size:10px!important}

.v491-login-form{display:grid;gap:13px}
.v491-login-form>label{display:grid;gap:7px;color:#334b6a;font-size:11.5px;font-weight:800}
.v491-field-help{margin-top:-2px;color:#8b98a8;font-size:9px;font-weight:550;line-height:1.35}

.v491-phone-field,
.v491-pin-field{
  display:flex;
  align-items:center;
  min-height:52px;
  overflow:hidden;
  border:1px solid #dbe3ec;
  border-radius:12px;
  background:#fff;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.v491-phone-field:focus-within,
.v491-pin-field:focus-within{border-color:#2e79cf;box-shadow:0 0 0 4px rgba(34,112,201,.085)}

.v491-phone-field select{
  flex:0 0 116px;
  align-self:stretch;
  min-width:0;
  border:0;
  border-right:1px solid #e5eaf0;
  outline:0;
  padding:0 10px;
  background:#f7f9fc;
  color:#214c7c;
  font-size:12px;
  font-weight:800;
}

.v491-phone-field input,
.v491-pin-field input{
  flex:1;
  min-width:0;
  height:50px;
  border:0!important;
  outline:0!important;
  background:#fff!important;
  box-shadow:none!important;
  padding:0 14px!important;
  color:#1f3e65;
  font-size:14px!important;
  font-weight:700;
}
.v491-phone-field input::placeholder,
.v491-pin-field input::placeholder{color:#a5afbd;font-weight:550}

.v491-pin-field>.ui-icon{flex:0 0 18px;width:18px;height:18px;margin-left:14px;color:#416fa5}
.v491-pin-field button{
  flex:0 0 auto;
  height:34px;
  margin-right:8px;
  border:0;
  border-radius:9px;
  padding:0 10px;
  background:#f2f6fb;
  color:#235e9d;
  font-size:9.5px;
  font-weight:850;
  cursor:pointer;
}

.v491-login-links{display:flex;justify-content:flex-end;margin-top:-3px}
.v491-login-links a{color:#1867b9;font-size:10.5px;font-weight:800;text-decoration:none}

.v491-signin{
  min-height:52px!important;
  margin-top:1px;
  border-radius:11px!important;
  background:linear-gradient(180deg,#1677eb,#075dcc)!important;
  border-color:#075dcc!important;
  box-shadow:0 10px 22px rgba(17,104,211,.17)!important;
  font-size:13px!important;
  font-weight:850!important;
}
.v491-signin:disabled{opacity:.72;cursor:wait}

.v491-divider{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:12px;
  margin:14px 0 12px;
  color:#9aa5b3;
  font-size:9px;
  font-weight:750;
}
.v491-divider:before,.v491-divider:after{content:"";height:1px;background:#e8edf2}

.v491-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.v491-actions a{
  min-height:39px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7px 10px;
  border:1px solid #dce4ed;
  border-radius:10px;
  background:#fff;
  color:#2c5d90;
  text-align:center;
  text-decoration:none;
  font-size:9px;
  line-height:1.25;
  font-weight:800;
}
.v491-actions .v491-register{grid-column:1/-1;background:#f7faff;color:#155fa8;border-color:#cfe0f0}

.v491-support{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:5px 7px;
  margin-top:12px;
  padding-top:11px;
  border-top:1px solid #eef2f6;
  color:#8793a2;
  font-size:8.6px;
}
.v491-support b{color:#2d507a}
.v491-support a{color:#1762aa;text-decoration:none;font-weight:750}

.v491-policy{display:flex;justify-content:center;gap:13px;margin-top:8px}
.v491-policy a{color:#9aa5b2;text-decoration:none;font-size:8px}

/* Fit safely on shorter desktop/laptop screens without introducing page scroll. */
@media (min-width:901px) and (max-height:780px){
  .v491-login-card{padding:22px 34px 17px;border-radius:20px}
  .v491-card-top{margin-bottom:15px}
  .v491-login-heading h2{font-size:31px}
  .v491-login-heading p{margin-top:6px;font-size:11.5px}
  .v491-login-form{gap:10px}
  .v491-phone-field,.v491-pin-field{min-height:46px}
  .v491-phone-field input,.v491-pin-field input{height:44px}
  .v491-signin{min-height:46px!important}
  .v491-actions a{min-height:34px;font-size:8.5px}
  .v491-divider{margin:10px 0 9px}
  .v491-support{margin-top:9px;padding-top:8px}
  .v491-policy{margin-top:6px}
}

@media (min-width:901px) and (max-height:650px){
  .v491-login-card{padding:16px 30px 13px}
  .v491-security-chip{min-height:29px;font-size:8.5px}
  .v491-login-heading h2{font-size:27px}
  .v491-login-heading p{font-size:10px}
  .v491-login-form{gap:8px}
  .v491-login-form>label{gap:5px;font-size:10px}
  .v491-field-help{display:none}
  .v491-phone-field,.v491-pin-field{min-height:42px}
  .v491-phone-field input,.v491-pin-field input{height:40px}
  .v491-signin{min-height:42px!important}
  .v491-actions a{min-height:31px}
  .v491-support{font-size:7.8px}
}

@media(max-width:1100px) and (min-width:901px){
  .v491-auth-shell{grid-template-columns:minmax(360px,.9fr) minmax(500px,1.1fr)}
  .v491-auth-visual{padding-left:48px;padding-right:42px}
  .v491-visual-copy h1{font-size:44px}
}

/* Mobile/tablet: one clean centered sign-in surface. Scrolling is allowed only when needed on small screens. */
@media(max-width:900px){
  html:has(body.vozua-login-v491),body.vozua-login-v491{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
  .v491-auth-shell{position:relative;inset:auto;display:block;height:auto;min-height:100vh;min-height:100dvh;overflow:visible;background:#fff}
  .v491-auth-visual{display:none}
  .v491-auth-main{min-height:100vh;min-height:100dvh;padding:max(18px,env(safe-area-inset-top)) 18px max(20px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#f6faff 0,#fff 28%)}
  .v491-login-card{max-height:none;width:min(100%,520px);padding:24px 20px 20px;border-radius:20px;box-shadow:0 14px 38px rgba(24,67,121,.08)}
  .v491-mobile-brand{display:flex;align-items:center;gap:9px;margin-bottom:18px}
  .v491-mobile-brand img{width:72px;height:39px;object-fit:contain}
  .v491-mobile-brand strong{display:block;color:#184a83;font-size:14px}
  .v491-mobile-brand small{display:block;color:#8793a3;font-size:9px;margin-top:1px}
  .v491-login-heading h2{font-size:30px}
  .v491-card-top{align-items:flex-start}
  .v491-security-chip{min-height:31px;padding:0 9px;font-size:8.5px}
}

@media(max-width:520px){
  .v491-auth-main{align-items:flex-start;padding-left:12px;padding-right:12px}
  .v491-login-card{width:100%;padding:20px 15px 18px;border-radius:16px}
  .v491-card-top{gap:10px;margin-bottom:17px}
  .v491-login-heading h2{font-size:27px}
  .v491-login-heading p{font-size:11px}
  .v491-phone-field select{flex-basis:104px;font-size:11px;padding-inline:8px}
  .v491-actions{grid-template-columns:1fr}
  .v491-actions .v491-register{grid-column:auto;order:-1}
}