
/* RechNext Wa — Light 3D Glass UI layer
   Visual-only overrides. No application/server logic. */
:root{
  --rn-purple:#7c3aed;--rn-purple-2:#a855f7;--rn-pink:#ec4899;
  --rn-blue:#3b82f6;--rn-green:#10b981;--rn-ink:#302b3f;--rn-muted:#716b80;
  --rn-bg:#f7f6fb;--rn-card:rgba(255,255,255,.78);
  --rn-border:rgba(124,58,237,.14);
}
html,html[data-bs-theme="dark"],body{
  background:
    radial-gradient(900px 500px at 8% 0%,rgba(168,85,247,.13),transparent 62%),
    radial-gradient(850px 520px at 94% 12%,rgba(236,72,153,.10),transparent 60%),
    linear-gradient(135deg,#fff 0%,#faf9ff 46%,#f3effb 100%) !important;
  color:var(--rn-ink) !important;
}
body{min-height:100vh;color-scheme:light!important}
body *{--bs-body-color:var(--rn-ink)}
.text-muted,.text-body-secondary,.text-secondary{color:#777080!important}
h1,h2,h3,h4,h5,h6,p,span,small,label,li,td,th,.form-label{color:inherit}

/* Sidebar */
#layout-menu.layout-menu{
  background:linear-gradient(180deg,#6d28d9 0%,#7c3aed 38%,#9333ea 72%,#ec4899 145%) !important;
  border:0!important;
  box-shadow:12px 0 40px rgba(88,28,135,.18),inset -1px 0 rgba(255,255,255,.18)!important;
  color:#fff!important;
}
#layout-menu .app-brand{height:76px!important}
#layout-menu .app-brand-link,#layout-menu .app-brand-text,#layout-menu .menu-header-text,
#layout-menu .menu-link,#layout-menu .menu-link>div,#layout-menu .menu-icon{color:#fff!important}
#layout-menu .menu-header-text{opacity:.78!important;font-weight:700;letter-spacing:.04em}
#layout-menu .menu-inner{padding:8px 10px!important}
#layout-menu .menu-item{margin:4px 0!important}
#layout-menu .menu-link{
  border-radius:13px!important;
  min-height:44px;
  transition:transform .28s ease,background .28s ease,box-shadow .28s ease!important;
}
#layout-menu .menu-link:hover{
  transform:translateX(5px)!important;
  background:linear-gradient(100deg,rgba(255,255,255,.24),rgba(255,255,255,.10))!important;
  box-shadow:0 10px 24px rgba(58,16,106,.18),inset 0 1px rgba(255,255,255,.18)!important;
}
#layout-menu .menu-item.active>.menu-link,#layout-menu .menu-item.open>.menu-link{
  background:linear-gradient(100deg,rgba(255,255,255,.30),rgba(255,255,255,.13))!important;
  box-shadow:0 12px 28px rgba(58,16,106,.20),inset 0 1px rgba(255,255,255,.22)!important;
}
#layout-menu .menu-sub{background:transparent!important}
#layout-menu .menu-sub .menu-link{opacity:.92}

