.dispatch-dialog-pro {
  display: flex !important;
  flex-direction: column !important;
  width: min(100vw - 1rem, 1120px) !important;
  height: calc(100dvh - 2rem) !important;
  max-height: calc(100dvh - 2rem) !important;
  overflow: hidden !important;
}

.dispatch-dialog-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  gap: .75rem !important;
  padding-top: .75rem !important;
  padding-bottom: .75rem !important;
}

.dispatch-dialog-table {
  flex: 0 0 auto !important;
  min-height: 130px !important;
  max-height: min(40dvh, 360px) !important;
  overflow: auto !important;
}

.dispatch-dialog-table [data-slot="table-container"] {
  overflow: visible !important;
  min-width: 920px;
}

.dispatch-dialog-table table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.dispatch-dialog-table thead,
.dispatch-dialog-table th {
  position: sticky !important;
  top: 0 !important;
  z-index: 60 !important;
  background: linear-gradient(180deg, #f8fafc, #eef3f9) !important;
}

.dispatch-dialog-table th {
  box-shadow: inset 0 -1px #dbe3ee, 0 2px 8px rgba(15, 23, 42, .06);
}

.dispatch-dialog-table thead tr {
  position: relative !important;
  z-index: 60 !important;
}

.dispatch-dialog-footer {
  position: sticky;
  bottom: 0;
  z-index: 30;
  background: rgba(248, 250, 252, .97) !important;
  box-shadow: 0 -18px 34px -30px rgba(15, 23, 42, .75);
}

.dispatch-scanbar-header {
  width: 100% !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  align-items: stretch !important;
  background: rgba(248, 250, 252, .9) !important;
}

.dispatch-dialog-body::-webkit-scrollbar {
  width: 10px;
}

.dispatch-dialog-body::-webkit-scrollbar-track {
  background: #e2e8f0;
  border-radius: 999px;
}

.dispatch-dialog-body::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #94a3b8, #64748b);
  border: 2px solid #f8fafc;
  border-radius: 999px;
}

@media (min-width: 640px) {
  .dispatch-dialog-pro {
    height: calc(100dvh - 4rem) !important;
    max-height: calc(100dvh - 4rem) !important;
  }
}

@media (min-width: 980px) {
  .dispatch-dialog-pro {
    position: relative !important;
  }

  .dispatch-dialog-pro > [data-slot="dialog-header"] {
    min-height: 92px !important;
    padding-right: 3.5rem !important;
  }

  .dispatch-scanbar-header {
    position: absolute !important;
    top: 44px !important;
    left: clamp(330px, 36vw, 430px) !important;
    right: 54px !important;
    width: auto !important;
    z-index: 75 !important;
    padding: .35rem !important;
    border-color: rgba(203, 213, 225, .95) !important;
    box-shadow: 0 14px 28px -24px rgba(15, 23, 42, .9) !important;
  }

  .dispatch-scanbar-header input {
    height: 34px !important;
  }

  .dispatch-scanbar-header button {
    height: 34px !important;
    width: 34px !important;
  }
}

@media (min-width: 980px) and (max-width: 1160px) {
  .dispatch-dialog-pro > [data-slot="dialog-header"] {
    min-height: 112px !important;
  }

  .dispatch-scanbar-header {
    top: 72px !important;
    left: 18px !important;
    right: 54px !important;
  }
}

@media (max-width: 760px) {
  .dispatch-dialog-pro {
    width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
  }

  .dispatch-dialog-body {
    padding: .65rem !important;
  }

  .dispatch-scanbar-header {
    flex-direction: column !important;
    padding: .5rem !important;
  }

  .dispatch-scanbar-header > div {
    width: 100% !important;
  }

  .dispatch-scanbar-header input {
    min-width: 0 !important;
    width: 100% !important;
  }

  .dispatch-dialog-table {
    max-height: 38dvh !important;
  }
}

@media (max-height: 760px) {
  .dispatch-dialog-body {
    gap: .6rem !important;
    padding-top: .6rem !important;
    padding-bottom: .6rem !important;
  }

  .dispatch-dialog-table {
    min-height: 110px !important;
    max-height: 34dvh !important;
  }

  .dispatch-dialog-footer {
    padding-top: .6rem !important;
    padding-bottom: .6rem !important;
  }
}

@media (max-width: 640px) {
  .dispatch-dialog-footer > div {
    justify-content: stretch !important;
  }

  .dispatch-dialog-footer button {
    min-height: 42px;
  }
}
