/* =========================================================================
 *  ATOM ISP — Login-page theme overlay (admin-portal)
 *  Re-themes the dark-blue/purple gradient into a clean
 *  dark-red + light-grey surface to match the public-portal brand.
 *  Loaded AFTER e1-modern.css / inline <style> so the !important here wins.
 * ========================================================================= */

:root{
  --brand-500:#b91c1c !important;
  --brand-600:#a01020 !important;
  --brand-700:#7f1d1d !important;
  --accent-400:#f59e0b !important;
  --ink-900:#1f2937 !important;
  --ink-700:#374151 !important;
  --ink-500:#4b5563 !important;
  --ink-300:#9ca3af !important;
  --line:#e5e7eb !important;
  --surface:#f4f5f7 !important;
}

/* Body & whole page background light grey */
html,body{
  background:#f4f5f7 !important;
  color:#1f2937 !important;
}

/* ── ATOM ISP top nav (full width, light pill — matches public-portal) ─── */
.atom-nav--standalone{
  position:sticky !important;
  top:0 !important;
  z-index:60 !important;
  background:#ffffff !important;
  border-bottom:1px solid #e5e7eb !important;
  width:100% !important;
  margin:0 0 28px 0 !important;
  padding:14px 24px !important;
  display:flex !important;
  box-shadow:0 6px 20px rgba(127,29,29,.05) !important;
}
.atom-nav--standalone .atom-nav-container{max-width:1280px !important;margin:0 auto !important;width:100% !important;}
.atom-nav--standalone .atom-nav-inner{
  display:flex !important;align-items:center !important;gap:14px !important;
  background:#fff !important;border:1px solid #f3f4f6 !important;
  border-radius:999px !important;padding:8px 16px !important;
  box-shadow:0 4px 14px rgba(127,29,29,.04) !important;
}
.atom-nav--standalone .atom-nav-mark img{height:30px !important;width:auto !important;display:block !important;}
.atom-nav--standalone .atom-nav-links{
  display:flex !important;gap:4px !important;list-style:none !important;padding:0 !important;margin:0 auto !important;
}
.atom-nav--standalone .atom-nav-links li a{
  display:inline-block !important;padding:8px 14px !important;font-weight:600 !important;font-size:.92rem !important;
  color:#374151 !important;border-radius:999px !important;transition:background .2s ease,color .2s ease !important;
  text-decoration:none !important;
}
.atom-nav--standalone .atom-nav-links li a:hover{
  color:#b91c1c !important;background:#fee2e2 !important;
}
.atom-nav--standalone .atom-nav-cta{
  display:flex !important;align-items:center !important;gap:8px !important;
}
.atom-nav--standalone .atom-lang-btn{
  border:1px solid #e5e7eb !important;background:#fff !important;
  border-radius:999px !important;padding:8px 14px !important;font-weight:600 !important;color:#374151 !important;
  display:inline-flex !important;align-items:center !important;gap:6px !important;
}
.atom-nav--standalone .atom-nav-cta .e1-btn{
  padding:8px 14px !important;border-radius:999px !important;font-weight:600 !important;
  text-decoration:none !important;font-size:.92rem !important;display:inline-flex !important;align-items:center !important;
}
.atom-nav--standalone .atom-nav-cta .e1-btn-ghost{border:1px solid #e5e7eb !important;color:#374151 !important;background:#fff !important;}
.atom-nav--standalone .atom-nav-cta .e1-btn-red{background:#b91c1c !important;color:#fff !important;border:0 !important;}
.atom-nav--standalone .atom-nav-cta .e1-btn-red:hover{background:#a01020 !important;}
.atom-nav--standalone .atom-nav-burger{
  display:none !important;border:0 !important;background:transparent !important;width:32px !important;height:32px !important;padding:0 !important;
  flex-direction:column !important;gap:5px !important;align-items:center !important;justify-content:center !important;
}
.atom-nav--standalone .atom-nav-burger span{width:22px !important;height:2px !important;background:#374151 !important;border-radius:2px !important;display:block !important;}

@media (max-width:980px){
  .atom-nav--standalone .atom-nav-links{display:none !important;}
  .atom-nav--standalone .atom-nav-burger{display:flex !important;}
  .atom-nav--standalone .atom-nav-cta .atom-nav-signin{display:none !important;}
}

.page{background:#f4f5f7 !important;}

/* Left "panel" — full dark-red gradient (instead of dark navy+purple) */
.panel{
  color:#fff !important;
  background:
    radial-gradient(900px 500px at 85% 0%, rgba(192,27,44,.40), transparent 60%),
    radial-gradient(700px 400px at 0% 100%, rgba(127,29,29,.30), transparent 60%),
    linear-gradient(135deg,#3a0a12 0%,#7f1d1d 45%,#a01020 100%) !important;
}
.panel::before{background-image:none !important;opacity:.0 !important;}
.panel::after{background:linear-gradient(180deg,transparent 0%,rgba(58,10,18,.05) 40%,rgba(58,10,18,.55) 100%) !important;}
.p-headline h2{
  background:linear-gradient(180deg,#fff,#ffd9dc) !important;
  -webkit-background-clip:text !important;background-clip:text !important;color:transparent !important;
}
.p-headline p,.feature-list li,.int-chip{color:rgba(255,255,255,.92)!important;}
.int-chip{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.18)!important;}
.stat-card{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.18)!important;}
.stat-card strong{color:#fff!important;}
.stat-card span{color:rgba(255,255,255,.78)!important;}
.feature-list li i{color:#fbbf24!important;}
.p-eyebrow{background:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.20)!important;color:#ffe4e6!important;}
.p-eyebrow .dot{background:#fbbf24!important;box-shadow:0 0 0 4px rgba(251,191,36,.20)!important;}

/* Brand badge in panel header — replace blue square with red */
.brand{color:#fff!important;}
.brand-logo{background:linear-gradient(135deg,#b91c1c,#7f1d1d)!important;box-shadow:0 10px 30px rgba(185,28,28,.45)!important;}

/* Form wrap stays white but brand chrome goes red */
.form-side{background:#f4f5f7!important;}
.form-wrap{background:#fff!important;border:1px solid #e5e7eb!important;box-shadow:0 25px 60px rgba(127,29,29,.18)!important;}
.form-top a{color:#4b5563!important;}
.form-top a:hover{color:#b91c1c!important;}
.form-wrap h1{color:#1f2937!important;}
.form-wrap .subtitle{color:#4b5563!important;}

.role-grid{background:#f4f5f7!important;border-color:#e5e7eb!important;}
.role.active{background:#fff!important;color:#1f2937!important;box-shadow:0 2px 8px rgba(185,28,28,.10)!important;}
.role.active i{color:#b91c1c!important;}

.form-control{border-color:#e5e7eb!important;color:#1f2937!important;background:#fff!important;}
.form-control:focus{border-color:#b91c1c!important;box-shadow:0 0 0 4px rgba(185,28,28,.15)!important;}
.field i.field-ico{color:#6b7280!important;}
.field .toggle-pw{color:#6b7280!important;}
.field .toggle-pw:hover{color:#b91c1c!important;}
.field label{color:#374151!important;}

.row-inline label{color:#374151!important;}
.row-inline a{color:#b91c1c!important;}

/* Primary submit button — red gradient */
.btn-submit,.btn-copyauth,.btn-login-primary,.btn-primary,.btn-red,
button[type="submit"]{
  background:linear-gradient(135deg,#b91c1c,#c01b2c 60%,#7f1d1d)!important;
  color:#fff!important;border:0!important;
  box-shadow:0 14px 30px rgba(185,28,28,.40)!important;
}
.btn-submit:hover,button[type="submit"]:hover{
  background:linear-gradient(135deg,#a01020,#b91c1c)!important;
  box-shadow:0 20px 40px rgba(185,28,28,.50)!important;
}

.form-footer{color:#4b5563!important;}
.form-footer a{color:#b91c1c!important;}
.secure{color:#4b5563!important;}
.secure i{color:#fbbf24!important;}

.alert-err{background:#fef2f2!important;color:#b91c1c!important;border-color:#fecaca!important;}

/* Reset-password & forgot-wifi modals header */
.block-head{background:linear-gradient(135deg,#b91c1c,#7f1d1d)!important;color:#fff!important;}
.block-actions .btn-copy-upi{background:#b91c1c!important;color:#fff!important;}
.block-actions .btn-close-block{background:#e5e7eb!important;color:#374151!important;}

/* Responsive */
@media (max-width:992px){
  .page{grid-template-columns:1fr!important;}
  .panel{padding:32px 24px!important;}
  .form-side{padding:32px 20px!important;}
}
@media (max-width:480px){
  .role-grid{grid-template-columns:repeat(2,1fr)!important;}
  .stat-row{grid-template-columns:1fr 1fr!important;}
}