/*
 * V100 - Sidebar active state unified
 * Admin, PIC/Pelatih, Siswa | desktop, tablet, mobile
 * Active menu uses a clean full card without a colored left strip.
 */

body.app-body .app-sidebar .side-nav > a,
body.app-body #appSidebar .side-nav > a{
  position:relative;
  border:1px solid transparent;
  box-shadow:none;
}

body.app-body .app-sidebar .side-nav > a.active,
body.app-body .app-sidebar .side-nav > a.active:hover,
body.app-body .app-sidebar .side-nav > a.active:focus,
body.app-body .app-sidebar .side-nav > a.active:focus-visible,
body.app-body #appSidebar .side-nav > a.active,
body.app-body #appSidebar .side-nav > a.active:hover,
body.app-body #appSidebar .side-nav > a.active:focus,
body.app-body #appSidebar .side-nav > a.active:focus-visible{
  background:#edf4ff !important;
  color:#2563eb !important;
  border:1px solid #d9e6fb !important;
  border-left:1px solid #d9e6fb !important;
  border-right:1px solid #d9e6fb !important;
  border-top:1px solid #d9e6fb !important;
  border-bottom:1px solid #d9e6fb !important;
  border-radius:16px !important;
  box-shadow:none !important;
  outline:none !important;
  transform:none !important;
  margin-left:0 !important;
  clip-path:none !important;
}

/* Remove every possible legacy side-strip implementation. */
body.app-body .app-sidebar .side-nav > a.active::before,
body.app-body .app-sidebar .side-nav > a.active::after,
body.app-body #appSidebar .side-nav > a.active::before,
body.app-body #appSidebar .side-nav > a.active::after{
  content:none !important;
  display:none !important;
  position:static !important;
  inset:auto !important;
  width:0 !important;
  height:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.app-body .app-sidebar .side-nav > a.active svg,
body.app-body .app-sidebar .side-nav > a.active > span,
body.app-body #appSidebar .side-nav > a.active svg,
body.app-body #appSidebar .side-nav > a.active > span{
  color:#2563eb !important;
  stroke:currentColor;
}

body.app-body .app-sidebar .side-nav > a:not(.active):hover,
body.app-body #appSidebar .side-nav > a:not(.active):hover{
  background:#f6f9ff !important;
  border-color:#edf2fa !important;
  border-radius:16px !important;
  box-shadow:none !important;
  transform:none !important;
}

/* Desktop keeps the compact sidebar spacing while matching mobile styling. */
@media(min-width:761px){
  body.app-body .app-sidebar .side-nav > a.active,
  body.app-body #appSidebar .side-nav > a.active{
    padding-left:14px !important;
  }
}

/* Mobile drawer and sidebar use the same active card treatment. */
@media(max-width:760px){
  body.app-body .app-sidebar .side-nav > a.active,
  body.app-body #appSidebar .side-nav > a.active{
    border-radius:18px !important;
  }
}