/* Premium Auth UI (keeps your header) */
.premium-auth{
  position: relative;
  min-height: 100vh;
  overflow: hidden;
}

/* Background layers */
.premium-bg{
  position: fixed;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(900px 600px at 15% 15%, rgba(99,102,241,0.26), transparent 60%),
    radial-gradient(900px 600px at 85% 70%, rgba(16,185,129,0.20), transparent 60%),
    radial-gradient(700px 450px at 70% 20%, rgba(236,72,153,0.14), transparent 55%),
    linear-gradient(180deg, rgba(249,250,251,1), rgba(243,244,246,1));
}

.premium-bg .blob{
  position:absolute;
  width: 560px;
  height: 560px;
  filter: blur(28px);
  opacity: 0.55;
  transform: translateZ(0);
}

.premium-bg .blob-1{
  top: -160px;
  left: -140px;
  fill: rgba(99,102,241,0.65);
}

.premium-bg .blob-2{
  bottom: -190px;
  right: -160px;
  fill: rgba(16,185,129,0.55);
}

.premium-bg .grid{
  position:absolute;
  top: 90px;
  right: 90px;
  width: 220px;
  height: 220px;
  opacity: 0.18;
  fill: rgba(17,24,39,0.45);
}

.premium-bg .noise{
  position:absolute;
  inset:0;
  opacity: .06;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

/* Make sure your content sits above background */
.custom-login-inner{ position: relative; z-index: 2; }

/* Keep header but make it premium */
.dash-header .navbar.default{
  background: rgba(255,255,255,0.55);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(17,24,39,0.06);
}

/* Premium wrapper spacing */
.premium-wrapper{
  padding-top: 28px;
  padding-bottom: 36px;
}

.premium-row{
  display:flex;
  justify-content:center;
}

/* Premium card */
.premium-card{
  width: min(520px, 92vw);
  border-radius: 22px;
  border: 1px solid rgba(17,24,39,0.10);
  background: rgba(255,255,255,0.70);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow:
    0 20px 60px rgba(17,24,39,0.16),
    0 1px 0 rgba(255,255,255,0.6) inset;
}

.premium-card-inner{
  padding: 26px 26px 20px;
}

/* Inputs & buttons look more premium */
.premium-card .form-label{
  font-weight: 700;
  color: rgba(17,24,39,0.88);
}

.premium-card .form-control{
  border-radius: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(17,24,39,0.10);
  background: rgba(255,255,255,0.78);
}

.premium-card .form-control:focus{
  box-shadow: 0 0 0 4px rgba(99,102,241,0.16);
  border-color: rgba(99,102,241,0.35);
}

.premium-card .btn{
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 800;
  letter-spacing: 0.01em;
}

/* Footer cleaner */
.auth-footer{
  opacity: .9;
}

/* Dark mode support (your app uses cust_darklayout) */
body.theme-dark .dash-header .navbar.default,
body.dark .dash-header .navbar.default{
  background: rgba(17,24,39,0.55);
  border-bottom: 1px solid rgba(255,255,255,0.10);
}

body.theme-dark .premium-bg,
body.dark .premium-bg{
  background:
    radial-gradient(900px 600px at 15% 15%, rgba(99,102,241,0.25), transparent 60%),
    radial-gradient(900px 600px at 85% 70%, rgba(16,185,129,0.18), transparent 60%),
    radial-gradient(700px 450px at 70% 20%, rgba(236,72,153,0.12), transparent 55%),
    linear-gradient(180deg, rgba(3,7,18,1), rgba(17,24,39,1));
}

body.theme-dark .premium-card,
body.dark .premium-card{
  background: rgba(17,24,39,0.62);
  border: 1px solid rgba(255,255,255,0.10);
  color: rgba(255,255,255,0.88);
}

body.theme-dark .premium-card .form-control,
body.dark .premium-card .form-control{
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.90);
}