/* ==========================================================================
   SEARCH COMPONENT
   Search box styles
   ========================================================================== */

.search-container {
  margin: 0 0 1.5rem 0;
  width: 100%;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.search-box {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  border: 2px solid #e2e8f0;
  border-radius: 0.75rem;
  background: #fff;
  color: #222;
  transition: border-color 0.2s, box-shadow 0.2s;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}

/* Accessibility: Focus indicator - Blue theme, no black outline */
.search-box:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
}

.search-box:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

.search-box:focus-visible {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
}

.search-box::placeholder {
  color: #6b7280;
}

/* Mobile responsive */
@media (max-width: 666px) {
  .search-container {
    width: 100%;
    margin: 0 auto 1rem;
    padding: 0;
  }

  .search-box {
    font-size: 16px !important; /* CRITICAL: Must be 16px to prevent iOS zoom */
    padding: 0.65rem 0.85rem;
  }
}