/* WCHAT.DIGITAL Premium Login - v2 */
@keyframes wchat-orb{0%,100%{transform:scale(1) translateY(0);opacity:.85}40%{transform:scale(1.08) translateY(-30px);opacity:1}70%{transform:scale(.95) translateY(14px);opacity:.75}}
@keyframes wchat-fade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

html,body{background:#070714!important}

#app>main{
  background:linear-gradient(135deg,#070714 0%,#0d0d2b 35%,#0a1628 65%,#0d0a1e 100%)!important;
  min-height:100vh!important;
}

/* Left panel - remove gradient */
#app>main>section.hidden{
  background:none!important;
  background-image:none!important;
  background-color:transparent!important;
}
#app>main>section.hidden img{opacity:.25!important;mix-blend-mode:luminosity!important;}

/* Grid dots */
#app>main>section.hidden::before{
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(rgba(99,102,241,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(99,102,241,.05) 1px,transparent 1px);
  background-size:56px 56px;pointer-events:none;z-index:1;
}

/* Orb animation */
#app>main>section.hidden::after{
  content:"";position:absolute;
  width:600px;height:600px;top:-180px;left:-180px;
  background:radial-gradient(circle,rgba(99,102,241,.22) 0%,transparent 65%);
  border-radius:50%;animation:wchat-orb 9s ease-in-out infinite;pointer-events:none;z-index:1;
}

/* Right panel */
#app>main>section.flex-1{background:transparent!important;}
#app>main>section.flex-1>div{animation:wchat-fade .55s cubic-bezier(.16,1,.3,1) both;}

/* Form card glass effect */
#app>main>section.flex-1>div>div{
  background:rgba(255,255,255,.04)!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:24px!important;
  padding:32px!important;
  backdrop-filter:blur(28px)!important;
  box-shadow:0 32px 64px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.07)!important;
}

/* Headings */
#app>main h1{color:#fff!important;font-weight:900!important;}
#app>main p.text-n-slate-11,#app>main .text-n-slate-11{color:rgba(165,180,252,.65)!important;}

/* Labels */
#app>main label{color:rgba(199,210,254,.8)!important;font-size:.8125rem!important;font-weight:500!important;}

/* Inputs */
#app>main .\\!bg-slate-50,
#app>main input[class*="bg-slate"],
#app>main .form-input{
  background-color:rgba(255,255,255,.06)!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:14px!important;
  color:#fff!important;
  --tw-ring-color:transparent!important;
}
#app>main .\\!bg-slate-50:focus,
#app>main input[class*="bg-slate"]:focus{
  background-color:rgba(255,255,255,.09)!important;
  background:rgba(255,255,255,.09)!important;
  border-color:rgba(99,102,241,.7)!important;
  box-shadow:0 0 0 3px rgba(99,102,241,.2)!important;
}
#app>main input::placeholder{color:rgba(255,255,255,.3)!important;}

/* Submit button */
#app>main button[type=submit],#app>main button[data-testid=submit_button]{
  background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%)!important;
  background-image:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%)!important;
  box-shadow:0 8px 32px rgba(99,102,241,.5),0 2px 8px rgba(0,0,0,.3)!important;
  border:none!important;border-radius:14px!important;
  color:#fff!important;font-weight:700!important;
  transition:all .2s ease!important;
}
#app>main button[type=submit]:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 14px 40px rgba(99,102,241,.6),0 4px 12px rgba(0,0,0,.3)!important;
}

/* Indigo button override (NextButton) */
#app>main .\\!bg-indigo-600,
#app>main [class*="bg-indigo"]{
  background:linear-gradient(135deg,#6366f1,#8b5cf6)!important;
  background-color:#6366f1!important;
}

/* Google/SSO buttons */
#app>main a[class*="inline-flex"][class*="justify-center"],
#app>main a[class*="rounded-xl"][class*="border"]{
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.1)!important;
  color:rgba(255,255,255,.9)!important;
  border-radius:14px!important;
}
#app>main a[class*="inline-flex"]:hover{background:rgba(255,255,255,.1)!important;}

/* Dividers and text */
#app>main .bg-n-slate-1{background:transparent!important;}
#app>main .border-n-slate-3{border-color:rgba(255,255,255,.08)!important;}
#app>main .text-n-slate-10{color:rgba(165,180,252,.5)!important;}

/* Links */
#app>main a.text-indigo-600,#app>main a[class*="indigo"]{color:#818cf8!important;}
#app>main .text-xs.font-medium{color:rgba(165,180,252,.75)!important;}

/* Signup text */
#app>main .text-center.text-sm{color:rgba(165,180,252,.6)!important;}
#app>main .text-center a{color:#818cf8!important;font-weight:600!important;}