/* TODO: abstract as Utilitiy class */
.dx-sr-only {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  margin: -1px;
  clip-path: inset(50%);
  white-space: nowrap;
}

.dx-sidebar-wrapper {
  --dx-sidebar-background: var(--primary-color-2);
  --dx-sidebar-foreground: var(--secondary-color-4);
  --dx-sidebar-border: var(--primary-color-6);
  --dx-sidebar-accent: var(--primary-color-4);
  --dx-sidebar-accent-foreground: var(--secondary-color-4);
  --dx-sidebar-ring: var(--primary-color-7);

  display: flex;
  overflow: hidden;
  width: 100%;
  height: 100svh;
  min-height: 100svh;
}

@media (width >=768px) {
  .dx-sidebar-wrapper:has(.dx-sidebar-desktop[data-side="right"]) {
    flex-direction: row-reverse;
  }

  .dx-sidebar-wrapper:has(.dx-sidebar-desktop[data-variant="inset"]) {
    background: var(--dx-sidebar-background);
  }
}

.dx-sidebar-desktop {
  display: none;
  color: var(--dx-sidebar-foreground);
}

@media (width >=768px) {
  .dx-sidebar-desktop {
    display: block;
  }
}

.dx-sidebar-gap {
  position: relative;
  width: var(--dx-sidebar-width);
  background: transparent;
  transition: width 200ms ease-out;
}

[data-collapsible="icon"] .dx-sidebar-gap {
  width: var(--dx-sidebar-width-icon);
}

[data-variant="floating"] .dx-sidebar-gap,
[data-variant="inset"] .dx-sidebar-gap {
  width: var(--dx-sidebar-width);
}

[data-variant="floating"][data-collapsible="icon"] .dx-sidebar-gap,
[data-variant="inset"][data-collapsible="icon"] .dx-sidebar-gap {
  width: calc(var(--dx-sidebar-width-icon) + 1rem);
}

[data-collapsible="offcanvas"] .dx-sidebar-gap {
  width: 0;
}

.dx-sidebar-container {
  position: fixed;
  z-index: 10;
  top: 0;
  bottom: 0;
  display: none;
  width: var(--dx-sidebar-width);
  height: 100svh;
  box-sizing: border-box;
  transition: left 200ms ease-out, right 200ms ease-out, width 200ms ease-out;
}

@media (width >=768px) {
  .dx-sidebar-container {
    display: flex;
  }
}

[data-side="left"] .dx-sidebar-container {
  left: 0;
}

[data-side="left"][data-collapsible="offcanvas"] .dx-sidebar-container {
  left: calc(var(--dx-sidebar-width) * -1);
}

[data-side="right"] .dx-sidebar-container {
  right: 0;
}

[data-side="right"][data-collapsible="offcanvas"] .dx-sidebar-container {
  right: calc(var(--dx-sidebar-width) * -1);
}

[data-collapsible="icon"] .dx-sidebar-container {
  overflow: visible;
  width: var(--dx-sidebar-width-icon);
}

[data-collapsible="icon"] .dx-sidebar-inner {
  overflow: visible;
}

[data-variant="sidebar"][data-side="left"] .dx-sidebar-container {
  border-right: 1px solid var(--dx-sidebar-border);
}

[data-variant="sidebar"][data-side="right"] .dx-sidebar-container {
  border-left: 1px solid var(--dx-sidebar-border);
}

[data-variant="floating"] .dx-sidebar-container,
[data-variant="inset"] .dx-sidebar-container {
  padding: 0.5rem;
}

[data-variant="floating"][data-collapsible="icon"] .dx-sidebar-container,
[data-variant="inset"][data-collapsible="icon"] .dx-sidebar-container {
  width: calc(var(--dx-sidebar-width-icon) + 1rem + 2px);
}

.dx-sidebar-inner {
  display: flex;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  flex-direction: column;
  background: var(--dx-sidebar-background);
}

[data-variant="floating"] .dx-sidebar-inner {
  border: 1px solid var(--dx-sidebar-border);
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}

.dx-sidebar-static {
  display: flex;
  width: var(--dx-sidebar-width);
  height: 100%;
  flex-direction: column;
  background: var(--dx-sidebar-background);
  color: var(--dx-sidebar-foreground);
}

