.theme-gold th {
  /*color: #2f2f2f !important;*/
}

.UserReservationsTable {
  --anim: 1s linear infinite;
}
.UserReservationsTable th {
  border: 0px !important;
  background: transparent;
}
.UserReservationsTable tr:first-of-type {
/*  background: var(--app-blue);
*/  --radius: 3px;
}
.UserReservationsTable tr:first-of-type th:first-of-type {
  border-radius: var(--radius) 0 0 var(--radius);
}
.UserReservationsTable tr:first-of-type th:last-of-type {
  border-radius: 0 var(--radius) var(--radius) 0;
}
.UserReservationsTable th {
  color: white;
  color: var(--theme-text-color);
}
.UserReservationsTable td {
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.7rem;
}
.UserReservationsTable tr {
  max-height: 50px !important;
  height: 50px !important;
  overflow: hidden;
}
    .UserReservationsTable tr:first-of-type {
    }

.UserReservationsTable td:nth-of-type(1) {
  min-width: 30px;
  max-width: 30px;

}
.UserReservationsTable td:nth-of-type(2) {
  min-width: 90px;
  max-width: 90px;
}
.UserReservationsTable td:nth-of-type(7) {
  padding: 0px;
  width: 130px;
  min-width: 130px;
}
.UserReservationsTable td:nth-of-type(8) {
  padding: 0px;
  width: 140px;
  min-width: 145px;
}
.UserReservationsTable td:nth-of-type(10) {
  padding: 0px;
  width: 140px;
  min-width: 140px;
}
.UserReservationsTable td:nth-of-type(10) .status {
  width: 100%;
  max-width: 100%;
  display: flex;
  align-items: center;
  max-height: 30px;
  color: #757575a9;
}
.UserReservationsTable td:nth-of-type(10) .status .bi-box-seam {
  font-size: 1.2rem;
}
.UserReservationsTable td:nth-of-type(10) .status svg {
  width: 20px;
}
.UserReservationsTable td:nth-of-type(10) .status .bi-geo-alt-fill {
  font-size: 1rem;
}
.UserReservationsTable td:nth-of-type(10) .status .status-dots {
  margin-inline: -11px;
}
.UserReservationsTable td:nth-of-type(11) {
  display: table-cell;
}
.UserReservationsTable label {
  color: #fafafa;
  border: none;
  height: 80%;
  min-height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 3px;
  gap: 5px;
  font-size: 0.8rem;
  padding-inline: 5px;
  border: 1px solid rgba(144, 144, 144, 0.3921568627);
}
.UserReservationsTable .expired {
  pointer-events: none;
  color: rgba(134, 134, 134, 0.7450980392);
}
.UserReservationsTable .expired label {
  cursor: not-allowed;
  background: #a3a3a3;
}
.UserReservationsTable .canceled {
  /*color: #f23131;*/
  color: rgba(134, 134, 134, 0.7450980392);
  cursor: not-allowed;
  pointer-events: none;
}
.UserReservationsTable .canceled label {
  background: #a3a3a3;
}
.UserReservationsTable .pending {
  color: rgb(120, 255, 122);
  color: var(--app-blue);
}
.UserReservationsTable .completed {
  color: #285aff;
  pointer-events: none;
}
.UserReservationsTable .started, .UserReservationsTable .pending {
  color: #30b3ff;
}
.UserReservationsTable .started:hover, .UserReservationsTable .pending:hover {
  background: var(--app-blue);
  color: white !important ;
}

.theme-light .started, .theme-light .pending {
  color: var(--app-blue) !important;
}

.preparing div:nth-child(1) i {
  animation: status-selected var(--anim);
  color: var(--app-blue);
}

.shipping div:nth-child(1) i {
  color: var(--status-color);
}

.shipping .status-dots:nth-child(2) i {
  color: var(--status-color) !important;
}

.shipping div:nth-child(3) svg {
  animation: status-selected-svg 1s linear infinite;
  color: var(--status-color);
  fill: var(--app-blue);
}

.received div:nth-child(3) i {
  color: var(--status-color);
}

.received div:nth-child(1) i {
  color: var(--status-color);
}

.received i, .received svg {
  color: var(--status-color) !important;
  color: #86fb94 !important;
}

@keyframes status-selected {
  0% {
    transform: scale(1) translateY(0px);
  }
  50% {
    transform: scale(1.15) translateY(0px);
  }
  100% {
    transform: scale(1) translateY(0px);
  }
}
@keyframes status-selected-svg {
  0% {
    transform: scale(1) translateY(0px);
  }
  50% {
    transform: scale(1.15) translateY(0px);
  }
  100% {
    transform: scale(1) translateY(0px);
  }
}
.selector {
  height: 100% !important;
  width: 33%;
  position: absolute;
  transform: scale(0.8);
  border-radius: 25%;
  display: flex;
  justify-content: center;
  border: 0px !important;
}

.selector i {
  margin-top: -16px;
  color: var(--theme-text-color);
}

.none .selector {
  display: none;
}

.preparing .selector {
  left: 0%;
}

.shipping .selector {
  left: 34.6%;
}

.received .selector {
  left: 67.4%;
}