/* =====================================================================
   Ürün Gezgini — Page-level components
   Breadcrumb · Toolbar · Filters · Pagination · Offer table · Detail
   ===================================================================== */

/* ---------- Breadcrumb ---------- */
.crumb{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:var(--fs-sm2); color:var(--ink-500); padding-block:var(--space-4); }
.crumb a{ color:var(--ink-500); }
.crumb a:hover{ color:var(--primary-700); }
.crumb .sep{ color:var(--ink-300); }
.crumb .cur{ color:var(--ink-800); font-weight:var(--fw-semibold); }

/* ---------- Page layout with sidebar ---------- */
.listing{ display:grid; grid-template-columns:1fr; gap:var(--space-6); align-items:start; }
@media (min-width:900px){ .listing{ grid-template-columns:260px 1fr; } }

/* ---------- Filters ---------- */
.filters{ background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-lg); position:sticky; top:calc(var(--header-h) + 12px); overflow:hidden; }
.filters__head{ display:flex; align-items:center; justify-content:space-between; padding:var(--space-4) var(--space-5); border-bottom:1px solid var(--color-border); }
.filters__head h3{ font-size:var(--fs-base); }
.filters__head a{ font-size:var(--fs-xs); font-weight:var(--fw-semibold); }
.fgroup{ padding:var(--space-4) var(--space-5); border-bottom:1px solid var(--color-border); }
.fgroup:last-child{ border-bottom:none; }
.fgroup h4{ font-size:var(--fs-sm2); margin-bottom:var(--space-3); font-family:var(--font-body); font-weight:var(--fw-bold); color:var(--ink-800); }
.fopt{ display:flex; align-items:center; gap:var(--space-2); padding:.3rem 0; font-size:var(--fs-sm2); color:var(--ink-700); cursor:pointer; }
.fopt input{ accent-color:var(--primary-700); width:1.05em; height:1.05em; flex:none; }
.fopt .c{ margin-left:auto; font-size:var(--fs-xs); color:var(--ink-400); font-variant-numeric:tabular-nums; }
.fopt:hover{ color:var(--primary-700); }
.price-range{ display:flex; align-items:center; gap:.5rem; margin-top:.4rem; }
.price-range input{ width:100%; padding:.5rem .6rem; border:1px solid var(--color-border-mid); border-radius:var(--radius-sm); font-size:var(--fs-sm2); font-variant-numeric:tabular-nums; }
.price-range span{ color:var(--ink-400); }
.chips-filter{ display:flex; flex-wrap:wrap; gap:.4rem; }
.chip-check{ padding:.35rem .7rem; border:1px solid var(--color-border-mid); border-radius:var(--radius-pill); font-size:var(--fs-xs); font-weight:var(--fw-medium); color:var(--ink-600); cursor:pointer; }
.chip-check.on{ background:var(--primary-50); border-color:var(--primary-300); color:var(--primary-700); }

/* active filter chips */
.filter-chips{ display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; margin-bottom:var(--space-4); }
.filter-chips .chip{ padding:.35rem .7rem; font-size:var(--fs-xs); }
.filter-chips .chip-active{ background:var(--primary-50); border-color:var(--primary-300); color:var(--primary-700); }

/* filter toggle (mobile) */
.filter-toggle{ display:flex; align-items:center; gap:.5rem; width:100%; padding:var(--space-4) var(--space-5);
  font-family:var(--font-body); font-weight:var(--fw-bold); font-size:var(--fs-sm2); color:var(--ink-800); }
.filter-toggle__count{ margin-left:auto; background:var(--primary-600); color:#fff; border-radius:var(--radius-pill);
  font-size:var(--fs-xs); padding:.05rem .45rem; }
@media (min-width:900px){ .filter-toggle{ display:none; } .filters > form{ display:block !important; } }

