/* DROPX MOBILE DRAWER V10.2 */

/* Disable overlays and close buttons created by older responsive attempts. */
.dropx-mobile-menu-overlay,
.dropx-mobile-menu-close,
.dx-v96-menu-overlay,
.dx-v96-menu-close,
.dx10-overlay,
.dx10-close {
  display: none !important;
}

#dx102-overlay {
  all: unset !important;
  position: fixed !important;
  z-index: 2147483000 !important;
  inset: 0 !important;
  display: block !important;
  width: 100vw !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(8, 20, 34, 0.56) !important;
  box-shadow: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition:
    opacity 0.18s ease,
    visibility 0.18s ease !important;
}

body.dx102-menu-open #dx102-overlay {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

#dx102-close {
  all: unset !important;
  position: absolute !important;
  z-index: 2147483646 !important;
  top: 10px !important;
  right: 10px !important;
  display: grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  border: 1px solid #d2dde8 !important;
  border-radius: 11px !important;
  background: #ffffff !important;
  color: #254660 !important;
  box-shadow:
    0 4px 14px
    rgba(25, 45, 66, 0.12) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

#dx102-close span {
  font-size: 29px !important;
  line-height: 1 !important;
}

body.dx102-mobile .erp-sidebar,
body.dx102-mobile aside.dx102-sidebar {
  position: fixed !important;
  z-index: 2147483640 !important;
  inset: 0 auto 0 0 !important;
  display: block !important;
  width: min(88vw, 340px) !important;
  min-width: 0 !important;
  max-width: 340px !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding-inline: 16px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  transform: translate3d(-110%, 0, 0) !important;
  transition: transform 0.20s ease !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: #ffffff !important;
  border-radius: 0 !important;
  border-right: 0 !important;
  box-shadow:
    20px 0 60px
    rgba(9, 23, 37, 0.30) !important;
  pointer-events: auto !important;
  contain: none !important;
}

body.dx102-mobile.dx102-menu-open .erp-sidebar,
body.dx102-mobile.dx102-menu-open aside.dx102-sidebar {
  transform: translate3d(0, 0, 0) !important;
}

body.dx102-mobile {
  overflow-x: hidden !important;
}

body.dx102-mobile.dx102-menu-open {
  overflow: hidden !important;
}

body.dx102-mobile .erp-content {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow-x: hidden !important;
}

@media (max-width: 430px) {
  body.dx102-mobile .erp-sidebar,
  body.dx102-mobile aside.dx102-sidebar {
    width: 94vw !important;
    max-width: 94vw !important;
  }
}