/* ==========================================================================
   WALKER — Katalog (kategori, arama, kampanyalar / tüm ürünler, markalar, karşılaştırma)
   Area stylesheet: loaded after walker.css on every page — keep selectors scoped.
   Look (walkerandhawkes.com category page): centred Playfair title + short text with gold "Devamını oku",
   "N sonucun 1–12 arası gösteriliyor" line, grey pill "Filtre" left / grey sort pill right, 3-column grid
   (2 on mobile), long light-grey rounded pagination bar with a gold arrow on the right.

   C1 Page wrapper            .walker-catalog
   C2 Page head               .walker-catalog-head (__title __desc __more __refine __chip __logo __eyebrow)
   C3 Toolbar                 .walker-toolbar (__count __row __start __pill __filter __compare), .walker-select-pill
   C4 Grid / pagination       .walker-catalog__grid, .walker-catalog__pagination, .walker-catalog-empty
   C5 Filter drawer           .walker-filter-drawer, .walker-catmenu, .walker-filter
   C6 Search                  .walker-searchbar
   C7 Brands                  .walker-brand-grid, .walker-brand-tile, .walker-brand-index, .walker-brand-group
   C8 Compare                 .walker-compare__*
   C9 Responsive
   ========================================================================== */


/* == C1 Page wrapper ======================================================= */
.walker-catalog {
  padding-bottom: var(--spaced-section);
}

.walker-catalog #content {
  min-width: 0;
}


/* == C2 Page head ========================================================== */
.walker-catalog-head {
  max-width: 980px;
  margin: 0 auto;
  padding-bottom: 3.5rem;
  text-align: center;
}

.walker-catalog-head .breadcrumb {
  justify-content: center;
  margin-bottom: 1.75rem;
}

.walker-catalog-head__eyebrow {
  display: block;
  margin-bottom: .75rem;
}

.walker-catalog-head__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--page-title-size);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.walker-catalog-head__desc {
  max-width: 760px;
  margin: 1.25rem auto 0;
  color: rgb(var(--color-text));
  font-size: 1.125rem;
  line-height: 1.7;
}

.walker-catalog-head__desc > :last-child {
  margin-bottom: 0;
}

.walker-catalog-head__desc img {
  display: none;
}

.walker-catalog-head__desc.is-clamped {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.walker-catalog-head__desc.is-clamped > * {
  display: inline;
  margin: 0;
}

.walker-catalog-head__desc.is-clamped > * + *::before {
  content: " ";
}

.walker-catalog-head__more {
  margin-top: .35rem;
  padding: 0;
  border: 0;
  background: none;
  color: rgb(var(--color-gold));
  font-family: var(--font-body);
  font-size: 1.125rem;
  font-weight: 500;
  cursor: pointer;
}

.walker-catalog-head__more:hover {
  color: rgb(var(--color-gold-dark));
  text-decoration: underline;
  text-underline-offset: 3px;
}

.walker-catalog-head__refine {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 2rem;
}

.walker-catalog-head__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 20px;
  border: 1px solid rgb(var(--color-border));
  border-radius: var(--radius-pill);
  background: rgb(var(--color-bg));
  color: rgb(var(--color-text));
  font-size: 16px;
  font-weight: 600;
  transition: border-color var(--duration-default), color var(--duration-default);
}

.walker-catalog-head__chip:hover {
  border-color: rgb(var(--color-gold));
  color: rgb(var(--color-gold-dark));
}

.walker-catalog-head__chip-count {
  color: rgb(var(--color-text-muted));
  font-size: 14px;
  font-weight: 400;
}

.walker-catalog-head__logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 180px;
  height: 120px;
  margin-bottom: 1.5rem;
  padding: 18px 26px;
  border: 1px solid rgb(var(--color-border));
  border-radius: var(--radius-card);
  background: #fff;
}

.walker-catalog-head__logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}


/* == C3 Toolbar ============================================================ */
.walker-toolbar {
  margin-bottom: 2rem;
}

.walker-toolbar__count {
  margin: 0 0 1.1rem;
  color: rgb(var(--color-text));
  font-size: 1.125rem;
}

.walker-toolbar__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.walker-toolbar__start {
  display: flex;
  align-items: center;
  gap: 24px;
  min-width: 0;
}

