/* Duyuru bandı, üst bilgi, kategori menüsü, arama, menü çekmecesi */

.announcement { background: var(--brand); color: var(--on-brand); font-size: var(--step--1); font-weight: 500; }
.announcement__inner {
  display: flex; justify-content: center; align-items: center; gap: var(--space-xl);
  min-height: 38px; padding-block: 0.4rem; text-align: center;
}
.announcement__item { display: inline-flex; align-items: center; gap: 0.45rem; margin: 0; }
.announcement__item .icon { width: 17px; height: 17px; opacity: 0.85; }
.announcement a { color: inherit; }
@media (max-width: 899px) { .announcement__item--extra { display: none; } }

.site-header { background: var(--bg); border-bottom: 1px solid var(--line); z-index: 40; position: relative; }
.shopify-section:has(> .site-header--sticky) { position: sticky; top: 0; z-index: 40; }

.site-header__bar {
  display: grid; align-items: center;
  grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: 'brand search actions';
  gap: var(--space-l); min-height: var(--header-height);
}
.site-header__menu-toggle { display: none; grid-area: menu; margin-left: -10px; }

.wordmark { grid-area: brand; display: grid; text-decoration: none; line-height: 1; }
.wordmark__name {
  font-family: var(--font-display); font-weight: var(--display-weight); letter-spacing: var(--display-tracking);
  font-size: 1.7rem; line-height: 1; color: var(--ink); white-space: nowrap;
}
.wordmark__sub { margin-top: 4px; font-size: 0.72rem; font-weight: 600; color: var(--brand); white-space: nowrap; }
.wordmark__logo { height: auto; }

/* Arama: hap biçimli alan, tahmini sonuçlar açılır panelde */
.header-search { grid-area: search; position: relative; display: block; max-width: 640px; width: 100%; justify-self: center; }
.header-search__form { position: relative; display: flex; align-items: center; }
.header-search__input {
  width: 100%; min-height: 48px; padding: 0 3.25rem 0 1.25rem;
  border: 1.5px solid var(--line); border-radius: var(--radius-pill); background: var(--surface);
  font-size: var(--step-0); transition: border-color var(--duration-fast) var(--ease), background-color var(--duration-fast) var(--ease);
}
.header-search__input::placeholder { color: var(--muted); }
.header-search__input:hover { border-color: color-mix(in srgb, var(--ink) 30%, var(--line)); }
.header-search__input:focus-visible { outline: none; border-color: var(--brand); background: var(--bg); }
.header-search__input::-webkit-search-cancel-button { display: none; }
.header-search__submit {
  position: absolute; right: 5px; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; border-radius: 50%; border: 0; display: grid; place-items: center;
  background: var(--brand); color: var(--on-brand);
}
.header-search__submit:hover { background: var(--brand-dark); }
.header-search__submit .icon { width: 19px; height: 19px; }

.predictive {
  position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 50;
  display: grid; gap: var(--space-m); padding: var(--space-m);
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-drawer); max-height: 70vh; overflow-y: auto;
}
.predictive:empty { display: none; }
.predictive__group .label { margin-bottom: var(--space-2xs); }
.predictive__list { display: grid; gap: 2px; }
.predictive__product {
  display: flex; gap: var(--space-s); align-items: center; min-height: 60px; padding: 0.35rem; border-radius: var(--radius-s); text-decoration: none;
}
.predictive__product:hover, .predictive__product:focus-visible, .predictive__link:hover { background: var(--surface); }
.predictive__media { width: 52px; height: 52px; flex: none; border-radius: var(--radius-s); overflow: hidden; background: var(--well); }
.predictive__media img { width: 100%; height: 100%; object-fit: cover; }
.predictive__text { display: grid; }
.predictive__title { font-weight: 600; }
.predictive__price { font-size: var(--step--1); color: var(--brand); font-weight: 600; }
.predictive__link { display: flex; align-items: center; min-height: 40px; padding: 0 0.35rem; border-radius: var(--radius-s); text-decoration: none; }
.predictive__empty { margin: 0; }

