/* Mobile-focused overrides and polish for search.html */
.category-bubble, .subcategory-bubble { border: 1px solid var(--border-color) !important; }
.sidebar h3::before, .category-section h3::before { content: '' !important; }

/* Hide category bubbles and show dropdown filters on mobile */
.mobile-filters { display: none; }
.mobile-filters .mobile-filter-group { margin: 0.5rem 0; }
.mobile-filters label { display: block; font-weight: 600; margin-bottom: 0.25rem; }
.mobile-filters select { width: 100%; padding: 0.75rem 0.9rem; border: 2px solid var(--border-color); border-radius: 8px; font-size: 1rem; background: var(--surface-color); }

@media (max-width: 768px) {
  .search-bar-container { position: sticky; top: 0; z-index: 50; background: var(--surface-color); padding-top: 0.25rem; }
  .mobile-filters { display: block; margin: 0 1rem 1rem; }
  .categories-container { display: none !important; }

  .main-container { padding: 1rem 0.75rem 5.5rem; }
  .content-area { padding: 1.5rem; border-radius: 18px; box-shadow: var(--shadow-sm); }
  .page-title { font-size: 1.6rem; }

  .listings-header { gap: 1.25rem; }
  .listings-header-top { width: 100%; flex-direction: column; align-items: flex-start; gap: 0.65rem; }
  .listings-header-top h2 { font-size: 1.6rem; }
  .listings-header-actions { width: 100%; flex-direction: column; align-items: stretch; gap: 0.75rem; }

  .view-toggle { width: 100%; justify-content: space-between; padding: 4px; }
  .view-toggle-button { flex: 1; justify-content: center; padding: 0.65rem 0.5rem; font-size: 0.95rem; }
  .view-toggle-button svg { width: 20px; height: 20px; }

  .search-alert-button { width: 100%; justify-content: center; padding: 0.8rem 1rem; font-size: 0.95rem; }
  .search-alert-button svg { width: 22px; height: 22px; }

  .ad-type-switcher { width: 100%; padding: 6px; gap: 0.35rem; }
  .switcher-option { flex: 1; padding: 0.65rem 0.75rem; font-size: 0.9rem; }

  .listings-grid { grid-template-columns: 1fr; gap: 1rem; }
  .listings-grid.list-view { gap: 1rem; }
  .listings-grid.list-view .listing { flex-direction: column; }
  .listings-grid.list-view .listing-card-content { padding: 1rem 1.1rem 1.25rem; }

  .listing { border-radius: 14px; }
  .listing-card-with-image { flex-direction: column; }
  .listing-card-image { height: 210px; }
  .listing-card-title { font-size: 1rem; }
  .ad-description { -webkit-line-clamp: 4; }
  .ad-details { flex-direction: column; align-items: flex-start; gap: 0.35rem; }

  .favorite-toggle { width: 42px; height: 42px; top: 10px; right: 10px; }
  .favorite-toggle svg { width: 20px; height: 20px; }
}

@media (max-width: 576px) {
  .search-icon { display: block; width: 22px; height: 22px; margin-left: 0.9rem; color: var(--text-muted); }
  .search-input { padding-left: 2.75rem; }
  .clear-search-btn { right: 0.5rem; }

  .content-area { padding: 1.25rem 1rem; border-radius: 16px; }
  .page-title { font-size: 1.45rem; }

  .listings-header-top h2 { font-size: 1.45rem; }
  .view-toggle { gap: 0.4rem; }
  .view-toggle-button { font-size: 0.9rem; padding: 0.6rem 0.4rem; }
  .search-alert-button { padding: 0.7rem 0.85rem; font-size: 0.9rem; }

  .ad-type-switcher { padding: 6px 5px; }
  .switcher-option { padding: 0.6rem 0.5rem; font-size: 0.85rem; }

  .listing-card-image { height: 180px; }
  .listing-card-content { padding: 0.9rem; }
  .listing-card-title { font-size: 0.95rem; }
  .ad-description { font-size: 0.9rem; }

  .favorite-toggle { width: 38px; height: 38px; top: 8px; right: 8px; }
  .favorite-toggle svg { width: 18px; height: 18px; }
}