/* Header */
.layout-navbar,.navbar-detached,.layout-navbar-fixed .layout-navbar{
  background:rgba(255,255,255,.70)!important;
  color:var(--rn-ink)!important;
  border:1px solid rgba(255,255,255,.85)!important;
  box-shadow:0 16px 45px rgba(68,45,105,.10),inset 0 1px rgba(255,255,255,.95)!important;
  backdrop-filter:blur(22px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
}
.layout-navbar .navbar-nav .nav-link,.layout-navbar .navbar-brand,.layout-navbar i{color:var(--rn-ink)!important}
.layout-navbar .form-control{color:var(--rn-ink)!important}

/* Main content + glass cards */
.content-wrapper,.layout-page{background:transparent!important}
.card,.accordion-item,.list-group-item{
  background:linear-gradient(145deg,rgba(255,255,255,.90),rgba(255,255,255,.66) 52%,rgba(244,238,255,.74))!important;
  color:var(--rn-ink)!important;
  border:1px solid rgba(124,58,237,.14)!important;
  border-radius:18px!important;
  box-shadow:0 18px 42px rgba(82,52,124,.10),0 5px 18px rgba(236,72,153,.06),inset 0 1px rgba(255,255,255,.96)!important;
  backdrop-filter:blur(18px) saturate(135%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(135%)!important;
}
.card{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease}
.card:before,.card:after{
  content:"";position:absolute;border-radius:999px;pointer-events:none;z-index:0;opacity:.35;
}
.card:before{width:110px;height:110px;right:-45px;bottom:-55px;background:radial-gradient(circle,#ec4899 0 8%,transparent 9%),radial-gradient(circle at 70% 35%,#a855f7 0 7%,transparent 8%);animation:rnBubbleA 8s ease-in-out infinite alternate}
.card:after{width:70px;height:70px;left:-25px;top:-35px;background:radial-gradient(circle,#a855f7 0 9%,transparent 10%);animation:rnBubbleB 7s ease-in-out infinite alternate}
.card>*{position:relative;z-index:1}
.card:hover{
  transform:translateY(-5px)!important;
  border-color:rgba(168,85,247,.28)!important;
  box-shadow:0 26px 55px rgba(82,52,124,.14),0 10px 30px rgba(168,85,247,.10),inset 0 1px rgba(255,255,255,1)!important;
}
@keyframes rnBubbleA{to{transform:translate(-20px,-28px) scale(1.1)}}
@keyframes rnBubbleB{to{transform:translate(24px,30px) scale(1.08)}}

/* Inputs/buttons */
.form-control,.form-select,.input-group-text{
  background:rgba(255,255,255,.78)!important;
  color:var(--rn-ink)!important;
  border:1px solid rgba(113,90,150,.22)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.95)!important;
}
.form-control::placeholder{color:#9a94a5!important}
.form-control:focus,.form-select:focus{
  background:#fff!important;border-color:rgba(124,58,237,.50)!important;
  box-shadow:0 0 0 .2rem rgba(124,58,237,.10),0 8px 22px rgba(124,58,237,.08)!important;
}
.btn{
  border-radius:12px!important;
  transition:transform .28s ease,box-shadow .28s ease,filter .28s ease!important;
}
.btn:hover{transform:translateY(-3px) scale(1.015)!important;box-shadow:0 14px 28px rgba(124,58,237,.18)!important}
.btn-primary,.bg-primary{
  background:linear-gradient(135deg,#7c3aed,#a855f7,#ec4899)!important;
  border-color:transparent!important;color:#fff!important;
}
.btn-outline-primary{border-color:#8b5cf6!important;color:#7c3aed!important}
.btn-outline-primary:hover{background:linear-gradient(135deg,#7c3aed,#ec4899)!important;color:#fff!important}

/* Badges / status */
.badge.bg-gradient{background:linear-gradient(135deg,#7c3aed,#ec4899,#3b82f6)!important}
.bg-success-subtle{background:rgba(16,185,129,.13)!important;color:#059669!important}
.bg-label-primary{background:rgba(124,58,237,.12)!important;color:#6d28d9!important}
.bg-label-danger{background:rgba(236,72,153,.12)!important;color:#db2777!important}

/* Dropdowns */
.dropdown-menu{
  background:rgba(255,255,255,.92)!important;color:var(--rn-ink)!important;
  border:1px solid rgba(124,58,237,.14)!important;
  box-shadow:0 22px 50px rgba(82,52,124,.16)!important;
  backdrop-filter:blur(18px)!important;
}
.dropdown-item{color:var(--rn-ink)!important;border-radius:9px!important}
.dropdown-item:hover{background:linear-gradient(100deg,rgba(124,58,237,.10),rgba(236,72,153,.08))!important}

/* Charts: keep chart area white/light and readable */
.apexcharts-canvas,.apexcharts-svg{background:transparent!important}
.apexcharts-text,.apexcharts-title-text,.apexcharts-legend-text{fill:#665f70!important;color:#665f70!important}
.apexcharts-gridline{stroke:rgba(89,73,116,.12)!important}
.apexcharts-tooltip{
  background:rgba(255,255,255,.96)!important;color:var(--rn-ink)!important;
  border:1px solid rgba(124,58,237,.15)!important;box-shadow:0 15px 35px rgba(82,52,124,.14)!important;
}
.apexcharts-series:nth-child(1) .apexcharts-bar-area,.apexcharts-series:nth-child(1) path{fill:#8b5cf6!important;stroke:#8b5cf6!important}
.apexcharts-series:nth-child(2) .apexcharts-bar-area,.apexcharts-series:nth-child(2) path{fill:#ec4899!important;stroke:#ec4899!important}
.apexcharts-series:nth-child(3) .apexcharts-bar-area,.apexcharts-series:nth-child(3) path{fill:#10b981!important;stroke:#10b981!important}
.apexcharts-series:nth-child(4) .apexcharts-bar-area,.apexcharts-series:nth-child(4) path{fill:#3b82f6!important;stroke:#3b82f6!important}

/* Footer — small, centered */
.rn-glass-footer,.content-footer{
  background:rgba(255,255,255,.62)!important;
  border-top:1px solid rgba(124,58,237,.10)!important;
  color:#81798e!important;
  box-shadow:0 -8px 30px rgba(82,52,124,.05)!important;
  backdrop-filter:blur(16px)!important;
}
.rn-glass-footer{border-radius:16px!important}
.rn-footer-center{width:100%;text-align:center!important;justify-content:center!important;font-size:10px!important;color:#8a8293!important;letter-spacing:.01em}
.rn-footer-center *{font-size:10px!important;color:#8a8293!important}

/* Auth + install */
.rn-auth-footer{
  position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:1000!important;
  display:flex!important;justify-content:center!important;align-items:center!important;gap:10px!important;
  padding:7px 10px!important;font-size:10px!important;color:#80788b!important;
  background:rgba(255,255,255,.72)!important;border-top:1px solid rgba(124,58,237,.10)!important;
  backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;
}
body:has(.install-card),body:has(#intro-screen){
  background:
    radial-gradient(800px 450px at 10% 8%,rgba(168,85,247,.16),transparent 62%),
    radial-gradient(780px 480px at 92% 88%,rgba(236,72,153,.12),transparent 62%),
    linear-gradient(135deg,#fff 0%,#faf9ff 48%,#f2edfb 100%)!important;
}
.install-card.card{
  background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(250,248,255,.80),rgba(244,238,255,.82))!important;
  border:1px solid rgba(124,58,237,.15)!important;
  box-shadow:0 28px 70px rgba(82,52,124,.14),inset 0 1px rgba(255,255,255,.98)!important;
  color:var(--rn-ink)!important;
}
.glass-header{
  background:linear-gradient(135deg,rgba(124,58,237,.10),rgba(236,72,153,.08),rgba(255,255,255,.72))!important;
  border-bottom:1px solid rgba(124,58,237,.10)!important;
  color:var(--rn-ink)!important;
}
.step-icon{
  background:linear-gradient(135deg,#7c3aed,#a855f7,#ec4899)!important;
  color:#fff!important;
  box-shadow:0 12px 24px rgba(124,58,237,.18)!important;
}
.step small,.step-content h5{color:#5f586a!important}
.list-group-item{background:rgba(255,255,255,.72)!important}
#intro-screen{
  background:
    radial-gradient(700px 400px at 12% 10%,rgba(168,85,247,.16),transparent 62%),
    radial-gradient(700px 400px at 88% 85%,rgba(236,72,153,.12),transparent 62%),
    #fff!important;color:var(--rn-ink)!important;
}
#intro-screen h1{color:#7c3aed!important}
#intro-screen p{color:#716b80!important}
.rn-install-developer-card{
  background:linear-gradient(135deg,rgba(124,58,237,.08),rgba(236,72,153,.07))!important;
  border:1px solid rgba(124,58,237,.13)!important;color:#514a5c!important;
}

/* Loader — light, transparent, logo fixed */
.rn-page-loader{
  background:rgba(255,255,255,.88)!important;
  backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;
}
.rn-loader-logo{
  color:#7c3aed!important;
  background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;
  font-weight:900!important;
}
.rn-loader-rings span{filter:drop-shadow(0 0 5px rgba(124,58,237,.18))}

/* Responsive polish and the darker glass chrome requested for the dashboard. */
.layout-navbar,.navbar-detached,.layout-navbar-fixed .layout-navbar{
  background:linear-gradient(115deg,rgba(45,31,68,.88),rgba(86,44,108,.76))!important;
  border-color:rgba(255,255,255,.18)!important;
}
.layout-navbar .navbar-nav .nav-link,.layout-navbar .navbar-brand,.layout-navbar i,
.layout-navbar .text-heading,.layout-navbar .text-body-secondary{color:#fff!important}
.layout-navbar #autocomplete{color:rgba(255,255,255,.76)!important}
.layout-navbar .avatar{box-shadow:0 0 0 3px rgba(255,255,255,.12),0 8px 20px rgba(20,9,35,.28)}
.content-footer{margin:0 1rem 1rem;border-radius:18px}

@media (max-width:1199.98px){
  .layout-navbar{margin:12px!important;border-radius:16px!important}
  .container-xxl{max-width:100%!important}
}
@media (max-width:767.98px){
  .container-xxl.flex-grow-1{padding:1rem!important}
  .card{border-radius:15px!important}
  .card:hover{transform:translateY(-2px)!important}
  .install-card.card{max-width:calc(100vw - 24px)!important}
  .install-card .card-body{padding:1.35rem!important}
  .install-card .glass-header{padding:1rem!important}
  .install-card .step-icon{width:39px!important;height:39px!important;font-size:1.05rem!important}
  .install-card .step small{font-size:.65rem!important}
  .rn-auth-footer{font-size:9px!important;gap:7px!important;white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
  .card,.card:before,.card:after,.menu-link,.btn,.rn-loader-rings,.rn-loader-rings span{animation:none!important;transition:none!important}
}

/* prevent dark theme from re-darkening controls */
[data-bs-theme="dark"] .card,[data-bs-theme="dark"] .list-group-item,
[data-bs-theme="dark"] .form-control,[data-bs-theme="dark"] .form-select{
  color:var(--rn-ink)!important;
}
