.track-modal {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 100001;
  justify-content: center;
  align-items: center;
}

.track-modal:after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 100000;
  background: rgba(0, 0, 0, 0.5);
}

.track-modal .information {
  max-width: 800px;
  width: 100%;
  background-color: #fff;
  border-radius: 6px;
  position: relative;
  z-index: inherit;
  max-height: 85%;
  height: 100%;
}

.track-modal .close-modal {
  color: #fff;
  display: block;
  padding: 10px;
  position: absolute;
  right: 10px;
  top: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 20px;
  height: 20px;
  opacity: 0.5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3C!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath fill='%23000' d='M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z'/%3E%3C/svg%3E");
  transition: opacity 0.3s ease-in-out;
}



.track-modal .track-title {
  text-align: center;
  font-size: 24px;
  color: #000;
  font-weight: 600;
  margin: 0;
  padding: 16px;
  border-bottom: 1px solid #ccc;
}

.track-modal .information .content {
  text-align: center;
  padding: 8px;
}

.track-modal .information .content .reference {
  padding: 10px;
  text-align: left;
  font-weight: Normal;
  font-style: normal;
  color: #dd9933;
  font-weight: bolder;
  font-size: 17.6px;
}

.track-modal .information .content .reference .reference-badge {
  color: #fff;
  background-color: #dc3545;
  border-radius: 6px;
  padding: 0 7.4px;
  height: 26px;
  line-height: normal;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.track-modal .information .content table tr {
  border-top: 1px solid #dee2e6;
}

.track-modal .information.block__invalid-id button[disabled],
#track-shipment button[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.track-modal .information .content table td,
.track-modal .information .content table th {
  text-align: left;
  font-size: 16px;
  padding: 12px;
  line-height: 1.9;
  border: 0;
}

.track-modal .information .content table.table-striped tbody tr:nth-child(2n-1) {
  background-color: #0000000d;
}

.track-modal .information .content {
  max-height: calc(100% - 62px);
  overflow: hidden;
  overflow-y: auto;
  scrollbar-color: var(--e-global-color-primary) #dee2e6;
  scrollbar-width: thin;
}

.track-modal .information .content::-webkit-scrollbar {
  width: 6px;
}

.track-modal .information .content::-webkit-scrollbar-thumb {
  background-color: var(--e-global-color-primary);
}

.track-modal .information .content::-webkit-scrollbar-track {
  background-color: #dee2e6;
}

.track-modal .information .content table.table-striped tbody td:nth-child(3) {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  column-gap: 10px;
}

.track-modal .information .content table td span[data-class="Out-on-Delivery"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3C!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath fill='%23ff6b6b' d='M112 0C85.5 0 64 21.5 64 48V96H16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 272c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 48c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 240c8.8 0 16 7.2 16 16s-7.2 16-16 16H64 16c-8.8 0-16 7.2-16 16s7.2 16 16 16H64 208c8.8 0 16 7.2 16 16s-7.2 16-16 16H64V416c0 53 43 96 96 96s96-43 96-96H384c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V288 256 237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zM544 237.3V256H416V160h50.7L544 237.3zM160 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96zm272 48a48 48 0 1 1 96 0 48 48 0 1 1 -96 0z'/%3E%3C/svg%3E");
}

.track-modal .information .content table td span[data-class="Scan-into-branch"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3C!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath fill='%23ff6b6b' d='M24 32C10.7 32 0 42.7 0 56V456c0 13.3 10.7 24 24 24H40c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24H24zm88 0c-8.8 0-16 7.2-16 16V464c0 8.8 7.2 16 16 16s16-7.2 16-16V48c0-8.8-7.2-16-16-16zm72 0c-13.3 0-24 10.7-24 24V456c0 13.3 10.7 24 24 24h16c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24H184zm96 0c-13.3 0-24 10.7-24 24V456c0 13.3 10.7 24 24 24h16c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24H280zM448 56V456c0 13.3 10.7 24 24 24h16c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24H472c-13.3 0-24 10.7-24 24zm-64-8V464c0 8.8 7.2 16 16 16s16-7.2 16-16V48c0-8.8-7.2-16-16-16s-16 7.2-16 16z'/%3E%3C/svg%3E");
}

.track-modal .information .content table td span[data-class="POD-created"],
.track-modal .information .content table td span[data-class="Created-waybill"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'%3E%3C!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath fill='%23ff6b6b' d='M0 64C0 28.7 28.7 0 64 0H224V128c0 17.7 14.3 32 32 32H384V285.7l-86.8 86.8c-10.3 10.3-17.5 23.1-21 37.2l-18.7 74.9c-2.3 9.2-1.8 18.8 1.3 27.5H64c-35.3 0-64-28.7-64-64V64zm384 64H256V0L384 128zM549.8 235.7l14.4 14.4c15.6 15.6 15.6 40.9 0 56.6l-29.4 29.4-71-71 29.4-29.4c15.6-15.6 40.9-15.6 56.6 0zM311.9 417L441.1 287.8l71 71L382.9 487.9c-4.1 4.1-9.2 7-14.9 8.4l-60.1 15c-5.5 1.4-11.2-.2-15.2-4.2s-5.6-9.7-4.2-15.2l15-60.1c1.4-5.6 4.3-10.8 8.4-14.9z'/%3E%3C/svg%3E");
}

.track-modal .information .content table td span {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3C!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath fill='%23ff6b6b' d='M48 0C21.5 0 0 21.5 0 48V368c0 26.5 21.5 48 48 48H64c0 53 43 96 96 96s96-43 96-96H384c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V288 256 237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H48zM416 160h50.7L544 237.3V256H416V160zM112 416a48 48 0 1 1 96 0 48 48 0 1 1 -96 0zm368-48a48 48 0 1 1 0 96 48 48 0 1 1 0-96z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  display: block;
  width: 20px;
  height: 20px;
}

.track-modal .information .content table.pod-info th,
.track-modal .information .content table.pod-info td,
.track-modal .information .content table.pod-info tr {
  background-color: #fff;
}

.track-modal .information .content #POD-information {
  margin-top: 40px;
}