.walker-toolbar__pill {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  height: 62px;
  margin: 0;
  padding: 0 40px;
  border: 0;
  border-radius: var(--radius-pill);
  background: rgb(var(--color-surface));
  color: rgb(var(--color-text));
  font-family: var(--font-body);
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  transition: background-color var(--duration-default);
}

.walker-toolbar__pill:hover,
.walker-toolbar__pill:focus-within {
  background: rgb(var(--color-surface-2));
}

.walker-toolbar__pill .walker-icon {
  flex: none;
  width: 22px;
  height: 22px;
}

.walker-toolbar__filter:focus-visible {
  outline: 2px solid rgb(var(--color-gold));
  outline-offset: 2px;
}

.walker-toolbar__compare {
  color: rgb(var(--color-text-muted));
  font-size: 16px;
  white-space: nowrap;
}

.walker-toolbar__compare:hover {
  color: rgb(var(--color-gold));
}

.walker-select-pill {
  width: 308px;
  max-width: 100%;
  padding: 0;
}

.walker-select-pill__select {
  width: 100%;
  height: 100%;
  min-width: 0;
  padding: 0 72px 0 40px;
  overflow: hidden;
  border: 0;
  border-radius: inherit;
  background: transparent;
  color: inherit;
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.walker-select-pill__select:focus {
  outline: none;
}

.walker-select-pill:has(.walker-select-pill__select:focus-visible) {
  outline: 2px solid rgb(var(--color-gold));
  outline-offset: 2px;
}

.walker-select-pill__select option {
  background: rgb(var(--color-bg));
  color: rgb(var(--color-text));
}

.walker-select-pill__icon {
  position: absolute;
  top: 50%;
  right: 40px;
  margin-top: -11px;
  pointer-events: none;
}


/* == C4 Grid / pagination / empty ========================================== */
.walker-catalog__grid {
  --grid-cols: 3;
  gap: 3.25rem 50px;
}

.walker-catalog__pagination {
  margin-top: 4rem;
}

.walker-catalog__pagination .pagination {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  min-height: 60px;
  padding: 8px 18px;
  border-radius: var(--radius-pill);
  background: rgb(var(--color-surface));
}

.walker-catalog__pagination .page-link {
  min-width: 34px;
  height: 44px;
  padding: 0 6px;
  font-size: 15px;
  font-weight: 500;
}

/* Numbers centred, prev/first on the left, next/last pushed to the right */
.walker-catalog__pagination .page-item:not(.page-item--edge):first-child,
.walker-catalog__pagination .page-item--edge + .page-item:not(.page-item--edge) {
  margin-left: auto;
}

.walker-catalog__pagination .page-item:not(.page-item--edge):last-child,
.walker-catalog__pagination .page-item:not(.page-item--edge):has(+ .page-item--edge) {
  margin-right: auto;
}

.walker-catalog__pagination .page-item--edge .page-link {
  color: rgb(var(--color-gold));
}

.walker-catalog__pagination .page-item--edge .page-link:hover {
  color: rgb(var(--color-gold-dark));
}

.walker-catalog__pagination .page-item--edge .walker-icon {
  width: 22px;
  height: 22px;
}

.walker-catalog-empty {
  max-width: 640px;
  margin: 0 auto;
  padding: 3.5rem 2rem;
  border-radius: var(--radius-panel);
  background: rgb(var(--color-surface));
  text-align: center;
}

.walker-catalog-empty__title {
  margin: 0 0 .75rem;
  font-size: clamp(1.75rem, 1.4rem + 1vw, 2.25rem);
}

.walker-catalog-empty__text {
  margin: 0;
  color: rgb(var(--color-text-muted));
}

.walker-catalog-empty__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 1.75rem;
}


/* == C5 Filter drawer ====================================================== */
.walker-filter-drawer .walker-drawer__title {
  font-family: var(--font-heading);
  font-size: 1.75rem;
  font-weight: 400;
}

.walker-filter-drawer__modules > * + * {
  margin-top: 1.75rem;
}

.walker-filter-drawer__modules #column-left,
.walker-filter-drawer__modules #column-right {
  display: block !important; /* core sidebar is d-none d-md-block; inside the drawer it shows on phones too */
  width: 100%;
  max-width: none;
  flex: none;
  padding: 0 !important; /* beats #container #column-left padding-bottom */
}

.walker-filter-drawer__modules #column-left > * + *,
.walker-filter-drawer__modules #column-right > * + * {
  margin-top: 1.75rem;
}

