/* ================================================================
   GVS AUTH SKIN v2 — dark revamp theme
   Loaded on /login and /signup (layouts.revamp)
   Scoped to .login-section — no Bootstrap CSS needed
   ================================================================ */

/* ── Bootstrap utility stubs (no Bootstrap CSS loaded) ─────────── */
.d-flex{display:flex}.d-none{display:none}
.justify-content-between{justify-content:space-between}
.align-items-center{align-items:center}
.p-0{padding:0}.mt-4{margin-top:1.5rem}

/* ── Minimal modal CSS (Bootstrap JS handles show/hide logic) ───── */
.modal{display:none;position:fixed;inset:0;z-index:9999;overflow-y:auto;
  padding:20px}
.modal.show{display:flex;align-items:center;justify-content:center}
.modal-dialog{position:relative;width:100%;max-width:560px;margin:auto;pointer-events:none}
.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - 40px)}
.modal-content{position:relative;width:100%;pointer-events:auto;
  background:#0D1220;border:1px solid rgba(255,255,255,.1);
  border-radius:20px;color:#CBD5E1;overflow:hidden}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9998}
.modal-backdrop.fade{opacity:0;transition:opacity .15s linear}
.modal-backdrop.show{opacity:1}
.btn-close{
  width:28px;height:28px;border:none;background:none;cursor:pointer;
  position:absolute;right:16px;top:16px;z-index:2;opacity:.6;
  display:flex;align-items:center;justify-content:center;
  color:#F1F5F9;font-size:20px;line-height:1;
}
.btn-close::before{content:'×'}
.btn-close:hover{opacity:1}
.modal-content .loginform{display:block}
.modal-content .loginform-img{display:none}
.modal-content .loginform-content{background:transparent!important;padding:36px!important}
.modal-content h4{font-size:1.25rem;font-weight:700;color:#F1F5F9;margin-bottom:22px;
  font-family:'Poppins',sans-serif}

/* ── Body global (full-screen auth, no old chrome) ───────────────  */
html,body,body.gvs-auth-body{
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  margin:0!important;padding:0!important;background:#080C18!important;
}
/* hide any leftover old layout chrome if present */
.gvs-auth-body > header,.gvs-auth-body .skylinebg,.gvs-auth-body > footer{display:none!important}

/* ── Page wrapper ────────────────────────────────────────────────── */
.login-section{
  --a-sky:#0EA5E9;--a-sky-d:#38BDF8;--a-orange:#F97316;
  --a-ink:#F1F5F9;--a-text:#CBD5E1;--a-muted:#94A3B8;--a-dim:#475569;
  --a-border:rgba(255,255,255,.08);--a-border2:rgba(255,255,255,.12);
  --a-bg2:rgba(255,255,255,.04);--a-green:#22C55E;
  font-family:'Poppins',-apple-system,sans-serif;
  background:#080C18;
  min-height:100vh;
  display:flex;align-items:center;
  padding:40px 0;
  position:relative;
}
.login-section::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse at 5% 60%,rgba(14,165,233,.12) 0,transparent 50%),
    radial-gradient(ellipse at 95% 40%,rgba(15,181,192,.08) 0,transparent 50%);
}
.login-section .container{
  max-width:980px;margin:0 auto;padding:0 20px;width:100%;
  position:relative;z-index:1;
}

/* ── Card ─────────────────────────────────────────────────────────── */
.login-section .loginform{
  display:grid;grid-template-columns:.88fr 1.12fr;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;overflow:hidden;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  box-shadow:0 40px 80px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.03) inset;
  align-items:stretch;
}