.dx-sidebar-sheet {
  width: var(--dx-sidebar-width-mobile) !important;
  padding: 0 !important;
  background: var(--dx-sidebar-background);
}

.dx-sidebar-sheet-close {
  display: none;
}

.dx-sidebar-mobile-inner {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
}

.dx-sidebar-trigger {
  display: inline-flex;
  width: 1.75rem;
  height: 1.75rem;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  line-height: 0;
}

.dx-sidebar-trigger-icon {
  width: 1rem;
  height: 1rem;
}

.dx-sidebar-rail {
  position: absolute;
  z-index: 20;
  top: 0;
  bottom: 0;
  display: none;
  width: 1rem;
  padding: 0;
  border: none;
  background: transparent;
  cursor: ew-resize;
  transform: translateX(-50%);
  transition: all 200ms ease-out;
}

@media (width >=640px) {
  .dx-sidebar-rail {
    display: flex;
  }
}

.dx-sidebar-rail::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 2px;
  content: "";
}

.dx-sidebar-rail:hover::after {
  background: var(--dx-sidebar-border);
}

[data-side="left"] .dx-sidebar-rail {
  right: -1rem;
  cursor: w-resize;
}

[data-side="right"] .dx-sidebar-rail {
  left: 0;
  cursor: e-resize;
}

[data-side="left"][data-state="collapsed"] .dx-sidebar-rail {
  cursor: e-resize;
}

[data-side="right"][data-state="collapsed"] .dx-sidebar-rail {
  cursor: w-resize;
}

[data-collapsible="offcanvas"] .dx-sidebar-rail {
  transform: translateX(0);
}

[data-collapsible="offcanvas"] .dx-sidebar-rail::after {
  left: 100%;
}

[data-collapsible="offcanvas"] .dx-sidebar-rail:hover {
  background: var(--dx-sidebar-background);
}

[data-side="left"][data-collapsible="offcanvas"] .dx-sidebar-rail {
  right: -0.5rem;
}

[data-side="right"][data-collapsible="offcanvas"] .dx-sidebar-rail {
  left: -0.5rem;
}

.dx-sidebar-inset {
  position: relative;
  display: flex;
  width: 100%;
  flex: 1 1 0%;
  flex-direction: column;
  background: var(--primary-color-1);
}

[data-variant="inset"]~.dx-sidebar-inset {
  border-radius: 0.75rem;
  margin: 0.5rem;
  margin-left: 0;
  box-shadow: 0 1px 3px rgb(0 0 0 / 10%);
}

[data-variant="inset"][data-state="collapsed"]~.dx-sidebar-inset {
  margin-left: 0.5rem;
}

[data-variant="inset"][data-side="right"]~.dx-sidebar-inset {
  margin-right: 0;
  margin-left: 0.5rem;
}

[data-variant="inset"][data-side="right"][data-state="collapsed"]~.dx-sidebar-inset {
  margin-right: 0.5rem;
}

.dx-sidebar-header {
  display: flex;
  flex-direction: column;
  padding: 0.5rem;
  gap: 0.5rem;
}

.dx-sidebar-content {
  display: flex;
  overflow: hidden auto;
  min-height: 0;
  flex: 1 1 0%;
  flex-direction: column;
  gap: 0.5rem;
}

[data-collapsible="icon"] .dx-sidebar-content {
  overflow: visible;
}

.dx-sidebar-footer {
  display: flex;
  flex-direction: column;
  padding: 0.5rem;
  gap: 0.5rem;
}

.dx-sidebar-separator {
  width: auto;
  margin: 0 0.5rem;
  background: var(--dx-sidebar-border);
}

.dx-sidebar-group {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 0.5rem;
}

.dx-sidebar-group-label {
  display: flex;
  height: 2rem;
  align-items: center;
  padding: 0 0.5rem;
  border-radius: 0.375rem;
  color: var(--dx-sidebar-foreground);
  font-size: 0.75rem;
  font-weight: 500;
  opacity: 0.7;
  outline: none;
  transition: margin 200ms ease-out, opacity 200ms ease-out;
}

.dx-sidebar-group-label svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

[data-collapsible="icon"] .dx-sidebar-group-label {
  margin-top: -2rem;
  opacity: 0;
}