.walker-filter-drawer__section {
  margin-top: 1.75rem;
  padding-top: 1.75rem;
  border-top: 1px solid rgb(var(--color-border));
}

.walker-drawer__body > .walker-filter-drawer__section:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.walker-filter-drawer__title,
.walker-catmenu__title,
.walker-filter__heading {
  margin: 0 0 .85rem;
  color: rgb(var(--color-text));
  font-family: var(--font-body);
  font-size: 1.0625rem;
  font-weight: 700;
}

.walker-filter-drawer__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.walker-filter-drawer__link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 7px 0;
  color: rgb(var(--color-text));
  font-size: 16px;
}

.walker-filter-drawer__link::before {
  content: "";
  flex: none;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(var(--color-text), .35);
  border-radius: 50%;
  transition: border-color var(--duration-default), box-shadow var(--duration-default);
}

.walker-filter-drawer__link:hover {
  color: rgb(var(--color-gold-dark));
}

.walker-filter-drawer__link.is-active::before {
  border-color: rgb(var(--color-gold));
  box-shadow: inset 0 0 0 4px rgb(var(--color-bg)), inset 0 0 0 9px rgb(var(--color-gold));
}

.walker-filter-drawer__limits {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.walker-filter-drawer__limit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 40px;
  padding: 0 14px;
  border: 1px solid rgb(var(--color-border));
  border-radius: var(--radius-pill);
  color: rgb(var(--color-text));
  font-size: 15px;
  font-weight: 600;
}

.walker-filter-drawer__limit:hover {
  border-color: rgb(var(--color-gold));
}

.walker-filter-drawer__limit.is-active {
  border-color: rgb(var(--color-gold));
  background: rgb(var(--color-gold));
  color: rgb(var(--color-on-accent));
}

/* Category module */
.walker-catmenu__list,
.walker-catmenu__children {
  margin: 0;
  padding: 0;
  list-style: none;
}

.walker-catmenu__children {
  margin: 2px 0 8px;
  padding-left: 14px;
  border-left: 1px solid rgb(var(--color-border));
}

.walker-catmenu__link {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  color: rgb(var(--color-text));
  font-size: 16px;
}

.walker-catmenu__link:hover,
.walker-catmenu__link.active {
  color: rgb(var(--color-gold-dark));
}

.walker-catmenu__link.active {
  font-weight: 600;
}

.walker-catmenu__link--child {
  font-size: 15px;
}

.walker-catmenu__count {
  color: rgb(var(--color-text-muted));
  font-size: 13px;
}

/* Filter module */
.walker-filter__groups {
  border-bottom: 0;
}

.walker-filter__title {
  font-size: 16px;
}

.walker-filter__options {
  display: grid;
  gap: 6px;
  padding-bottom: 6px;
}

.walker-filter__option {
  margin: 0;
  font-size: 16px;
}

.walker-filter__actions {
  display: flex;
  gap: 10px;
  margin-top: 1.25rem;
}

.walker-filter__actions .btn-walker {
  flex: 1 1 0;
  min-height: 48px;
  padding: 0 18px;
}


/* == C6 Search ============================================================= */
.walker-searchbar {
  max-width: 760px;
  margin: -1.5rem auto 3.5rem;
}

.walker-searchbar__field {
  position: relative;
  display: flex;
  align-items: center;
}

.walker-searchbar__input.form-control {
  height: 62px;
  padding: 0 170px 0 30px;
  border-radius: var(--radius-pill);
  font-size: 1.125rem;
}

.walker-searchbar__submit.btn-walker {
  position: absolute;
  top: 6px;
  right: 6px;
  bottom: 6px;
  gap: 10px;
  min-height: 0;
  height: auto;
  padding: 0 26px;
}

.walker-searchbar__submit .walker-icon {
  width: 20px;
  height: 20px;
}

.walker-searchbar__options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 24px;
  margin-top: 1rem;
}

.walker-searchbar__select.form-select {
  width: auto;
  max-width: 100%;
  height: 46px;
  padding-top: 0;
  padding-bottom: 0;
  border-color: transparent;
  background-color: rgb(var(--color-surface));
  font-size: 16px;
}

.walker-searchbar__options .form-check {
  margin: 0;
  font-size: 16px;
}

.walker-searchbar__options .form-check.is-disabled .form-check-label {
  opacity: .5;
}


