/* * {
  outline: 1px solid red !important;
} */
/* ===========================
   Mobile-first: Show mobile row, hide desktop row
   =========================== */
.sameday-desktop-only {
  display: none !important;
}

.sameday-mobile-only {
  display: table-row !important;
}
/* Bold table row border */
.sameday-mobile-only {
  border: 0.1rem solid #726d6d !important;
   
}

/* Optional: make all cells consistent */
.sameday-mobile-only td {
  width: 40%;
vertical-align: top;
 /* padding: 8px !important; */
  box-sizing: border-box;
  word-wrap: break-word;
}

/* ===========================
   Desktop view: Show desktop row, hide mobile row
   =========================== */
@media (min-width: 768px) {
  .sameday-desktop-only {
    display: table-row !important;
  }

  .sameday-mobile-only {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .mobile-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
  }
}
@media (max-width: 767px) {
  .hide-on-mobile {
    display: none !important;
  }
}

/* Slot container styling on mobile */
.slot-container1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  gap: 3px;
  width: 100%;
}

.slot-container1 .slot-list {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.slot-container1 .slot-link {

  font-size: 0.7rem !important;
  padding: 2px 4px !important;
  border-radius: 6px !important;
  background-color: #f0f0f0;
  border: 1px solid #ccc;
  color: #333;

  text-align: center !important;
}

/* Mobile view adjustments */
@media (max-width: 767px) {
  .slot-container1 {
    flex-direction: column;
    /* align-items: center !important; */
    gap: 1px;
    /* padding-left: 4px !important; */
  }

  .slot-container1 .slot-list {
    justify-content: center !important;
    width: 100%;
  }

  .slot-container1 .slot-link {
    font-size: 0.6rem !important;
    /* padding: 1px 2px !important; */
    border-radius: 4px !important;
    width: fit-content;
    max-width: 150px;
  }
 

  .slot-container1 ul {
    margin: 0 !important;
    margin-top: 7px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .slot-container1 li {
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
 .btn-calendar1 {
  font-size: 0.7rem !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  background-color: #ffffff;
  border: 1px solid #041958 !important;

  color: #233058 !important;
  text-align: center !important;
  font-size: 0.6rem !important;
    /* padding: 1px 2px !important; */
  border-radius: 4px !important;
  width: fit-content;
  max-width: 150px;


/* width: 100%;
font-size: 0.6rem !important;
border-radius: 4px !important;
color: #233058 !important;
width: fit-content;
width: 106px !important;
border-color: #233058;
padding-left: 0px !important;
margin-top: 3px !important;
margin-bottom: 3px !important;
margin-left: 0px !important; */
}
}




/* Mobile view adjustments */
@media (max-width: 420px) {
 .slot-container1 .slot-link {
    font-size: 0.5rem !important;
    /* padding: 1px 2px !important; */
    border-radius: 4px !important;
    width: fit-content;
    max-width: 130px;
  }
 
 .btn-calendar1 {
  font-size: 0.55rem !important;
  padding: 2px 6px !important;
  border-radius: 6px !important;
  background-color: #ffffff;
  border: 1px solid #041958 !important;
  color: #233058 !important;
  text-align: center !important;
  /* padding: 1px 2px !important; */
  border-radius: 4px !important;
  width: fit-content;
  max-width: 132px;

}
.no-availability-box {
    margin-bottom: 7px !important;
    font-size: 9px !important;     /* Smaller font */
    padding: 2px 2px !important;    /* Reduced padding */
    width: 80% !important;          /* Adjust width */
          /* Center on small screens */
  }

  .busi_name{
    font-size: 0.8rem !important;
  }
  .busi_name1{
    font-size: 0.7rem !important;
  }
   .td-left {
    width: 58% !important;
  }

  .td-right {
    width: 41% !important;
  }
}

.slot-container1 li {
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

 @media (max-width: 768px) {
  .hide-on-mobile {
    display: none;
  }
}
/* Hide "Try a different date" on mobile */
@media (max-width: 768px) {
  .hide-on-mobile {
    display: none;
  }

  .no-availability-box {
    margin-bottom: 7px !important;
    font-size: 9px !important;     /* Smaller font */
    padding: 2px 2px !important;    /* Reduced padding */
    width: 100% !important;          /* Adjust width */
          /* Center on small screens */
  }
}

/* 

.slot-list-wrapper {
  list-style: none !important;
  padding: 0 !important;
  display: flex ;
  gap: 6px !important;
  flex-wrap: wrap !important;
}


 */

/* Default order for desktop */
.header-date {
  order: 1;
}
.header-search {
  order: 2; /* normal order on desktop */
  flex: 1 1 220px;
  min-width: 250px;
  max-width: 450px;
}
.header-legend {
  order: 3;
}

/* For screen widths <= 900px: reorder */
@media (max-width: 900px) {
  .header-row {
    flex-direction: column;
    /* align-items: stretch; */
  }

  .header-date {
    order: 1;
  }

  .header-legend {
    order: 2;
  }

  .header-search {
    order: 3;
    width: 100% !important;
    flex: none !important;         /* ✅ cancel flex shrinking/growing */
    min-width: unset !important;   /* ✅ allow it to go below 250px */
    max-width: 100% !important;    /* ✅ use full available space */
    height: 36px;                  /* or whatever height you prefer */
    margin-top: 8px;
  }

 .header-search input {
    height: 100%;
    padding: 6px 30px;
    box-sizing: border-box;
  }

  .header-search .fa-search {
    font-size: 14px;
  }
}