.dx-sidebar-group-action {
  position: absolute;
  top: 0.875rem;
  right: 0.75rem;
  display: flex;
  width: 1.25rem;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: 0.375rem;
  aspect-ratio: 1;
  background: transparent;
  color: var(--dx-sidebar-foreground);
  cursor: pointer;
  outline: none;
  transition: transform 150ms ease-out, opacity 200ms ease-out, visibility 0ms 0ms;
}

.dx-sidebar-group-action:hover {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-group-action svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

/* Increase hit area on mobile */
.dx-sidebar-group-action::after {
  position: absolute;
  content: "";
  inset: -0.5rem;
}

@media (width >=768px) {
  .dx-sidebar-group-action::after {
    display: none;
  }
}

[data-collapsible="icon"] .dx-sidebar-group-action {
  opacity: 0;
  pointer-events: none;
  transition: transform 150ms ease-out, opacity 200ms ease-out, visibility 0ms 200ms;
  visibility: hidden;
}

.dx-sidebar-group-content {
  width: 100%;
  font-size: 0.875rem;
}

.dx-sidebar-menu {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  padding: 0;
  margin: 0;
  gap: 0.25rem;
  list-style: none;
}

.dx-sidebar-menu .dx-sidebar-dropdown-menu,
.dx-sidebar-menu .dx-sidebar-tooltip {
  display: block;
  width: 100%;
}

.dx-sidebar-dropdown-menu-content .dx-sidebar-dropdown-separator[data-orientation="horizontal"] {
  margin: 0.25rem 0;
}

.dx-sidebar-menu-item {
  position: relative;
}

.dx-sidebar-menu-item > .dx-sidebar-dropdown-menu:has(.dx-sidebar-menu-action) {
  position: static;
}

.dx-sidebar-header .dx-sidebar-menu-button.dx-sidebar-dropdown-menu-trigger:not(:focus-visible),
.dx-sidebar-footer .dx-sidebar-menu-button.dx-sidebar-dropdown-menu-trigger:not(:focus-visible) {
  box-shadow: none;
}

.dx-sidebar-sheet .dx-sidebar-header .dx-sidebar-dropdown-menu-content {
  margin-top: 4px;
  margin-bottom: 0;
  inset: 100% auto auto 0;
}

.dx-sidebar-sheet .dx-sidebar-footer .dx-sidebar-dropdown-menu-content {
  margin-top: 0;
  margin-bottom: 4px;
  inset: auto auto 100% 0;
}

.dx-sidebar-menu-button.dx-sidebar-collapsible-trigger:hover {
  text-decoration: none;
  text-decoration-line: none;
}

@media (width >= 768px) {
  .dx-sidebar-desktop[data-side="left"] :is(.dx-sidebar-header, .dx-sidebar-menu-item:has(.dx-sidebar-menu-action)) .dx-sidebar-dropdown-menu-content {
    top: 0;
    left: 100%;
    margin-top: 0;
    margin-left: 0.5rem;
  }

  .dx-sidebar-desktop[data-side="left"] .dx-sidebar-footer .dx-sidebar-dropdown-menu-content {
    top: auto;
    bottom: 0;
    left: 100%;
    margin-bottom: 0;
    margin-left: 0.5rem;
  }

  .dx-sidebar-desktop[data-side="right"] :is(.dx-sidebar-header, .dx-sidebar-menu-item:has(.dx-sidebar-menu-action)) .dx-sidebar-dropdown-menu-content {
    top: 0;
    right: 100%;
    left: auto;
    margin-top: 0;
    margin-right: 0.5rem;
  }

  .dx-sidebar-desktop[data-side="right"] .dx-sidebar-footer .dx-sidebar-dropdown-menu-content {
    margin-right: 0.5rem;
    margin-bottom: 0;
    inset: auto 100% 0 auto;
  }
}

.dx-sidebar-menu-button[data-sidebar="menu-button"] {
  display: flex;
  overflow: hidden;
  width: 100%;
  box-sizing: border-box;
  align-items: center;
  padding: 0.5rem;
  border: none;
  border-radius: 0.375rem;
  background: transparent;
  color: var(--dx-sidebar-foreground);
  cursor: pointer;
  font-size: 0.875rem;
  gap: 0.5rem;
  outline: none;
  text-align: left;
  text-decoration: none;
  transition: width 200ms ease-out, height 200ms ease-out, padding 200ms ease-out;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"]:hover {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-button[data-sidebar="menu-button"]:focus-visible {
  box-shadow: 0 0 0 2px var(--dx-sidebar-ring);
}

.dx-sidebar-menu-button[data-sidebar="menu-button"]:active {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-button[data-sidebar="menu-button"]:disabled,
.dx-sidebar-menu-button[data-sidebar="menu-button"][aria-disabled="true"] {
  opacity: 0.5;
  pointer-events: none;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-active="true"] {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
  font-weight: 500;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"] svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"]>span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity 200ms ease-out;
  white-space: nowrap;
}

.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"]>span:last-child {
  opacity: 0;
}

