/* :root,
:root.light {
  --bg-color: #fff;
  --text-color: #123;
}
:root.dark {
  --bg-color: #121212;
  --text-color: #45 adfe;
} */

:root {
  --red-color: #ac3d39;
  --red-color-10: #bf443f;
  --red-1: #ff0606;
  --black-one: #6b797c;
  --black-two: #081f24;
  --td-orange: #f58d29;
  --gray-one: #efefef;
  --gray-two: #f1f1f1;
  --gray-three: #e7e7e7;
  --gray-four: #fcfcfc;
  --gray-five: #aeaeae;
  --gray-six: #f7f7f7;
  --gray-seven: #717a8e;
  --white: #fff;
  --blue-one: #0679ff;
  --blue-one-opac-6: #0610ff0f;
  --green-one: #08aa49;
  --green-one-opac-10: #08aa491a;
  --red-two-opac-6: #ff06060f;
  --red-two: #ff0606;
}
/* background: var(--red-color-10); */

.Toastify__toast-container {
  width: fit-content !important;
}

.Toastify__toast-container .Toastify__toast {
  padding: 0 !important;
}

.Toastify__toast-container .Toastify__toast .Toastify__toast-body {
  padding: 0 !important;
}

/* ***** until a fix is found ******* */
.modal-backdrop.show {
  display: none;
}

/* STATUSES */

.custom_status {
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  width: fit-content;
  border-radius: 34px;
  padding: 2px 6px 4px 6px;
  /* margin-left: 8px; */
  margin-bottom: 0;
  text-transform: capitalize;
  height: fit-content;
  background: #ff8c060f;
  color: var(--td-orange);
}

.custom_status.processing {
  color: var(--blue-one);
  background-color: var(--blue-one-opac-6);
}

.custom_status.draft {
  color: var(--black-one);
  background: #6b797c0f;
}

.custom_status.failed {
  color: var(--red-two);
  background: var(--red-two-opac-6);
}

.custom_status.success {
  color: var(--green-one);
  background: var(--green-one-opac-10);
}

.incoterm {
  background-color: var(--blue-one);
  color: var(--white) !important;
  padding: 0.5px 4px;
  border-radius: 4px;
  height: 17px !important;
  line-height: 14px;
  font-size: 12px !important;
  width: max-content !important;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* Pagination */

.custom_pagination {
  margin-right: 30px;
  display: flex;
  border-bottom: 1px solid var(--gray-three);
  justify-content: flex-end;
}

.custom_pagination ul {
  list-style: none;
  display: flex;
  gap: 8px;
  padding-left: 0;
}

.custom_pagination ul li {
  box-shadow: 0px 2px 2px -1px #0000000a;
  background-color: var(--white);
  height: 32px;
  display: flex;
  text-align: center;
  width: 32px;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  font-size: 14px;
  color: var(--black-one);
  cursor: pointer;
  border: 1px solid var(--gray-three);
}

.custom_pagination ul li.previous a,
.custom_pagination ul li.next a {
  color: var(--black-one);
  text-decoration: none;
  font-weight: 800;
  font-size: 11px;
}

.custom_pagination ul li.active {
  border: 2px solid var(--black-two);
  color: var(--black-two);
}

/* Pagination ends */

/* Delete Modal Styles */

.delete-modal {
}

.delete-modal .modal-dialog {
  width: 400px;
  height: 355px;
}

.delete-modal .modal-header {
  border-bottom: 0;
  padding: 20px;
}

.delete-modal .modal-header .close-btn {
  margin-right: 16px;
}

.delete-modal .modal-header h1 {
  color: var(--black-one);
  line-height: 19px;
  font-weight: 400;
  font-size: 16px;
}

.delete-modal .modal-body {
  padding: 0 20px;
}

.delete-modal .modal-body h3 {
  color: var(--black-two);
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
}

.delete-modal .modal-body h6 {
  color: var(--black-one);
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  margin-top: 12px;
}

.delete-modal .modal-body .delete-icon-container {
  background: #ff8d06;
  width: fit-content;
  padding: 6px;
  border-radius: 50%;
  height: 48px;
  width: 48px;
  margin-bottom: 20px;
}

.delete-modal .modal-footer {
  border-top: 0;
  padding: 0 20px;
  padding-top: 20px;
}

.delete-modal .modal-footer button:last-child {
  margin-bottom: 20px;
}

/* Delete Modal Styles Ends*/

/* Custom Select Begins */
.custom-select .input_wrapper {
  display: flex;
  position: relative;
}

.custom-select .input_wrapper i {
  position: absolute;
  top: 13px;
  right: 9px;
  font-size: 12px;
}

/* Custom Select Ends  */

.app-spinner {
  color: var(--td-orange) !important;
  width: 20px !important;
  height: 20px;
}

.react-loading-skeleton {
  height: 30px;
  margin-bottom: 10px;
}

/* custom counter */
.custom_counter .plus_minus_controller {
  display: flex;
  align-items: center;
  box-shadow: 0px 2px 2px -1px #0000000a;
  border: 1px solid var(--gray-three);
  background: #f1f1f1;
  border-radius: 8px;
  font-size: 14px;
  overflow: hidden;
  height: 28px;
  justify-content: space-evenly;
  width: 110px;
}

.custom_counter .plus_minus_controller button i {
  font-weight: 800;
  color: var(--black-two);
  /* padding: 13px 7.5px; */
}

.custom_counter .plus_minus_controller button {
  cursor: pointer;
  width: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--gray-two);
  height: fit-content;
}

.custom_counter .plus_minus_controller button:focus {
  box-shadow: none;
  outline: none;
}

.custom_counter .plus_minus_controller input {
  width: 50%;
  border-radius: 0 !important;
  height: -webkit-fill-available;
  border: none !important;
  text-align: center;
}

.custom_counter .plus_minus_controller input:focus {
  outline: none;
  box-shadow: none !important;
}

/* custom counter ends */

/* table component starts  */
.screen-loader-wrapper {
  padding: 10px 20px;
}

.customer-portal-table {
  table-layout: fixed;
}

.customer-portal-table thead th {
  background-color: var(--gray-six);
  border-bottom: 0;
  padding: 9px 0 10px 0px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;

  &:first-child {
    padding-left: 20px;
  }

  &.pd-left-40 {
    padding-left: 40px;
  }

  &.pd-left-30 {
    padding-left: 30px;
  }

  &.pd-left-20 {
    padding-left: 20px;
  }

  &.center {
    text-align: center;
  }
}

.customer-portal-table tbody tr {
  cursor: pointer;
  height: 41px;
  vertical-align: middle;

  td {
    color: var(--black-one);
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    padding-left: 0;

    &:first-child {
      padding-left: 20px;
    }

    &.center {
      text-align: center;
    }
  }
}

/* table component ends */

.tdp_mobile {
  height: 100vh;
  display: flex;
  align-items: center;
  text-align: center;
  padding: 0 33px;
  flex-direction: column;
  justify-content: center;
}

.tdp_mobile img {
  width: 20%;
  margin-bottom: 7px;
}

.tdp_mobile h4 {
  font-size: 18px;
  font-weight: 700;
}

.date-picker-container-custom {
  display: flex;
  position: relative;
  margin-top: -10px;
}

.date-picker-container-custom .react-datepicker-wrapper {
  width: 100%;
}

.date-picker-container-custom .react-datepicker-wrapper input {
  width: 100%;
  padding: 12px;
  margin-bottom: 0 !important;
}

.date-picker-container-custom svg {
  position: absolute;
  top: 21px;
  right: 9px;
}

.date-picker-container .react-datepicker__header {
  background-color: #fff;
}

.date-picker-container .react-datepicker__day--in-range {
  background-color: var(--black-two);
  color: var(--white);
}

.date-picker-container
  .react-datepicker__day--in-selecting-range:not(
    .react-datepicker__day--in-range,
    .react-datepicker__month-text--in-range,
    .react-datepicker__quarter-text--in-range,
    .react-datepicker__year-text--in-range
  ) {
  background-color: var(--black-one);
}

/* layout styles */
.tdp_layout {
}

.tdp_layout .side-nav-container {
  padding-right: 0;
  padding-left: 0;
}

.tdp_layout .side-nav-container .sticky-col-2 {
  height: 100vh;
  background: #fcfcfc;
  padding: 15px 40px;
  overflow: overlay;
  position: fixed;
  width: 100%;
}

.tdp_layout .side-nav-container .sticky-col-2 .tdp_side_nav .nav_menu {
  display: flex;
  padding: 8px;
  gap: 4px;
  border-radius: 8px;
  min-height: 50px;
  max-height: max-content;
  width: 14%;
  margin-bottom: 14px;
  cursor: pointer;
  align-items: center;
}

.tdp_layout .side-nav-container .sticky-col-2 .tdp_side_nav .nav_menu.active {
  background: var(--white);
  box-shadow: 0px 4px 12px 0px #0000000a;
  border: 1px solid var(--gray-three);
}

.tdp_layout .side-nav-container .sticky-col-2 .tdp_side_nav .nav_menu h4 {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: var(--black-one);
  margin-top: 2px;
}

.tdp_layout .side-nav-container .sticky-col-2 .tdp_side_nav .nav_menu h6 {
  margin-bottom: 0;
  font-size: 12px;
  line-height: 14.3px;
  font-weight: 400;
  color: var(--black-one);
}

.tdp_layout .side-nav-container .sticky-col-2 .tdp_side_nav .nav_menu.active h6,
.tdp_layout
  .side-nav-container
  .sticky-col-2
  .tdp_side_nav
  .nav_menu.active
  h4 {
  color: var(--black-two);
}

.tdp_layout .side-nav-container .sticky-col-2 .tdp_side_nav .nav_menu svg path {
  stroke: var(--black-one);
}

.tdp_layout
  .side-nav-container
  .sticky-col-2
  .tdp_side_nav
  .nav_menu.active
  svg
  path {
  stroke: #ff8d06;
}

.tdp_layout .side-nav-container .sticky-col-2 .tdp_side_nav .nav_menu img {
  width: 28px;
  height: 28px;
}

.tdp_layout .side-nav-container .sticky-col-2 .outlet-handler {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0px 9px;
  padding-top: 20px;
  padding-bottom: 52px;
}

.tdp_layout .side-nav-container .sticky-col-2 .outlet-handler span {
  background: var(--gray-one);
  padding: 9px;
  border-radius: 50%;
  height: fit-content;
  display: flex;
  align-items: center;
  justify-content: center;
}

.tdp_layout .side-nav-container .sticky-col-2 .outlet-handler p {
  margin-bottom: 0;
  color: var(--black-two);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  text-transform: capitalize;
  width: 10%;
  text-overflow: ellipsis;
  overflow: hidden;
  flex-wrap: wrap;
  white-space: nowrap;
}

.tdp_layout .view-box {
  position: fixed;
  background-color: #fcfcfc;
  height: 100vw;
  width: -webkit-fill-available;
  overflow-y: scroll;
}