/* ── Left brand panel ─────────────────────────────────────────────── */
.login-section .loginform-text{
  background:linear-gradient(150deg,#0E1B33 0%,#0B3A66 55%,#0369A1 100%);
  padding:48px 40px;display:flex;flex-direction:column;
  justify-content:flex-start;position:sticky;top:72px;
  align-self:start;overflow:hidden;min-height:460px;
}
.login-section .loginform-text::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(circle at 80% 15%,rgba(15,181,192,.32) 0,transparent 46%),
    radial-gradient(circle at 10% 90%,rgba(249,115,22,.22) 0,transparent 46%);
}
.login-section .loginform-text>*{position:relative;z-index:1}
.login-section .loginform-text h3,
.login-section .loginform-text h2,
.login-section .loginform-text h4{
  font-size:clamp(1.4rem,2.2vw,1.9rem);font-weight:800;
  line-height:1.2;letter-spacing:-.02em;margin:0 0 22px;color:#fff;
}
.login-section .loginform-text p{color:rgba(255,255,255,.75);font-size:14px;line-height:1.6}
.login-section .loginform-text ul{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:14px;
}
.login-section .loginform-text ul li{
  display:flex;align-items:center;gap:12px;
  font-size:14.5px;color:rgba(255,255,255,.9);font-weight:500;
}
.login-section .loginform-text ul li img{
  width:20px;height:20px;
  filter:brightness(0) invert(1);opacity:.85;flex-shrink:0;
}
/* SVG check icons from admin CMS */
.login-section .loginform-text ul li svg{width:20px;height:20px;flex-shrink:0;color:#0EA5E9}

/* ── Right form panel ─────────────────────────────────────────────── */
.login-section .loginform-content{
  padding:44px 44px 36px;
  background:rgba(13,18,32,.94);
  display:flex;flex-direction:column;
}

/* ── Auth trust list (left panel) ────────────────────────────────── */
.login-section .auth-logo{
  width:130px;margin-bottom:28px;
  filter:brightness(0) invert(1);opacity:.95;
}
.login-section .auth-trust{
  list-style:none;padding:0;margin:0 0 auto;
  display:flex;flex-direction:column;gap:16px;
}
.login-section .auth-trust li{
  display:flex;align-items:center;gap:13px;
}
.login-section .auth-trust-ic{
  width:38px;height:38px;border-radius:10px;flex-shrink:0;
  background:rgba(255,255,255,.12);display:flex;
  align-items:center;justify-content:center;
}
.login-section .auth-trust-ic svg{color:#fff;opacity:.9}
.login-section .auth-trust strong{
  display:block;font-size:13.5px;font-weight:700;color:#fff;line-height:1.3;
}
.login-section .auth-trust span{font-size:12px;color:rgba(255,255,255,.55)}
.login-section .auth-badge{
  font-size:11px;font-weight:600;color:rgba(255,255,255,.45);
  letter-spacing:.4px;padding-top:20px;margin-top:24px;
  border-top:1px solid rgba(255,255,255,.12);
}
/* Page heading above tabs */
.login-section .auth-page-hd{margin-bottom:22px}
.login-section .auth-page-hd h2{font-size:21px;font-weight:800;color:#F1F5F9;margin:0 0 4px}
.login-section .auth-page-hd p{font-size:13.5px;color:#94A3B8;margin:0}

/* ── Tabs ─────────────────────────────────────────────────────────── */
.login-section .nav-tabs{
  border:none;
  background:rgba(255,255,255,.04);
  outline:1px solid rgba(255,255,255,.08);
  border-radius:100px;padding:5px;
  display:flex;gap:4px;margin-bottom:28px;
}
.login-section .nav-tabs,.login-section .nav-tabs ul{list-style:none;padding:0;margin:0}
.login-section .nav-tabs .nav-item{flex:1;margin:0;list-style:none}
.login-section .nav-tabs .nav-link{
  width:100%;border:none!important;border-radius:100px!important;
  padding:11px 10px;font-size:13px;font-weight:700;
  color:var(--a-muted);background:none;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:.2s;cursor:pointer;font-family:inherit;
}
.login-section .nav-tabs .nav-link:focus{outline:none;box-shadow:none}
.login-section .nav-tabs .nav-link figure{margin:0;line-height:0}
.login-section .nav-tabs .nav-link figure img{
  width:18px;height:18px;opacity:.4;
  filter:brightness(0) invert(1);transition:.2s;
}
.login-section .nav-tabs .nav-link.active{
  background:var(--a-sky);color:#fff;
  box-shadow:0 6px 20px rgba(14,165,233,.35);
}
.login-section .nav-tabs .nav-link.active figure img{opacity:1}

/* Tab pane: Bootstrap JS adds/removes .active + .show */
.login-section .tab-content>.tab-pane{display:none}
.login-section .tab-content>.tab-pane.active{display:block}

/* Scroll override */
.login-section .boxheight{max-height:none!important;padding-right:4px}

/* ── Form base ────────────────────────────────────────────────────── */
.login-section .form-group{margin-bottom:16px;position:relative}
.login-section label,
.login-section .form-label,
.login-section .form-group>label{
  font-size:12px;font-weight:600;color:var(--a-muted);
  margin-bottom:7px;display:block;letter-spacing:.3px;
}
.login-section .required{color:var(--a-orange)}

.login-section .form-control{
  width:100%;padding:13px 16px;
  border:1.5px solid rgba(255,255,255,.1);
  border-radius:12px;font-size:15px;
  font-family:'Poppins',-apple-system,sans-serif;
  color:var(--a-ink);background:rgba(255,255,255,.05);
  outline:none;transition:border .2s,box-shadow .2s,background .2s;
  height:auto;line-height:1.4;
  -webkit-appearance:none;appearance:none;
  box-sizing:border-box;
}
.login-section .form-control:focus{
  border-color:var(--a-sky);
  box-shadow:0 0 0 3px rgba(14,165,233,.15);
  background:rgba(14,165,233,.04);
}
.login-section .form-control::placeholder{color:var(--a-dim)}
.login-section input.form-control:-webkit-autofill{
  -webkit-box-shadow:0 0 0 100px #0D1525 inset;
  -webkit-text-fill-color:#F1F5F9;caret-color:#F1F5F9;
}

/* native select dark */
.login-section select.form-control option{background:#0D1220;color:var(--a-ink)}
.login-section select.form-control{
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;
  padding-right:40px;cursor:pointer;
}

/* ── intl-tel-input ──────────────────────────────────────────────── */
.login-section .iti{width:100%}
.login-section .iti .form-control{padding-left:56px}
.login-section .iti__flag-container{z-index:2}
.login-section .iti__selected-flag{
  background:rgba(255,255,255,.06)!important;
  border-radius:10px 0 0 10px;
  border-right:1px solid rgba(255,255,255,.1);
  padding:0 10px;
}
.login-section .iti__country-list{
  background:#0D1220!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:12px;color:var(--a-text)!important;
  box-shadow:0 20px 40px rgba(0,0,0,.6);
}
.login-section .iti__country.iti__highlight,
.login-section .iti__country:hover{background:rgba(14,165,233,.15)!important}
.login-section .iti__dial-code{color:var(--a-muted)}
.login-section .iti__country-name{color:var(--a-text)}
.login-section .iti__search-input{
  background:rgba(255,255,255,.05)!important;
  border:1px solid rgba(255,255,255,.1)!important;
  border-radius:8px!important;color:var(--a-ink)!important;
}

/* ── select2 ─────────────────────────────────────────────────────── */
.login-section .select2-container{width:100%!important}
.login-section .select2-container--default .select2-selection--single{
  background:rgba(255,255,255,.05)!important;
  border:1.5px solid rgba(255,255,255,.1)!important;
  border-radius:12px!important;height:49px!important;
  display:flex;align-items:center;
}
.login-section .select2-container--default .select2-selection--single .select2-selection__rendered{
  color:var(--a-ink)!important;padding:0 40px 0 16px!important;line-height:46px!important;
}
.login-section .select2-container--default .select2-selection__arrow{top:10px!important;right:10px!important}
.login-section .select2-container--default.select2-container--focus .select2-selection--single{
  border-color:var(--a-sky)!important;
  box-shadow:0 0 0 3px rgba(14,165,233,.15)!important;
}
/* select2 dropdown (not scoped — renders outside .login-section) */
.select2-dropdown{
  background:#0D1220!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:12px!important;
  box-shadow:0 20px 40px rgba(0,0,0,.6)!important;
}
.select2-container--default .select2-results__option{
  color:#CBD5E1!important;padding:10px 14px!important;
}
.select2-container--default .select2-results__option--highlighted{
  background:#0EA5E9!important;color:#fff!important;
}
.select2-search--dropdown .select2-search__field{
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.1)!important;
  border-radius:8px!important;color:#F1F5F9!important;
  padding:8px 12px!important;
}
.select2-search--dropdown .select2-search__field:focus{
  outline:none;border-color:#0EA5E9!important;
}

/* ── Password reveal + tooltip ───────────────────────────────────── */
.login-section .tooltipHelp{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--a-dim);z-index:3}
.login-section .custominput{position:relative;display:flex;align-items:center}
.login-section .custominput .form-control{padding-right:44px}
.login-section .reveal,.login-section .view_password{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  color:var(--a-muted);cursor:pointer;z-index:3;
  background:none;border:none;padding:0;line-height:1;
}
.login-section .reveal i,.login-section .view_password i{color:var(--a-muted);font-size:15px;line-height:1}

/* ── Remember + forgot row ───────────────────────────────────────── */
.login-section .form-check{display:flex;align-items:center;gap:8px;padding:0;
  margin-top:10px}
.login-section .form-check label,
.login-section .form-check .label{
  font-size:13px;color:var(--a-text);margin:0;cursor:pointer;font-weight:400;
}
.login-section .form-check input[type="checkbox"]{
  width:16px;height:16px;border-radius:4px;
  accent-color:var(--a-sky);cursor:pointer;flex-shrink:0;
}
.login-section .forgotpassword a{
  color:var(--a-sky-d);font-weight:600;font-size:13px;text-decoration:none;
}
.login-section .forgotpassword a:hover{text-decoration:underline}

/* ── Primary button ──────────────────────────────────────────────── */
.login-section .btn.btn-primary,
.login-section .btn-primary.fullbtn{
  width:100%;padding:14px;
  background:var(--a-orange)!important;color:#fff!important;
  border:none;border-radius:12px;font-size:15px;font-weight:700;
  cursor:pointer;transition:.25s;
  box-shadow:0 10px 26px rgba(249,115,22,.3);margin-top:4px;
  font-family:inherit;letter-spacing:.2px;display:block;text-align:center;
}
.login-section .btn.btn-primary:hover,
.login-section .btn-primary.fullbtn:hover{
  background:#FB923C!important;transform:translateY(-1px);
  box-shadow:0 14px 32px rgba(249,115,22,.4);
}

/* ── Social login ────────────────────────────────────────────────── */
.login-section .social-login{display:flex;gap:12px;margin-top:6px}
.login-section .social-login .btn-outline{
  flex:1;display:flex;align-items:center;justify-content:center;
  gap:8px;padding:11px;
  border:1.5px solid rgba(255,255,255,.12);
  border-radius:12px;font-size:13px;font-weight:600;
  color:var(--a-text)!important;background:rgba(255,255,255,.04);
  transition:.2s;text-decoration:none;
}
.login-section .social-login .btn-outline:hover{
  border-color:var(--a-sky);background:rgba(14,165,233,.08);
}
.login-section .social-login .btn-outline b{
  display:flex;align-items:center;gap:8px;font-weight:600;color:inherit;
}
.login-section .social-login .btn-outline img{width:18px;height:18px}

/* ── Sign-up / log-in link row ───────────────────────────────────── */
.login-section .form-group p{
  font-size:13px;color:var(--a-muted);text-align:center;margin:12px 0 0;
}
.login-section .form-group p a{color:var(--a-sky-d);font-weight:600;text-decoration:none}
.login-section .form-group p a:hover{text-decoration:underline}
.login-section .form-group p strong{color:var(--a-text);font-weight:600}

/* ── Errors ──────────────────────────────────────────────────────── */
.login-section .error.help-inline,
.login-section .help-inline.error{
  color:#F87171;font-size:12px;display:block;margin-top:4px;
}

/* ── Documents heading (agent signup) ───────────────────────────── */
.login-section .required-heading{
  font-size:13px;font-weight:700;color:var(--a-text);
  margin:22px 0 12px;padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
}

/* ── File upload ─────────────────────────────────────────────────── */
.login-section .custominput.form-control{
  display:flex;align-items:center;gap:10px;padding:10px 10px 10px 14px;
  border:1.5px dashed rgba(255,255,255,.15);
  background:rgba(255,255,255,.03);cursor:pointer;min-height:50px;
  position:relative;overflow:hidden;
}
.login-section .custominput .placeholdertext{
  font-size:13px;color:var(--a-muted);flex:1;order:-1;pointer-events:none;
}
/* Completely hide browser default file button — overlay it invisible */
.login-section .custominput input[type=file]{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;cursor:pointer;z-index:2;font-size:0;
}
/* Attachment icon button */
.login-section .custominput>a{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;flex-shrink:0;
  background:rgba(255,255,255,.1);
  border-radius:8px;
  border:1px solid rgba(255,255,255,.15);
  transition:.2s;pointer-events:none;z-index:1;
}
.login-section .custominput>a:hover{background:rgba(14,165,233,.2);border-color:var(--a-sky)}
.login-section .custominput img{
  width:18px;height:18px;
  filter:brightness(0) invert(1);opacity:.7;
}

/* ── Flash alerts ────────────────────────────────────────────────── */
.login-section .alert,
.alert-login-wrap .alert{
  border-radius:10px;padding:12px 18px;margin-bottom:16px;font-size:14px;
  position:relative;z-index:1;
}
.login-section .alert-success{
  background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.2);color:#4ADE80;
}
.login-section .alert-danger,
.login-section .alert-error{
  background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.2);color:#F87171;
}

/* ── Responsive ──────────────────────────────────────────────────── */
@media(max-width:900px){
  .login-section .loginform{grid-template-columns:1fr;border-radius:20px}
  .login-section .loginform-text{display:none}
  .login-section .loginform-content{padding:32px 28px}
  .login-section{padding:70px 0 50px}
}
@media(max-width:600px){
  .login-section{padding:60px 0 40px;align-items:flex-start}
  .login-section .container{padding:0 12px}
  .login-section .loginform{border-radius:16px}
  .login-section .loginform-content{padding:24px 20px}
  .login-section .nav-tabs .nav-link{font-size:12px;padding:10px 8px;gap:6px}
  .login-section .social-login{gap:8px}
}
@media(max-width:480px){
  .login-section{padding:50px 0 30px}
  .login-section .loginform-content{padding:20px 16px}
  .login-section .social-login{flex-direction:column}
  .login-section .form-control{font-size:16px}
  .login-section .btn.btn-primary,.login-section .btn-primary.fullbtn{padding:15px;font-size:16px}
}