/* Size variants */
.dx-sidebar-menu-button[data-sidebar="menu-button"][data-size="default"] {
  height: 2rem;
  font-size: 0.875rem;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-size="sm"] {
  height: 1.75rem;
  font-size: 0.75rem;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-size="lg"] {
  height: 3rem;
  font-size: 0.875rem;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-variant="outline"] {
  background: var(--primary-color-1);
  box-shadow: 0 0 0 1px var(--dx-sidebar-border);
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-variant="outline"]:hover {
  background: var(--dx-sidebar-accent);
  box-shadow: 0 0 0 1px var(--dx-sidebar-accent);
}

.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"] {
  width: 2rem;
  height: 2rem;
  padding: 0.5rem;
}

.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"][data-size="lg"] {
  padding: 0;
}

.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"]:has(> :first-child:is(svg, img)),
.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"]:has(> :first-child:has(svg, img)) {
  justify-content: center;
  gap: 0;
}

.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"]:has(> :first-child:is(svg, img))> :not(:first-child),
.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"]:has(> :first-child:has(svg, img))> :not(:first-child) {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  padding: 0;
  border: 0;
  margin: -1px;
  clip-path: inset(50%);
  white-space: nowrap;
}

.dx-sidebar-desktop[data-collapsible="icon"] .dx-sidebar-menu-button[data-sidebar="menu-button"] svg {
  display: block;
}

.dx-sidebar-menu-item:has(.dx-sidebar-menu-action[data-sidebar="menu-action"]) .dx-sidebar-menu-button[data-sidebar="menu-button"] {
  padding-right: 2rem;
}

.dx-sidebar-menu-action[data-sidebar="menu-action"] {
  position: absolute;
  top: 0.375rem;
  right: 0.25rem;
  display: flex;
  width: 1.25rem;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: 0.375rem;
  aspect-ratio: 1;
  background: transparent;
  color: var(--dx-sidebar-foreground);
  cursor: pointer;
  outline: none;
  transition: transform 150ms ease-out, opacity 200ms ease-out, visibility 0ms 0ms;
}