/* ---------- Toolbar (sort / count) ---------- */
.toolbar{ display:flex; align-items:center; gap:var(--space-3); flex-wrap:wrap; margin-bottom:var(--space-5); }
.toolbar__count{ font-size:var(--fs-sm2); color:var(--ink-600); }
.toolbar__count b{ color:var(--ink-900); }
.toolbar__spacer{ margin-left:auto; }
.sortsel{ display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .8rem; border:1px solid var(--color-border-mid); border-radius:var(--radius-md); background:#fff; font-size:var(--fs-sm2); font-weight:var(--fw-medium); }
.applied{ display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:var(--space-4); }
.applied .tag{ display:inline-flex; align-items:center; gap:.4rem; padding:.3rem .6rem; background:var(--primary-50); color:var(--primary-700); border-radius:var(--radius-pill); font-size:var(--fs-xs); font-weight:var(--fw-semibold); }
.applied .tag button{ color:var(--primary-500); line-height:1; }

/* ---------- Pagination ---------- */
.pager{ display:flex; align-items:center; justify-content:center; gap:.4rem; margin-top:var(--space-8); }
.pager a, .pager span{ min-width:40px; height:40px; padding:0 .6rem; display:inline-flex; align-items:center; justify-content:center; border-radius:var(--radius-md); border:1px solid var(--color-border); background:#fff; font-size:var(--fs-sm2); font-weight:var(--fw-semibold); color:var(--ink-700); font-variant-numeric:tabular-nums; }
.pager a:hover{ border-color:var(--primary-400); color:var(--primary-700); text-decoration:none; }
.pager .on{ background:var(--primary-700); border-color:var(--primary-700); color:#fff; }
.pager .dots{ border:none; background:none; }

/* ---------- Product detail ---------- */
.pd{ display:grid; grid-template-columns:1fr; gap:var(--space-8); align-items:start; }
@media (min-width:800px){ .pd{ grid-template-columns:minmax(0,420px) 1fr; } }
.gallery{ background:radial-gradient(120% 100% at 50% 0,#fff,var(--ink-50)); border:1px solid var(--color-border); border-radius:var(--radius-xl); padding:var(--space-10); display:grid; place-items:center; position:sticky; top:calc(var(--header-h) + 16px); }
.gallery svg{ color:var(--ink-300); }
.pd__brand{ font-size:var(--fs-sm2); color:var(--primary-700); font-weight:var(--fw-bold); text-transform:uppercase; letter-spacing:.05em; }
.pd h1{ font-size:var(--fs-2xl); margin-top:.35rem; }
.pd__rating{ display:flex; align-items:center; gap:var(--space-3); margin-top:var(--space-3); font-size:var(--fs-sm2); color:var(--ink-600); }
.stars{ color:var(--accent-500); letter-spacing:1px; }

/* best price panel */
.bestbuy{ background:linear-gradient(180deg,var(--cheapest-bg),#fff); border:1.5px solid #BFE8D5; border-radius:var(--radius-xl); padding:var(--space-6); margin-top:var(--space-6); }
.bestbuy__top{ display:flex; align-items:center; gap:.6rem; margin-bottom:var(--space-3); }
.bestbuy__row{ display:flex; align-items:flex-end; gap:var(--space-5); flex-wrap:wrap; }
.bestbuy__store{ display:flex; align-items:center; gap:var(--space-3); }
.bestbuy__logo{ width:52px; height:52px; border-radius:var(--radius-md); background:#fff; border:1px solid var(--color-border); display:grid; place-items:center; font-weight:var(--fw-bold); color:var(--ink-600); }
.bestbuy__price{ margin-left:auto; text-align:right; }
.bestbuy__cta{ margin-top:var(--space-5); display:flex; gap:var(--space-3); flex-wrap:wrap; }
.bestbuy__note{ font-size:var(--fs-xs); color:var(--cheapest-fg); margin-top:var(--space-3); display:flex; align-items:center; gap:.4rem; }

/* offer table */
.offers-wrap{ border:1px solid var(--color-border); border-radius:var(--radius-lg); overflow:hidden; background:#fff; }
.offers{ width:100%; border-collapse:collapse; }
.offers th, .offers td{ text-align:left; padding:var(--space-4) var(--space-4); border-bottom:1px solid var(--color-border); vertical-align:middle; }
.offers thead th{ font-size:var(--fs-xs); text-transform:uppercase; letter-spacing:.05em; color:var(--ink-500); font-weight:var(--fw-bold); background:var(--ink-50); }
.offers tr:last-child td{ border-bottom:none; }
.offers tr.is-cheapest{ background:linear-gradient(90deg,var(--cheapest-bg),transparent 60%); }
.offers .store{ display:flex; align-items:center; gap:var(--space-3); }
.offers .store-logo{ width:44px; height:44px; border-radius:var(--radius-md); background:var(--ink-50); border:1px solid var(--color-border); display:grid; place-items:center; font-size:var(--fs-xs); font-weight:var(--fw-bold); color:var(--ink-600); flex:none; }
.offers .store-name{ font-weight:var(--fw-semibold); color:var(--ink-900); }
.offers .store-meta{ font-size:var(--fs-xs); color:var(--ink-500); display:flex; align-items:center; gap:.5rem; }
.offers .oprice{ font-family:var(--font-price); font-variant-numeric:tabular-nums; font-weight:var(--fw-extra); font-size:var(--fs-lg); color:var(--ink-950); }
.offers .oship{ font-size:var(--fs-xs); color:var(--ink-500); }
.offers .ototal{ font-size:var(--fs-xs); color:var(--cheapest-fg); font-weight:var(--fw-bold); }
.hide-sm{ display:none; }
@media (min-width:680px){ .hide-sm{ display:table-cell; } }

/* price history chart */
.chart-card{ background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:var(--space-5) var(--space-5) var(--space-4); }
.chart-head{ display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); flex-wrap:wrap; margin-bottom:var(--space-4); }
.chart-legend{ display:flex; align-items:center; gap:1rem; font-size:var(--fs-xs); color:var(--ink-600); }
.chart-legend .k{ display:inline-flex; align-items:center; gap:.4rem; }
.chart-legend .sw{ width:14px; height:3px; border-radius:2px; }
.range-tabs{ display:inline-flex; gap:.2rem; background:var(--ink-100); padding:.2rem; border-radius:var(--radius-md); }
.range-tabs button, .range-tabs a{ padding:.35rem .7rem; border-radius:var(--radius-sm); font-size:var(--fs-xs); font-weight:var(--fw-semibold); color:var(--ink-600); }
.range-tabs a:hover{ color:var(--primary-700); text-decoration:none; }
.range-tabs button.on, .range-tabs a.on{ background:#fff; color:var(--primary-700); box-shadow:var(--shadow-xs); }
.chart-svg{ width:100%; height:200px; overflow:visible; }
.chart-stats{ display:flex; gap:var(--space-6); flex-wrap:wrap; margin-top:var(--space-4); padding-top:var(--space-4); border-top:1px solid var(--color-border); }
.chart-stats .s .l{ font-size:var(--fs-xs); color:var(--ink-500); }
.chart-stats .s .v{ font-weight:var(--fw-bold); font-variant-numeric:tabular-nums; color:var(--ink-900); }

/* spec table */
.specs{ width:100%; border-collapse:collapse; }
.specs th, .specs td{ text-align:left; padding:.7rem var(--space-4); border-bottom:1px solid var(--color-border); font-size:var(--fs-sm2); }
.specs th{ color:var(--ink-500); font-weight:var(--fw-medium); width:40%; }
.specs td{ color:var(--ink-800); font-weight:var(--fw-semibold); }
.specs tr:nth-child(even){ background:var(--ink-50); }

/* section title small */
.h-sec{ font-size:var(--fs-lg); margin:var(--space-8) 0 var(--space-4); }

/* comparison table */
.cmp{ width:100%; border-collapse:separate; border-spacing:0; }
.cmp th, .cmp td{ padding:var(--space-4); border-bottom:1px solid var(--color-border); text-align:center; }
.cmp thead th{ background:#fff; position:sticky; top:0; }
.cmp .rowlabel{ text-align:left; color:var(--ink-500); font-weight:var(--fw-medium); font-size:var(--fs-sm2); background:var(--ink-50); }
.cmp .win{ color:var(--cheapest-fg); font-weight:var(--fw-bold); }

/* empty / no-result */
.empty{ text-align:center; padding:var(--space-16) var(--space-4); }
.empty__ic{ width:64px; height:64px; border-radius:50%; background:var(--ink-100); color:var(--ink-400); display:grid; place-items:center; margin:0 auto var(--space-4); }

/* ---------- Legal / KVKK pages ---------- */
.legal__body{ max-width:760px; margin:0 auto var(--space-16); }
.legal__body h1{ font-size:var(--fs-2xl); margin-bottom:var(--space-5); }
.legal__body h2{ font-size:var(--fs-lg); margin:var(--space-8) 0 var(--space-3); }
.legal__body p, .legal__body li{ color:var(--ink-700); line-height:1.7; }
.legal__body p{ margin-bottom:var(--space-4); }
.legal__body ul{ margin:0 0 var(--space-4) 1.2rem; list-style:disc; }
.legal__body a{ color:var(--primary-700); text-decoration:underline; }
.legal__draft{ margin-top:var(--space-8); padding:var(--space-3) var(--space-4); background:var(--warning-bg); color:var(--warning-fg); border-radius:var(--radius-md); font-size:var(--fs-sm2); }
.legal__notice{ padding:var(--space-3) var(--space-4); border-radius:var(--radius-md); margin-bottom:var(--space-5); font-weight:var(--fw-semibold); }
.legal__notice--ok{ background:var(--success-bg); color:var(--success-fg); }
.legal__form{ display:flex; flex-direction:column; gap:var(--space-4); max-width:440px; margin-top:var(--space-5); }
.legal__err{ color:var(--error-fg); font-size:var(--fs-sm); }

/* ---------- Store pages ---------- */
.store-head{ display:flex; align-items:center; gap:var(--space-4); margin-bottom:var(--space-5); }
.store-logo--lg{ width:56px; height:56px; border-radius:var(--radius-lg); background:var(--ink-50);
  border:1px solid var(--color-border); display:grid; place-items:center; flex:none;
  font-size:var(--fs-lg); font-weight:var(--fw-bold); color:var(--primary-700); }
.store-stats{ display:flex; gap:var(--space-6); flex-wrap:wrap; padding:var(--space-4) var(--space-5);
  background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-lg); margin-bottom:var(--space-5); }
.store-stats .l{ font-size:var(--fs-xs); color:var(--ink-500); }
.store-stats .v{ font-weight:var(--fw-bold); font-variant-numeric:tabular-nums; color:var(--ink-900); }
.grid-stores{ display:grid; gap:var(--space-4); grid-template-columns:repeat(2,1fr); }
@media (min-width:700px){ .grid-stores{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1100px){ .grid-stores{ grid-template-columns:repeat(4,1fr); } }
.store-card{ display:flex; align-items:center; gap:var(--space-3); padding:var(--space-4); }
.store-card:hover{ text-decoration:none; }
.store-card__name{ font-weight:var(--fw-bold); color:var(--ink-900); }

/* subcategory chips */
.subcats{ display:flex; flex-wrap:wrap; gap:.45rem; margin-top:var(--space-4); }
.subcats .chip{ padding:.4rem .8rem; font-size:var(--fs-xs); }