/* ============================================================================
   Gridavera Admin — auth-page brand overlay
   Restyles the sign-in (/login) and sign-up (/signup) cards to match the
   redesigned marketing site (gridavera.com) two-panel auth design.
   COSMETIC ONLY. Does not touch auth logic or the Microsoft SSO button
   handler. Fully reversible: remove the <link>/<script> refs in index.html.
   Marketing tokens are inlined here (admin app uses different token values).
   ============================================================================ */

/* Page canvas — marketing "mist" instead of full-bleed navy */
.gva-login{
  background:#F5F6F8 !important;
  padding:56px 24px !important;
}

/* Two-panel card wrapper (injected by brand-overlay.js) */
.gv-authsplit{
  width:100%;
  max-width:960px;
  display:grid;
  grid-template-columns:1fr 1fr;
  background:#fff;
  border:1px solid #D6D6D6;
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 18px 48px rgba(0,45,70,0.12);
}

/* -------- Right (auth) panel — the original .gva-login__card -------- */
.gv-authsplit .gva-login__card{
  max-width:none !important;
  width:auto !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:#fff !important;
  padding:48px 44px !important;
  gap:0 !important;
  align-items:stretch !important;
  justify-content:center !important;
  text-align:left !important;
}
.gv-authsplit .gva-login__logo-img{
  height:30px !important;
  align-self:flex-start !important;
  margin-bottom:24px !important;
}
.gv-authsplit .gva-login__tagline{
  align-self:flex-start !important;
  font-size:13px !important;
  font-weight:600 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  color:#6E91AE !important;
  margin:0 0 10px !important;
}
.gv-authsplit .gva-login__description{
  text-align:left !important;
  font-size:15px !important;
  color:#5E5E5E !important;
  line-height:1.55 !important;
  margin:0 0 26px !important;
}
/* Microsoft SSO button -> marketing white treatment (4-colour squares stay) */
.gv-authsplit .gva-btn--ms{
  background:#fff !important;
  color:#1A1F24 !important;
  border:1px solid #D6D6D6 !important;
  border-radius:11px !important;
  box-shadow:0 1px 2px rgba(0,45,70,0.06) !important;
  padding:14px 18px !important;
  height:auto !important;
  font-size:15.5px !important;
  font-weight:600 !important;
}
.gv-authsplit .gva-btn--ms:hover:not(:disabled){
  background:#fff !important;
  border-color:#A3BBD0 !important;
  transform:none !important;
}
/* Sign-up "Already have an account?" footer */
.gv-authsplit .gva-login__footer{
  text-align:center !important;
  margin:18px 0 0 !important;
  font-size:13px !important;
  color:#5E5E5E !important;
}
.gv-authsplit .gva-login__footer a{ color:#002D46 !important; font-weight:600 !important; }
.gv-authsplit .gva-login__meta,
.gv-authsplit .gva-login__hint,
.gv-authsplit .gva-login__support{ text-align:center !important; }

/* -------- Left (brand) panel — injected -------- */
.gv-brand-panel{
  position:relative;
  overflow:hidden;
  background:#001B2B;
  padding:48px 44px;
  display:flex;
  flex-direction:column;
  font-family:inherit;
}
.gv-brand-panel .gv-bp-glow{
  position:absolute; top:-100px; right:-80px; width:360px; height:360px;
  background:radial-gradient(circle, rgba(133,164,191,0.30), transparent 64%);
  pointer-events:none;
}
.gv-brand-panel .gv-bp-eyebrow{
  position:relative; font-size:13px; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:#C2D2E0;
}
.gv-brand-panel .gv-bp-head{
  position:relative; margin:14px 0 26px; font-size:30px; line-height:1.18;
  letter-spacing:-0.02em; color:#fff; font-weight:700;
}
.gv-brand-panel .gv-bp-list{ position:relative; display:flex; flex-direction:column; gap:16px; }
.gv-brand-panel .gv-bp-item{ display:flex; align-items:flex-start; gap:12px; }
.gv-brand-panel .gv-bp-ic{
  flex:none; display:inline-flex; width:24px; height:24px; padding:5px;
  border-radius:7px; background:rgba(133,164,191,0.18); color:#C2D2E0;
}
.gv-brand-panel .gv-bp-ic svg{ width:100%; height:100%; }
.gv-brand-panel .gv-bp-t{ font-size:15px; font-weight:600; color:#fff; }
.gv-brand-panel .gv-bp-d{ font-size:13.5px; color:#DFE8F0; line-height:1.5; }
.gv-brand-panel .gv-bp-quote{
  position:relative; margin-top:auto; padding-top:30px; font-size:13px; color:#C2D2E0;
}

/* -------- Mobile: stack to a single column -------- */
@media (max-width:760px){
  .gva-login{ padding:32px 18px !important; }
  .gv-authsplit{ grid-template-columns:1fr; max-width:440px; }
  .gv-brand-panel{ padding:34px 30px; }
  .gv-brand-panel .gv-bp-head{ font-size:23px; margin-bottom:22px; }
  .gv-authsplit .gva-login__card{ padding:34px 30px !important; }
}