.ts-sr {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* ── Suggestion dropdown ───────────────────────────────────────────────────────── */
form[data-site-search] { position: relative; }
.ts-kabuk { flex: 1 1 auto; min-width: 0; display: flex; }
.ts-kabuk > input { width: 100%; min-width: 0; }

.ts-liste {
  position: absolute; z-index: 60; top: calc(100% + 10px); left: 0; right: 0;
  background: #fff; border: 1px solid var(--line, #e6dfd6); border-radius: 12px;
  box-shadow: 0 18px 44px rgba(23, 39, 33, .14), 0 2px 6px rgba(23, 39, 33, .06);
  padding: 6px; max-height: min(70vh, 560px); overflow-y: auto; overscroll-behavior: contain;
  font-family: var(--sans, var(--home-font, system-ui, sans-serif));
}
.ts-liste[hidden] { display: none; }

.ts-satir {
  display: flex; align-items: center; gap: 12px; padding: 9px 10px;
  border-radius: 9px; text-decoration: none; color: var(--ink, #292733); cursor: pointer;
}
.ts-satir:hover, .ts-satir.is-aktif { background: #f4f0fb; }
.ts-satir.is-aktif { box-shadow: inset 0 0 0 1px #d9cdf3; }

.ts-thumb {
  width: 48px; height: 48px; flex: none; border-radius: 8px;
  object-fit: cover; background: #eceef0; display: block;
}
.ts-thumb--bos { background: #f0eef4; }

.ts-metin { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ts-metin strong { font-weight: 600; font-size: 15px; line-height: 1.3; }
.ts-metin strong mark { background: none; color: inherit; font-weight: 700; text-decoration: none; }
.ts-alt {
  font-size: 13px; line-height: 1.35; color: var(--muted, #6c6670);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.ts-grup { padding-bottom: 4px; border-bottom: 1px solid var(--line, #e6dfd6); margin-bottom: 4px; }
.ts-satir--eylem { padding-block: 7px; padding-left: 22px; gap: 10px; }
.ts-satir--eylem .ts-metin {
  font-size: 14px; font-weight: 600; color: var(--purple, #432092);
  text-decoration: underline; text-underline-offset: 3px;
}
.ts-ok { color: var(--muted, #6c6670); font-size: 13px; width: 16px; flex: none; }

.ts-satir--hepsi {
  justify-content: center; font-size: 14px; font-weight: 600;
  color: var(--purple, #432092); border-top: 1px solid var(--line, #e6dfd6);
  border-radius: 0 0 8px 8px; margin-top: 4px; padding-block: 12px;
}

.ts-bos { padding: 16px 12px 14px; }
.ts-bos p { margin: 0 0 10px; font-size: 14px; line-height: 1.5; color: var(--muted, #6c6670); }
.ts-cikis { font-size: 14px; font-weight: 600; color: var(--purple, #432092); text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 640px) {
  .ts-liste { left: -8px; right: -8px; max-height: 62vh; }
  .ts-thumb { width: 42px; height: 42px; }
  .ts-metin strong { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { .ts-satir { transition: none; } }

/* The homepage already has a hero search box; the header box serves every other page. */
.site-search-header { display: flex; align-items: center; }
.site-search-header form { display: flex; align-items: center; gap: 6px; }
.site-search-header .ts-alan {
  display: flex; align-items: center; gap: 7px;
  border: 1px solid var(--line, #e6dfd6); border-radius: 8px; background: #fff;
  padding: 0 10px; min-height: 40px; width: 196px;
}
.site-search-header .ts-alan:focus-within { outline: 2px solid var(--purple, #432092); outline-offset: 2px; }
.site-search-header input {
  border: 0; outline: 0; background: transparent; font: inherit; font-size: 14px;
  color: var(--ink, #292733); width: 100%; min-width: 0; padding-block: 9px;
}
.site-search-header input::placeholder { color: #8a8590; opacity: 1; }
.site-search-header .ts-ikon { width: 17px; height: 17px; flex: none; color: var(--muted, #6c6670); }
.site-search-header button[type="submit"] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.site-search-header .ts-liste { left: 0; right: auto; width: 380px; max-width: calc(100vw - 32px); }
.site-search-link { display: none; }
@media (max-width: 1100px) { .site-search-header .ts-alan { width: 150px; } }
/* Below 760px there is no room for the box in the header — the icon links to /search. */
@media (max-width: 759px) {
  .site-search-header form { display: none; }
  .site-search-link {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 8px; color: var(--ink, #292733);
    border: 1px solid var(--line, #e6dfd6); background: #fff; flex: none;
  }
}

.search-page main { width: var(--page, min(1184px, calc(100% - 64px))); margin-inline: auto; }
.sr-head { padding-block: 34px 8px; }
.sr-head h1 { margin: 0 0 10px; }
.sr-form { display: flex; align-items: center; gap: 10px; max-width: 620px; margin: 18px 0 6px; }
.sr-form .ts-alan {
  display: flex; align-items: center; gap: 10px; flex: 1;
  border: 1px solid #b8c2ba; border-radius: 9px; background: #fff; padding: 0 14px; min-height: 52px;
}
.sr-form .ts-alan:focus-within { outline: 2px solid var(--purple, #432092); outline-offset: 3px; }
.sr-form input { border: 0; outline: 0; background: transparent; font: inherit; font-size: 16px; width: 100%; min-width: 0; padding-block: 13px; }
.sr-form .ts-ikon { width: 20px; height: 20px; flex: none; color: var(--muted, #6c6670); }
.sr-form button[type="submit"] {
  border: 0; border-radius: 7px; background: var(--purple, #432092); color: #fff;
  font: 600 14px var(--sans, system-ui); padding: 15px 22px; cursor: pointer; min-height: 52px;
}
.sr-sayi { font-size: 14px; color: var(--muted, #6c6670); margin: 0 0 18px; }

.sr-cipler { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.sr-cip {
  border: 1px solid var(--line, #e6dfd6); background: #fff; border-radius: 999px;
  padding: 7px 14px; font: inherit; font-size: 13px; color: var(--ink, #292733);
  cursor: pointer; text-decoration: none; line-height: 1.4;
}
.sr-cip[aria-pressed="true"], .sr-cip.is-on { background: var(--purple, #432092); border-color: var(--purple, #432092); color: #fff; }
.sr-cip span { opacity: .65; margin-left: 5px; }

.sr-bolum { margin-bottom: 34px; }
.sr-bolum h2 { font-size: 15px; text-transform: uppercase; letter-spacing: .07em; color: var(--muted, #6c6670); margin: 0 0 14px; font-weight: 600; }
.sr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.sr-kart {
  display: flex; gap: 14px; align-items: center; padding: 12px;
  border: 1px solid var(--line, #e6dfd6); border-radius: 12px; background: #fff;
  text-decoration: none; color: var(--ink, #292733);
}
.sr-kart:hover { border-color: #c9bce8; }
.sr-kart img, .sr-kart .ts-thumb { width: 62px; height: 62px; border-radius: 9px; flex: none; object-fit: cover; }
.sr-kart strong { display: block; font-size: 16px; font-weight: 600; line-height: 1.3; margin-bottom: 3px; }
.sr-kart .ts-alt { font-size: 13px; white-space: normal; }

.sr-yok { border: 1px solid var(--line, #e6dfd6); border-radius: 14px; padding: 26px; background: #fff; max-width: 640px; }
.sr-yok h2 { margin: 0 0 10px; font-size: 20px; font-weight: 600; }
.sr-yok p { margin: 0 0 16px; color: var(--muted, #6c6670); line-height: 1.6; }
.sr-yok ul { margin: 0; padding-left: 20px; line-height: 2; }
.sr-populer { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

.sr-daha {
  display: inline-block; margin-top: 14px; border: 1px solid var(--line, #e6dfd6);
  background: #fff; border-radius: 999px; padding: 10px 20px; font: inherit;
  font-size: 14px; font-weight: 600; cursor: pointer;
}

@media (max-width: 760px) {
  .search-page main { width: calc(100% - 40px); }
  .sr-form { flex-wrap: wrap; }
  .sr-grid { grid-template-columns: 1fr; }
}