.dx-sidebar-menu-action[data-sidebar="menu-action"]:hover {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-action[data-sidebar="menu-action"] svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.dx-sidebar-menu-action[data-sidebar="menu-action"]::after {
  position: absolute;
  content: "";
  inset: -0.5rem;
}

@media (width >=768px) {
  .dx-sidebar-menu-action[data-sidebar="menu-action"]::after {
    display: none;
  }
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-size="sm"]~.dx-sidebar-menu-action[data-sidebar="menu-action"] {
  top: 0.25rem;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-size="default"]~.dx-sidebar-menu-action[data-sidebar="menu-action"] {
  top: 0.375rem;
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-size="lg"]~.dx-sidebar-menu-action[data-sidebar="menu-action"] {
  top: 0.625rem;
}

[data-collapsible="icon"] .dx-sidebar-menu-action[data-sidebar="menu-action"] {
  opacity: 0;
  pointer-events: none;
  transition: transform 150ms ease-out, opacity 200ms ease-out, visibility 0ms 200ms;
  visibility: hidden;
}

.dx-sidebar-menu-action[data-sidebar="menu-action"][data-show-on-hover="true"] {
  opacity: 0;
}

@media (width >=768px) {
  .dx-sidebar-menu-item:hover .dx-sidebar-menu-action[data-sidebar="menu-action"][data-show-on-hover="true"],
  .dx-sidebar-menu-item:focus-within .dx-sidebar-menu-action[data-sidebar="menu-action"][data-show-on-hover="true"],
  .dx-sidebar-menu-action[data-sidebar="menu-action"][data-show-on-hover="true"][data-state="open"] {
    opacity: 1;
  }
}

.dx-sidebar-menu-button[data-sidebar="menu-button"][data-active="true"]~.dx-sidebar-menu-action[data-sidebar="menu-action"][data-show-on-hover="true"] {
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-badge {
  position: absolute;
  top: 0.375rem;
  right: 0.25rem;
  display: flex;
  min-width: 1.25rem;
  height: 1.25rem;
  align-items: center;
  justify-content: center;
  padding: 0 0.25rem;
  border-radius: 0.375rem;
  color: var(--dx-sidebar-foreground);
  font-size: 0.75rem;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  pointer-events: none;
  transition: opacity 200ms ease-out;
  user-select: none;
}

.dx-sidebar-menu-item:hover .dx-sidebar-menu-badge,
.dx-sidebar-menu-item:has(.dx-sidebar-menu-button[data-active="true"]) .dx-sidebar-menu-badge {
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-item:has(.dx-sidebar-menu-button[data-size="sm"]) .dx-sidebar-menu-badge {
  top: 0.25rem;
}

.dx-sidebar-menu-item:has(.dx-sidebar-menu-button[data-size="lg"]) .dx-sidebar-menu-badge {
  top: 0.625rem;
}

[data-collapsible="icon"] .dx-sidebar-menu-badge {
  opacity: 0;
  pointer-events: none;
}

.dx-sidebar-menu-skeleton {
  display: flex;
  height: 2rem;
  align-items: center;
  padding: 0 0.5rem;
  border-radius: 0.375rem;
  gap: 0.5rem;
}

.dx-sidebar-menu-skeleton-icon {
  width: 1rem;
  height: 1rem;
  border-radius: 0.375rem;
}

.dx-sidebar-menu-skeleton-text {
  height: 1rem;
  flex: 1;
}

.dx-sidebar-menu-sub {
  display: flex;
  flex-direction: column;
  padding: 0.125rem 0.625rem;
  border-left: 1px solid var(--dx-sidebar-border);
  margin: 0 0.875rem;
  gap: 0.25rem;
  list-style: none;
  transform: translateX(1px);
  transition: opacity 200ms ease-out, max-height 200ms ease-out, padding 200ms ease-out, margin 200ms ease-out, visibility 0ms 0ms;
}

[data-collapsible="icon"] .dx-sidebar-menu-sub {
  overflow: hidden;
  max-height: 0;
  padding: 0;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 200ms ease-out, max-height 200ms ease-out, padding 200ms ease-out, margin 200ms ease-out, visibility 0ms 200ms;
  visibility: hidden;
}

.dx-sidebar-menu-sub-item {
  position: relative;
}

.dx-sidebar-menu-sub-button {
  display: flex;
  overflow: hidden;
  width: 100%;
  min-width: 0;
  height: 1.75rem;
  box-sizing: border-box;
  align-items: center;
  padding: 0 0.5rem;
  border: none;
  border-radius: 0.375rem;
  background: transparent;
  color: var(--dx-sidebar-foreground);
  cursor: pointer;
  font-size: 0.875rem;
  gap: 0.5rem;
  outline: none;
  text-decoration: none;
  transform: translateX(-1px);
  transition: opacity 200ms ease-out;
}

.dx-sidebar-menu-sub-button:hover {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-sub-button:focus-visible {
  box-shadow: 0 0 0 2px var(--dx-sidebar-ring);
}

.dx-sidebar-menu-sub-button:active {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-sub-button:disabled,
.dx-sidebar-menu-sub-button[aria-disabled="true"] {
  opacity: 0.5;
  pointer-events: none;
}

.dx-sidebar-menu-sub-button[data-active="true"] {
  background: var(--dx-sidebar-accent);
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-sub-button svg {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  color: var(--dx-sidebar-accent-foreground);
}

.dx-sidebar-menu-sub-button>span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dx-sidebar-menu-sub-button[data-size="sm"] {
  font-size: 0.75rem;
}

.dx-sidebar-menu-sub-button[data-size="md"] {
  font-size: 0.875rem;
}

[data-collapsible="icon"] .dx-sidebar-menu-sub-button {
  opacity: 0;
  pointer-events: none;
}