/* V430 - MENU GROUPED ONLY
   Chỉ thay giao diện menu. Không thay đổi nội dung trang/API/SQL/nghiệp vụ. */

.v430-sidebar-desktop,
.v430-sidebar-mobile{
  background:var(--sidebar)!important;
}

.v430-menu-brand{
  min-height:68px;
  padding:14px 14px 13px!important;
  gap:10px!important;
  border-bottom:1px solid var(--sidebar-border)!important;
}
.v430-menu-brand>div:first-child{
  width:36px!important;
  height:36px!important;
  border-radius:9px!important;
  box-shadow:none!important;
}
.v430-menu-brand>div:last-child>div:first-child{
  font-size:17px!important;
  letter-spacing:.02em!important;
}
.v430-menu-brand>div:last-child>div:last-child{
  margin-top:2px;
  font-size:8.5px!important;
  letter-spacing:.12em!important;
}

.v430-menu-nav{
  padding:8px 9px 14px!important;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--sidebar-foreground) 16%,transparent) transparent;
}
.v430-menu-nav::-webkit-scrollbar{width:5px}
.v430-menu-nav::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--sidebar-foreground) 16%,transparent);
  border-radius:999px;
}

.v430-menu-group{
  margin-top:11px;
}
.v430-menu-group:first-child{
  margin-top:2px;
}
.v430-menu-group-title{
  padding:0 10px 6px;
  font-size:9px;
  line-height:1.25;
  font-weight:750;
  letter-spacing:.085em;
  text-transform:uppercase;
  color:color-mix(in srgb,var(--sidebar-foreground) 42%,transparent);
}
.v430-menu-group-items{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.v430-menu-item{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:39px;
  padding:8px 10px;
  border-radius:9px;
  color:color-mix(in srgb,var(--sidebar-foreground) 72%,transparent);
  font-size:12.5px;
  line-height:1.25;
  font-weight:560;
  text-decoration:none;
  transition:background-color .14s ease,color .14s ease;
}
.v430-menu-item:hover{
  background:color-mix(in srgb,var(--sidebar-foreground) 6%,transparent);
  color:var(--sidebar-foreground);
}
.v430-menu-icon{
  width:18px!important;
  height:18px!important;
  flex:none;
  padding:2px;
  border:1px solid color-mix(in srgb,var(--sidebar-foreground) 13%,transparent);
  border-radius:5px;
  color:color-mix(in srgb,var(--sidebar-foreground) 62%,transparent);
}

.v430-menu-active{
  background:color-mix(in srgb,var(--sidebar-foreground) 8%,transparent)!important;
  color:var(--sidebar-foreground)!important;
  font-weight:700;
}
.v430-menu-active:before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  bottom:9px;
  width:3px;
  border-radius:999px;
  background:var(--amber-brand);
}
.v430-menu-active .v430-menu-icon{
  color:var(--sidebar-foreground)!important;
  border-color:color-mix(in srgb,var(--amber-brand) 55%,var(--sidebar-border))!important;
  background:color-mix(in srgb,var(--amber-brand) 9%,transparent);
}

/* Tách nhóm bằng khoảng trắng, không dùng nhiều màu */
.v430-menu-group + .v430-menu-group{
  padding-top:8px;
  border-top:1px solid color-mix(in srgb,var(--sidebar-border) 72%,transparent);
}

@media(min-width:1024px){
  .v430-sidebar-desktop{
    width:14.5rem!important;
  }
}

/* Mobile drawer */
@media(max-width:1023px){
  .v430-sidebar-mobile{
    width:min(84vw,300px)!important;
    box-shadow:12px 0 28px rgba(0,0,0,.14);
  }
  .v430-sidebar-mobile .v430-menu-brand{
    min-height:64px;
    padding:12px!important;
  }
  .v430-sidebar-mobile .v430-menu-nav{
    padding:8px!important;
  }
  .v430-sidebar-mobile .v430-menu-group{
    margin-top:10px;
  }
  .v430-sidebar-mobile .v430-menu-group-title{
    padding:0 8px 5px;
    font-size:9.5px;
  }
  .v430-sidebar-mobile .v430-menu-item{
    min-height:44px;
    padding:10px 10px;
    font-size:13px;
    border-radius:9px;
  }
  .v430-sidebar-mobile .v430-menu-icon{
    width:19px!important;
    height:19px!important;
  }
}

@media(max-width:390px){
  .v430-sidebar-mobile{
    width:min(89vw,286px)!important;
  }
  .v430-sidebar-mobile .v430-menu-item{
    font-size:12.5px;
  }
}