/* Gallery Search Bar and Filter Overrides */

/* Gallery-specific search input styling */
#gallery-search-input {
  max-width: none !important; /* Remove max-width restriction */
}

/* Ensure search bar uses Tailwind width classes properly */
#gallery-search-input.input-glass {
  width: 100% !important;
}

/* Gallery style filter dropdown - reduce width */
#gallery-style-filter {
  max-width: 240px !important; /* Restrict dropdown width */
}

/* Mobile responsive overrides */
@media (max-width: 640px) {
  #gallery-search-input,
  #gallery-style-filter {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Tablet responsive overrides */
@media (min-width: 641px) and (max-width: 1023px) {
  #gallery-search-input {
    width: 384px !important; /* sm:w-96 equivalent */
    max-width: 384px !important;
  }
  
  #gallery-style-filter {
    width: 224px !important; /* sm:w-56 equivalent */
    max-width: 224px !important;
  }
}

/* Desktop responsive overrides */
@media (min-width: 1024px) {
  #gallery-search-input {
    width: 500px !important; /* lg:w-[500px] */
    max-width: 500px !important;
  }
  
  #gallery-style-filter {
    width: 240px !important; /* lg:w-60 equivalent */
    max-width: 240px !important;
  }
}

/* Ensure dropdown options are readable */
#gallery-style-filter option {
  padding: 8px 12px !important;
  font-size: 0.875rem !important;
}