/* == C7 Brands ============================================================= */
.walker-brand-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.walker-brand-tile {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(var(--color-text), .3);
  border-radius: var(--radius-card);
  background: #fff;
  color: rgb(var(--color-text));
  transition: border-color var(--duration-default), box-shadow var(--duration-default);
}

.walker-brand-tile:hover {
  border-color: rgb(var(--color-gold));
  box-shadow: var(--shadow-soft);
}

.walker-brand-tile__media {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  min-height: 170px;
  padding: 28px 40px 12px;
}

.walker-brand-tile__media img {
  max-width: 220px;
  max-height: 110px;
  object-fit: contain;
}

.walker-brand-tile__word {
  font-family: var(--font-heading);
  font-size: 2rem;
  line-height: 1.1;
  text-align: center;
}

.walker-brand-tile__info {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 10px;
  padding: 0 20px 22px;
  color: #111;
  font-size: 16px;
}

.walker-brand-tile__name {
  font-weight: 600;
}

.walker-brand-tile__count {
  color: rgb(118, 122, 111);
  font-size: 15px;
}

.walker-brand-tile:hover .walker-brand-tile__name {
  color: rgb(var(--color-gold-dark));
}

.walker-brand-index {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin: -1.5rem 0 3rem;
}

.walker-brand-index__chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  border-radius: var(--radius-pill);
  background: rgb(var(--color-surface));
  color: rgb(var(--color-text));
  font-weight: 600;
}

.walker-brand-index__chip:hover {
  background: rgb(var(--color-gold));
  color: rgb(var(--color-on-accent));
}

.walker-brand-group + .walker-brand-group {
  margin-top: 3.5rem;
}

.walker-brand-group__letter {
  margin: 0 0 1.25rem;
  font-size: 2.25rem;
  scroll-margin-top: calc(var(--header-space) + 24px);
}


/* == C8 Compare ============================================================ */
.walker-compare__scroll {
  overflow-x: auto;
  border: 1px solid rgb(var(--color-border));
  border-radius: var(--radius-panel);
  background: rgb(var(--color-bg));
  scrollbar-width: thin;
}

.walker-compare__scroll:focus-visible {
  outline: 2px solid rgb(var(--color-gold));
  outline-offset: 2px;
}

.walker-compare__table {
  --compare-head: 220px;
  --compare-col: 260px;
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 16px;
}

.walker-compare__table col.walker-compare__col-head {
  width: var(--compare-head);
}

.walker-compare__table th,
.walker-compare__table td {
  padding: 16px 24px;
  border-top: 1px solid rgb(var(--color-border));
  vertical-align: top;
  text-align: left;
}

.walker-compare__table thead th,
.walker-compare__table thead td {
  border-top: 0;
  padding-top: 30px;
  padding-bottom: 30px;
}

.walker-compare__table tbody th {
  color: rgb(var(--color-text));
  font-weight: 700;
}

.walker-compare__table tbody td {
  color: rgb(var(--color-text-muted));
}

.walker-compare__table th[scope="row"] {
  position: sticky;
  left: 0;
  z-index: 1;
  background: rgb(var(--color-bg));
}

.walker-compare__count {
  font-family: var(--font-heading);
  font-size: 1.375rem;
  line-height: 1.3;
  font-weight: 400;
}

.walker-compare__media {
  position: relative;
  aspect-ratio: 1 / 1;
  margin-bottom: 14px;
  overflow: hidden;
  border: 1px solid rgb(var(--color-border));
  border-radius: var(--radius-card);
  background: rgb(var(--color-tile));
}

.walker-compare__media img {
  width: 100%;
  height: 100%;
  padding: 12%;
  object-fit: contain;
  mix-blend-mode: multiply;
}

.walker-compare__remove {
  position: absolute;
  top: 10px;
  right: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #fff;
  color: #111;
  box-shadow: var(--shadow-soft);
}

.walker-compare__remove:hover {
  background: rgb(var(--color-gold));
}

.walker-compare__remove .walker-icon {
  width: 16px;
  height: 16px;
}

.walker-compare__name {
  display: block;
  color: rgb(var(--color-text));
  font-size: 18px;
  font-weight: 600;
  line-height: 1.35;
}

.walker-compare__name:hover {
  color: rgb(var(--color-gold-dark));
}

.walker-compare__price {
  margin-top: 4px;
}