.track-modal .information .content #POD-information .reference {
  margin-bottom: 0;
}

.track-modal .information .content #POD-information .pod-info {
  text-align: left;
  margin-bottom: 40px;
}

.track-modal .information .content #POD-information .modal-comment {
  text-align: left;
}

.track-modal .information .content #POD-information .modal-comment p:not(.reference) {
  padding: 0 12px 12px;
}

.track-modal .information.block__invalid-id {
  height: auto;
}

.track-modal .information.block__invalid-id .reference-number {
  color: #ff0000;
  font-weight: 700;
  margin-bottom: 0;
  font-family: 'Roboto',
    Helvetica,
    Arial,
    Lucida,
    sans-serif;
  padding: 16px;
}

.track-modal .information.block__invalid-id .cv-spinner {
  margin: 20px 0;
}

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100000;
  width: 100%;
  height: 100%;
  display: block;
  background: rgba(0, 0, 0, 0.5);
}

.cv-spinner {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.spinner-track {
  width: 40px;
  height: 40px;
  border: 4px #ddd solid;
  border-top: 4px #ff0401 solid;
  border-radius: 50%;
  animation: sp-anime 2s infinite linear;
}

@keyframes sp-anime {
  100% {
    transform: rotate(360deg);
  }
}

.is-hide {
  display: none;
}

@media (hover: hover) {

  .track-modal .information .content table.pod-info th:hover,
  .track-modal .information .content table.pod-info td:hover,
  .track-modal .information .content table.pod-info tr:hover {
    background-color: #fff;
  }

  .track-modal .information.block__invalid-id button[disabled]:hover,
  #track-shipment button[disabled]:hover {
    text-decoration: none;
    color: var(--e-global-color-accent);
    background-color: var(--e-global-color-primary);
    border-style: none;
  }

  .track-modal .close-modal:hover {
    text-decoration: none;
    color: #fff;
    opacity: 1;
  }
}

@media(max-width: 991px) {
  .track-modal .information {
    max-width: 90%;
  }

  .track-modal .information .content table {
    min-width: 767px;
  }

  .track-modal .information .content #POD-information .pod-info {
    min-width: auto;
    width: 100%;
  }

  .track-modal .information .content .x-scroll {
    overflow: hidden;
    overflow-x: auto;
  }

  .track-modal .close-modal {
    right: -15px;
    top: -15px;
    background-size: 52%;
    font-size: 0px;
    background-color: #fff;
    border-radius: 50%;
    padding: 13px;
  }

}