/* Folanja v1.22.79 — SMS inline loading, one resend UX, mobile no-scroll fit */

/* Inline loader lives inside the SMS card; there is no separate site loading window. */
.fol-sms-dialog{
  position:relative!important;
}
.fol-sms-inline-loader[hidden]{display:none!important}
.fol-sms-inline-loader{
  position:absolute;
  inset:0;
  z-index:20;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:20px;
  border-radius:inherit;
  background:color-mix(in srgb,var(--auth-card) 88%,transparent);
  backdrop-filter:blur(7px) saturate(105%);
  -webkit-backdrop-filter:blur(7px) saturate(105%);
  text-align:center;
}
.fol-sms-inline-loader b{
  color:var(--auth-text);
  font-size:11.5px;
  font-weight:900;
}
.fol-sms-inline-loader small{
  color:var(--auth-muted);
  font-size:8.8px;
}
.fol-sms-inline-spinner{
  width:32px;
  height:32px;
  border-radius:999px;
  border:3px solid rgba(151,81,232,.13);
  border-top-color:#7b3ca6;
  border-right-color:#d98229;
  animation:folSmsSpin .75s linear infinite;
}
@keyframes folSmsSpin{to{transform:rotate(360deg)}}

.core-auth-sms-tools [data-sms-resend][hidden]{display:none!important}
.core-auth-sms-tools [data-sms-resend]{
  transition:opacity .18s ease,color .18s ease;
}
.core-auth-sms-tools [data-sms-resend]:disabled{
  opacity:.62!important;
}

/* Mobile: fit the whole active step inside the viewport, no horizontal/vertical modal scroll. */
@media(max-width:820px){
  .core-auth-card-v12270 .core-auth-sms-panel:not([hidden]){
    overflow:hidden!important;
    padding:
      max(5px,env(safe-area-inset-top))
      7px
      max(6px,env(safe-area-inset-bottom))!important;
    align-items:flex-start!important;
  }

  .fol-sms-dialog{
    width:min(100%,480px)!important;
    max-width:100%!important;
    max-height:calc(var(--sms-vh,100dvh) - 12px)!important;
    overflow:hidden!important;
    padding:10px 12px 10px!important;
    border-radius:18px!important;
  }

  .fol-sms-close{
    top:7px!important;
    left:7px!important;
    width:29px!important;
    height:29px!important;
  }

  .fol-sms-brand{
    margin:0 28px 7px!important;
    gap:6px!important;
  }
  .fol-sms-brand img{
    width:34px!important;
    height:34px!important;
  }
  .fol-sms-brand h3{
    font-size:14px!important;
    line-height:1.35!important;
  }
  .fol-sms-brand small{font-size:7.5px!important}

  .fol-sms-stepper{
    margin:0 auto 7px!important;
    max-width:154px!important;
    gap:5px!important;
    grid-template-columns:21px 1fr 21px 1fr 21px!important;
  }
  .fol-sms-stepper span{
    width:21px!important;
    height:21px!important;
    font-size:8px!important;
  }

  .fol-sms-dialog .core-auth-sms-state{gap:7px!important}
  .fol-sms-dialog .core-auth-sms-head h4{
    margin:1px 0!important;
    font-size:13px!important;
    line-height:1.42!important;
  }
  .fol-sms-dialog .core-auth-sms-head p{
    font-size:8.6px!important;
    line-height:1.5!important;
  }
  .fol-sms-dialog .core-auth-sms-badge{
    min-height:19px!important;
    padding:0 7px!important;
    font-size:7.7px!important;
  }

  .fol-sms-dialog form{gap:7px!important}
  .fol-sms-dialog label{gap:3px!important}
  .fol-sms-dialog label>span{font-size:8.8px!important}

  .fol-sms-dialog input{
    height:39px!important;
    border-radius:11px!important;
    font-size:11.5px!important;
    padding-inline:10px!important;
  }
  .fol-sms-phone-field{
    grid-template-columns:52px 1fr!important;
    border-radius:11px!important;
  }
  .fol-sms-phone-prefix{
    height:37px!important;
    font-size:9.7px!important;
  }
  .core-auth-phone-hint{
    font-size:7.4px!important;
    line-height:1.35!important;
  }

  .fol-sms-dialog .core-auth-otp-input{
    height:39px!important;
    font-size:17px!important;
    letter-spacing:.30em!important;
  }
  .fol-sms-dialog .core-auth-sms-primary{
    height:40px!important;
    border-radius:11px!important;
    font-size:10.4px!important;
  }
  .fol-sms-dialog .core-auth-sms-tools{
    margin-top:0!important;
    padding-top:1px!important;
  }
  .fol-sms-dialog .core-auth-sms-tools button{font-size:8.2px!important}
  .fol-sms-dialog .core-auth-sms-error{
    margin-top:5px!important;
    padding:7px 8px!important;
    font-size:8.4px!important;
    line-height:1.45!important;
  }
  .fol-sms-security{
    margin-top:5px!important;
    font-size:7.2px!important;
  }

  /* Profile still fits: first/last remain side-by-side on mobile. */
  .fol-sms-dialog .core-auth-sms-profile-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:6px!important;
  }

  /* When keyboard opens, remove non-essential chrome instead of scrolling the modal. */
  body.auth-keyboard-open .fol-sms-brand,
  body.auth-keyboard-open .fol-sms-stepper,
  body.auth-keyboard-open .fol-sms-security{
    display:none!important;
  }
  body.auth-keyboard-open .fol-sms-dialog{
    max-height:calc(var(--sms-vh,100dvh) - 6px)!important;
    padding-top:9px!important;
    border-radius:15px!important;
  }
  body.auth-keyboard-open .fol-sms-dialog .core-auth-sms-head p{
    display:none!important;
  }
  body.auth-keyboard-open .fol-sms-dialog .core-auth-sms-head h4{
    font-size:12px!important;
  }
}

@media(max-width:370px){
  .fol-sms-dialog{padding-inline:9px!important}
  .fol-sms-dialog .core-auth-sms-profile-grid{gap:4px!important}
  .fol-sms-dialog input{font-size:10.8px!important}
}
