.tabs {
  font-family: Arial, sans-serif;
  width: 100%;
}

.tab-list {
  list-style: none;
  display: flex;
  padding: 0;
  margin: 0;
  border-radius: 10px 10px 0 0; /* Rounded top corners of the tab container */
  overflow: hidden;
  width: 100%; /* Ensure the tab list stretches across the entire container */
}

.tab-item {
  padding: 10px 20px;
  cursor: pointer;
  background-color: #fff;
  border-right: 1px solid #ccc; /* Optional border between tabs */
  transition: background-color 0.3s ease-in-out;
  border-radius: 10px 10px 0 0; /* Rounded top corners for each tab */
  border-bottom: none;
  font-weight: bold;
  flex: 1; /* Allow tabs to expand and take equal space on smaller screens */
  text-align: center;
}

.tab-item:last-child {
  border-right: none; /* Removes the border from the last tab */
}

.tab-item.active {
  background-color: #DAEEF4;
  border-bottom: 1px solid #408EA4;
  z-index: 1; /* Ensures active tab is above others */
}

.tab-content#tab-1 {
  position: relative !important;
  overflow: hidden !important;
  min-height: 800px !important;  /* Ensure a minimum height for the entire tab content area */
  padding-top: 1px !important;
  padding-left: 0px !important;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  overflow-y: auto !important;
}

.tab-content#tab-2 {
  position: relative !important;
  overflow: hidden !important;
  min-height: 2000px !important;  /* Ensure a minimum height for the entire tab content area */
  padding-top: 1px !important;
  padding-left: 0px !important;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}

.tab-content::-webkit-scrollbar {
  width: 0px;
}

.tab-content::-webkit-scrollbar-thumb{
  background-color: transparent;
}

.tab-panel {
  display: none;
  padding: 20px 0px 20px 0px;
  background-color: #fff;
  border-top: 1px solid #DAEEF4;
}

/* Tab 2 content active state */
.tab-panel.active {
  display: block;
  animation: fadeIn 0.3s ease-in-out;
  margin-top: 0px;
  padding: 20px 0px 20px 0px;
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .tab-list {
      flex-direction: row; /* Ensure the tabs stay in a row (side by side) */
      width: 100%; /* Full width of the container */
  }

  .tab-item {
      width: auto; /* Allow tabs to expand side by side */
      padding: 10px 15px; /* Adjust padding for mobile screens */
      text-align: center; /* Keep text centered */
      border-right: 1px solid #ccc; /* Border between tabs */
      border-bottom: none; /* No bottom border for tabs */
  }

  .tab-item:last-child {
      border-right: none; /* Remove border from the last tab */
  }
}

/* Adjust tabs for larger screens (greater than 768px) */
@media (min-width: 769px) {
  .tab-list {
      flex-direction: row; /* Keep the tabs in a row layout on larger screens */
  }

  .tab-item {
      flex: none; /* Prevent the tabs from expanding to fill the width */
      padding: 10px 20px; /* Adjust padding to the original values */
      text-align: center; /* Keep the text centered */
      border-right: 1px solid #ccc; /* Optional border between tabs */
      width: auto; /* Prevent the tabs from stretching */
  }

  .tab-item:last-child {
      border-right: none; /* Remove border from the last tab */
  }
}


@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.submit-btn {
  align-items: center  !important;
}

.submit-icon {
  margin-right: 10px !important; /* Space between image and text */
}

 @media (max-width: 767px){
  #searchBtn {
      width: 50% !important;
  }
 }