/* Add this to your CSS file */
.no-scroll {
  overflow: hidden;
}

/* Default: column layout on small screens */
.custom-flex-layout {
  flex-direction: column;
}

/* From 1130px to 1600px, switch to column layout */
@media (min-width: 1130px) and (max-width: 1600px) {
  .custom-flex-layout {
    flex-direction: column !important;
  }

  .search-bar {
    margin-top: 20px;
  }
}

/* From 1600px and above, switch back to row layout */
@media (min-width: 1600px) {
  .custom-flex-layout {
    flex-direction: row !important;
    /* Row layout for large screens */
  }
}

/* Use Tailwind for small and medium screens */
@media (max-width: 1130px) {
  .custom-flex-layout {
    flex-direction: column !important;
    /* Column layout for small screens */
  }
}