/* Approved dark sidebar. Scoped to the navigation; no content layout overrides. */
#yupao-navigation.main-sidebar {
  background: #1d2023 !important;
  color: #cbd2d7;
  box-shadow: inset -1px 0 0 #30373c !important;
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  letter-spacing: 0;
}
#yupao-navigation.main-sidebar * { letter-spacing: 0; }
#yupao-navigation.main-sidebar .navbar-header {
  height: 76px !important;
  padding: 0 17px !important;
  background: #1d2023 !important;
  border: 0 !important;
  box-shadow: none !important;
}
#yupao-navigation.main-sidebar .navbar-header > ul { height: 100%; align-items: center; }
#yupao-navigation.main-sidebar .navbar-brand {
  margin: 0 !important;
  padding: 0 !important;
  color: #f1f5f7 !important;
  line-height: 1.3 !important;
}
#yupao-navigation.main-sidebar .logo-lg {
  display: flex !important;
  align-items: center;
  gap: 0;
  color: #f1f5f7 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  white-space: nowrap;
}
#yupao-navigation.main-sidebar .logo-lg img { width: 32px; height: 32px; object-fit: contain; }
#yupao-navigation.main-sidebar .logo-mini { color: #f1f5f7 !important; }
#yupao-navigation.main-sidebar .sidebar {
  height: calc(100% - 76px) !important;
  padding: 0 0 18px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: thin;
  scrollbar-color: #465159 transparent;
}
#yupao-navigation.main-sidebar .sidebar > .nav-sidebar {
  width: 100%;
  padding: 0 10px !important;
  margin: 0 !important;
}
#yupao-navigation.main-sidebar .navigation-section-label {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 12px 10px;
  margin: 0;
  color: #9baab3;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  white-space: nowrap;
}
#yupao-navigation.main-sidebar .navigation-section-label::after {
  content: "";
  flex: 1;
  min-width: 16px;
  height: 1px;
  background: #3c474e;
}
#yupao-navigation.main-sidebar .navigation-section-label:first-child { padding-top: 4px; }
#yupao-navigation.main-sidebar .nav-sidebar > .nav-item { margin: 1px 0 !important; padding: 0 !important; }
#yupao-navigation.main-sidebar .nav-link {
  position: relative;
  display: flex !important;
  align-items: center;
  gap: 11px;
  width: 100% !important;
  min-height: 40px;
  padding: 9px 12px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: #cbd2d7 !important;
  font-size: 14px !important;
  line-height: 22px !important;
  box-shadow: none !important;
  text-decoration: none !important;
  transition: none !important;
}
#yupao-navigation.main-sidebar .nav-link > i {
  flex: 0 0 17px;
  width: 17px !important;
  margin: 0 !important;
  color: #9ba8b0 !important;
  font-size: 15px !important;
  text-align: center;
}
#yupao-navigation.main-sidebar .nav-link > p {
  display: flex !important;
  align-items: center;
  flex: 1;
  min-width: 0;
  padding: 0 !important;
  margin: 0 !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: 500;
  white-space: normal;
  overflow-wrap: anywhere;
}
#yupao-navigation.main-sidebar .nav-link .right {
  position: static !important;
  margin: 0 0 0 auto !important;
  padding-left: 8px;
  color: #919da5 !important;
  font-size: 14px !important;
  line-height: 18px;
}
#yupao-navigation.main-sidebar .nav-sidebar > .nav-item > .nav-link {
  background: #22272b !important;
  box-shadow: inset 0 0 0 1px #3b444b !important;
}
#yupao-navigation.main-sidebar .nav-sidebar > .has-treeview.menu-open > .nav-link {
  background: #25302c !important;
  box-shadow: inset 0 0 0 1px #49685c !important;
}
#yupao-navigation.main-sidebar .has-treeview.menu-open > .nav-link { color: #f1f5f7 !important; }
#yupao-navigation.main-sidebar .has-treeview.menu-open > .nav-link > p { font-weight: 700; }
#yupao-navigation.main-sidebar .has-treeview.menu-open > .nav-link > i { color: #88d0b6 !important; }
#yupao-navigation.main-sidebar .nav-treeview {
  position: relative;
  width: auto !important;
  margin: 2px 0 7px 19px !important;
  padding: 0 0 0 9px !important;
  background: transparent !important;
  border-left: 1px solid #394147;
}
#yupao-navigation.main-sidebar .nav-treeview > .nav-item { margin: 1px 0 !important; padding: 0 !important; }
#yupao-navigation.main-sidebar .nav-treeview .nav-link {
  min-height: 34px;
  gap: 8px;
  padding: 6px 8px !important;
  font-size: 13px !important;
  line-height: 22px !important;
  color: #b3bec5 !important;
}
#yupao-navigation.main-sidebar .nav-treeview .nav-link > p { font-weight: 400; }
#yupao-navigation.main-sidebar .nav-treeview .nav-link > i { flex-basis: 15px; width: 15px !important; font-size: 13px !important; color: #929fa8 !important; }
#yupao-navigation.main-sidebar .nav-link.active {
  background: #25433b !important;
  color: #b4ebd5 !important;
  box-shadow: inset 3px 0 0 #69cba5 !important;
}
#yupao-navigation.main-sidebar .nav-link.active > i { color: #86dbb9 !important; }
#yupao-navigation.main-sidebar .nav-link.active > p { font-weight: 700; }
#yupao-navigation.main-sidebar .nav-link:focus-visible { outline: 2px solid #86dbb9 !important; outline-offset: -2px; }
#yupao-navigation.main-sidebar .navigation-help-item {
  border-top: 1px solid #394147;
  padding-top: 8px !important;
  margin-top: 12px !important;
}
#yupao-navigation.main-sidebar .ps__rail-x,
#yupao-navigation.main-sidebar .ps__rail-y { display: none !important; }
@media (hover: hover) and (pointer: fine) {
  #yupao-navigation.main-sidebar .nav-link:hover { background: #2a3034 !important; color: #f1f5f7 !important; }
  #yupao-navigation.main-sidebar .nav-link:hover > i { color: #c7d5dd !important; }
  #yupao-navigation.main-sidebar .nav-link.active:hover { background: #2a4c41 !important; color: #c8f2e1 !important; }
  #yupao-navigation.main-sidebar .nav-sidebar > .nav-item > .nav-link:hover {
    background: #2a3034 !important;
    box-shadow: inset 0 0 0 1px #64747d !important;
  }
}
#yupao-navigation.main-sidebar[data-nav-quiet] {
  --nav-surface: #30363b;
  --nav-text: #dce1e5;
  --nav-muted: #acb5bd;
  --nav-line: #ffffff0f;
  --nav-hover: #ffffff0a;
  --nav-selected: #455c6e;
  --nav-selected-text: #edf5fc;
  --nav-accent: #b5d7f0;
  background: var(--nav-surface) !important;
  box-shadow: inset -1px 0 0 #ffffff0c !important;
}
#yupao-navigation.main-sidebar[data-nav-quiet] .navbar-header {
  height: 68px !important;
  background: var(--nav-surface) !important;
}
#yupao-navigation.main-sidebar[data-nav-quiet] .sidebar {
  height: calc(100% - 68px) !important;
  scrollbar-color: #ffffff30 transparent;
}
#yupao-navigation.main-sidebar[data-nav-quiet] .navigation-section-label {
  padding: 20px 12px 7px;
  color: var(--nav-muted);
  font-weight: 400;
}
#yupao-navigation.main-sidebar[data-nav-quiet] .navigation-section-label:first-child {padding-top:8px}
#yupao-navigation.main-sidebar[data-nav-quiet] .navigation-section-label::after {content:none}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-sidebar > .nav-item {margin:3px 0!important}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-sidebar > .nav-item > .nav-link {
  background: transparent !important;
  box-shadow: none !important;
  color: var(--nav-text) !important;
}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-link > p {font-weight:400}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-link > i {
  color: var(--nav-muted) !important;
  font-size: 14px !important;
  background: transparent;
}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-link .right {color:var(--nav-muted)!important;font-size:12px!important}
#yupao-navigation.main-sidebar[data-nav-quiet] .has-treeview.menu-open > .nav-link > p {font-weight:600}
#yupao-navigation.main-sidebar[data-nav-quiet] .has-treeview.menu-open > .nav-link > i {color:var(--nav-text)!important}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-treeview {
  margin: 4px 0 8px 20px !important;
  padding-left: 8px !important;
  border-left-color: var(--nav-line);
}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-treeview .nav-link {color:var(--nav-muted)!important}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-treeview .nav-link > i {color:var(--nav-muted)!important;font-size:12px!important}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-link.active {
  background: var(--nav-selected) !important;
  color: var(--nav-selected-text) !important;
  box-shadow: none !important;
}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-link.active > p {font-weight:600}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-link.active > i {color:var(--nav-accent)!important}
#yupao-navigation.main-sidebar[data-nav-quiet] .nav-link:focus-visible {outline-color:var(--nav-accent)!important}
#yupao-navigation.main-sidebar[data-nav-quiet] .navigation-help-item {
  border: 0;
  margin-top: 3px !important;
  padding-top: 0 !important;
}

