/* ===========================
   Результати пошуку (/store/search/?keyword=…): шапка з полем пошуку, підказка категорії/бренду,
   чіпи категорій і брендів, наявність і сортування, «Показати ще». Картки — home.css.
   =========================== */
.sr { --sr-ink: #1f2133; --sr-muted: #8a8ea6; --sr-line: #eceef5; padding-bottom: 36px; }
.sr a { text-decoration: none; }
.sr a:hover { text-decoration: none; }
.sr a:focus-visible, .sr button:focus-visible, .sr input:focus-visible, .sr select:focus-visible { outline: 3px solid #667eea; outline-offset: 2px; border-radius: 10px; }

/* ---- шапка ---- */
.sr-hero { position: relative; overflow: hidden; color: #fff; background: linear-gradient(120deg, #667eea, #764ba2); }
.sr-hero::after { content: ''; position: absolute; right: -80px; top: -120px; width: 380px; height: 380px; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.sr-hero-in { position: relative; z-index: 1; padding-top: 28px; padding-bottom: 26px; }
.sr-crumbs { margin-bottom: 8px; font-size: 13px; opacity: .85; }
.sr-crumbs a { color: #fff; }
.sr-hero h1 { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-size: 38px; font-weight: 700; color: #fff; }
.sr-find { display: flex; align-items: center; gap: 10px; max-width: 760px; height: 56px; margin: 14px 0 0; padding: 0 8px 0 16px; border-radius: 16px; background: #fff; box-shadow: 0 10px 24px rgba(20, 10, 60, .2); }
.sr-find i { color: var(--sr-muted); }
.sr-find input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font: inherit; font-size: 17px; font-weight: 600; color: var(--sr-ink); }
.sr-find button { height: 42px; padding: 0 20px; border: 0; border-radius: 12px; background: #ffe066; color: #1f2133; font-weight: 900; font-size: 15px; cursor: pointer; }
.sr-count { margin: 12px 0 0; font-size: 15px; opacity: .92; }
.sr-count b { font-size: 17px; }

/* ---- підказка ---- */
.sr-sec { padding-top: 22px; }
.sr-sug { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 16px; align-items: center; margin-bottom: 16px; padding: 14px 18px; border-radius: 18px; background: linear-gradient(120deg, #fff8e1, #fff); border: 1px solid #f6e3b4; color: var(--sr-ink) !important; transition: box-shadow .2s ease; }
.sr-sug:hover { box-shadow: 0 10px 22px rgba(154, 101, 0, .12); }
.sr-sug-im { width: 64px; height: 64px; border-radius: 14px; overflow: hidden; background: #fff; display: grid; place-items: center; }
.sr-sug-im img { width: 100%; height: 100%; object-fit: contain; }
.sr-sug-mono { width: 100%; height: 100%; display: grid; place-items: center; color: #fff; font-family: Georgia, 'Times New Roman', serif; font-size: 28px; font-weight: 700; background: linear-gradient(135deg, #667eea, #764ba2); }
.sr-sug-t small { display: block; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #9a6500; }
.sr-sug-t b { display: block; font-size: 19px; }
.sr-sug-t em { font-style: normal; font-size: 14px; color: #6b6f86; }
.sr-sug-go { padding: 10px 16px; border-radius: 12px; font-weight: 800; color: #fff; background: linear-gradient(120deg, #667eea, #764ba2); white-space: nowrap; }

/* ---- чіпи ---- */
.sr-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; min-width: 0; }
.sr-bar-t { flex: 0 0 auto; font-size: 14px; font-weight: 800; color: #6b6f86; }
.sr-chips { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
.sr-chips--center { justify-content: center; }
.sr-chip { padding: 8px 14px; border-radius: 999px; background: #fff; border: 1px solid #e2e5f0; font-size: 14px; font-weight: 700; color: var(--sr-ink) !important; white-space: nowrap; transition: border-color .2s ease; }
.sr-chip:hover { border-color: #667eea; }
.sr-chip small { color: var(--sr-muted); }
.sr-chip--b { background: #f7f8ff; }
.sr-chip.is-on { color: #fff !important; border-color: transparent; background: linear-gradient(120deg, #667eea, #764ba2); }
.sr-chip.is-on small { color: rgba(255, 255, 255, .8); }

/* ---- наявність і сортування ---- */
.sr-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 14px 0 18px; padding: 10px 14px; border-radius: 14px; background: #fff; border: 1px solid var(--sr-line); }
.sr-toggle { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; color: var(--sr-ink) !important; }
.sr-toggle-sw { position: relative; width: 40px; height: 22px; border-radius: 999px; background: #c7cdf5; transition: background .2s ease; }
.sr-toggle-sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: left .2s ease; }
.sr-toggle-sw.is-on { background: linear-gradient(120deg, #667eea, #764ba2); }
.sr-toggle-sw.is-on::after { left: 21px; }
.sr-tools-count { margin-left: auto; font-size: 14px; color: var(--sr-muted); }
.sr-sort select { height: 40px; padding: 0 12px; border-radius: 10px; border: 1.5px solid #e2e5f0; background: #fff; font: inherit; font-weight: 600; color: var(--sr-ink); }

/* ---- «Показати ще» ---- */
.sr-more { display: grid; justify-items: center; gap: 8px; margin-top: 22px; }
.sr-more button { padding: 14px 30px; border: 0; border-radius: 999px; font: inherit; font-weight: 800; color: #fff; background: linear-gradient(120deg, #667eea, #764ba2); box-shadow: 0 8px 18px rgba(118, 75, 162, .3); cursor: pointer; }
.sr-more button:disabled { opacity: .6; cursor: wait; }
.sr-more small { font-size: 13px; color: var(--sr-muted); }

/* ---- порожньо ---- */
.sr-empty { display: grid; justify-items: center; gap: 12px; padding: 34px 20px; border-radius: 22px; background: #fff; border: 1px solid var(--sr-line); text-align: center; }
.sr-empty-ic { font-size: 48px; }
.sr-empty h2 { margin: 0; font-family: Georgia, 'Times New Roman', serif; font-size: 24px; color: var(--sr-ink); }
.sr-empty p { margin: 0; max-width: 56ch; color: #6b6f86; }
.sr-empty a:not(.sr-chip):not(.sr-empty-cta) { color: #4f5bd5; font-weight: 700; }
.sr-empty--soft { padding: 20px; }
.sr-empty-cta { padding: 12px 22px; border-radius: 12px; font-weight: 800; color: #fff !important; background: linear-gradient(120deg, #667eea, #764ba2); }

.sr-cart-note { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 9999; padding: 12px 20px; border-radius: 8px; background: rgba(40, 167, 69, .9); color: #fff; font-size: 14px; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .3s ease; }

/* ---- адаптив ---- */
@media (max-width: 991px) {
  .sr-hero-in { padding-top: 70px; }
}
@media (max-width: 575px) {
  .sr-hero-in { padding-top: 64px; padding-bottom: 20px; }
  .sr-hero h1 { font-size: 26px; }
  .sr-find { height: 52px; }
  .sr-find button { padding: 0 14px; }
  .sr-sug { grid-template-columns: 52px minmax(0, 1fr); }
  .sr-sug-im { width: 52px; height: 52px; }
  .sr-sug-go { grid-column: 1 / -1; text-align: center; }
  .sr-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .sr-chips::-webkit-scrollbar { display: none; }
  .sr-chips--center { flex-wrap: wrap; overflow: visible; }
  .sr-tools { flex-direction: column; align-items: stretch; }
  .sr-tools-count { margin-left: 0; }
  .sr-sort select { width: 100%; }
}

/* Запит виправлено через «Виправлення пошуку» (SearchFix) */
.sr-fixed { margin: 6px 0 0; font-size: 14px; opacity: .85; }
