/* Control Plane application frame. Its tokens are product-owned; RMS only informed the visual direction. */
:root{
  /* --cp-ink / --cp-canvas alias the real semantic tokens — see control-plane-layout.css for why:
     this file redeclared the SAME variable names with slightly DIFFERENT hex values (#162c3b here
     vs #172b3a there), a second silent definition of the same concept, and neither had a dark-theme
     entry. Aliasing both blocks to one source removes the duplicate and restores theme correctness
     without touching the six call sites that consume them. */
  --cp-ink:var(--cp-text-primary);
  --cp-canvas:var(--cp-surface-page);
  --cp-navy:#081f34;
  --cp-deep:#061522;
  --cp-line:#e2eaf0;
  --cp-nav-text:#a9becc;
  --cp-nav-muted:#678497;
  --cp-mint:#19c59a;
  --cp-mint-soft:rgba(25,197,154,.15)
}
body:not(.abp-account-layout){
  font-family:var(--cp-font-sans)!important;
  background:var(--cp-canvas)!important;
  color:var(--cp-ink)!important
}
#lpx-wrapper{
  background:var(--cp-canvas)!important
}
#lpx-wrapper .lpx-sidebar-container{
  width:266px!important;
  background:linear-gradient(180deg,var(--cp-navy),var(--cp-deep))!important;
  box-shadow:12px 0 30px rgba(7,27,46,.08)!important
}
#lpx-wrapper .lpx-sidebar-container .lpx-logo-container{
  height:74px!important;
  margin:0!important;
  padding:0 22px!important;
  border-bottom:1px solid rgba(143,176,193,.16)!important;
  background:transparent!important
}
#lpx-wrapper .lpx-sidebar-container .lpx-logo-container .lpx-brand-logo{
  max-width:29px!important;
  filter:brightness(0) invert(1)!important;
  opacity:.96
}
#lpx-wrapper .lpx-sidebar-container .lpx-logo-container .lpx-brand-name{
  left:57px!important;
  top:25px!important;
  color:#fff!important;
  font-family:var(--cp-font-display)!important;
  font-size:.83rem!important;
  font-weight:700!important
}
#lpx-wrapper .lpx-sidebar-container .lpx-sidebar{
  width:266px!important;
  margin-top:74px!important;
  background:transparent!important
}
#lpx-wrapper .lpx-sidebar-container .lpx-sidebar .lpx-nav{
  padding:18px 14px 26px!important;
  background:transparent!important
}
#lpx-wrapper .lpx-sidebar-container .lpx-sidebar .lpx-nav-menu{
  margin:0!important;
  padding:0!important;
  background:transparent!important
}
#lpx-wrapper .lpx-nav-menu .menu-item{
  margin:3px 0!important;
  background:transparent!important
}
#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link{
  min-height:42px!important;
  padding:0 12px!important;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  color:var(--cp-nav-text)!important;
  font-size:.8rem!important;
  font-weight:600!important;
  letter-spacing:-.01em!important
}
#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link:hover{
  background:#12334a!important;
  color:#edf8fb!important
}
#lpx-wrapper .lpx-nav-menu .menu-item.active>.lpx-menu-item-link,#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link.active{
  background:linear-gradient(90deg,var(--cp-mint-soft),rgba(25,197,154,.055))!important;
  color:#edfffa!important;
  box-shadow:inset 3px 0 0 var(--cp-mint)!important
}
#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link i,#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link .menu-item-icon{
  width:18px!important;
  margin-right:12px!important;
  color:currentColor!important;
  font-size:.9rem!important;
  text-align:center!important
}
#lpx-wrapper .lpx-nav-menu .menu-item.active>.lpx-menu-item-link i{
  color:#38dfb8!important
}
#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link .menu-item-text{
  color:inherit!important
}
#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link .dd-icon{
  margin-left:auto!important;
  margin-right:0!important;
  color:#7795a7!important
}
#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link+ul{
  margin:4px 0 8px 20px!important;
  padding-left:8px!important;
  border-left:1px solid rgba(143,176,193,.17)!important;
  background:transparent!important
}
#lpx-wrapper .lpx-nav-menu .menu-item .lpx-menu-item-link+ul .lpx-menu-item-link{
  min-height:36px!important;
  padding-left:10px!important;
  font-size:.74rem!important
}
#lpx-wrapper .lpx-topbar{
  min-height:74px!important;
  border-bottom:1px solid var(--cp-line)!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 2px 15px rgba(22,41,67,.035)!important
}
#lpx-wrapper .lpx-topbar-content{
  padding-inline:28px!important
}
#lpx-wrapper .lpx-content-container,#lpx-wrapper .lpx-content{
  background:var(--cp-canvas)!important
}
@media(max-width:1100px){
  #lpx-wrapper .lpx-sidebar-container,#lpx-wrapper .lpx-sidebar-container .lpx-sidebar{
    width:230px!important
  }
}