/* Sağ taraf: WhatsApp, hesap, sepet */
.site-header__actions { grid-area: actions; display: flex; align-items: center; gap: var(--space-2xs); }
.header-wa {
  display: inline-flex; align-items: center; gap: 0.5rem; margin-right: var(--space-xs);
  padding: 0.35rem 0.6rem; border-radius: var(--radius-s); text-decoration: none;
}
.header-wa:hover { background: var(--surface); }
.header-wa .icon { width: 26px; height: 26px; color: #1F9D55; }
.header-wa__text { display: grid; line-height: 1.15; }
.header-wa__label { font-size: 0.72rem; color: var(--muted); font-weight: 500; }
.header-wa__number { font-weight: 700; font-size: var(--step--1); white-space: nowrap; }
.site-header__cart { gap: 0.55rem; padding-inline: 0.6rem; }
.site-header__cart-icon { position: relative; display: inline-flex; }
.site-header__cart-icon .icon { width: 26px; height: 26px; }
.site-header__account .icon { width: 25px; height: 25px; }
.cart-count {
  position: absolute; top: -6px; right: -9px; min-width: 19px; height: 19px; padding: 0 5px;
  display: inline-grid; place-items: center; border-radius: var(--radius-pill);
  background: var(--brand); color: var(--on-brand); font-size: 0.7rem; font-weight: 700; line-height: 1;
  border: 2px solid var(--bg);
}
.cart-count[hidden] { display: none; }
.site-header__cart-total { font-weight: 700; font-size: var(--step--1); white-space: nowrap; }

/* Kategori menüsü (ikinci satır) */
.category-nav { border-top: 1px solid var(--line); }
.category-nav__list {
  display: flex; gap: var(--space-2xs); overflow-x: auto; scrollbar-width: none;
  margin-inline: calc(var(--space-s) * -1);
}
.category-nav__list::-webkit-scrollbar { display: none; }
.category-nav__link {
  display: inline-flex; align-items: center; min-height: 46px; padding: 0 var(--space-s);
  font-size: var(--step--1); font-weight: 600; text-decoration: none; white-space: nowrap;
  border-bottom: 2px solid transparent;
}
.category-nav__link:hover, .category-nav__link.is-active { color: var(--brand); border-bottom-color: var(--brand); }
.category-nav__link--highlight { color: var(--brand); }
.category-nav__link--highlight::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--tag); margin-right: 0.45rem;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--tag) 35%, transparent);
}

@media (max-width: 1199px) {
  .header-wa__text { display: none; }
  .header-wa { margin-right: 0; padding: 0; min-width: 44px; min-height: 44px; justify-content: center; }
}
@media (max-width: 989px) {
  :root { --header-height: 60px; }
  .site-header__bar {
    grid-template-columns: auto 1fr auto; grid-template-areas: 'menu brand actions' 'search search search';
    gap: 0 var(--space-xs); padding-bottom: var(--space-s);
  }
  .site-header__menu-toggle { display: inline-flex; }
  .wordmark { min-height: var(--header-height); align-content: center; }
  .wordmark__name { font-size: 1.4rem; }
  .wordmark__sub { font-size: 0.66rem; }
  .header-search { max-width: none; }
  .header-search__input { min-height: 44px; }
  .header-search__submit { width: 36px; height: 36px; }
  .category-nav, .site-header__account, .site-header__cart-total, .header-wa { display: none; }
}

/* Menü çekmecesi */
.menu-drawer__list { display: grid; }
.menu-drawer__list li { border-bottom: 1px solid var(--line); }
.menu-drawer__link {
  display: flex; justify-content: space-between; align-items: center; min-height: 54px;
  font-weight: 600; text-decoration: none;
}
.menu-drawer__link .icon { width: 18px; height: 18px; color: var(--muted); }
.menu-drawer__link[aria-current='page'] { color: var(--brand); }
.menu-drawer__extra { display: grid; margin-top: var(--space-l); }
.menu-drawer__extra a { display: flex; align-items: center; min-height: 44px; color: var(--muted); text-decoration: none; }
.menu-drawer__foot { display: grid; gap: var(--space-s); }
.menu-drawer__hours { display: flex; align-items: center; gap: 0.4rem; margin: 0; }
.menu-drawer__hours .icon { width: 18px; height: 18px; }
.menu-drawer__sub { display: grid; padding: 0 0 var(--space-xs) var(--space-s); }
.menu-drawer__sub a { display: flex; align-items: center; min-height: 40px; color: var(--muted); text-decoration: none; }