@media (hover: hover) and (pointer: fine) {
  #yupao-navigation.main-sidebar[data-nav-quiet] .nav-sidebar > .nav-item > .nav-link:hover {
    background: var(--nav-hover) !important;
    color: var(--nav-text) !important;
    box-shadow: none !important;
  }
  #yupao-navigation.main-sidebar[data-nav-quiet] .nav-link:hover > i {color:var(--nav-text)!important}
  #yupao-navigation.main-sidebar[data-nav-quiet] .nav-treeview .nav-link:hover {
    background: var(--nav-hover) !important;
    color: var(--nav-text) !important;
  }
  #yupao-navigation.main-sidebar[data-nav-quiet] .nav-treeview .nav-link.active:hover {
    background: var(--nav-selected) !important;
    color: var(--nav-selected-text) !important;
  }
}
#yupao-navigation.main-sidebar[data-nav-readable] {
  font-family: "Microsoft JhengHei", "PingFang TC", "Microsoft YaHei", sans-serif;
}
#yupao-navigation.main-sidebar[data-nav-readable] .navigation-section-label {
  font-size: 13px;
  line-height: 20px;
  color: #c4cbd0;
  font-weight: 400;
}
#yupao-navigation.main-sidebar[data-nav-readable] .nav-sidebar > .nav-item > .nav-link {
  min-height: 44px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  font-size: 15px !important;
  line-height: 24px !important;
}
#yupao-navigation.main-sidebar[data-nav-readable] .nav-sidebar > .nav-item > .nav-link:not(.active) {color:#eff1f3!important}
#yupao-navigation.main-sidebar[data-nav-readable] .nav-treeview .nav-link {
  min-height: 38px;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  font-size: 14px !important;
}
#yupao-navigation.main-sidebar[data-nav-readable] .nav-treeview .nav-link:not(.active) {color:#d8dce0!important}
#yupao-navigation.main-sidebar[data-nav-readable] .nav-link > p {font-weight:400}
#yupao-navigation.main-sidebar[data-nav-readable] .has-treeview.menu-open > .nav-link > p,
#yupao-navigation.main-sidebar[data-nav-readable] .nav-link.active > p {font-weight:600}
#yupao-navigation.main-sidebar[data-nav-refined] {
  --nav-row-fill: #ffffff03;
  --nav-row-outline: #ffffff0d;
  --nav-row-open: #ffffff07;
  --nav-radius: 7px;
}
#yupao-navigation.main-sidebar[data-nav-refined] .nav-sidebar > .nav-item > .nav-link {
  background: var(--nav-row-fill) !important;
  border-radius: var(--nav-radius) !important;
  box-shadow: inset 0 0 0 1px var(--nav-row-outline) !important;
}
#yupao-navigation.main-sidebar[data-nav-refined] .nav-sidebar > .has-treeview.menu-open > .nav-link {
  background: var(--nav-row-open) !important;
  box-shadow: inset 0 0 0 1px #ffffff18 !important;
}
#yupao-navigation.main-sidebar[data-nav-refined] .nav-treeview .nav-link {border-radius:var(--nav-radius)!important}
@media (hover: hover) and (pointer: fine) {
  #yupao-navigation.main-sidebar[data-nav-refined] .nav-sidebar > .nav-item > .nav-link:hover {
    background: #ffffff08 !important;
    box-shadow: inset 0 0 0 1px #ffffff20 !important;
  }
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] {
  --nav-surface: #2e353a;
  --nav-row-outline: #a1c8da16;
  --nav-selected: #3c5363;
  --nav-selected-text: #edf4f9;
  --nav-accent: #b5d4e6;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-section-label {
  padding-left: 4px;
  gap: 9px;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-section-label::before {
  content: "";
  flex: 0 0 3px;
  height: 13px;
  background: #95c5dc;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item {margin:4px 0!important}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview {border-left-color:#a1c8da12}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link::before,
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link::after {
  content: "";
  position: absolute;
  width: 17px;
  height: 11px;
  border-color: #9bc9dd;
  border-style: solid;
  border-width: 0;
  opacity: 0.35;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link::before {
  top: 0;
  left: 0;
  border-top-width: 1px;
  border-left-width: 1px;
  border-top-left-radius: 7px;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link::after {
  right: 0;
  bottom: 0;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-bottom-right-radius: 7px;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .has-treeview.menu-open > .nav-link {
  box-shadow: inset 0 0 0 1px #a7d0e026 !important;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .has-treeview.menu-open > .nav-link::before,
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .has-treeview.menu-open > .nav-link::after {opacity:0.65}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview .nav-link.active {
  box-shadow: inset 0 0 0 1px #a5cada26 !important;
}
@media (hover: hover) and (pointer: fine) {
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link:hover {box-shadow:inset 0 0 0 1px #a7d0e026!important}
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link:hover::before,
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link:hover::after {opacity:0.7}
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navbar-header {
  position: relative;
  padding: 0 22px !important;
  text-align: center;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navbar-header::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 0;
  height: 1px;
  background: #9bc9dd1c;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navbar-header > ul > .nav-item {text-align:center!important}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navbar-header .navbar-brand {
  display: inline-flex !important;
  align-items: center;
  height: 40px !important;
  float: none;
  vertical-align: middle;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navbar-header .logo-lg {
  height: 40px !important;
  line-height: 40px !important;
  font-size: 22px !important;
  letter-spacing: 0 !important;
  gap: 10px;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navbar-header .logo-lg img {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  margin: 0 !important;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] {
  --nav-motion-duration: 180ms;
  --nav-exit-duration: 150ms;
  --nav-stagger-delay: 70ms;
  --nav-exit-stagger-delay: 30ms;
  --nav-burst-duration: 280ms;
  --nav-burst-word-duration: 640ms;
  --nav-arrival-duration: 280ms;
  --nav-child-word-duration: 480ms;
  --nav-firework-duration: 640ms;
  --nav-child-firework-duration: 480ms;
  --nav-motion-easing: cubic-bezier(0.23, 1, 0.32, 1);
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-burst-layer {
  position: absolute;
  inset: 0;
  z-index: 5;
  overflow: hidden;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-burst {
  position: absolute;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-burst-ring {
  position: absolute;
  inset: 0;
  border: 1px solid #a8c6d0;
  border-radius: 7px;
  background: #a6dcef04;
  box-shadow: 0 0 3px #8fd5ed22;
  opacity: 0;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-firework {
  position: absolute;
  inset: 0;
  filter: blur(0.2px);
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-firework-spark {
  position: absolute;
  width: 5px;
  height: 1px;
  border-radius: 1px;
  background: linear-gradient(90deg, transparent, currentColor);
  transform-origin: center;
  opacity: 0;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-firework-spark::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 1px;
  height: 1px;
  border-radius: 1px;
  background: currentColor;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-burst-word {
  position: absolute;
  right: 32px;
  top: 12px;
  z-index: 1;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  white-space: nowrap;
  color: #ffe2a1;
  text-shadow: 0 0 5px #e4ba7333;
  opacity: 0;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .has-treeview[data-nav-clipping] {overflow:clip}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #9bc9dd40;
  clip-path: inset(0 0 0 0);
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview::after {
  content: "";
  position: absolute;
  left: -1px;
  top: 0;
  width: 1px;
  height: 8px;
  background: #c8edf8;
  box-shadow: 0 0 3px #9bd9ed80;
  opacity: 0;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview > .nav-item {position:relative}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview > .nav-item::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 50%;
  width: 6px;
  height: 1px;
  background: #9bc9dd60;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview > .nav-item > .nav-link::before {
  content: "";
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview > .nav-item > .nav-link {overflow:visible!important}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .navigation-child-word {
  position: absolute;
  left: -17px;
  top: 50%;
  width: 14px;
  height: 20px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  text-align: center;
  color: #ffe2a1;
  text-shadow: 0 0 4px #e4ba7333;
  opacity: 0;
  pointer-events: none;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview > .nav-item > .nav-link::before {
  inset: 0;
  border: 1px solid #b8d8e2;
  border-radius: 7px;
  background: #a6dcef04;
  box-shadow: 0 0 3px #93def224;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-link {
  transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease !important;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-link > i:not(.right) {
  transition: color 160ms ease !important;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-link .right {
  transition: transform var(--nav-motion-duration) var(--nav-motion-easing), color 160ms ease !important;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link::before,
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link::after {
  transition: opacity 160ms ease;
}
#yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .has-treeview[data-nav-instant] > .nav-link .right {
  transition: none !important;
}
@media (hover: hover) and (pointer: fine) {
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link:hover {
    background: #a9cbdc0e !important;
    box-shadow: inset 0 0 0 1px #b5d6e63d !important;
  }
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link:hover::before,
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-sidebar > .nav-item > .nav-link:hover::after {opacity:0.9}
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-link:hover > i:not(.right) {color:#c2deec!important}
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-treeview .nav-link:not(.active):hover {
    background: #a9cbdc12 !important;
    color: #f1f7fa !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  #yupao-navigation.main-sidebar[data-nav-variant="soft-tech"] .nav-link .right {transition:color 160ms ease!important}
}

#yupao-navigation.main-sidebar .navigation-effects-setting {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  padding: 9px 13px;
  color: #aebdc5;
  font-size: 12px;
  line-height: 20px;
}
#yupao-navigation.main-sidebar .navigation-effects-switch {
  position: relative;
  flex: 0 0 30px;
  width: 30px;
  height: 18px;
  padding: 0;
  border: 1px solid #66747d;
  border-radius: 9px;
  background: #46515a;
  cursor: pointer;
  transition: background-color 160ms ease, border-color 160ms ease;
}
#yupao-navigation.main-sidebar .navigation-effects-switch::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #e6edf0;
  transition: transform 160ms var(--nav-motion-easing);
}
#yupao-navigation.main-sidebar .navigation-effects-switch[aria-checked="true"] {background:#588b9d;border-color:#73a7b8}
#yupao-navigation.main-sidebar .navigation-effects-switch[aria-checked="true"]::before {transform:translateX(12px)}
#yupao-navigation.main-sidebar .navigation-effects-switch:focus-visible {outline:2px solid #b5d4e6;outline-offset:3px}
@media (prefers-reduced-motion: reduce) {
  #yupao-navigation.main-sidebar .navigation-effects-switch::before {transition:none}
}

/* Keep the existing stock-type badges without laying them over larger labels. */
#yupao-navigation.main-sidebar .nav-treeview .nav-link[href$="/returned-goods-storage"],
#yupao-navigation.main-sidebar .nav-treeview .nav-link[href$="/forwarder-returned-goods"] {gap:4px}
#yupao-navigation.main-sidebar .nav-treeview .nav-link[href$="/returned-goods-storage"]::after,
#yupao-navigation.main-sidebar .nav-treeview .nav-link[href$="/forwarder-returned-goods"]::after {
  position: static;
  flex: 0 0 auto;
  min-width: 0;
  margin-left: auto;
  padding: 1px 3px;
}

/* Shopee chat store unread count. Counts are read from the ERP local database. */
#yupao-navigation.main-sidebar .nav-link[href*="/shopee-chat/shop/"] > p {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 6px;
}
#yupao-navigation.main-sidebar .nav-treeview .nav-link.shopee-chat-unopened {
  filter: grayscale(1);
  opacity: .8;
}
#yupao-navigation.main-sidebar .nav-treeview .nav-link.shopee-chat-unopened:hover,
#yupao-navigation.main-sidebar .nav-treeview .nav-link.shopee-chat-unopened:focus-visible {
  opacity: .95;
}
#yupao-navigation.main-sidebar .nav-treeview .shopee-chat-open-notice {
  padding: 6px 8px;
  color: #aeb9bf;
  font-size: 12px;
  line-height: 20px;
}
#yupao-navigation.main-sidebar .shopee-chat-unopened-toggle {
  display: flex;
  align-items: center;
  gap: 7px;
  width: 100%;
  padding: 7px 8px;
  border: 0;
  background: transparent;
  color: #aeb9bf;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  text-align: left;
}
#yupao-navigation.main-sidebar .shopee-chat-unopened-toggle:focus-visible {outline:2px solid #86dbb9;outline-offset:-2px}
#yupao-navigation.main-sidebar .shopee-chat-unopened-toggle .fa {font-size:10px;transition:transform 150ms ease}
#yupao-navigation.main-sidebar .shopee-chat-unopened-toggle[aria-expanded="true"] .fa {transform:rotate(90deg)}
#yupao-navigation.main-sidebar .shopee-chat-unopened-count {margin-left:auto;font-size:11px}
#yupao-navigation.main-sidebar .shopee-chat-unopened-list[hidden] {display:none!important}
#yupao-navigation.main-sidebar .shopee-chat-unopened-list {margin:0 0 0 9px!important}
#yupao-navigation.main-sidebar .shopee-chat-unread-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 18px;
  height: 18px;
  margin-left: auto;
  padding: 0 5px;
  border-radius: 9px;
  background: #df5a54;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 18px;
}

/* 父菜单「蝦皮聊聊」上显示全部店铺的未读合计。 */
#yupao-navigation.main-sidebar .shopee-chat-unread-total {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 20px;
  height: 18px;
  margin-left: auto;
  margin-right: 8px;
  padding: 0 6px;
  border-radius: 9px;
  background: #e5484d;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  font-variant-numeric: tabular-nums;
}
#yupao-navigation.main-sidebar .navigation-new-badge,
#yupao-navigation.main-sidebar .navigation-beta-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  height: 16px;
  margin-left: 4px;
  padding: 0 3px;
  border-radius: 3px;
  background: #f2c476;
  color: #20272a;
  font-size: 9px;
  font-weight: 800;
  line-height: 16px;
}
#yupao-navigation.main-sidebar .navigation-beta-badge {
  background: #b7d9cf;
  color: #23453a;
}
#yupao-navigation.main-sidebar .navigation-value-added-label {
  gap: 6px;
  flex-wrap: nowrap;
}
#yupao-navigation.main-sidebar .navigation-section-badges {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  flex: 0 0 auto;
  gap: 4px;
  margin-left: -3px;
  transform: translateY(-7px);
}
#yupao-navigation.main-sidebar .navigation-section-badges > span {
  margin-left: 0;
  height: 16px;
  padding: 0 4px;
  border: 1px solid;
  border-radius: 4px;
  font-size: 9px;
  font-weight: 700;
  line-height: 14px;
}
#yupao-navigation.main-sidebar .navigation-section-badges > .navigation-new-badge {
  background: #f2c4761a;
  border-color: #d7ab5b66;
  color: #f3ca85;
}
#yupao-navigation.main-sidebar .navigation-section-badges > .navigation-beta-badge {
  background: #81c9ba1a;
  border-color: #7ccfb654;
  color: #b3e5d5;
}
#yupao-navigation.main-sidebar .shopee-chat-parent-link {
  gap: 7px;
  padding-right: 8px !important;
}
#yupao-navigation.main-sidebar .shopee-chat-parent-link > p {
  font-size: 13px !important;
  white-space: nowrap;
}
#yupao-navigation.main-sidebar .shopee-chat-parent-link .shopee-chat-unread-total {
  margin-right: 3px;
}
#yupao-navigation.main-sidebar .shopee-chat-parent-link .right {
  padding-left: 4px;
}
#yupao-navigation.main-sidebar .has-treeview.menu-open > .nav-link > .shopee-chat-unread-total {
  background: #ffffff;
  color: #1f5c48;
}

@media (min-width: 992px) {
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .logo-lg,
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .nav-link > p,
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .nav-treeview,
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .navigation-section-label,
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .navigation-effects-setting {display:none!important}
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .navbar-header {padding:0 10px!important}
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .navbar-header::after {left:10px;right:10px}
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .logo-mini {display:block!important}
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .logo-mini img {width:32px;height:32px;object-fit:contain}
  .sidebar-mini.sidebar-collapse #yupao-navigation.main-sidebar:not(:hover):not(.sidebar-focused) .nav-link {justify-content:center;padding-right:0!important;padding-left:0!important}
}