.walker-compare__cart {
  margin-top: 14px;
}

.walker-compare__group th {
  padding-top: 22px;
  background: rgb(var(--color-surface));
  font-family: var(--font-heading);
  font-size: 1.375rem;
  font-weight: 400;
}

.walker-compare__table tr.walker-compare__group th[scope="rowgroup"] {
  position: static;
}

.walker-compare__desc {
  font-size: 15px;
  line-height: 1.6;
}

.walker-compare__stock {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgb(var(--color-success));
  font-weight: 600;
}

.walker-compare__stock::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: currentColor;
}

.walker-compare__reviews {
  margin-top: 2px;
  font-size: 14px;
}


/* == C9 Responsive ========================================================= */
@media (max-width: 1199.98px) {
  .walker-catalog__grid {
    column-gap: 30px;
  }
}

@media (max-width: 991.98px) {
  .walker-catalog__grid {
    --grid-cols: 2;
    gap: 2.5rem 20px;
  }

  .walker-brand-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }

  .walker-compare__table {
    --compare-head: 150px;
    --compare-col: 210px;
  }

  .walker-compare__table th,
  .walker-compare__table td {
    padding: 14px 16px;
  }
}

@media (max-width: 575.98px) {
  .walker-catalog-head {
    padding-bottom: 2.25rem;
  }

  .walker-catalog-head .breadcrumb {
    margin-bottom: 1.25rem;
  }

  .walker-catalog-head__desc {
    font-size: 1rem;
  }

  .walker-catalog-head__refine {
    flex-wrap: nowrap;
    justify-content: flex-start;
    margin-right: calc(var(--page-gutter) * -1);
    margin-left: calc(var(--page-gutter) * -1);
    padding: 0 var(--page-gutter) 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .walker-catalog-head__refine::-webkit-scrollbar {
    display: none;
  }

  .walker-catalog-head__chip {
    flex: none;
    min-height: 40px;
    padding: 0 16px;
    font-size: 15px;
  }

  .walker-toolbar {
    margin-bottom: 1.5rem;
  }

  .walker-toolbar__count {
    font-size: 15px;
  }

  .walker-toolbar__row {
    gap: 10px;
  }

  .walker-toolbar__pill {
    height: 50px;
    padding: 0 22px;
    font-size: 16px;
  }

  .walker-toolbar__pill .walker-icon {
    width: 20px;
    height: 20px;
  }

  .walker-select-pill {
    flex: 0 1 210px;
    min-width: 0;
    padding: 0;
  }

  .walker-select-pill__select {
    padding: 0 48px 0 20px;
  }

  .walker-select-pill__icon {
    right: 20px;
    margin-top: -10px;
  }

  .walker-catalog__grid {
    column-gap: 14px;
  }

  .walker-catalog__pagination {
    margin-top: 3rem;
  }

  .walker-catalog__pagination .pagination {
    padding: 6px 8px;
  }

  .walker-catalog__pagination .page-link {
    min-width: 28px;
    padding: 0 4px;
  }

  .walker-catalog__pagination .page-item--edge:has(.walker-pagination__double) {
    display: none;
  }

  .walker-searchbar {
    margin-top: -.5rem;
    margin-bottom: 2.5rem;
  }

  .walker-searchbar__input.form-control {
    height: 56px;
    padding-right: 66px;
    padding-left: 22px;
    font-size: 16px;
  }

  .walker-searchbar__submit.btn-walker {
    width: 44px;
    padding: 0;
  }

  .walker-searchbar__submit-text {
    display: none;
  }

  .walker-searchbar__options {
    justify-content: flex-start;
  }

  .walker-brand-tile__media {
    min-height: 110px;
    padding: 18px 16px 8px;
  }

  .walker-brand-tile__media img {
    max-height: 64px;
  }

  .walker-brand-tile__word {
    font-size: 1.375rem;
  }

  .walker-brand-tile__info {
    flex-direction: column;
    align-items: center;
    gap: 0;
    padding: 0 12px 14px;
    font-size: 15px;
  }

  .walker-brand-tile__count {
    font-size: 13px;
  }

  .walker-catalog-empty {
    padding: 2.5rem 1.25rem;
  }
}

/* Dark scheme: brand tiles keep a white plate for logos */
[data-scheme="dark"] .walker-brand-tile {
  border-color: rgb(var(--color-border));
}