.santabbox {display: flex;margin: 20px 0;}
.santabbox .tabs {width: 300px;background: #fff;border-radius: 6px;border: 1px solid #1B21311A; height: 132px}
.santabbox .tabs button {display: flex;justify-content: space-between;align-items: center;width: 100%;padding: 0px 33px;border: none;background: #fff;cursor: pointer;text-align: left;height: 65px;}
.santabbox .tabs button.active {background: #E0F5FF;color: #1A4AB9;}
.santabbox .tabs button.active svg path{stroke:#1A4AB9; }
.santabbox .tab-content {flex-grow: 1;}
.santabbox .content {display: none;}
.santabbox .content.active {display: block;}
.personal-info {margin-bottom: 0px;padding-top: 5px;padding-left: 33px;}
.personal-info h2{ font-size:32px; color:#1B2131F2; margin-bottom: 28px}
.tracksearch {position: relative;width: 74%;height: 57px;margin-bottom: 48px}
.tracksearch #searchBox, .tracksearch #searchBox2 {height: 57px;border: 1px solid #1B21311A;border-radius: 32px;color: #1B2131;width: 100%; padding-left: 20px;}
.tracksearch .search-icon {width: 44px;height: 44px;position: absolute;top: 6px;right: 6px}
.downloadall {display: flex;justify-content: flex-end;font-size: 14px;color: #1B2131E6; padding-top: 10px}
.downloadall:hover {color: #1A4AB9}
.santabbox table {width: 100%;border-collapse: collapse;margin-top: 10px;border: 1px solid #ddd;}
.santabbox table, .santabbox th, .santabbox td {text-align: center;padding: 8px;font-size: 14px;}
.santabbox td {height: 40px;line-height: 40px;border-bottom: 1px solid #ccc;}
.santabbox th {background-color: #1A4AB9;height: 40px;line-height: 40px;color: #fff;}
.santabbox thead tr th:first-child {border-top-left-radius: 6px;}
.santabbox thead tr th:last-child {border-top-right-radius: 6px;}
.downicon {padding: 10px;display: flex;justify-content: center;}
.desktopimg{display: block;}
.mobileimg{display: none;}


 .tracking-detail {
  padding: 3rem 0;
}

#tracking {
  margin-bottom: 1rem;
}
[class*="tracking-status-"] p {
  margin: 0;
  font-size: 1.1rem;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
}
[class*="tracking-status-"] {
  padding: 1.6rem 0;
}

.tracking-item {
  border-left: 1px dashed #00B868;
  position: relative;
  padding: 0rem 1.5rem 20px 23px;
  font-size: 0.9rem;
  margin-left: 20px;
  min-height: 5rem;
}
.tracking-item:nth-child(1){padding-top: 0px;}
.tracking-item:last-child {
  padding-bottom: 0;
    border: 0;}
.tracking-item .tracking-date {
  margin-bottom: 0.5rem;
}
.tracking-item .tracking-date span {
  color: #888;
  font-size: 85%;
  padding-left: 0.4rem;
}
.tracking-item .tracking-content {
  padding: 0.5rem 0.8rem;
  background-color: #f4f4f4;
  border-radius: 0.5rem;
}
.tracking-content h6{font-size: 16px; margin: 0px; color: #1B2131; line-height: 16px}
.tracking-content p{font-size: 14px; color: #1B2131E6; font-weight: normal;
    font-family: 'Circular Std Book'; line-height: 20px}
.tracking-item .tracking-content span {
  display: block;
  color: #1B2131B3;
  font-size: 14px;
      font-weight: normal;
    font-family: 'Circular Std Book';
}
.tracking-item .tracking-icon {
  position: absolute;
  left: -9px;
  width: 16px;
  height: 16px;
  text-align: center;
  border-radius: 50%;
  background-color: #fff;
  color: #fff;
}

.tracking-item-pending {
  border-left: 1px dashed #fff;
  position: relative;
  padding: 2rem 1.5rem 26px 23px;
  font-size: 0.9rem;
  margin-left: 3rem;
  min-height: 5rem;
}
.tracking-item-pending:last-child {
  padding-bottom: 4rem;
}
.tracking-item-pending .tracking-date {
  margin-bottom: 0.5rem;
}
.tracking-item-pending .tracking-date span {
  color: #888;
  font-size: 85%;
  padding-left: 0.4rem;
}
.tracking-item-pending .tracking-content {
  padding: 0.5rem 0.8rem;
  background-color: #f4f4f4;
  border-radius: 0.5rem;
}
.tracking-item-pending .tracking-content span {
  display: block;
    color: #1B2131B3;
    font-size: 14px;
    font-weight: normal;
    font-family: 'Circular Std Book';
}
.tracking-item-pending .tracking-icon {
  line-height: 2.6rem;
  position: absolute;
  left: -9px;
    width: 16px;
    height: 16px;
  text-align: center;
  border-radius: 50%;
  font-size: 1.1rem;
  color: #d6d6d6;
}
.tracking-item-pending .tracking-content {
  font-weight: 600;
  font-size: 17px;
}

.tracking-item .tracking-icon.status-current {
  width: 16px;
  height: 10px;
  left: -10px;
}
.tracking-item .tracking-icon.status-intransit {
  color: #00ba0d;
  font-size: 0.6rem;
}
.tracking-item .tracking-icon.status-current {
  color: #00ba0d;
  font-size: 0.6rem;
}

.trackbanner{padding-bottom: 43px}


@media (min-width: 992px) {
  
  .tracking-item .tracking-date {
    position: absolute;
    left: -10rem;
    width: 7.5rem;
    text-align: right;
  }
  .tracking-item .tracking-date span {
    display: block;
  }
  .tracking-item .tracking-content {
    padding: 0;
    background-color: transparent;
  }

  .tracking-item-pending {
    margin-left: 20px;
    padding-top: 0px;
    padding-bottom: 20px;

  }
  .tracking-item-pending .tracking-date {
    position: absolute;
    left: -10rem;
    width: 7.5rem;
    text-align: right;
  }
  .tracking-item-pending .tracking-date span {
    display: block;
  }
  .tracking-item-pending .tracking-content {
    padding: 0;
    background-color: transparent;
  }
}

.tracking-item .tracking-content {
  font-weight: 600;
  font-size: 17px;
}
.modal {
            display: none;
            position: fixed;
            z-index: 9;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
        }

        .modal-content {
            background-color: white;
            margin: 15% auto;
            padding: 20px;
            border-radius: 8px;
            width: 300px;
            text-align: center;
            position: relative;
        }

        .close {
            position: absolute;
            top: 10px;
            right: 15px;
            font-size: 20px;
            cursor: pointer;
        }

  .mobilehead{display: none;} 
   .ordersuntackbox .group{display: flex; justify-content: space-between;}   
  .ordersuntackbox .group .form-div{width: 35%} 
  .ordersuntackbox .group .form-div input{width: 100%; font-size: 16px; line-height: 22px; padding: 8px 19px; background-color: transparent; border: 1px solid #1b2131CC; font-family: 'Circular Std Book'; margin:0px;} 
   .ordersuntackbox .group .form-div .submit-button{width: 100%;font-size: 16px;line-height: 22px;padding: 8px 19px;background-color: #1a4ab9;border: 1px solid #1a4ab9;font-family: 'Circular Std Book';margin: 0px;cursor: pointer;color: #fff;}
  .ordersuntackbox .group .form-div:nth-child(3){width: 20%}

.tracking-list{padding-top: 10px}
.table-container {
            display: none; 
        }
#trackInglist2 {
    display: none;
}
.downloadall{padding-top: 10px}
.tracking-item.cancelled .tracking-icon.status-intransit{color:#a4aba2}
#orderError, #emailError, #orderError2, #emailError2{font-size: 12px; color: red;}
        @media screen and (max-width:767px){
            .santabbox, .searchBox2{width: 100%; flex-direction: column;}
            .santabbox .tabs, .searchBox2 .tabs{width: 100%;height: auto;display: flex;align-items: center;justify-content: space-around;border: 0;background: #fff;}
            .santabbox .tab-content, .santabbox2 .tab-content{width: 100%;}
             .santabbox .tabs button, .santabbox2 .tabs button{padding: 0;width: 50%;height: auto;text-align: center;display: block;border-bottom: 2px solid #fff;}
            .santabbox .tabs button span, .santabbox2 .tabs button span{display: none;}
            .santabbox .tabs button.active, .santabbox2 .tabs button.active{background: #fff;border-bottom: 2px solid #1A4AB9;}
            .personal-info h2 { display: none;}
              h2.mobilehead{font-size: 18px;color: #1B2131F2; display: block;} 
            .personal-info {
    margin-bottom: 24px;
    padding-top: 0px;
    padding-left: 0px;
}
.tracksearch {
    position: relative;
    width: 100%;
    height: 40px;
    margin-bottom: 48px;
    margin-top: 25px;
}
.tracksearch #searchBox, .tracksearch #searchBox2{height: 40px;font-size: 12px;padding-left: 10px;}
.tracksearch .search-icon {
    width: 24px;
    height: 24px;
    position: absolute;
    top: 8px;
    right:8px;
}
.tracksearch .search-icon svg{width: 24px; height: 24px}
.tracking-item .tracking-content, .tracking-item-pending .tracking-content{background-color: #fff !important; padding-top: 0}
.tracking-item-pending .tracking-icon{left: -38px!important;}
.tracking-item-pending{padding-top: 0px!important;padding-left: 0px;}

#orderTable {
    width: 100%;
    border-collapse: collapse;
    table-layout: auto; /* Allows columns to adjust based on content */
}
.table-container {
        overflow-x: auto;
        width: 100%;
    }

#orderTable th,
#orderTable td {
    white-space: nowrap; /* Prevents text from wrapping */
    padding: 8px;
    text-align: left;
    height: auto;
    line-height: inherit;
}

#orderTable thead th {
    width: auto; /* Allows headers to adjust */
}

#orderTable tbody td {
    width: auto; /* Ensures content fits dynamically */
}

#orderTable th:last-child,
#orderTable td:last-child {
    position: sticky;
    right: 0;
    background: #fff; /* Ensures text visibility */
    z-index: 2;
    height: 44px;
}

#orderTable th:last-child, #orderTable thead tr {
    background: #1A4AB9;
}

.desktopimg{display: none;}
.mobileimg{display: block;}
.trackbanner {
    padding-bottom: 0px;
}
.ordersuntackbox .group{flex-direction: column; padding-top: 20px}
.ordersuntackbox .group .form-div, .ordersuntackbox .group .form-div:nth-child(3){width: 100%}
#email_id1, #email_id{margin: 10px 0px}


        }