.tdp_layout .hasOnboarding {
  background-image: url("/images/console-top-bg.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-color: var(--white);
}

.tdp_layout .content-wrapper {
  margin-top: 100px;
  position: relative;
  height: 100%;
  width: inherit;
  /* margin-bottom: 50%; */
  margin-bottom: 50vh;
}

.tdp_layout .content-wrapper .page-header {
  top: 95px;
  background: white;
  z-index: 3;
  border-bottom: 1px solid var(--gray-three);
  padding-bottom: 20px;
  border-top-left-radius: 16px;
  border: 1px solid var(--gray-three);
  border-right: none;
}

.tdp_layout .content-wrapper .page-body {
  position: relative;
  border: 1px solid var(--gray-three);
  min-height: 100%;
  background: var(--white);
  border-top: 0;
  padding-bottom: 100px;
}

.tdp_register .nav_controller {
  display: flex;
  background: var(--gray-four);
  padding: 17px 80px;
  height: 70px;
  justify-content: space-between;
  align-items: center;
}

.tdp_register .nav_controller .title {
  display: flex;
  align-items: center;
  gap: 24px;
}

.tdp_register .nav_controller .title i {
  cursor: pointer;
}

.tdp_register .nav_controller .title h4 {
  color: var(--black-one);
  font-weight: 400;
  font-size: 16px;
  margin-bottom: 0px;
}

.tdp_register .nav_controller .progress {
  width: 420px;
  margin-right: 130px;
  height: 10px;
}

.tdp_register .nav_controller .progress .bg-success {
  background-color: #081f24 !important;
}

.tdp_register .form-container .form-section .form-icon {
  background: #ff8d06;
  width: fit-content;
  padding: 7px 6px;
  border-radius: 50%;
  margin-bottom: 32px;
}

.tdp_register .form-container .form-section .form-icon._logo svg {
  margin: 8px 2px;
}

.tdp_register .form-container .form-section .form-itself h3 {
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  margin-bottom: 4px;
}

.tdp_register .form-container .form-section .form-itself h5 {
  color: var(--black-one);
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  margin-bottom: 12px;
}

.tdp_register .form-container .form-section .form-itself .error-message {
  color: var(--red-two);
  font-size: 12px;
  margin-bottom: 4px;
  margin-top: -4px;
}

.tdp_register .form-container .form-section .form-itself .v-input__ {
  position: relative;
}

.tdp_register .form-container .form-section .form-itself .v-input__ span {
  position: absolute;
  top: 14px;
  right: 11px;
  line-height: 14px;
  font-size: 12px;
  font-weight: 400;
  color: var(--td-orange);
  cursor: pointer;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .v-input__
  span
  .app-spinner {
  margin-top: -4px;
}

.tdp_register .form-container .form-section .form-itself h6 {
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 12px;
}

.tdp_register .form-container .form-section .form-itself select {
  margin-bottom: 8px;
}

.tdp_register .form-container .form-section .form-itself h6 span {
  color: var(--td-orange);
  cursor: pointer;
}

.tdp_register .form-container .form-section .form-itself .space-flex {
  display: flex;
  gap: 16px;
}

.tdp_register .form-container .form-section .form-itself input {
  margin-bottom: 8px;
  font-size: 14px;
  /* margin-top: 12px; */
}

.tdp_register .form-container .form-section .form-itself .address-container {
  position: relative;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  .address-loader {
  color: var(--td-orange);
  top: 12px;
  position: absolute;
  right: 12px;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  ._prompt-text {
  color: var(--td-orange);
  font-size: 12px;
  text-decoration: underline;
  cursor: pointer;
  margin-bottom: 8px;
  font-weight: 400;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  .address-list-container {
  background: white;
  position: absolute;
  margin-top: -8px;
  height: fit-content;
  max-height: 150px;
  width: 100%;
  overflow: scroll;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  padding-bottom: 8px;
  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.14);
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  .address-list-container
  p {
  padding: 8px 16px;
  border-bottom: 0.2px solid #717a8e1f;
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: var(--black-one);
  margin-bottom: 0;
  display: flex;
  align-items: center;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  .address-list-container
  p:hover {
  background: var(--gray-six);
  cursor: pointer;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  .address-list-container
  p:last-child {
  border-bottom: none;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  .address-list-container
  p
  span {
  color: var(--black-two);
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .address-container
  .address-list-container
  p
  h6 {
  width: 260px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 0;
  margin-right: 9px;
  margin-top: 0;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container {
  margin-bottom: 12px;
  cursor: pointer;
  border: 1px solid var(--gray-three);
  gap: 8px;
  align-items: center;
  box-shadow: 0px 2px 2px -1px #0000000a;
  border-radius: 8px;
  padding: 12px 8px;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  input {
  display: none;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  .input-container {
  display: flex;
  cursor: pointer;
  gap: 8px;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  .input-container
  p {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  .input-container
  p
  span {
  max-width: 62px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display: flow;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  .uploaded-view {
  display: flex;
  justify-content: space-between;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  .uploaded-view
  .edit-actions {
  display: flex;
  gap: 4px;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  .uploaded-view
  .edit-actions
  span {
  font-size: 12px;
  font-weight: 500;
  border-radius: 32px;
  background: #aeaeae14;
  padding: 4px 6px;
  color: var(--black-two);
  cursor: pointer;
}

.tdp_register
  .form-container
  .form-section
  .form-itself
  .file-upload-container
  .uploaded-view
  .edit-actions
  span:last-child {
  color: var(--td-orange);
  background: #ff42060f;
}

.tdp_register .form-container .form-section .form-itself .upload-instruction {
  background: #2020200f;
  padding: 8px;
  border-radius: 18px;
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  width: fit-content;
}

.tdp_register .form-container .form-section .form-itself button {
  margin-top: 12px;
}

.tdp_register .form-container .form-section .form-itself button.secondary {
  background: none;
  color: var(--td-orange);
}

.tdp_authed_header {
  background: var(--gray-four);
  /* special add */
  padding: 15px 40px;
  position: fixed;
  width: -webkit-fill-available;
  padding-top: 30px;
  z-index: 4;
  top: 0;
}

.tdp_authed_header li {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 4px;
  height: 100%;
  padding-left: 20px;
}

.tdp_authed_header li span {
  background: var(--gray-one);
  padding: 9px;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
}

.tdp_authed_header li span img {
  width: 14px;
  height: 14px;
}

.tdp_authed_header li p {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  color: var(--black-two);
  line-height: 14.5px;
  text-transform: capitalize;
}

.tdp_authed_header .header_props {
  display: flex;
  width: 100%;
  gap: 20px;
}

.tdp_authed_header .header_props .search-div {
  width: 100%;
}

.custom-select-wrapper .custom-select {
  width: 150px;
}

.custom-select-wrapper .custom-select input {
  border-radius: 0.375rem !important;
}

.custom-select-wrapper .custom-select .app-spinner {
  width: 15px !important;
  height: 15px !important;
}

.tdp_authed_header .header_props ._flex__ender {
  display: flex;
  gap: 16px;
  align-items: baseline;
  width: 330px;
}

.tdp_authed_header .header_props ._flex__ender p img {
  width: 35px;
  cursor: pointer;
}

.tdp_authed_header .header_props ._flex__ender btn {
  width: 170px;
}

.tdp_authed_header .dropdown-menu a {
  &:focus {
    background-color: inherit;
  }
  li {
    padding-left: 0;
  }
}

.search-modal .modal-dialog {
  max-width: 650px;
}

.search-modal .modal-dialog .modal-content .modal-header {
  height: 48px;
}

.search-modal .modal-dialog .modal-content .modal-header .search-input {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
}

.search-modal .modal-dialog .modal-content .modal-header .search-input i {
  color: var(--gray-five);
  font-size: 14px;
  position: absolute;
}

.search-modal .modal-dialog .modal-content .modal-header .search-input input {
  width: 100%;
  padding-left: 30px;
  border: none !important;
  font-size: 14px;
  line-height: 16px;
  box-shadow: none !important;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-header
  .search-input
  input:focus {
  outline: none;
  box-shadow: none !important;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results {
  border-bottom: 1px solid var(--gray-three);
  padding-bottom: 12px;
  margin-bottom: 12px;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results:last-child {
  border-bottom: none;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  h2 {
  font-size: 14px;
  color: #6b797c;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results
  h5 {
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  color: var(--black-one);
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results
  p {
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  color: var(--black-two);
  padding: 4px 0;
  margin-bottom: 8px;
  cursor: pointer;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results
  p:hover {
  background-color: #f4f4f4;
  padding: 4px 6px;
  border-radius: 4px;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results
  .product {
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results
  .product:hover {
  background-color: #f4f4f4;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results
  .product
  img {
  width: 27px !important;
  height: auto !important;
}

.search-modal
  .modal-dialog
  .modal-content
  .modal-body
  .search-results-container
  .search-results
  .product
  p {
  margin-bottom: 0;
}

.tdp_body {
  padding-left: 40px;
  margin-top: 80px;
}

.tdp_body .sticky-col-2 {
  /* position: sticky; */
  position: fixed;
  z-index: 2;
  background: #fcfcfc;
  height: 100%;
  left: 0;
  top: 80px;
  width: 320px;
  /* height: 400px; */
}

.tdp_body .tdp_side_nav {
  padding-left: 40px;
  margin-top: 39px;
}

.tdp_body .tdp_side_nav .nav_menu {
  display: flex;
  padding: 8px;
  gap: 4px;
  border-radius: 8px;
  height: 50px;
  width: 200px;
  margin-bottom: 14px;
  cursor: pointer;
  align-items: center;
}

.tdp_body .tdp_side_nav .nav_menu.active {
  background: var(--black-two);
  box-shadow: 0px 4px 7px 0px #0000002b;
}

.tdp_body .tdp_side_nav .nav_menu.logout {
  margin-top: 30vh;
}

.tdp_body .tdp_side_nav .nav_menu h4 {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  color: var(--black-two);
  margin-top: 2px;
}

.tdp_body .tdp_side_nav .nav_menu.active h4,
.tdp_body .tdp_side_nav .nav_menu.active h6 {
  color: var(--white);
}

.tdp_body .tdp_side_nav .nav_menu h6 {
  margin-bottom: 0;
  font-size: 12px;
  line-height: 14.3px;
  font-weight: 400;
  color: var(--black-one);
}

.tdp_body .tdp_side_nav .nav_menu svg path {
  stroke: var(--black-one);
}

.tdp_body .tdp_side_nav .nav_menu.active svg path {
  stroke: var(--white);
}

.tdp_body .tdp_side_nav .nav_menu img {
  width: 28px;
  height: 28px;
}

.tdp_register .form ._confirm-register {
}

.tdp_console {
  background-color: var(--white);
  border: 1px solid var(--gray-three);
  border-top-left-radius: 16px;
}

.tdp_console .section {
  padding: 40px;
}

.tdp_console .section h3 {
  font-size: 24px;
  font-weight: 700;
  line-height: 29.3px;
  color: var(--black-two);
}

.tdp_console .section._one button {
  width: fit-content;
  margin-top: 20px;
  border-radius: 8px;
  padding: 12.5px 25px;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
}

.tdp_console .section._one h6 {
  color: var(--black-one);
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
}

.tdp_console .section._two .time-range {
  display: flex;
  margin-bottom: 20px;
}

.tdp_console .section._two .time-range select {
  width: 140px;
  font-size: 14px;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.tdp_console .section._two .time-range select:focus {
  box-shadow: none !important;
}

.tdp_console .section._two .time-range .react-datepicker-wrapper input {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-left: 0 !important;
  padding-left: 8px;
  width: 90%;
}

.tdp_console .section._two .time-range .date-picker-container {
  display: flex;
  align-items: center;
}

.tdp_console .section._two .time-range .date-picker-container svg {
  position: absolute;
  right: 26px;
  top: 10px;
}

.tdp_console .section._two .volume-container {
  display: flex;
  gap: 12px;
}

.tdp_console .section._two .volume-container .vol__ {
  border: 1px solid var(--gray-one);
  width: 100%;
  border-radius: 8px;
  padding: 20px;
  box-shadow: 0px 2px 2px -1px #0000000a;
  background: var(--white);
  cursor: pointer;
}

.tdp_console .section._two .volume-container .vol__:first-child {
  border: 1px solid var(--black-one);
}

.tdp_console .section._two .volume-container .vol__ h3 {
  color: var(--black-two);
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 68px;
}

.tdp_console .section._two .volume-container .vol__ div {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.tdp_console .section._two .volume-container .vol__ div h6 {
  color: var(--black-two);
  font-size: 24px;
  font-weight: 400;
  line-height: 28px;
}

.tdp_console .section._two .volume-container .vol__ div a {
  color: var(--td-orange);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  text-decoration: none;
  cursor: pointer;
}

.tdp_console .section._three {
  padding: 20px 40px;
}

.tdp_console .section._three .container-table {
  border: 1px solid #e7e7e7;
  padding: 20px;
  box-shadow: 0px 2px 2px -1px #0000000a;
  border-radius: 8px;
}

.tdp_console .section._three .nav_buttons {
  display: flex;
  width: 100%;
  gap: 12px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_console .section._three .nav_buttons button {
  background: var(--white);
  border: 1px solid var(--gray-one);
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  padding-top: 0px;
  width: 180px;
  box-shadow: 0px 4px 12px 0px #0000000a;
}

.tdp_console .section._three .nav_buttons button.active {
  background: var(--white);
  border: 2px solid var(--black-two);
  color: var(--black-two);
  font-weight: 500;
  line-height: 17px;
}

.tdp_console .section._three .nav_content .products-loading-screen {
  display: flex;
  gap: 8px;
}

.tdp_console .section._three .nav_content .empty_content {
  display: flex;
  padding: 79px 0;
  gap: 11px;
}

.tdp_console .section._three .nav_content .empty_content p {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--gray-two);
  height: 36px;
  width: 36px;
  border-radius: 50%;
  padding: 11px;
}

.tdp_console .section._three .nav_content .empty_content h2 {
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
  margin-bottom: 4px;
}

.tdp_console .section._three .nav_content .empty_content h4 {
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  color: var(--black-one);
  margin-bottom: 8px;
  width: 70%;
}

.tdp_console .section._three .nav_content .empty_content h4 a {
  color: var(--td-orange);
  text-decoration: none;
  font-size: 16px;
}

.tdp_console .section._three .nav_content .empty_content a {
  color: var(--td-orange);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  text-decoration: none;
}

.tdp_console .section._three h1 {
  color: var(--black-two);
  line-height: 29px;
  font-size: 24px;
  font-weight: 700;
  padding-bottom: 20px;
  border-bottom: 1px solid #e7e7e7;
}

.tdp_console .section._three .entities table {
  margin-bottom: 60px;
  table-layout: fixed;
}

.tdp_console .section._three .entities table thead tr th {
  font-size: 14px;
  font-weight: 500;
  padding: 10px 8px;
}

.tdp_console .section._three .entities table thead tr th:first-child {
  padding-left: 40px;
}

.tdp_console .section._three .entities table tbody tr:hover {
  cursor: pointer;
}

.tdp_console .section._three .entities table tbody tr td {
  font-size: 14px;
  color: var(--black-one);
  font-weight: 400;
  line-height: 16px;
  height: 50px;
  vertical-align: middle;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.tdp_console .section._three .entities table tbody tr td span {
  padding-left: 9px;

  &:first-child {
    margin-right: 8px;
  }
}

.tdp_console .section._three .entities table tbody tr td h6 {
  display: inline;
  font-size: 14px;
  font-weight: 500;
  color: var(--black-two);
  line-height: 16px;
  margin-right: 4px;
}

.tdp_console .section._three .frequent-orders {
  display: flex;
  /* overflow-x: scroll; */
  overflow-x: hidden;
  gap: 12px;
}

.tdp_console .section._three .frequent-orders .product {
  display: flex;
  min-width: fit-content;
  padding: 12px;
  align-items: center;
  gap: 12px;
}

.tdp_console .section._three .frequent-orders .product img {
  width: 90px;
  /* height: 130px; */
  height: auto;
}

.tdp_console .section._three .frequent-orders .product .details {
  width: 110px;
}

.tdp_console .section._three .frequent-orders .product .details h3 {
  margin-bottom: 4px;
  font-size: 18px;
  font-weight: 700;
  line-height: 21px;
}

.tdp_console .section._three .frequent-orders .product .details p {
  font-size: 12px;
  line-height: 14px;
}

.tdp_console .section._three .frequent-orders .product .details p.name {
  color: var(--black-one);
  width: 110px;
  font-weight: 500;
  margin-bottom: 4.8px;
  margin-bottom: 20px;
}

.tdp_console .section._three .frequent-orders .product .details button {
  width: 60px;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
}

.tdp_console .section._three .slider-buttons {
  display: flex;
  position: absolute;
  justify-content: space-between;
  width: 100%;
}

.tdp_console .section._three .slider-buttons button {
  box-shadow: 0px 4px 7px 0px #0000002b;
  border-radius: 22px !important;
  background: var(--black-two);
  width: 44px;
  height: 44px;
}

.tdp_console .section._three .slider-buttons button.right {
  box-shadow: -18px -12px 7px 16px #ffffffe6;
}

.tdp_console .section._three .slider-buttons button.hide {
  display: contents;
}

.tdp_console .section._three .slide-frequent-orders {
  display: flex;
  position: relative;
  align-items: center;
  /* justify-content: space-around; */
}

.tdp_onboarding {
}

.tdp_onboarding .header {
  background-color: var(--gray-four);
  width: 100%;
  height: 70px;
  padding: 15px 80px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tdp_onboarding .header .cancel__ {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.tdp_onboarding .header .cancel__ p {
  display: flex;
  background-color: var(--gray-one);
  height: 44px;
  width: 45px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-bottom: 0;
  cursor: pointer;
}

.tdp_onboarding .header .cancel__ div i {
  cursor: pointer;
}

.tdp_onboarding .header .cancel__ p i {
  font-size: 20px;
}

.tdp_onboarding .header .cancel__ h4 {
  font-size: 16px;
  color: var(--black-one);
  font-weight: 400;
  line-height: 19px;
  margin-bottom: 0;
}

.tdp_onboarding .header .cancel__ h4 svg {
  margin: 0 5px;
}

.tdp_onboarding .header ._progress {
  display: flex;
  width: 15%;
  gap: 16px;
  align-items: center;
}

.tdp_onboarding .header ._progress .progress {
  width: 100%;
}

.tdp_onboarding .header ._progress .progress .progress-bar {
  background: var(--black-two);
}

.tdp_onboarding .header .action-buttons {
  display: flex;
  gap: 16px;
}

.tdp_onboarding .header .action-buttons button._continue {
  background-color: var(--gray-seven);
  color: var(--white);
}

.tdp_onboarding .header button {
  width: fit-content;
  padding: 0px 27px;
  background: var(--orange-12, #ff8d061f);
  color: var(--td-orange);
}

.tdp_onboarding .header .buttons_flex {
  display: flex;
  gap: 16px;
}

.tdp_onboarding .header .buttons_flex button:last-child {
  background: var(--black-two);
  color: var(--white);
}

.tdp_onboarding .body {
  /* margin-top: 40px; */
}

.tdp_onboarding .body .onboarding_form {
}

.tdp_onboarding .body .onboarding_form h3 {
  color: var(--black-two);
  font-size: 24px;
  font-weight: 700;
  line-height: 29px;
}

.tdp_onboarding .body .onboarding_form .confirm__phone h3 {
  margin-bottom: 4px;
}

.tdp_onboarding .body .onboarding_form h5 {
  color: var(--black-one);
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
}

.tdp_onboarding .body .onboarding_form input,
.tdp_onboarding .body .onboarding_form textarea {
  margin: 12px 0;
}

.tdp_onboarding .body .onboarding_form .v-input__ {
  position: relative;
}

.tdp_onboarding .body .onboarding_form .v-input__ span {
  position: absolute;
  top: 14px;
  right: 11px;
  line-height: 14px;
  font-size: 12px;
  font-weight: 400;
  color: var(--td-orange);
  cursor: pointer;
}

.tdp_onboarding .body .onboarding_form .confirm__phone p {
  margin-bottom: 4px;
  font-size: 14px;
  line-height: 16px;
  margin-top: 12px;
  color: var(--black-one);
}

.tdp_onboarding .body .onboarding_form .confirm__phone p span {
  color: var(--td-orange);
  cursor: pointer;
}

.tdp_onboarding .body .verify_identity_form .__first-step h5 {
  margin-bottom: 12px;
}

.tdp_onboarding .body .verify_identity_form .__first-step button:last-child {
  background: var(--white);
  color: var(--td-orange);
}

.tdp_onboarding .body .verify_identity_form .__second-step input:disabled,
.tdp_onboarding .body .verify_identity_form .__second-step select {
  background: #eceded;
  border: 1px solid var(--gray-three) !important;
  margin: 8px 0;
}

.tdp_onboarding .body .verify_identity_form .__second-step .__flex {
  display: flex;
  gap: 16px;
  margin-bottom: -8px;
}

.tdp_onboarding .body .verify_identity_form .__second-step .admin_info {
  display: flex;
  border: 1px solid var(--gray-three);
  padding: 12px 14px;
  margin-top: 12px;
  border-radius: 8px;
  gap: 8px;
}

.tdp_onboarding .body .verify_identity_form .__second-step .admin_info p {
  background: var(--gray-three);
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

.tdp_onboarding .body .verify_identity_form .__second-step .admin_info p svg {
  padding: 3px;
}

.tdp_onboarding .body .verify_identity_form .__second-step .admin_info h4 {
  font-size: 14px;
  line-height: 19px;
  font-weight: 500;
  color: var(--black-one);
}

.tdp_onboarding .body .team_members {
}

.tdp_onboarding .body .team_members .member__row {
  margin-top: 24px;
}

.tdp_onboarding .body .team_members .member__row .team_row_list {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: -8px;
  border-bottom: 1px solid var(--gray-three);
  padding-bottom: 12px;
}

.tdp_onboarding .body .team_members .member__row .team_row_list td {
  font-size: 16px;
  font-weight: 500;
  color: var(--black-two);
  width: -webkit-fill-available;
}

.tdp_onboarding .body .team_members .member__row .team_row_list ._actions svg {
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.tdp_onboarding
  .body
  .team_members
  .member__row
  .team_row_list
  ._actions
  svg
  path {
  fill: var(--black-one);
}

.tdp_onboarding .body .team_members .member__row .team_row {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: -8px;
}

.tdp_onboarding .body .team_members .member__row ._action-buttons {
  display: flex;
  gap: 8px;
  padding-left: 60%;
  margin-top: 16px;
}

.tdp_onboarding .body .team_members .member__row ._action-buttons button {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
}

.tdp_onboarding
  .body
  .team_members
  .member__row
  ._action-buttons
  button.cancel-btn {
  background: none;
  color: var(--black-one);
  width: 20%;
}

.tdp_onboarding
  .body
  .team_members
  .member__row
  ._action-buttons
  button.save-add-btn {
  background: var(--td-orange);
}

.tdp_onboarding
  .body
  .team_members
  .member__row
  ._action-buttons
  button.save-btn {
  background: var(--black-two);
  width: 47%;
}

.tdp_onboarding .body .team_members .member__row.open {
  padding: 12px 14px;
  background-color: var(--gray-four);
  border: 1px solid var(--gray-three);
  border-radius: 8px;
}

.tdp_onboarding .body .team_members .user__add {
  font-size: 14px;
  font-weight: 400;
  color: var(--td-orange);
  line-height: 16px;
  cursor: pointer;
  margin-top: 8px;
  background: none !important;
  width: fit-content;
  margin-bottom: 8px;
}

.tdp_onboarding .body .team_members .user__add i {
  margin-right: 8px;
}

.tdp_onboarding .body .team_members .user__add.disabled {
  color: #ff8d0654;
  cursor: no-drop;
}

.tdp_onboarding .body .business_information_form {
}

.tdp_onboarding .body .business_information_form ._section {
  margin-bottom: 72px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  .date-picker-container {
  display: flex;
  position: relative;
  margin-top: -10px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  .date-picker-container
  .react-datepicker-wrapper {
  width: 100%;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  .date-picker-container
  .react-datepicker-wrapper
  input {
  width: 100%;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  .date-picker-container
  svg {
  position: absolute;
  top: 21px;
  right: 9px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.director
  .date-picker-container
  .react-datepicker-wrapper
  input {
  padding: 12px;
  margin-bottom: 0;
}

.tdp_onboarding .body .business_information_form ._section.director select {
  margin-top: 12px;
}

.tdp_onboarding .body .business_information_form ._section.residency h5 {
  margin-bottom: 12px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .document-container {
  text-align: center;
  margin-top: 8px;
  background-color: var(--gray-four);
  padding: 12px;
  border: 1px solid var(--gray-three);
  border-radius: 8px;
  cursor: pointer;
  margin-bottom: 12px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .document-container
  svg {
  margin-bottom: 8px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .document-container
  input {
  display: none;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .document-container
  h5 {
  color: var(--black-two);
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  margin-bottom: 4px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .document-container
  h6 {
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container {
  box-shadow: 0px 2px 2px -1px #0000000a;
  border: 1px solid var(--gray-three);
  display: flex;
  padding: 12px 8px;
  background: var(--gray-four);
  align-items: center;
  justify-content: space-between;
  border-radius: 8px;
  margin-bottom: 12px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container
  .document-info {
  display: flex;
  align-items: center;
  gap: 4px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container
  .document-info
  h4 {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: var(--black-two);
  margin-bottom: 0;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container
  .actions {
  display: flex;
  gap: 4px;
  align-content: center;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container
  .actions
  input {
  display: none;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container
  .actions
  p {
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  color: var(--black-two);
  padding: 4px 6px;
  border-radius: 34px;
  display: flex;
  align-items: center;
  height: fit-content;
  margin-bottom: 0;
  cursor: pointer;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container
  .actions
  p.new {
  background: #aeaeae14;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.residency
  .uploaded-document-container
  .actions
  p.delete {
  background: #ff42060f;
  color: var(--red-1);
}

.tdp_onboarding .body .business_information_form ._section .option {
  display: flex;
  border: 1px solid rgba(231, 231, 231, 1);
  padding: 12px 8px;
  border-radius: 8px;
  gap: 8px;
  cursor: pointer;
  margin-bottom: 8px;
}

.tdp_onboarding .body .business_information_form ._section .option.active {
  border: 2px solid var(--black-two);
}

.tdp_onboarding .body .business_information_form ._section .option div {
  width: 335px;
}

.tdp_onboarding .body .business_information_form ._section .option input {
  margin: 0;
  height: fit-content;
  accent-color: var(--black-two);
}

.tdp_onboarding .body .business_information_form ._section .option h4 {
  color: var(--black-two);
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 0;
}

.tdp_onboarding .body .business_information_form ._section .option h6 {
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  margin-top: 4px;
  margin-bottom: 0;
}

.tdp_onboarding .body .business_information_form ._section .option h6 {
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  margin-top: 4px;
  margin-bottom: 0;
}

.tdp_onboarding .body .business_information_form ._section ._block,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block {
  background: var(--gray-four);
  box-shadow: 0px 2px 2px -1px #0000000a;
  padding: 12px 8px;
  border: 1px solid var(--gray-three);
  border-radius: 8px;
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
  cursor: pointer;
}

.tdp_onboarding .body .business_information_form ._section ._block h4,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block h4 {
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  color: var(--black-two);
  margin-bottom: 4px;
}

.tdp_onboarding .body .business_information_form ._section ._block h6,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block h6 {
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  color: var(--black-one);
  margin-bottom: 12px;
}

.tdp_onboarding .body .business_information_form ._section._director ._block h6,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block h6 {
  margin-bottom: 4px;
}

.tdp_onboarding .body .business_information_form ._section._director ._block h4,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block h4 {
  margin-bottom: 0;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section._director
  ._block
  .status,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block .status {
  margin-top: 12px;
  float: none;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section._director
  ._block
  div,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block div {
  width: 100%;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section._director
  ._block
  button {
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  height: fit-content;
  padding: 5px 10px;
  border-radius: 36px !important;
  margin-top: 12px;
  display: flex;
  width: fit-content;
  gap: 4px;
  float: right;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section._director
  ._block
  button
  .app-spinner {
  width: 10px;
  height: 10px;
}

.tdp_onboarding .body .business_information_form ._section.banking .info-alert {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 8px;
  border-radius: 8px;
  align-items: center;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.banking
  .info-alert.success {
  background: var(--green-one-opac-10);
  color: var(--green-one);
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.banking
  .info-alert
  p {
  margin-bottom: 0px;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.banking
  .info-alert
  i {
  font-size: 14px;
}

.tdp_onboarding .body .business_information_form ._section.banking ._search {
  margin-top: -12px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.banking
  ._search
  span {
  font-size: 12px;
  cursor: pointer;
}

.tdp_onboarding .body .business_information_form ._section ._block .status,
.tdp_onboarding .body .verify_identity_form .kyc_status ._block .status {
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  width: fit-content;
  border-radius: 34px;
  padding: 4px 6px;
  float: right;
  position: relative;
  top: 4px;
  margin-bottom: 0;
  text-transform: capitalize;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  ._block
  .status.running,
.tdp_onboarding
  .body
  .verify_identity_form
  .kyc_status
  ._block
  .status.running {
  color: var(--gray-two);
  background: var(--gray-three);
}

.tdp_onboarding .body .business_information_form ._section ._search {
  display: flex;
  align-items: center;
  position: relative;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.business-information
  input {
  margin-bottom: 0;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.business-information
  p {
  margin-top: 8px;
  font-size: 14px;
  color: var(--black-one);
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.business-address
  .__flex {
  display: flex;
  gap: 16px;
  margin-top: -12px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section.business-information
  p
  span {
  color: var(--td-orange);
  cursor: pointer;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  ._search
  .address-loader {
  position: absolute;
  color: var(--td-orange);
  right: 10px;
  top: 24px;
}

.tdp_onboarding .body .business_information_form ._section ._search-results {
  border: 1px solid var(--gray-three);
  box-shadow: 0px 4px 4px 0px #0000000a;
  padding: 8px 4px;
  border-radius: 8px;
  margin-top: 4px;
  height: 160px;
  overflow-y: scroll;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  ._search-results
  div {
  padding: 4px 6px;
  margin-bottom: 4px;
  cursor: pointer;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  ._search-results
  div:hover {
  background-color: var(--gray-three);
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  ._search-results
  div
  h4 {
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  color: var(--black-two);
  margin-bottom: 4px;
}

.tdp_onboarding
  .body
  .business_information_form
  ._section
  ._search-results
  div
  p {
  font-size: 12px;
  line-height: 14px;
  font-weight: 400;
  color: var(--black-one);
  margin-bottom: 0;
  width: 350px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.tdp_modal {
  background-image: url("/images/modal-bg.png");
  background-repeat: round;
  background-size: contain;
  background-color: #fcfcfc;
  width: fit-content;
  padding: 20px 24px 40px 24px;
}

.tdp_modal h2 {
  font-size: 20px;
  line-height: 24.5px;
  font-weight: 700;
  color: var(--black-two);
}

.tdp_modal h2 span {
  color: var(--td-orange);
}

.tdp_modal h5 {
  font-size: 16px;
  color: var(--black-one);
  font-weight: 400;
  line-height: 19px;
  width: 70%;
  margin-bottom: 40px;
}

.tdp_modal .action_ {
  /* float: right; */
  display: flex;
  justify-content: flex-end;
}

.tdp_modal .action_ button {
  padding: 8px 28px;
  width: fit-content;
}

.tdp_modal .action_ i {
  cursor: pointer;
}

.tdp_customtoast {
  width: 518px;
}

.tdp_customtoast h2 {
  margin-top: 10px;
  font-weight: 500;
  margin-bottom: 4px;
}

.tdp_customtoast h5 {
  margin-bottom: 0;
  width: 100%;
  line-height: 23px;
}

.tdp_customtoast a.action-link {
  top: 10px;
  position: relative;
  font-size: 12px;
  text-decoration: underline;
  color: var(--td-orange);
  cursor: pointer;
}

.tdp_orders,
.tdp_account_statement {
  height: 100%;
}

.tdp_orders .header,
.tdp_account_statement .header {
  padding: 40px 40px 20px 40px;
}

.tdp_orders .header h2,
.tdp_account_statement .header h2 {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  line-height: 29px;
}

.tdp_orders .header ._filter_status {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.tdp_orders .header ._filter_status .__filters {
  display: flex;
}

.tdp_orders .header ._filter_status .__filters select {
  width: 130px;
  font-size: 14px;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  pointer-events: none;
}

.tdp_orders .header ._filter_status .__filters .react-datepicker-wrapper input {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-right: 0 !important;
  padding-right: 8px;
  padding-left: 12px;
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  color: #081f24;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .react-datepicker-wrapper
  input:focus {
  outline: none;
  box-shadow: none !important;
}

.tdp_orders .header ._filter_status .__filters .custom-select-filter {
  position: relative;
}

.tdp_orders .header ._filter_status .__filters .custom-select-filter input {
  border-left: 1px solid var(--gray-three) !important;
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
  cursor: pointer;
  color: var(--black-two);
  padding-left: 12px;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-select-filter
  input:disabled {
  background: white;
}

.tdp_orders .header ._filter_status .__filters .custom-filter-select {
  position: relative;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown {
  background: white;
  border: 1px solid var(--gray-three);
  width: 580px;
  height: 268px;
  padding: 12px;
  border-radius: 8px;
  position: absolute;
  z-index: 3;
  right: 0;
  top: 46px;
  overflow-y: scroll;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown
  li {
  list-style: none;
  display: flex;
  gap: 10px;
  align-items: center;
  border-bottom: 1px solid var(--gray-three);
  cursor: pointer;
  padding-bottom: 16px;
  margin-bottom: 12px;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown
  li:last-child {
  border-bottom: none;
}

.tdp_orders .header ._filter_status .__filters .custom-filter-select span {
  font-size: 12px;
  position: absolute;
  top: 12px;
  left: 9px;
  color: var(--black-one);
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown
  li
  h4 {
  font-weight: 500;
  font-size: 16px;
  color: var(--black-two);
  line-height: 19px;
  margin-bottom: 4px;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown
  li
  h6 {
  font-weight: 400;
  font-size: 14px;
  color: var(--black-one);
  line-height: 16px;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown
  .__actions {
  display: flex;
  height: 49px;
  background: white;
  justify-content: end;
  gap: 10px;
  position: absolute;
  right: 10px;
  bottom: 0;
  width: 100%;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown
  .__actions
  button {
  width: 80px;
  height: 32px;
}

.tdp_orders
  .header
  ._filter_status
  .__filters
  .custom-filter-select
  .__select-dropdown
  .__actions
  button:first-child {
  background: #ff8d061f;
  color: #ff8d06;
}

.tdp_orders .header ._filter_status .__filters .react-datepicker-wrapper {
  position: relative;
  left: 20px;
  z-index: 0;
}

.tdp_orders .header ._filter_status .__filters .date-picker-container {
  display: flex;
  align-items: center;
}

.tdp_orders .header ._filter_status .__filters .date-picker-container svg {
  z-index: 2;
  position: relative;
  left: -5px;
}

.tdp_orders .header .order_statuses {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.tdp_orders .header .order_statuses button {
  background: transparent;
  color: var(--black-one);
  width: 158px;
  border: 1px solid var(--gray-three);
}

.tdp_orders .header .order_statuses button.active {
  border: 2px solid var(--black-two);
  box-shadow: 0px 1px 1px 0px #0000001a;
  color: var(--black-two);
  font-weight: 500;
}

.tdp_orders .body {
  /* border-top: 1px solid var(--gray-three); */
}

.tdp_orders .body.list-body {
  /* margin-top: -56px; */
}

/* .tdp_orders {
  .body .orders-list {
    padding: 20px 0px;
  }
  &:where(.tdp_n_table) {
    normal table
    .body .orders-list {
      padding: 0;
    }
  }
} */

.tdp_orders .body .orders-list .empty__list {
  height: 100vh;
  margin-right: auto;
  text-align: center;
  padding: 200px;
}

.tdp_orders .body .orders-list .empty__list.table-empty {
  width: 75vw;
  margin-top: -75px;
}

.tdp_orders .body .orders-list .empty__list svg path {
  stroke: var(--black-two);
}

.tdp_orders .body .orders-list .empty__list h3 {
  font-weight: 700;
  font-size: 18px;
  line-height: 22px;
  color: var(--black-two);
  margin-top: 16px;
}

.tdp_orders .body .orders-list .empty__list.table-empty h3 {
  margin-top: 10px;
  padding: 0 40%;
}

.tdp_orders .body .orders-list .empty__list h5 {
  font-weight: 400;
  font-size: 16px;
  line-height: 19px;
  color: var(--black-one);
  margin-bottom: 8px;
}

.tdp_orders .body .orders-list .empty__list h5 a {
  color: var(--td-orange);
  text-decoration: none;
}

.tdp_orders .body .orders-list .empty__list p {
  color: var(--td-orange);
  line-height: 16.7px;
  font-size: 14px;
  font-weight: 400;
  cursor: pointer;
}

.tdp_orders .body .orders-list .empty__list p i {
  top: 2px;
  position: relative;
}

.tdp_orders .body .__input-search {
  display: flex;
  align-items: center;
  position: relative;
  height: 45px;
  padding-bottom: 18px;
  width: 100%;

  &.empty {
    border-bottom: 1px solid var(--gray-three);
  }
}

.tdp_orders .body .__input-search i {
  font-size: 16px;
  margin-left: 20px;
  color: var(--gray-five);
  position: relative;
  top: 14px;
}

.tdp_orders .body .__input-search input.order-search {
  border: none !important;
  height: 45px;
  padding: 19px 25px;
  box-shadow: none !important;
  margin-bottom: -23px;
  padding-left: 10px;
  font-size: 14px;
  background: transparent;
}

.tdp_orders .body input.order-search:focus {
  box-shadow: none !important;
  outline: none !important;
}

.tdp_orders .body .orders-list .entities table tbody td .dropdown {
  display: flex;
  justify-content: end;
  padding-right: 24px;
}

.tdp_orders .body .orders-list .entities table tbody td .dropdown span {
  display: block;
}

.tdp_orders .body .orders-list .entities table tbody td .dropdown li {
  cursor: pointer;
}

.tdp_orders .body .orders-list .entities table tbody td .dropdown li p {
  margin-bottom: 0;
  font-size: 14px;
}

.tdp_orders .body .orders-list .entities table tbody td.amount p {
  margin-bottom: 0;
  /* text-align: -webkit-center; */

  span:last-child {
    margin-left: 2px;
  }
}

.tdp_orders .body .orders-list .entities table tbody td span.summary {
  display: block;
  width: 90%;
  text-overflow: ellipsis;
  text-wrap: nowrap;
  overflow: hidden;
}

.tdp_orders .body .orders-list .entities table tbody td .dropdown li:focus,
.tdp_orders
  .body
  .orders-list
  .entities
  table
  tbody
  td.amount
  p
  span:nth-child(1) {
  color: var(--black-two);
  margin-right: 6px;
  font-size: 14px;
  font-weight: 500;
  max-width: 90px;
  text-align: right;
  display: inline-block;
  min-width: 55px;
}

.tdp_orders .body .orders-list .entities table tbody td.createdAt {
  span:first-child {
    width: 65px;
    display: inline-block;
  }
}

.tdp_orders .body .orders-list .entities table tbody td span.credit {
  color: var(--green-one);
  font-weight: 500;
}

.tdp_orders .body .orders-list .entities table tbody td span.debit {
  color: var(--red-two);
  font-weight: 500;
}

.tdp_orders .body .orders-list .entities table tbody td span.balance {
  color: var(--black-two);
  font-weight: 500;
}

.tdp_orders .body .orders-list .entities table tbody td a.view {
  width: 100px;
  background-color: var(--white);
  border: 2px solid var(--black-two);
  box-shadow: 0px 1px 1px 0px #0000001a;
  color: var(--black-two);
  float: right;
  margin-right: 40px;
  height: 32px;
  border-radius: 8px;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
}

.tdp_orders .body .orders-list .entities table tbody td .status_,
.tdp_orders .body .orders-list .entities table tbody th .status_ {
  background: #ff8c060f;
  color: var(--td-orange);
  padding: 2px 6px 4px 6px;
  border-radius: 34px;
  margin-left: 10px;
  text-transform: capitalize;
  /* margin-top: -2px; */
  font-size: 12px;
  font-weight: 500;
}

.tdp_orders .body .orders-list .entities table tbody td .action-row-button,
.tdp_console .section._three .entities table tbody tr td .action-row-button {
  box-shadow: 0px 2px 2px -1px #0000000a;
  min-width: 56px;
  min-height: 28px;
  border-radius: 8px;
  padding: 5px 19px 7px 15px;
  border: 1px solid var(--gray-three);
  background: var(--gray-four);
  color: var(--black-two);
  display: none;
}

.tdp_orders
  .body
  .orders-list
  .entities
  table
  tbody
  td
  .action-row-button.disabled,
.tdp_console
  .section._three
  .entities
  table
  tbody
  tr
  td
  .action-row-button.disabled {
  background: var(--gray-three) !important;
  cursor: none !important;
  border: none !important;
}

.tdp_orders
  .body
  .orders-list
  .entities
  table
  tbody
  td
  .action-row-button
  .app-spinner,
.tdp_console
  .section._three
  .entities
  table
  tbody
  tr
  td
  .action-row-button
  .app-spinner {
  width: 15px !important;
  height: 15px !important;
  top: 2px;
  position: relative;
}

.tdp_orders
  .body
  .orders-list
  .entities
  table
  tbody
  tr:hover
  .action-row-button,
.tdp_console .section._three .entities table tbody tr:hover .action-row-button {
  display: inline;
}

.tdp_orders
  .body
  .orders-list
  .entities
  table
  tbody
  td
  .action-row-button:first-child,
.tdp_console
  .section._three
  .entities
  table
  tbody
  td
  .action-row-button:first-child {
  background-color: var(--black-two);
  border: 1px solid var(--black-two);
  color: #fff;
  margin-right: 12px;
}

.tdp_orders .body .orders-list .entities table tbody td.actions-td,
.tdp_console .section._three .entities table tbody tr td.actions-td {
  text-align: end;
}

.tdp_create_orders .header {
  background: var(--white);
  border-bottom: 1px solid #e7e7e7;
}

.tdp_create_orders .body ._preview-form {
  padding: 94px 30px 0 30px;
}

.tdp_create_orders .body ._preview-form .head_text {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.payment-err-actions {
  margin-top: 13px;
  text-align: right;
  display: flex;
  justify-content: right;
  gap: 14px;
}

.payment-err-actions span {
  font-size: 13px;
  color: #ff0606c2;
  cursor: pointer;
}

.payment-err-actions span:last-child {
  color: var(--td-orange);
}

.tdp_create_orders .body ._preview-form .head_text h3 {
  font-weight: 700;
  font-size: 18px;
  line-height: 22px;
  color: var(--black-two);
  margin-bottom: 16px;
}

.tdp_create_orders .body ._preview-form .head_text h6 {
  color: var(--td-orange);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  cursor: pointer;
}

.tdp_create_orders .body ._preview-form .head_text h6.disabled {
  color: var(--gray-three);
  cursor: not-allowed;
}

.tdp_create_orders .body ._preview-form .head_text {
  margin-top: 72px;
}

.tdp_create_orders .body ._preview-form .head_text .actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.tdp_create_orders .body ._preview-form .head_text .actions h6 {
  color: var(--black-one);
  margin-bottom: 0;
}

.tdp_create_orders .body ._preview-form .head_text .actions button {
  background-color: #ff8d061f;
  color: var(--td-orange);
  font-weight: 400;
  font-size: 12px;
  width: 69px;
  height: 28px;
}

.tdp_create_orders .body ._preview-form .head_text:first-child {
  margin-top: 0;
}

.tdp_create_orders .body ._preview-form .products_error_container {
  border: 2px solid var(--red-color);
  box-shadow: 0px 2px 2px 3px #ff420642;
  padding: 16px;
  border-radius: 12px;
  margin-top: 20px;
}

.tdp_create_orders .body ._preview-form .products_error_container h3 {
  color: var(--red-1);
  font-size: 18px;
  font-weight: 700;
  line-height: 21.48px;
  margin-bottom: 4px;
}

.tdp_create_orders .body ._preview-form .products_error_container p {
  font-size: 14px;
  font-weight: 400;
  line-height: 22.4px;
  color: var(--black-two);
  list-style: circle;
}

.tdp_create_orders .body ._preview-form h5 {
  color: var(--black-one);
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  margin-top: -12px;
}

.tdp_create_orders .body .container-information ._preview-form {
  padding-left: 0;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-wrapper {
  border: 1px solid var(--gray-three);
  box-shadow: 0px 2px 2px -1px #0000000a;
  border-radius: 8px;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-wrapper
  .head_text__ {
  margin-top: 20px;
  padding: 0 20px;
  border-bottom: 1px solid var(--gray-three);

  h3 {
    font-size: 20px;
    font-weight: 700;
    line-height: 23.87px;
  }

  h6 {
    margin-top: 8px;
    color: var(--black-one);
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
  }
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .selected-branch {
  border-bottom: 1px solid var(--gray-three);
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .selected-branch
  ._no-edit {
  margin-bottom: 24px;
}

.tdp_create_orders .body .container-information ._preview-form .sub-text {
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  margin-top: -10px;
  margin-bottom: 20px;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion {
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item {
  border: none;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-header
  button {
  font-weight: 500;
  background-color: var(--gray-six);
  border-radius: 0 !important;
  font-size: 14px;
  line-height: 14px;
  text-transform: uppercase;
  color: var(--black-two);
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-header
  button:focus {
  box-shadow: none;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body {
  padding: 0;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body
  table
  thead
  tr
  th:first-child,
.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body
  table
  tbody
  tr
  th:first-child {
  padding-left: 20px;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body
  table
  thead
  tr
  th
  tr {
  display: flex;
  justify-content: space-around;
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body
  table
  thead
  tr
  th
  p
  a {
  margin-left: 5px;
  color: var(--black-one);
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body
  table
  thead
  tr {
  th {
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
    color: var(--black-two);
    text-align: center;
  }
  th:first-child {
    text-align: left;
  }
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body
  table
  tbody
  tr {
  th,
  td {
    color: var(--black-one);
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    height: 40px;
    padding: 13px 0.5rem;
    vertical-align: middle;

    div {
      display: flex;
      justify-content: space-around;

      td {
        padding: 0;
        vertical-align: middle;
        height: fit-content;
      }
    }
  }
  th {
    text-transform: uppercase;
  }
  td {
    text-align: center;
  }
}

.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-group
  .accordion
  .accordion-item
  .accordion-body
  table
  tbody
  tr.total {
  th,
  td {
    font-weight: 700;
    text-transform: capitalize;
    color: var(--black-two);
  }
}

.tdp_create_orders .body ._preview-form .custom-select,
.team_members .member__row .custom-select,
.custom-select-wrapper .custom-select {
  position: relative;
  width: 100%;
}

.custom-select-wrapper .custom-select {
  min-width: 190px;
}

.tdp_console ._two .custom-select input {
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
}

.tdp_create_orders .body ._preview-form .custom-select select:disabled,
.team_members .member__row .custom-select select:disabled,
.custom-select-wrapper .custom-select select:disabled {
  background-color: #fff;
}

.tdp_create_orders .body ._preview-form .custom-select span,
.team_members .member__row .custom-select span,
.custom-select-wrapper .custom-select span {
  position: absolute;
  top: 0;
  padding: 9px;
  color: var(--gray-five);
}

.tdp_create_orders .body ._preview-form .custom-select ._dropdown,
.team_members .member__row .custom-select ._dropdown,
.custom-select-wrapper .custom-select ._dropdown {
  border: 1px solid var(--gray-three);
  box-shadow: 0px 4px 4px 0px #0000000a;
  border-radius: 8px;
  /* position: absolute; */
  top: 48px;
  background: white;
  width: 100%;
  height: 96px;
  overflow: hidden;
  overflow-y: scroll;
  position: relative;
  top: 5px;
}

.team_members .member__row .custom-select ._dropdown,
.custom-select-wrapper .custom-select ._dropdown {
  position: absolute;
  top: unset;
  margin-top: 4px;
}

.team_members .member__row .custom-select ._dropdown ._row.active,
.custom-select-wrapper .custom-select ._dropdown ._row.active {
  background: var(--gray-three);
}

.team_members .member__row .custom-select span.filled-value,
.custom-select-wrapper .custom-select span.filled-value {
  color: var(--black-two);
}

.team_members .member__row .form-check {
  display: flex;
  align-items: center;
  justify-content: end;
  width: 75%;
  gap: 15px;
}

.tdp_create_orders .body ._preview-form .custom-input .product-input {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  .product-input
  .app-spinner {
  position: absolute;
  right: 14px;
  color: #ff59106e !important;
}

.tdp_create_orders .body ._preview-form .custom-input ._product_row {
  border-bottom: 1px solid var(--gray-three);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 12px;
  margin-bottom: 12px;
}

.tdp_create_orders .body ._preview-form .custom-input ._product_row p {
  margin-bottom: 0;
  font-weight: 500;
  font-size: 14px;
  line-height: 16.7px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  .product-name {
  display: flex;
  align-items: center;
  width: 60%;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  .product-name
  span {
  padding: 4px 0;
  position: unset;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  .product-name
  p {
  display: inline-block;
  color: var(--black-two);
  text-overflow: ellipsis;
  overflow: hidden;
  /* width: 80%; */
  white-space: nowrap;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  .product-name
  span {
  font-size: 14px;
  font-weight: 500;
  line-height: 16.7px;
  margin-left: 4px;
}

.tdp_create_orders .body ._preview-form .custom-input ._product_row ._actions {
  display: flex;
  gap: 4px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  ._actions
  span {
  cursor: pointer;
  position: unset;
  padding: 0;
  color: var(--black-one);
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  ._actions
  svg {
  width: 24px;
  height: 24px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  ._actions
  svg
  path {
  fill: var(--black-one);
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._product_row
  ._actions.disabled
  svg
  path {
  fill: var(--gray-three);
  cursor: pointer;
}

.tdp_create_orders .body ._preview-form .custom-input ._add-item {
  color: var(--td-orange);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  margin-top: 16px;
  cursor: pointer;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_create_orders .body ._preview-form .custom-input ._add-item.disabled {
  color: var(--gray-three);
  cursor: not-allowed;
}

.tdp_create_orders .body ._preview-form .custom-input ._add-item i {
  margin-right: 4px;
}

.tdp_create_orders .body ._preview-form .custom-input ._processing-product {
  border: 1px solid var(--gray-three);
  background: var(--gray-four);
  padding: 12px 14px 12px 14px;
  border-radius: 8px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .details {
  display: flex;
  gap: 8px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .details
  input:first-child {
  width: auto;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .details
  input {
  width: 85px;
  text-overflow: ellipsis;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .details
  input:first-child {
  width: 100%;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .image_container,
.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .input_containers {
  display: flex;
  align-items: center;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .image_container {
  gap: 10px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .image_container
  img {
  width: 50%;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .image_container
  p {
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 17px;
  text-transform: uppercase;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .image_container
  span {
  position: absolute;
  right: 15px;
  padding: 0;
  top: auto;
  cursor: pointer;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .input_containers {
  gap: 16px;
  margin-top: 20px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .input_containers
  label {
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  margin-bottom: 8px;
  color: var(--black-one);
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .input_containers
  .custom_counter
  .plus_minus_controller {
  height: 40px;
  max-width: 162px;
  min-width: 120px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .input_containers
  .custom_counter
  .plus_minus_controller
  input:focus {
  outline: none;
  box-shadow: none !important;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .export-details
  .input_containers
  .amount {
  font-weight: 700;
  line-height: 20px;
  height: 40px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .error-message {
  color: var(--red-1);
  font-size: 12px;
  line-height: 14px;
  font-weight: 400;
  margin-top: 6px;
  margin-bottom: 16px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .error-message.max {
  color: var(--black-one);
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .actions {
  display: flex;
  /* padding-left: 50%; */
  margin-top: 16px;
  gap: 8px;
  justify-content: right;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .actions
  button:first-child {
  background: none;
  color: var(--black-one);
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .actions
  button {
  font-size: 12px;
  font-weight: 400;
  height: 30px;
  line-height: 14.3px;
  width: fit-content;
  padding: 7px 8px;
}

.tdp_create_orders
  .body
  ._preview-form
  .custom-input
  ._processing-product
  .actions
  button._remove {
  background: var(--td-orange);
  color: var(--black-two);
}

.tdp_create_orders .body ._preview-form .custom-input ._dropdown {
  max-height: 150px;
  height: fit-content;
  position: relative;
  top: 5px;
}

.tdp_create_orders .body ._preview-form .custom-select ._dropdown ._row,
.team_members .member__row .custom-select ._dropdown ._row,
.custom-select-wrapper .custom-select ._dropdown .row {
  cursor: pointer;
  padding: 8px 8px 4px 8px;
}

.team_members .member__row .custom-select ._dropdown,
.tdp_create_orders .body ._preview-form .custom-select ._dropdown {
  height: fit-content;
}

.custom-select-wrapper .custom-select ._dropdown {
  max-height: 200px;
  height: fit-content;
  z-index: 1;
}

.tdp_create_orders .body ._preview-form .custom-select ._dropdown ._row:hover,
.team_members .member__row .custom-select ._dropdown ._row:hover,
.custom-select-wrapper .custom-select ._dropdown ._row:hover {
  background: var(--gray-one);
}

.tdp_create_orders .body ._preview-form .custom-select ._dropdown ._row h4,
.team_members .member__row .custom-select ._dropdown ._row h4,
.custom-select-wrapper .custom-select ._dropdown ._row h4 {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: var(--black-two);
}

.tdp_create_orders .body ._preview-form .custom-select ._dropdown ._row p,
.team_members .member__row .custom-select ._dropdown ._row p,
.custom-select-wrapper .custom-select ._dropdown ._row p {
  color: var(--black-one);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  margin-bottom: 4px;
}

.tdp_create_orders .body ._preview-form .custom-input ._dropdown .count {
  font-size: 12px;
  line-height: 14px;
}

.tdp_create_orders .body ._preview-form .custom-input li,
.custom-select-wrapper .custom-input li {
  list-style: none;
  cursor: pointer;
  padding: 4px 6px;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.tdp_create_orders .body ._preview-form .custom-input li:first-child,
.custom-select-wrapper .custom-input li:first-child {
  margin-top: 4px;
}

.tdp_create_orders .body ._preview-form .custom-input li:hover,
.custom-select-wrapper .custom-input li:hover {
  background: var(--gray-one);
}

.tdp_create_orders .body ._preview-form .custom-input li p,
.custom-select-wrapper .custom-input li p {
  margin-bottom: 4px;
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  color: var(--black-one);
}

.tdp_create_orders .body ._preview-form .custom-input li p:first-child,
.custom-select-wrapper .custom-input li p:first-child {
  color: var(--black-two);
}

.tdp_create_orders .body ._preview-form .custom-input li p:last-child {
  /* width: 500px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: nowrap; */
}

.tdp_create_orders .body ._preview-form ._no-edit {
  display: flex;
  justify-content: space-between;
  margin-bottom: 72px;
  align-items: center;
}

.tdp_create_orders .body ._preview-form ._no-edit h3 {
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
  color: var(--black-two);
  margin-bottom: 14px;
}

.tdp_create_orders .body ._preview-form ._no-edit h5 {
  font-weight: 400;
  font-size: 14px;
  line-height: 16px;
  color: var(--black-one);
  text-transform: capitalize;
}

.tdp_create_orders .body ._preview-form ._no-edit i {
  cursor: pointer;
}

.tdp_create_orders .body .right__ {
  background: var(--gray-four);
  height: 100vh;
}

.tdp_create_orders .body .right__ .document__preview {
  box-shadow: 0px 7px 12px 0px #00000024;
  width: 595px;
  height: 842px;
  background: var(--white);
  margin: 12% 13%;
  padding: 60px 40px;
  position: relative;
}

.tdp_create_orders .body .right__.detail .document__preview {
  box-shadow: none;
  width: 100%;
  height: 842px;
  background: var(--white);
  margin: auto;
  padding: auto;
  position: relative;
}

.tdp_create_orders .body .right__ .document__preview ._title {
  display: flex;
  margin-bottom: 40px;
  justify-content: space-between;
  align-items: center;
}

.tdp_create_orders .body .right__ .document__preview ._title h4 {
  color: var(--black-two);
  line-height: 24px;
  font-weight: 500;
  font-size: 20px;
}

.tdp_create_orders .body .right__ .document__preview ._title p {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background: var(--td-orange);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
}

.tdp_create_orders .body .right__ .document__preview ._info-details {
  display: flex;
  gap: 14px;
}

.tdp_create_orders .body .right__ .document__preview ._info-details p {
  width: 140px;
  line-height: 14px;
  font-size: 12px;
  font-weight: 400;
  color: var(--black-one);
  margin-bottom: 4px;
  text-transform: uppercase;
}

.tdp_create_orders .body .right__ .document__preview ._order-details {
  display: flex;
  gap: 14px;
  margin: 30px 0;
}

.tdp_create_orders .body .right__ .document__preview ._order-details div {
  width: 140px;
}

.tdp_create_orders .body .right__ .document__preview ._order-details div h4 {
  font-size: 12px;
  font-weight: 700;
  line-height: 14.6px;
  margin-bottom: 3px;
  color: var(--black-two);
}

.tdp_create_orders .body .right__ .document__preview ._order-details div p {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: var(--black-one);
}

.tdp_create_orders
  .body
  .right__
  .document__preview
  ._order-details
  div
  p.second {
  margin-top: -14px;
}

.tdp_create_orders .body .right__ .document__preview .money__ {
  font-size: 16px;
  font-weight: 700;
  line-height: 19px;
  color: var(--black-two);
  margin-bottom: 30px;
}

.tdp_create_orders
  .body
  .right__
  .document__preview
  table.custom_tdp_table
  thead
  tr {
  border-bottom: 1px solid #000;
}

.tdp_create_orders
  .body
  .right__
  .document__preview
  table.custom_tdp_table
  thead
  tr
  th {
  color: var(--black-two);
  font-size: 12px;
  font-weight: 500;
  line-height: 14px;
  padding-bottom: 8px;
}

.tdp_create_orders
  .body
  .right__
  .document__preview
  table.custom_tdp_table
  tbody {
  margin-top: 20px;
}

.tdp_create_orders
  .body
  .right__
  .document__preview
  table.custom_tdp_table
  tbody
  tr
  td {
  font-weight: 500;
  font-size: 12px;
  line-height: 14px;
  color: var(--black-two);
}

.tdp_create_orders .body .right__ .document__preview .total-section {
  color: var(--black-two);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  padding-bottom: 8px;
  width: 300px;
  float: right;
  margin-top: 24px;
}

.tdp_create_orders .body .right__ .document__preview .total-section ._section {
  display: flex;
  justify-content: space-between;
  padding: 4px 0px 4px 0;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_create_orders
  .body
  .right__
  .document__preview
  .total-section
  ._section
  p {
  color: var(--black-two);
  font-weight: 400;
  font-size: 12px;
  line-height: 14px;
  margin-bottom: 0;
  margin-top: 4px;
}

.tdp_create_orders
  .body
  .right__
  .document__preview
  .total-section
  ._section
  h4 {
  font-size: 14px;
  line-height: 17px;
  font-weight: 700;
  margin-bottom: 0;
  margin-top: 4px;
}

.tdp_create_orders .body .right__ .document__preview .footer {
  width: 88%;
  position: absolute;
  bottom: 70px;
}

.tdp_create_orders .body .right__ .document__preview .footer p {
  color: var(--black-one);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  border-top: 1px solid var(--gray-three);
  padding-top: 20px;
}

.tdp_create_orders .body .right__ .items_processing_container {
}

.tdp_create_orders .body .right__ .items_processing_container.page_1 {
  height: 100%;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 44%;
  text-align: center;
  padding-top: 15%;
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_1
  .icons-wrapper {
  width: fit-content;
  background-color: var(--white);
  padding: 12px 20px;
  border-radius: 10px;
  border: 1px solid var(--gray-three);
  box-shadow: 0px 2px 2px -1px #0000000a;
  border-radius: 40px;
  height: fit-content;
  margin-bottom: 24px;
}

.tdp_create_orders .body .right__ .items_processing_container.page_1 h3 {
  font-size: 18px;
  line-height: 21px;
  font-weight: 700;
  margin-bottom: 6px;
}

.tdp_create_orders .body .right__ .items_processing_container.page_1 h6 {
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  color: var(--black-one);
  margin-bottom: 24px;
}

.tdp_create_orders .body .right__ .items_processing_container.page_1 button {
  width: 110px;
}

.tdp_create_orders .body .right__ .items_processing_container.page_2 {
  padding: 94px 70px;
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_total_container {
  box-shadow: 0px 2px 2px -1px #0000000a;
  background: #ff8d0614;
  width: 516px;
  margin: auto;
  padding: 20px;
  border-radius: 8px;
  border: 1px solid var(--gray-three);
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_total_container
  div {
  display: flex;
  justify-content: space-between;
  /* margin-bottom: 16px; */
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_total_container
  div
  h4 {
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_container_information {
  width: 516px;
  margin: auto;
  border: 1px solid var(--gray-three);
  margin-top: 20px;
  border-radius: 8px;
  box-shadow: 0px 2px 2px -1px #0000000a;
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_container_information {
  .accordion {
    .accordion-item {
      border: none;
      .accordion-body {
        padding: 0;

        table {
          thead th {
            font-weight: 500;
            font-size: 14px;
            line-height: 16.7px;
            text-align: center;
          }

          tbody {
            tr td {
              padding: 0;
              width: 50%;

              &:first-child {
                border-right: 1px solid var(--gray-three);
              }

              div {
                display: flex;
                justify-content: space-around;

                &:first-child {
                  border-bottom: 1px solid var(--gray-three);
                }

                p {
                  margin-bottom: 0;
                  height: 40px;
                  display: flex;
                  align-items: center;
                  font-weight: 400;
                }

                &.percent {
                  p {
                    &.red {
                      color: #e61010;
                    }
                    &.green {
                      color: #458558;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
    .accordion-button {
      border-radius: 0 !important;
      background: #f7f7f7;
      border: 0px;
      text-transform: uppercase;
      color: var(--black-two);
      border-bottom-color: var(--gray-three);

      &:focus {
        box-shadow: none;
      }
    }
  }
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_container_information
  .action {
  display: flex;
  padding: 20px;
  gap: 20px;

  button {
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
  }

  button:first-child {
    background-color: var(--white);
    color: var(--black-two);
    border: 1px solid var(--black-two);
    font-weight: 500;
  }

  button:last-child {
    background-color: #ff8d061f;
    color: var(--td-orange);
  }
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_container_information
  h3 {
  padding: 20px;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  border-bottom: 1px solid var(--gray-three);
  margin-bottom: 0;
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_container_information
  .transport-options,
.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-wrapper
  .transport-options {
  list-style: none;
  display: flex;
  padding: 9.5px 11px;
  gap: 10px;
  padding-bottom: 0;
}

.tdp_create_orders
  .body
  .right__
  .items_processing_container.page_2
  .order_container_information
  .transport-options
  li,
.tdp_create_orders
  .body
  .container-information
  ._preview-form
  .container-wrapper
  .transport-options
  li {
  padding-bottom: 8.5px;
  width: 120px;
  cursor: pointer;
  text-align: center;
  color: var(--black-two);
  font-size: 14px;
  font-weight: 500;
  &.active {
    color: var(--td-orange);
    border-bottom: 2px solid var(--td-orange);
  }
}

.tdp_offcanvas {
  width: 784px !important;

  &.shipment_details {
    width: 1450px !important;
  }

  &.payout-details,
  &.distributor-delivery {
    width: 800px !important;
  }
}

.tdp_offcanvas .offcanvas-header {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_offcanvas .offcanvas-header i {
  cursor: pointer;
  margin-right: 24px;
}

.tdp_offcanvas .offcanvas-header h5 {
  display: flex;
}

.tdp_offcanvas .offcanvas-header button {
  width: 80px;
}

.tdp_offcanvas .offcanvas-header.header-2 {
  display: flex;
  gap: 16px;
}

.tdp_offcanvas .offcanvas-header.header-2 input {
  width: 100%;
}

.tdp_offcanvas .offcanvas-header.header-2 select {
  width: 120px;
}

.tdp_offcanvas .offcanvas-header.header-3 {
  overflow-x: scroll;
  gap: 10px;
  height: 75px;
  overflow-y: hidden;
  padding: 30px 20px;
  justify-content: normal;
  scrollbar-width: none;
}

.tdp_offcanvas .offcanvas-header.header-3 div {
  /* border: 1px solid var(--gray-three); */
  border: 1px solid #ff8d061f;
  padding: 6px 10px;
  border-radius: 6px;
  max-width: 200px;
  text-wrap: nowrap;
  cursor: pointer;
  color: #ff8d06;
}

.tdp_offcanvas .offcanvas-header.header-3 div p {
  margin-bottom: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tdp_offcanvas .offcanvas-header.header-3 div.selected {
  border: 1px solid var(--black-two);
  color: var(--black-two);
}

.tdp_offcanvas .offcanvas-body {
  padding: 20px 40px;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container {
  margin-bottom: 50px;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product {
  display: flex;
  justify-content: space-between;
  padding: 20px 0;
  border-bottom: 1px solid var(--gray-three);

  &:last-child {
    border-bottom: 0;
  }
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product
  .info-wrapper {
  display: flex;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product
  .img_container {
  width: 100px;
  height: 76px;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product
  .img_container
  img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product
  .details {
  width: 204px;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product
  .details
  h2 {
  margin-bottom: 4px;
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product
  .details
  h6 {
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  color: var(--black-one);
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  .supplier_product_container
  .supplier_product
  button {
  width: 82px;
  height: 28px;
  font-size: 12px;
  font-weight: 500;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog h2 {
  color: var(--black-two);
  font-weight: 700;
  font-size: 18px;
  line-height: 21px;
  margin-bottom: 24px;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog .product-listing,
.offcanvas.tdp_catalog_product
  .offcanvas-body
  .other_products
  .product-listing {
  display: inline-flex;
  /* column-gap: 48px; */
  row-gap: 16px;
  flex-flow: wrap;
  padding: 0px 10px;
  margin-bottom: 48px;
  justify-content: space-between;
  width: 100%;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog .products_empty {
  padding: 10vw;
  text-align: center;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog .products_empty h3,
.tdp_catalog .body .list-view-container .table tbody .products_empty h3,
.tdp_catalog .body .grid-view-container .products_empty h3 {
  color: var(--black-two);
  font-size: 18px;
  line-height: 21px;
  font-weight: 700;
  margin-bottom: 4px;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog .products_empty h6,
.tdp_catalog .body .list-view-container .table tbody .products_empty h6,
.tdp_catalog .body .grid-view-container .products_empty h6 {
  color: var(--black-one);
  font-size: 16px;
  line-height: 19x;
  font-weight: 400;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog ._product {
  display: flex;
  margin-bottom: 16px;
  gap: 8px;
  align-items: center;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog ._product h3 {
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  color: var(--black-two);
  margin-bottom: 4px;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog ._product h6 {
  width: 110px;
  font-weight: 400;
  font-size: 12px;
  line-height: 14px;
  color: var(--black-one);
  margin-bottom: 4px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog ._product p {
  width: 110px;
  font-weight: 400;
  font-size: 12px;
  line-height: 14px;
  color: var(--black-one);
  margin-bottom: 4px;
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog ._product img {
  width: 77px;
  /* height: 110px; */
}

.tdp_offcanvas .offcanvas-body .tdp_product_catalog ._product button {
  width: 60px;
  height: 28px;
  font-size: 12px;
}

.tdp_products__loading-categories {
  display: flex;
  gap: 20px;
  padding: 9px;
  border-bottom: 1px solid var(--gray-three);
  padding-bottom: 4px;
}

.tdp_products__loading-categories span {
  width: 136px;
}

.tdp_products__loading-variants {
  display: flex;
  gap: 15px;
}

.tdp_products__loading-variants span {
  height: 120px;
  width: 70px;
}

.tdp_products__loading-variants div span {
  height: 30px;
  width: 70px;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  ._product
  .plus_minus_controller {
  width: fit-content;
  display: flex;
  border: 1px solid var(--gray-three);
  border-radius: 8px;
  box-shadow: 0px 2px 2px -1px #0000000a;
  align-items: center;
  margin-top: 4px;
  overflow: hidden;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  ._product
  .plus_minus_controller
  input {
  width: 45px;
  height: 22px;
  border-radius: 0 !important;
  border: none !important;
  text-align: center;
  font-size: 14px;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  ._product
  .plus_minus_controller
  input:focus {
  outline: none;
  box-shadow: none !important;
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  ._product
  .plus_minus_controller
  span {
  background-color: var(--gray-two);
  width: 28px;
  display: flex;
  justify-content: space-around;
  cursor: pointer;
  color: var(--black-two);
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  ._product
  .plus_minus_controller
  span
  i {
  color: var(--black-two);
}

.tdp_offcanvas
  .offcanvas-body
  .tdp_product_catalog
  ._product
  .plus_minus_controller
  p {
  width: 40px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  color: var(--black-two);
  font-size: 14px;
  font-weight: 400;
  line-height: 16.7px;
  margin-bottom: -3px;
}

.tdp_offcanvas .offcanvas-footer {
  height: 78px;
  border-top: 1px solid #e7e7e7;
  background: #fcfcfc;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.tdp_offcanvas .offcanvas-footer p {
  color: var(--td-orange);
  margin-bottom: 0;
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
  cursor: pointer;
}

.tdp_offcanvas .offcanvas-footer p i {
  font-size: 10px;
}

.tdp_phone_offcanvas,
.tdp_product_review_offcanvas {
  width: 545px !important;
}

.tdp_phone_offcanvas .offcanvas-header {
  background: rgba(252, 252, 252, 1);
  padding: 17px 40px;
}

.tdp_phone_offcanvas .offcanvas-header .offcanvas-title {
  display: flex;
  align-items: center;
}

.tdp_phone_offcanvas .offcanvas-header .offcanvas-title i {
  margin-right: 25px;
  font-size: 15px;
}

.tdp_phone_offcanvas .offcanvas-header .offcanvas-title p {
  color: var(--black-one);
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
}

.tdp_phone_offcanvas .offcanvas-body {
  padding: 39px 100px;
}

.tdp_phone_offcanvas .offcanvas-body .body {
  margin-top: 0;
}

.tdp_phone_offcanvas .offcanvas-body .phone_input_form h6 {
  color: var(--black-one);
  font-weight: 400;
  font-size: 16px;
  line-height: 19px;
  margin-bottom: 12px;
}

.tdp_phone_offcanvas {
  width: 545px !important;
}

.tdp_order_view .body {
  padding: 28px 57px;
}

.tdp_order_view .body .approval-container {
  margin-bottom: 20px;
  display: flex;
  background-color: #30b0b756;
  padding: 7px 10px;
  align-items: center;
  justify-content: space-between;
  border-radius: 5px;
  margin-top: -10px;
}

.tdp_order_view .body .approval-container p {
  margin-bottom: 0;
  font-size: 15px;
}

.tdp_order_view .body .approval-container div.actions {
  display: flex;

  button {
    background: none;
    width: fit-content;
    color: var(--green-one);
    font-size: 14px;
    text-decoration: underline;

    &:first-child {
      color: var(--red-1);
    }
  }
}

.tdp_order_view .body ._card-boxes {
  display: flex;
  gap: 12px;
}

.tdp_order_view .body ._card-boxes.draft {
  padding: 0 250px;
}

.tdp_order_view .body ._left,
.tdp_order_view .body ._right {
  box-shadow: 0px 2px 2px -1px #0000000a;
  border: 1px solid var(--gray-three);
  padding: 24px;
  border-radius: 12px;
  width: 100%;
}

.tdp_order_view .body ._right {
  width: 55%;
}

.tdp_order_view .body ._left .title {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
  gap: 8px;
}

.tdp_order_view .body ._left h2,
.tdp_order_view .body ._right h2 {
  color: var(--black-two);
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
}

.tdp_order_view .body ._right h2 {
  padding-bottom: 20px;
}

.tdp_order_view .body ._right ._tracking .step .info-notes div {
  p {
    margin-bottom: 0;
    line-height: 16px;
    font-size: 14px;

    &:first-child {
      color: var(--black-one);
      font-weight: 400;
      margin-bottom: 4px;
    }

    &:last-child {
      font-weight: 500;
      color: var(--black-two);

      display: flex;
      align-items: center;
      gap: 4px;
    }

    button {
      background: #6b797c0f;
      color: var(--black-one);
      height: 20px;
      padding: 2px 6px 4px 6px;
    }
  }

  margin-bottom: 12px;
}

.tdp_offcanvas .offcanvas-header.header-invoice-view {
  background: var(--gray-four);
  border-bottom: none;
  padding: 19px 40px;
  align-items: center;
}

.tdp_offcanvas .offcanvas-header.header-invoice-view .action-buttons {
  display: flex;
  gap: 12px;
  font-size: 14px;
}

.tdp_offcanvas
  .offcanvas-header.header-invoice-view
  .action-buttons
  button:first-child {
  background: #ff8d06;
  color: var(--white);
}

.tdp_offcanvas .offcanvas-header.header-invoice-view h5 {
  color: var(--black-one);
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
}

.tdp_offcanvas .offcanvas-header.header-invoice-view h5 i {
  color: var(--black-two);
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .due-date {
  display: flex;
  margin-bottom: 6px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .due-date p {
  color: var(--black-one);
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
  margin-right: 12px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .due-date span {
  margin-left: -8px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .due-date span.paid {
  margin-left: -2px;
  margin-bottom: 2px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .addresses div {
  display: flex;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .addresses div p:first-child {
  color: var(--black-one);
  width: 85px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .addresses div p:last-child {
  color: var(--black-two);
  text-transform: capitalize;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .payment-instruction {
  margin-top: 40px;
  box-shadow: 0px 4px 4px 0px #0000000a;
  border: 1px solid var(--gray-three);
  border-radius: 16px;
  padding: 16px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .payment-instruction h4 {
  color: var(--td-orange);
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  margin-bottom: 4px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .payment-instruction h5 {
  color: var(--black-two);
  font-size: 18px;
  font-weight: 500;
  line-height: 21px;
  margin-bottom: 4px;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .payment-instruction h5 b {
  font-weight: 700;
}

.tdp_offcanvas .offcanvas-body.invoice-view-body .payment-instruction h6 {
  color: var(--black-one);
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_offcanvas
  .offcanvas-body.invoice-view-body
  .payment-instruction
  .bank-details {
  margin-top: 16px;
}

.tdp_offcanvas
  .offcanvas-body.invoice-view-body
  .payment-instruction
  .bank-details
  div {
  display: flex;
  justify-content: space-between;
}

.tdp_offcanvas
  .offcanvas-body.invoice-view-body
  .payment-instruction
  .bank-details
  div
  p {
  margin-bottom: 8px;
  color: var(--black-two);
  font-weight: 500;
  font-size: 14px;
  line-height: 16px;
}

.tdp_offcanvas
  .offcanvas-body.invoice-view-body
  .payment-instruction
  .bank-details
  div
  p:last-child {
  font-weight: 700;
}

/* CUSTOM TABLE */

._custom-table {
  margin-top: 42px;
}

._custom-table ._body tr {
  display: grid;
  grid-template-columns: 3.5fr 1.5fr 1.5fr 1.5fr 1fr 1fr;
}

.tdp_order_view .body ._left .due_status_block {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}

.tdp_order_view .body ._left .due_status_block p {
  margin-bottom: 0;
  color: var(--black-one);
  font-size: 14px;
  line-height: 19px;
  font-weight: 400;
}

.tdp_order_view .body ._left .due_status_block span {
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  padding: 2px 6px;
  border-radius: 34px;
  text-transform: capitalize;
}

.tdp_order_view .body ._left .due_status_block span.open {
  background: #0610ff0f;
  color: var(--blue);
}

.tdp_order_view .body ._left .due_status_block span.completed {
  color: var(--green-one);
  background: var(--green-one-opac-10);
}

.tdp_order_view .body ._left .due_status_block span.draft {
  color: var(--black-one);
  background: #6b797c0f;
}

.tdp_order_view .body ._left .due_status_block span.cancelled {
  background: var(--red-color);
  color: var(--gray-six);
}

.tdp_order_view .body ._left .date,
.tdp_order_view .body ._left .approval-status {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 0;
  margin-top: 8px;
}

.tdp_order_view .body ._left .location h4,
.tdp_order_view .body ._left .date h4 {
  color: var(--black-one);
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  width: 65px;
}

.tdp_order_view .body ._left .approval-status {
  margin-top: 0;
  gap: 16px;
  h4 {
    width: fit-content;
  }
}

.tdp_order_view .body ._left .location h6,
.tdp_order_view .body ._left .date h6 {
  color: var(--black-two);
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  text-transform: capitalize;
}

.tdp_order_view .body ._left .location h6 p {
  margin-bottom: 4px;
}

.tdp_order_view .body ._left ._custom-table {
  margin-top: 42px;
}

.tdp_order_view .body ._left ._custom-table ._head,
.tdp_order_view .body ._left ._custom-table ._body tr {
  display: grid;
  grid-template-columns: 3.5fr 1.5fr 1.5fr 1.5fr 1fr 0.6fr 1fr;
  /* grid-template-columns: repeat(6, 1fr); */
}

._custom-table ._head {
  display: grid;
  grid-template-columns: 3.5fr 1.5fr 1.5fr 1.5fr 1fr 1fr;
  border-bottom: 1px solid var(--gray-three);
  margin-bottom: 24px;
}

._custom-table ._head p {
  color: var(--black-one);
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
}

.tdp_order_view .body ._left ._custom-table ._head p {
  color: var(--black-one);
  font-size: 14px;
  line-height: 16px;
  font-weight: 400;
  margin-bottom: 8px;
}

._custom-table ._head p:last-child,
._custom-table ._body tr td:last-child {
  text-align: right;
}

._custom-table ._body tr {
  margin-bottom: 24px;
}

._custom-table ._body tr td {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
}

.tdp_order_view .body ._left ._custom-table ._body tr {
  margin-bottom: 24px;
}

.tdp_order_view .body ._left ._custom-table ._body tr td {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  /* text-align: center; */
}

.tdp_order_view .body ._left ._custom-table ._body tr td:first-child {
  /* width: 60%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden; */
}

._custom-table ._body tr td.item-1 {
  color: var(--black-two);
}

._custom-table ._body tr td.item-2 {
  color: var(--black-one);
}

._custom-table ._totals {
  padding: 17px;
  padding-right: 0;
}

.tdp_order_view .body ._left ._custom-table ._totals {
  padding-right: 0;
}

.tdp_order_view .body ._left ._custom-table ._head {
  border-bottom: 0;
  margin-bottom: 22px;
}

.tdp_order_view .body ._left ._custom-table ._body tr td.item-1 {
  color: var(--black-two);
}

.tdp_order_view .body ._left ._custom-table ._body tr td.item-2 {
  color: var(--black-one);
}

.tdp_order_view .body ._left ._custom-table ._body tr td:last-child {
  text-align: right;
}

._custom-table ._totals .total-line {
  display: flex;
  justify-content: end;
  gap: 80px;
}

._custom-table ._totals .total-line p {
  color: var(--black-two);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  text-align: end;
  width: 90px;
}

._custom-table ._totals .total-line p:first-child {
  text-align: start;
}

.tdp_order_view .body ._left ._custom-table ._totals .total-line p {
  color: var(--black-two);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
}

._custom-table ._totals .total-line.total p {
  color: var(--black-two);
  font-size: 14px;
  font-weight: 800;
  line-height: 17px;
}

._custom-table ._totals .total-line.paid p {
  color: var(--black-two);
  font-size: 14px;
  font-weight: 600;
  line-height: 17px;
}

.tdp_order_view .body ._left ._custom-table ._totals .total-line.total p {
  color: var(--black-two);
  font-size: 14px;
  font-weight: 700;
  line-height: 17px;
}

.tdp_account_statement .balance-cards {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
}

.tdp_account_statement .balance-cards .card {
  padding: 20px;
  box-shadow: 0px 2px 2px -1px #0000000a;
  border-radius: 8px;
  width: 100%;
  cursor: pointer;
}

.tdp_account_statement .balance-cards .card h2 {
  font-size: 24px;
  font-weight: 400;
  line-height: 28.64px;
  margin-bottom: 0;
  margin-top: 40px;
}

.tdp_account_statement .balance-cards .card h6 {
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.tdp_account_statement .balance-cards .card.active {
  background-color: var(--black-two);
  color: #fff;
}

.tdp_account_statement .balance-cards .card:nth-child(2) h2 {
  color: var(--green-one);
}

.tdp_account_statement .balance-cards .card:nth-child(3) h2 {
  color: var(--red-two);
}

.tdp_account_statement .header .action-row {
  display: flex;
  justify-content: space-between;
}

.tdp_account_statement .header .action-row .__filters {
  display: flex;
}

.tdp_account_statement
  .header
  .action-row
  .__filters
  .custom-filter-select
  select {
  border-radius: 8px 0px 0px 8px !important;
  border-right: 0.5px !important;
}

.tdp_account_statement
  .header
  .action-row
  .__filters
  .custom-filter-select
  select:focus {
  box-shadow: none !important;
}

.tdp_account_statement .header .action-row .__filters .date-picker-container {
  display: flex;
  align-items: center;
}

.tdp_account_statement
  .header
  .action-row
  .__filters
  .date-picker-container
  svg {
  position: relative;
  left: -30px;
}

.tdp_account_statement
  .header
  .action-row
  .__filters
  .date-picker-container
  .react-datepicker__input-container
  input {
  border-radius: 0px 8px 8px 0px !important;
  border-left: 0.5 !important;
  padding-left: 7px;
}

.tdp_account_statement
  .header
  .action-row
  .__filters
  .date-picker-container
  .react-datepicker__input-container
  input:focus {
  outline: none;
}

.tdp_account_statement .header .action-row .buttons {
  display: flex;
  gap: 12px;
}

.tdp_account_statement .header .action-row .buttons button {
  width: fit-content;
  padding: 9.5px 8px;
  background-color: #fff;
  color: var(--black-two);
  border: 1px solid var(--gray-three);
  font-size: 14px;
  font-weight: 500;
  line-height: 16.71px;
}

.tdp_account_statement .header .action-row .buttons button svg {
  margin-left: 10px;
  stroke: var(--black-one);
}

.tdp_invoices
  .header
  ._filter_status
  .__filters
  .react-datepicker-wrapper
  input {
  border-right: 1px solid var(--gray-three) !important;
  border-radius: 8px !important;
  width: 200px;
}

.tdp_review_order_offcanvas .tdp_product_review {
  padding: 39px 82px;
}

.tdp_product_review .body {
  margin-top: 40px;
}

.tdp_product_review .body .error_block {
  margin-bottom: 24px;
}

.tdp_product_review .body .error_block h3 {
  color: var(--black-two);
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  margin-bottom: 4px;
}

.tdp_product_review .body .error_block h5 {
  color: var(--black-one);
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.tdp_product_review .body .error_block .error-container {
  border: 1px solid var(--gray-three);
  background: var(--gray-four);
  padding: 12px 14px;
  border-radius: 8px;
}

.tdp_product_review .body .error_block .error-container .error-inputs-flex {
  display: flex;
  flex-direction: column;
  row-gap: 8px;
}

.tdp_product_review
  .body
  .error_block
  .error-container
  .error-inputs-flex
  .input-flex {
  display: flex;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_product_review
  .body
  .error_block
  .error-container
  .error-inputs-flex
  .input-flex:last-child {
  border-bottom: 0;
}

.tdp_product_review
  .body
  .error_block
  .error-container
  .error-inputs-flex
  .input-flex
  input {
  height: 32px;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  padding: 8px;
  width: -webkit-fill-available;
  text-overflow: ellipsis;
}

.tdp_product_review
  .body
  .error_block
  .error-container
  .input-flex
  input:nth-child(2) {
  width: 60px;
}

.tdp_product_review
  .body
  .error_block
  .error-container
  .input-flex
  input:nth-child(3) {
  max-width: 90px;
  width: 100%;
}

.tdp_product_review .body .error_block .error-container p.error-message {
  margin-bottom: 0;
  color: var(--red-1);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
}

.tdp_product_review .body .error_block .error-container p.error-message {
  margin-bottom: 0;
  color: var(--red-1);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
}

.tdp_product_review .body .error_block .confirm-items {
  margin-top: 24px;
}

.tdp_product_review .body .error_block .confirm-items h4 {
  font-weight: 700;
  font-size: 18px;
  line-height: 21px;
  color: var(--black-two);
  margin-bottom: 16px;
}

.tdp_product_review .body .error_block .confirm-items .item {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_product_review .body .error_block .confirm-items .item div {
  display: flex;
  align-items: center;
}

.tdp_product_review .body .error_block .confirm-items .item p {
  padding-bottom: 12px;
  margin-top: 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: var(--black-two);
}

.tdp_product_review .body .error_block .confirm-items .item div p {
  max-width: 250px;
  text-overflow: ellipsis;
  overflow: hidden;
  text-wrap: nowrap;
}

.tdp_product_review .body .error_block .confirm-items .item div span {
  color: var(--black-one);
  margin-left: 3px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
}

.tdp_product_review .body .error_block .confirm-items .cummulatives {
  margin-top: 12px;
  margin-bottom: 24px;
}

.tdp_product_review .body .error_block .confirm-items .cummulatives .total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.tdp_product_review .body .error_block .confirm-items .cummulatives .total p {
  font-size: 14px;
  font-weight: 600;
  line-height: 16px;
  margin-bottom: 0;
  color: var(--black-two);
}

.tdp_product_review .body button {
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
}

.tdp_product_review .body button.secondary {
  background: none;
  color: var(--td-orange);
}

.tdp_catalog {
}

.tdp_catalog .header {
  padding-bottom: 0;
  padding-right: 0;
}

.tdp_catalog .header ._filter_status .order_statuses {
  overflow-x: scroll;
  scrollbar-width: none;
  flex-wrap: nowrap;
}

.tdp_catalog .header ._filter_status .order_statuses button {
  padding: 4px 12px;
  min-width: fit-content;
  font-weight: 400;
  font-size: 14px;
  text-transform: capitalize;
}

.tdp_catalog .header ._filter_status .order_statuses button.active {
  border: 2px solid var(--black-two);
}

.tdp_catalog .header .search_filter {
  display: flex;
  margin-top: 20px;
  justify-content: space-between;
  width: 100%;
  gap: 10px;
}

.tdp_catalog .header .search_filter .search-container {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
}

.tdp_catalog .header .search_filter .search-container input {
  padding: 0px 30px;
  width: 100%;
  font-size: 14px;
  height: 36px;
}

.tdp_catalog .header .search_filter .search-container input:focus {
  outline: none;
}

.tdp_catalog .header .search_filter .search-container i {
  left: 10px;
  color: #aeaeae;
  font-size: 12px;
  position: absolute;
}

.tdp_catalog .header .search_filter .types-filter {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-right: 40px;
}

.tdp_catalog .header .search_filter .types-filter .selects-group {
  display: flex;
  box-shadow: 0px 2px 2px -1px #0000000a;
}

.tdp_catalog .header .search_filter .types-filter .selects-group select {
  padding: 7px;
  height: 36px;
  font-size: 14px;
}

.tdp_catalog .header .search_filter .types-filter .selects-group select:focus {
  box-shadow: none;
  outline: none;
}

.tdp_catalog
  .header
  .search_filter
  .types-filter
  .selects-group
  select:nth-child(1) {
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
  width: 160px;
}

.tdp_catalog
  .header
  .search_filter
  .types-filter
  .selects-group
  select:nth-child(2) {
  border-radius: 0px !important;
  border-left: 0 !important;
  width: 120px;
}

.tdp_catalog
  .header
  .search_filter
  .types-filter
  .selects-group
  select:nth-child(3) {
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
  border-left: 0 !important;
  width: 120px;
}

.tdp_catalog .header .search_filter .types-filter .view-types {
  display: flex;
  box-shadow: 0px 2px 2px -1px #0000000a;
}

.tdp_catalog .header .search_filter .types-filter .view-types button {
  background: white;
  width: 36px;
  height: 36px;
  color: var(--black-one);
  border: 1px solid var(--gray-three);
}

.tdp_catalog .header .search_filter .types-filter .view-types button.active {
  border: 2px solid var(--black-two);
  color: var(--black-two);
}

.tdp_catalog
  .header
  .search_filter
  .types-filter
  .view-types
  button:nth-child(1) {
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
}

.tdp_catalog
  .header
  .search_filter
  .types-filter
  .view-types
  button:nth-child(2) {
  /* border-left: 0px !important; */
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
}

.tdp_catalog .header .search_filter .types-filter button.cart-btn {
  width: 36px;
  height: 36px;
  position: relative;
  background: #ff8d06;
}

.tdp_catalog .header .search_filter .types-filter button.cart-btn span {
  width: 15px;
  height: 15px;
  color: var(--white);
  background: var(--black-two);
  position: absolute;
  font-size: 10px;
  font-weight: 500;
  line-height: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  top: 3px;
  right: 2px;
}

.tdp_catalog .body .grid-view-container .product_section {
  padding: 40px;

  &:last-child {
    margin-bottom: 70%;
  }
}

.tdp_catalog .body .grid-view-container .product_section .product_title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.tdp_catalog .body .grid-view-container .product_section .product_title h3 {
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  text-transform: capitalize;
  width: 400px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-wrap: nowrap;
}

.tdp_catalog .body .grid-view-container .product_section .product_title p {
  color: var(--td-orange);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
  cursor: pointer;
  margin-bottom: 0;
}

.tdp_catalog .body .grid-view-container .product_section .products_container {
  position: relative;
}

.tdp_catalog .body .grid-view-container .product_section .products {
  display: flex;
  gap: 30px;
  overflow-x: scroll;
  scrollbar-width: none;
  z-index: 1;
}

.tdp_catalog .body .grid-view-container .product_section.export .product {
  border: 1px solid #e7e7ee80;
  padding: 12px;
  min-height: fit-content;
  border-radius: 8px;
  width: 260px;
  display: block;
}

.tdp_catalog .body .grid-view-container .product_section .product {
  display: flex;
  gap: 12px;
}

.tdp_catalog .body .grid-view-container .product_section .product .export-info {
  display: none;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  .product
  ._img-container {
  border: none;
  max-height: 130px;
  max-width: 90px;
  display: flex;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section.export
  .product
  ._img-container {
  text-align: center;
  height: 90px;
  object-fit: contain;
  margin-bottom: 12px;
  border: 1px solid #e7e7e780;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  max-width: unset;
}

.tdp_catalog .body .grid-view-container .product_section .product img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  /* .products */
  .product
  .details
  p {
  color: var(--black-one);
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  width: 90%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 0px;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section.export
  .product
  .details
  p {
  font-size: 14px;
  line-height: 19px;
}

.tdp_catalog .body .grid-view-container .product_section .product .details h5 {
  color: var(--black-two);
  font-size: 18px;
  font-weight: 700;
  line-height: 21.48px;
  margin-bottom: 4px;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  /* .products */
  .product
  .details
  button {
  width: 60px;
  height: 28px;
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section.export
  /* .products */
  .product
  .details section {
  margin-bottom: 24px;

  &:last-child {
    margin-bottom: 0px;
  }
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  .product
  .details
  section {
  margin-bottom: 20px;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section.export
  .product
  .details
  section
  div.export-info {
  display: flex;
  justify-content: space-between;
  padding-bottom: 12px;

  &:last-child {
    padding-bottom: 0;
  }

  p {
    font-weight: 400;
    width: 100%;
    &:last-child {
      text-align: right;
      color: var(--black-two);
      font-weight: 500;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      display: block;
    }
  }
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  .products_container
  .promo {
  position: absolute;
  padding: 3px;
  background: #0679ff;
  color: white;
  border-radius: 34px;
  width: 48px;
  font-size: 12px;
  text-align: center;
  font-weight: 600;
  height: 19px;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  .products_container
  /* .react-multiple-carousel__arrow */
  .slider-buttons button {
  box-shadow: -18px -12px 7px 16px #ffffffe6;
  border-radius: 22px !important;
  background: var(--black-two);
  width: 44px;
  height: 44px;
  z-index: 2;
  top: 40px;
  position: absolute;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  .products_container
  /* .react-multiple-carousel__arrow */
  .slider-buttons button.disable {
  display: none;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  .products_container
  .react-multiple-carousel__arrow.react-multiple-carousel__arrow--left {
  left: -10px;
}

.tdp_catalog
  .body
  .grid-view-container
  .product_section
  .products_container
  .react-multiple-carousel__arrow.react-multiple-carousel__arrow--right {
  right: 0px;
}

.tdp_catalog .body .grid-view-container .products-loading-screen {
  display: flex;
  gap: 36px;
  padding-left: 28px;
}

.tdp_catalog .body .grid-view-container .products-loading-screen:first-child {
  padding-top: 10px;
}

.tdp_catalog .body .list-view-container {
  padding: 15px 40px;
}

.tdp_catalog .body .list-view-container .table {
  table-layout: fixed;
  margin-top: 20px;
}

.tdp_catalog .body .list-view-container .table thead tr th {
  background-color: white !important;
  text-align: center;

  &._left {
    text-align: left;
  }
}

.tdp_catalog .body .list-view-container .table tbody img {
  width: auto;
  height: 44px;
  padding-right: 5px;
}

.tdp_catalog .body .list-view-container .table tbody tr {
  vertical-align: baseline;
}

.tdp_catalog .body .list-view-container .table tbody tr td {
  padding: 13.5px 0;
  font-weight: 500;
  vertical-align: middle;
  text-align: center;

  &._left {
    text-align: left;

    p {
      width: 85% !important;
      text-align: left;
      margin: inherit;
    }
  }

  .ships-from {
    display: flex;
    gap: 10px;
  }

  p {
    width: 50%;
    text-align: center;
    margin: auto;
    margin-bottom: 0;
  }
}

.tdp_catalog .body .list-view-container .table tbody tr td .img-container {
  width: 50px;

  img {
    max-width: 100%;
    object-fit: contain;
    max-height: 100%;
  }
}

.tdp_catalog .body .list-view-container .table tbody tr td p.product-name {
  width: 70%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 16px;
  margin-bottom: 0;
}

.tdp_catalog .body .list-view-container .table tbody tr td span.promo {
  background: #0610ff0f;
  color: var(--blue-one);
  margin-left: 10px;
  border-radius: 34px;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  padding: 6px 10px;
}

.tdp_catalog .body .list-view-container .table tbody tr td:last-child {
  text-align: end;
}

.tdp_catalog .body .list-view-container .table tbody tr button.addToCart {
  width: 100px;
  height: 32px;
  border: 2px solid var(--black-two);
  background-color: white;
  color: var(--black-two);
  display: inline;
  margin-right: 20px;
  font-weight: 500;
  font-size: 14px;
  line-height: 16px;
}

.tdp_catalog .body .list-view-container .table tbody tr td.counter {
  text-align: -webkit-right;
}

.tdp_catalog
  .body
  .list-view-container
  .table
  tbody
  tr
  td.counter
  .custom_counter {
  width: 65%;
}

.tdp_catalog
  .body
  .list-view-container
  .table
  tbody
  tr
  td.counter
  .custom_counter
  .plus_minus_controller {
  width: fit-content;
}

.tdp_catalog
  .body
  .list-view-container
  .table
  tbody
  tr
  td.counter
  .custom_counter {
  display: none;
}

.tdp_catalog
  .body
  .list-view-container
  .table
  tbody
  tr
  td.counter.show
  .custom_counter {
  display: block;
}

.tdp_catalog
  .body
  .list-view-container
  .table
  tbody
  tr:hover
  .counter
  .custom_counter {
  display: block;
}

.tdp_catalog .body .list-view-container .table tbody .products_empty,
.tdp_catalog .body .grid-view-container .products_empty {
  padding: 42px;
  text-align: center;
  transform: translateY(50%);
}

.tdp_catalog .body .list-view-container .table tbody .products_empty h6,
.tdp_catalog .body .list-view-container .table tbody .products_empty h3,
.tdp_catalog .body .grid-view-container .products_empty h6,
.tdp_catalog .body .grid-view-container .products_empty h3 {
  padding: 0 35%;
}

.offcanvas.tdp_catalog_category_products {
  width: 784px;
}

.offcanvas.tdp_catalog_category_products .offcanvas-header {
  padding: 17px 20px;
  border-bottom: 1px solid var(--gray-three);
}

.offcanvas.tdp_catalog_category_products .offcanvas-header h5,
.offcanvas.tdp_catalog_product .offcanvas-header h5 {
  display: flex;
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  gap: 12px;
}

.offcanvas.tdp_catalog_category_products .offcanvas-header h5 i,
.offcanvas.tdp_catalog_product .offcanvas-header h5 i {
  font-size: 16px;
}

.offcanvas.tdp_catalog_category_products .offcanvas-header h5 p,
.offcanvas.tdp_catalog_product .offcanvas-header h5 p {
  margin-bottom: 0;
  text-transform: capitalize;
}

.offcanvas.tdp_catalog_category_products .offcanvas-header.header-2 {
  padding: 20px 40px;
}

.offcanvas.tdp_catalog_category_products
  .offcanvas-header.header-2
  .search-container {
  position: relative;
  width: 100%;
}

.offcanvas.tdp_catalog_category_products
  .offcanvas-header.header-2
  .search-container
  i {
  position: absolute;
  left: 8px;
  top: 8px;
  font-size: 13px;
  color: var(--gray-five);
}

.offcanvas.tdp_catalog_category_products
  .offcanvas-header.header-2
  .search-container
  input {
  width: 100%;
  padding: 0px 30px;
  height: 36px;
  font-size: 14px;
}

.offcanvas.tdp_catalog_category_products
  .offcanvas-header.header-2
  .search-container
  input:focus {
  outline: none !important;
}

.offcanvas.tdp_catalog_category_products .offcanvas-body {
  padding: 40px;
}

.offcanvas.tdp_catalog_product {
  width: 802px;
}

.offcanvas.tdp_catalog_product .offcanvas-header {
  padding: 17px 20px;
  background-color: var(--gray-four);
}

.offcanvas.tdp_catalog_product .offcanvas-header h5 p {
  color: var(--black-one);
  font-weight: 400;
  font-size: 16px;
}

.offcanvas.tdp_catalog_product .offcanvas-body .product-container {
  padding: 40px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card {
  padding: 20px;
  border: 1px solid var(--gray-three);
  box-shadow: 0px 4px 12px 0px #0000000a;
  border-radius: 8px;
  width: 352px;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .card-export-details {
  margin-bottom: 6px;
}

.card-export-details {
  display: flex;
  gap: 6px;
}

.card-export-details p {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--white);
  padding: 3px 4px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  white-space: nowrap;
  margin-bottom: 0;
}

.card-export-details p:first-child {
  background-color: var(--black-one);
}

.card-export-details p:last-child {
  background-color: var(--blue-one);
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .production-details {
  margin-bottom: 20px;
  margin-top: 12px;
  div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    p {
      font-size: 14px;
      font-weight: 400;
      line-height: 16px;
      color: var(--black-two);
      margin-bottom: 6px;

      &:first-child {
        color: var(--black-one);
      }
    }
  }
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  h2 {
  font-size: 20px;
  font-weight: 700;
  line-height: 23px;
  color: var(--black-two);
  width: 80%;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  h6 {
  line-height: 14px;
  color: var(--black-one);
  font-size: 12px;
  font-weight: 400;
  margin-bottom: 20px;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  p.price {
  font-size: 18px;
  font-weight: 700;
  line-height: 21px;
  margin-bottom: 8px;
  color: var(--black-two);

  span {
    color: var(--black-one);
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
  }
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .accordion
  .accordion-item {
  border: none;
  border-bottom: 1px solid #efefef;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .accordion
  .accordion-item
  h2 {
  width: 100%;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .accordion
  .accordion-item
  h2
  .accordion-button {
  font-size: 14px;
  font-weight: 500;
  padding: 14px 0px;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .accordion
  .accordion-item
  h2
  .accordion-button:active,
.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .accordion
  .accordion-item
  h2
  .accordion-button:focus,
.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .accordion
  .accordion-button:not(.collapsed) {
  background: none;
  outline: none;
  box-shadow: none;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .accordion
  .accordion-item
  .accordion-body {
  color: var(--black-one);
  font-weight: 400;
  font-size: 12px;
  line-height: 14px;
  padding: 9px 0px;
  padding-top: 0;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .quantity-container {
  display: flex;
  justify-content: space-between;
  padding: 14px 0px;
  align-items: center;
  /* border-bottom: 1px solid var(--gray-one); */
  margin-bottom: 20px;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  .quantity-container
  h5 {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
}

.offcanvas.tdp_catalog_product
  .offcanvas-body
  .product-container
  .product-card
  button.button {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  margin-bottom: 8px;
}

.offcanvas.tdp_catalog_product .offcanvas-body .other_products h5 {
  padding-bottom: 20px;
  border-bottom: 1px solid var(--gray-three);
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
}

.tdp_auth_wrapper {
}

.tdp_auth_wrapper ._left {
  background-color: var(--td-orange);
  padding: 150px 40px;
  min-height: 100vh;
  height: 100%;
}

.tdp_auth_wrapper ._left h3 {
  margin-top: 42px;
  font-weight: 700;
  font-size: 36px;
  line-height: 39px;
  color: var(--white);
}

.tdp_auth_wrapper ._left h6 {
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: var(--white);
}

.tdp_auth_wrapper ._right {
  padding: 0;
  height: 100%;
}

.tdp_auth_wrapper .navigation {
  display: flex;
  padding: 19px 40px;
  justify-content: space-between;
  border-bottom: 1px solid var(--gray-three);
}

.tdp_auth_wrapper .navigation ._back {
  gap: 10px;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.tdp_auth_wrapper .navigation ._back a {
  color: var(--black-one);
  text-decoration: none;
  font-size: 14px;
  font-weight: 400;
}

.tdp_auth_wrapper .navigation .login-section {
  display: flex;
  gap: 31px;
  align-items: center;
}

.tdp_auth_wrapper .navigation .login-section p {
  font-size: 14px;
  color: var(--black-one);
  margin-bottom: 0px;
}

.tdp_auth_wrapper .navigation .login-section button {
  width: 92px;
  font-size: 14px;
}

.tdp_auth_wrapper .register-form {
  margin: auto;
  padding-top: 113px;
  width: 400px;
}

.tdp_auth_wrapper .register-form.options {
  width: fit-content;
}

.tdp_auth_wrapper .register-form .sub-heading {
  font-size: 14px;
  color: var(--black-one);
}

.tdp_auth_wrapper .register-form h3 {
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  margin-bottom: 4px;
}

.tdp_auth_wrapper .register-form h6 {
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  color: var(--black-one);
  margin-bottom: 32px;
}

.tdp_auth_wrapper .register-form .option {
  display: flex;
  box-shadow: 0px 2px 2px -1px #0000000a;
  border: 1px solid var(--gray-three);
  background-color: var(--gray-four);
  padding: 12px;
  border-radius: 8px;
  gap: 8px;
  margin-bottom: 24px;
  min-height: 172px;
}

.tdp_auth_wrapper .register-form .option div h4 {
  font-weight: 700;
  font-size: 20px;
}

.tdp_auth_wrapper .register-form .option div p {
  width: 541px;
  color: var(--black-one);
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 16px;
  font-weight: 400;
}

.tdp_auth_wrapper .register-form .option div button {
  width: 92px;
  float: right;
  font-size: 14px;
  font-weight: 500;
  height: 32px;
}

.tdp_auth_wrapper .register-form .option {
  display: flex;
  width: fit-content;
}

.tdp_auth_wrapper .register-form .input-flex {
  margin-bottom: 8px;
  display: flex;
  gap: 12px;
}

.tdp_auth_wrapper .register-form .input-flex:first-of-type {
  margin-top: 12px;
}

.tdp_auth_wrapper .register-form .input-flex div {
  width: 100%;
}

.tdp_auth_wrapper .register-form .input-flex div input {
  width: 100%;
  padding: 12px 14px;
  font-size: 14px;
}

.tdp_auth_wrapper .register-form .input-flex input:focus {
  outline: none;
}

.tdp_auth_wrapper .register-form .input-flex div span {
  color: var(--red-two);
  font-size: 12px;
}

.tdp_auth_wrapper .register-form .tdp_register {
  width: 400px;
}

.tdp_auth_wrapper .register-form .register-contact-success .icon-wrapper {
  background: var(--td-orange);
  width: fit-content;
  padding: 6px;
  border-radius: 50%;
  font-size: 12px;
}

.tdp_auth_wrapper .register-form .register-contact-success .icon-wrapper svg {
  width: 40px;
  height: 40px;
}

.tdp_auth_wrapper
  .register-form
  .register-contact-success
  .icon-wrapper
  svg
  path {
  stroke: var(--white);
}

.tdp_auth_wrapper .register-form .register-contact-success h5 {
  font-size: 21px;
  margin-top: 18px;
}

.tdp_auth_wrapper .register-form .register-contact-success p {
  font-size: 14px;
  color: var(--black-one);
}

.tdp_offcanvas.shipment_details .offcanvas-header {
  background-color: #fcfcfc;
  border-bottom: 0;
}

.tdp_offcanvas.shipment_details .offcanvas-header h5 {
  background-color: #fcfcfc;
  border-bottom: 0;
  color: var(--black-one);
  font-weight: 400;
  font-size: 16px;
  display: flex;
  align-items: center;

  p {
    margin-bottom: 0;
    font-size: 14px;
    line-height: 16px;
    align-items: center;
    display: flex;

    svg {
      width: 30px;
      height: 30px;
    }
  }

  i {
    color: var(--black-two);
    font-size: 12px;
    margin-left: 23px;
  }
}

.tdp_offcanvas.shipment_details .body-container {
  border-bottom: 1px solid var(--gray-three);
}

.tdp_offcanvas.shipment_details .offcanvas-body .heading h5 {
  font-weight: 700;
  font-size: 24px;
  line-height: 28px;
  margin-bottom: 20px;
}

.tdp_offcanvas.shipment_details .offcanvas-body .heading {
  .info {
    display: flex;
    gap: 64px;
    flex-flow: wrap;

    p {
      margin-bottom: 0;

      &.title {
        text-transform: uppercase;
        color: var(--black-one);
        font-size: 12px;
        font-weight: 500;
        line-height: 14px;
        margin-bottom: 4px;
      }
      &.value {
        font-size: 14px;
        font-weight: 400;
        line-height: 16px;
        color: var(--black-two);
        text-transform: capitalize;

        &.link {
          color: #357ae1;
          text-transform: lowercase;
        }
      }
    }
  }
}

.tdp_offcanvas.shipment_details .info-container {
  background-color: var(--gray-four);
  height: 100vw;
  padding: 0;
  display: flex;
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view {
  background-color: var(--white);
  width: 65%;
  padding: 20px 40px;
  margin-bottom: 15%;
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .filter-buttons {
  display: flex;
  gap: 12px;
  margin-bottom: 40px;
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .filter-buttons
  button {
  max-width: 156px;
  background-color: white;
  box-shadow: 0px 1px 1px 0px #0000001a;
  color: var(--black-one);
  border: 1px solid var(--gray-three);
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;

  &.active {
    border: 2px solid var(--black-two);
    color: var(--black-two);
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-box {
  height: 100vw;
  overflow-y: scroll;
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body {
  box-shadow: 0px 2px 2px -1px #0000000a;
  border: 1px solid var(--gray-three);
  border-radius: 8px;
  margin-bottom: 20px;

  .react-loading-skeleton {
    width: 150px;
    height: 20px;
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  h3 {
  font-weight: 700;
  font-size: 18px;
  line-height: 21px;
  margin-bottom: 20px;
  padding: 20px;
  padding-bottom: 0;
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .details-container
  .details {
  display: flex;
  flex-wrap: wrap;
  padding: 20px;
  padding-top: 0px;

  .__col {
    width: 50%;
    margin-bottom: 20px;

    p {
      margin-bottom: 0;
      &:first-child {
        color: var(--black-one);
        font-size: 12px;
        font-weight: 500;
        line-height: 14px;
        margin-bottom: 4px;
      }
      &:last-child {
        font-size: 14px;
        font-weight: 400;
        line-height: 16px;
        text-transform: capitalize;
      }
    }
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers
  table {
  table-layout: fixed;
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers
  table
  thead
  tr
  th {
  background-color: var(--gray-six);
  color: var(--black-two);
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  text-align: center;

  &:first-child {
    padding-left: 20px;
    text-align: left;
  }

  i {
    font-size: 12px;
    margin-left: 7px;
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers
  table
  tbody {
  .react-loading-skeleton {
    width: 100vw;
    margin-top: 10px;
    margin-bottom: 10px;
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers
  table
  tbody
  tr {
  height: 50px;
  vertical-align: middle;
  cursor: pointer;
  td {
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
    color: var(--black-one);

    &:first-child {
      color: var(--black-two);
    }
  }

  &:last-child {
    td {
      border-bottom: 0px;
    }
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers
  table
  tbody
  tr
  td {
  text-align: center;
  text-transform: capitalize;

  &:first-child {
    text-align: left;
    padding-left: 20px;
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers.invoices
  table {
  thead tr th {
    text-align: center;
  }
  tbody tr td {
    text-align: center;

    a {
      color: #357ae1;
      text-decoration: underline;
    }

    button {
      width: 100px;
      height: 32px;
      box-shadow: 0px 1px 1px 0px #0000001a;
      border: 2px solid var(--black-two);
      background-color: var(--white);
      color: var(--black-two);
      margin: auto;
    }
  }
}

.tdp_offcanvas.shipment_details .offcanvas-body.info-container ._tracking {
  width: 35%;
  padding-top: 40px;
  height: 120%;
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  ._tracking
  .container {
  background-color: var(--white);
  width: 454px;
  border-radius: 8px;
  border: 1px solid var(--gray-three);
  box-shadow: 0px 2px 2px -1px #0000000a;
  padding: 0;
}

/* TRACKING STYLE  */

._tracking .container h2 {
  padding: 20px;
  font-weight: 700;
  font-size: 18px;
  line-height: 21px;
}

._tracking .tracking-steps .step {
  border-bottom: 1px solid var(--gray-three);
  padding: 12px 20px;
  display: flex;
  gap: 22px;

  &:last-child {
    border-bottom: 0;
  }

  &::before {
    content: "";
    width: 1px;
    background-color: var(--gray-three);
    position: relative;
    bottom: 0;
    margin-top: 23px;
  }
}

._tracking .tracking-steps .step h5 {
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  margin-bottom: 12px;
  display: flex;
  position: relative;

  .status-dot {
    background: white;
    display: block;
    height: 20px;
    width: 20px;
    border: 1px solid #08aa49;
    border-radius: 50%;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    left: -33px;

    &::before {
      content: "";
      height: 10px;
      width: 10px;
      background-color: #08aa49;
      display: block;
      border-radius: 50%;
    }

    &.pending {
      border-color: #ff8d06;

      &::before {
        background-color: #ff8d06;
      }
    }

    &.open {
      border-color: #dbd6d6;

      &::before {
        background-color: #dbd6d6;
      }
    }
  }
}

._tracking .tracking-steps .step .logistics {
  display: flex;
  gap: 16px;
  margin-bottom: 12px;

  svg {
    width: 15px;
    path {
      stroke: #ff8d06;
    }
  }

  .time,
  .location {
    display: flex;
    align-items: center;
    gap: 4px;

    span {
      font-size: 12px;
      font-weight: 400;
      line-height: 14px;
    }
  }

  .location {
    svg {
      width: fit-content;
    }
  }
}

._tracking .tracking-steps .step .comment {
  margin-bottom: 0;
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;
}

/* TRACKING STYLE ENDS */

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers.documents
  table {
  thead tr th {
    text-align: initial;
  }
  tbody tr td {
    text-align: initial;
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers.customers
  table {
  tbody tr td:last-child {
    text-decoration: underline;
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers.documents
  table
  tbody
  tr
  td
  .download {
  background: var(--gray-three);
  margin: auto;
  padding: 4px;
  border-radius: 8px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;

  path {
    stroke: var(--black-two);
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers.items
  table
  tbody
  tr
  td {
  div {
    display: flex;
    align-items: center;
    gap: 20px;

    p {
      margin-bottom: 0;
      color: var(--black-one);
      font-size: 14px;
      font-weight: 400;
      line-height: 16px;
    }
  }
}

.tdp_offcanvas.shipment_details
  .offcanvas-body.info-container
  .information-view
  .info-body
  .containers.items
  table
  thead
  tr
  th {
  &:first-child {
    padding-left: 85px;
  }
}

.tdp_account_settings .offcanvas-header {
  height: 70px;
}

.tdp_account_settings .offcanvas-body {
  padding: 40px;
}

.tdp_account_settings .offcanvas-body .menu-list {
  border: 1px solid var(--gray-three);
  padding: 8px 4px;
  border-radius: 8px;
  position: relative;
}

.tdp_account_settings .offcanvas-body .menu-list .menu {
  display: flex;
  align-items: center;
  padding: 5px;
  margin-bottom: 12px;
  cursor: pointer;

  &:hover {
    background-color: var(--gray-six);
    border-radius: 4px;
  }

  &:last-child {
    margin-bottom: 0;
  }

  div {
    margin-left: 10px;
    :where(h6, p) {
      margin-bottom: 0;
    }

    h6 {
      font-size: 14px;
      line-height: 16px;
      font-weight: 400;
      color: var(--black-two);
      margin-bottom: 4px;
    }

    p {
      color: var(--black-one);
      font-size: 12px;
      font-weight: 400;
      line-height: 14px;
    }
  }

  svg {
    width: 20px;
    margin-right: 5px;
  }

  svg:last-child {
    position: absolute;
    right: 10px;
  }
}

.tdp_account_settings .offcanvas-body .menu-list .menu .dropdown-menu {
  width: fit-content;
  margin-left: auto !important;
  margin-top: -10px !important;
  right: 40px !important;

  a {
    padding: 0;

    &:where(:focus, :active) {
      background-color: inherit;
    }
  }
  li {
    display: flex;
    align-items: center;
    padding: 0px 10px;

    &:hover {
      background-color: var(--gray-six);
    }

    p {
      font-size: 12px;
      font-weight: 400;
      line-height: 14px;
      color: var(--black-two);
      margin-bottom: 0;
    }

    svg path {
      fill: var(--white);
      stroke: var(--black-two);
    }
  }
}

.tdp_account_settings .offcanvas-body .menu-list .account-details-view {
  padding: 5px;
}

.tdp_account_settings .offcanvas-body .menu-list .account-details-view .title {
  display: flex;
  align-items: center;
  margin-bottom: 16px;

  h6 {
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    color: var(--black-two);
    margin-bottom: 0;

    &:first-child {
      color: var(--black-one);
      cursor: pointer;
    }
  }
}

.tdp_account_settings .offcanvas-body .menu-list .account-details-view h3 {
  font-weight: 700;
  font-size: 18px;
  line-height: 21px;
  color: var(--black-two);
  margin-bottom: 12px;
}

.tdp_account_settings .offcanvas-body .menu-list .account-details-view .c_form {
  display: flex;
  width: 100%;
  gap: 12px;
  margin-bottom: 16px;
}

.tdp_account_settings
  .offcanvas-body
  .menu-list
  .account-details-view
  .c_form
  div {
  width: 100%;

  label {
    margin-bottom: 8px;
    color: var(--black-one);
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
  }

  input {
    background-color: var(--gray-six);
    border: 1px solid var(--gray-three) !important;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    color: var(--black-one);
  }
}

.tdp_account_settings
  .offcanvas-body
  .menu-list
  .account-details-view
  .delete-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;

  button {
    background: none;
    border: none;
    color: var(--black-two);
    width: fit-content;
    padding: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    align-items: center;
    display: flex;
    gap: 10px;
    height: fit-content;
  }
}

.tdp_account_settings
  .offcanvas-body
  .menu-list
  .account-details-view.organization
  hr {
  margin: 24px 0;
  border-color: var(--gray-three);
  opacity: 1;
}

.tdp_account_settings .offcanvas-body.delete-screens {
  padding: 40px 100px;
}

.tdp_account_settings .offcanvas-body.delete-screens .delete-icon-wrapper {
  background-color: var(--td-orange);
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 6px;
  border-radius: 50%;
  margin-bottom: 24px;

  svg {
    width: 36px;
    height: 36px;
    path {
      fill: var(--black-two);
    }
  }
}

.tdp_account_settings .offcanvas-body.delete-screens :where(h3, h5) {
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
  color: var(--black-two);
  margin-bottom: 4px;
}

.tdp_account_settings .offcanvas-body.delete-screens h5 {
  font-size: 18px;
  line-height: 27px;
  margin-bottom: 16px;
}

.tdp_account_settings .offcanvas-body.delete-screens p {
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
  color: var(--black-one);
  margin-bottom: 24px;
}

.tdp_account_settings .offcanvas-body.delete-screens button {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  margin-bottom: 12px;

  &:last-child {
    font-weight: 400;
  }
}

.tdp_account_settings .offcanvas-body.delete-screens ul {
  list-style: none;
  padding: 0;
  margin-bottom: 24px;

  li {
    color: var(--black-one);
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 7px;
    margin-left: 5px;

    svg {
      position: relative;
      path {
        fill: var(--black-one);
      }
    }
  }
}

.tdp_account_settings .offcanvas-body.delete-screens h6 {
  margin-top: 24px;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  color: var(--black-one);

  a {
    color: var(--td-orange);
    text-decoration: none;
  }
}

.tdp_not_found_page {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;

  .flex {
    align-items: center;

    h1 {
      font-size: 4rem;
      font-weight: 700;
    }

    p {
      font-size: 18px;
      font-weight: 400;
      width: 50%;
    }

    a {
      background: var(--black-two);
      color: var(--white);
      text-decoration: none;
      padding: 8px 20px;
      border-radius: 10px;
      margin-top: 24px;
      display: block;
      width: fit-content;
      font-size: 14px;
    }
  }
}

.tdp_payouts {
  .action-row-button {
    background-color: var(--white) !important;
    border: 2px solid var(--black-two) !important;
    color: var(--black-two) !important;
  }

  table tbody tr td span.invoices {
    text-decoration: underline;
  }
}

.tdp_offcanvas.payout-details .offcanvas-body.info-container .information-view {
  width: 100%;
  padding: 40px;
}

.tdp_offcanvas.payout-details .offcanvas-body .heading .info p:last-child {
  color: var(--black-one);
  font-size: 14px;
  font-weight: 400;
  line-height: 16px;

  span {
    color: var(--black-two);
    font-weight: 500;
  }
}

.tdp_offcanvas.payout-details
  .offcanvas-body.info-container
  .information-view
  .info-box
  .info-body
  .invoices
  tr
  td
  span {
  color: var(--black-two);
  font-weight: 500;
}

.tdp_offcanvas.distributor-delivery
  .offcanvas-body.distributor-delivery-body
  h5 {
  color: var(--black-two);
  font-weight: 700;
  font-size: 18px;
  line-height: 21px;
  margin-bottom: 19.5px;
}

.tdp_offcanvas.distributor-delivery
  .offcanvas-body.distributor-delivery-body
  .item-container {
  border: 1px solid var(--gray-three);
  background-color: var(--gray-four);
  padding: 12px 14px;
  border-radius: 8px;
  height: 150px;
  margin-bottom: 16px;
}

.tdp_offcanvas.distributor-delivery
  .offcanvas-body.distributor-delivery-body
  .item-container
  .product-detail {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;

  img {
    width: 44px;
    height: 44px;
  }

  h6 {
    color: var(--black-two);
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    text-transform: uppercase;
    margin-bottom: 0;
  }
}

.tdp_offcanvas.distributor-delivery
  .offcanvas-body.distributor-delivery-body
  .item-container
  .quantity-detail {
  h6 {
    color: var(--black-one);
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    margin-bottom: 8px;
  }

  .custom_counter .plus_minus_controller {
    width: 100%;
    height: 40px;

    input {
      width: 89%;
    }
  }
}

.customer-portal-table.sales-order-table tbody tr td:last-child {
  text-align: end;
  padding-right: 40px;

  .dropdown-menu {
    padding: 8px 4px;

    li {
      display: flex;
      align-items: center;
      font-size: 13px;
      font-weight: 400;
      padding: 4px 6px;

      &:hover {
        background-color: var(--gray-six);
        border-radius: 4px;
      }

      svg {
        width: 20px;
      }

      a {
        padding: 0;
        &:hover {
          background: none;
        }
        &:focus {
          color: initial;
        }
      }
    }
  }
}