/* Kirpi Kids header (Header & Footer Builder şablonu, .kk-header) ve geçici footer logo sınırı. */

/* HFE menüsü ≤1024 px'te gizlenir ama genişliğini korur; tek satırlık header'da sepeti ekran dışına iter.
   Kapalı/açık menü akıştan çıkarılır ve header'ın altında tam genişlikte açılır. */
@media (max-width:1024px){
  .kk-header{position:relative}
  .kk-header .hfe-nav-menu__breakpoint-tablet .hfe-nav-menu__layout-horizontal{
    position:absolute;left:0;right:0;top:100%;z-index:50;background:var(--kk-white);box-shadow:var(--kk-shadow-card)
  }
}
@media (max-width:767px){
  .kk-header .hfe-nav-menu__breakpoint-mobile .hfe-nav-menu__layout-horizontal{position:absolute;left:0;right:0;top:100%;z-index:50}
}

/* Ortak ızgara: Hello'nun içerik genişliği (1140/800 px) Elementor kutusuna (1200 px + 16 px kenar) eşitlenir.
   Böylece header, Woo sayfaları ve Elementor bölümleri aynı sol/sağ kenarı paylaşır. */
body:not([class*=elementor-page-]) .site-main,
.site-header:not(.dynamic-header),
.site-footer:not(.dynamic-footer){
  max-width:calc(var(--kk-container) + 32px);padding-inline:16px;box-sizing:border-box
}

/* Header ikon grubu: dokunma alanı en az 44 px. */
.kk-header .elementor-widget-icon .elementor-icon,
.kk-header .hfe-search-icon-toggle{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}

/* home.css'teki buton gölgesi/kalkışı header sepet butonuna uygulanmaz. */
.kk-header .elementor-button{box-shadow:none!important;transform:none!important}

/* Dar ekran: logo + menü + arama + hesap + sepet tek satıra sığar (360 px'te ölçülerek ayarlandı). */
@media (max-width:767px){
  .kk-header > .e-con-inner{gap:4px}
  .kk-header .hfe-menu-cart__toggle .elementor-button{padding:10px;min-width:44px;min-height:44px;justify-content:center}
}

/* Hello Elementor varsayılan footer'ı Site Kimliği logosunu doğal boyutunda (538 px) basıyor.
   Footer şablonu Aşama 4'te hazırlanana kadar logo sınırlandırılır. */
.site-footer .custom-logo{width:auto;max-width:100%;height:auto;max-height:48px}

/* Arama simgesi: kapalıyken görünmeyen arama kutusunun kenarlığı (kit form alanı stili) gizlenir;
   açıldığında (.hfe-input-focus) kenarlık geri gelir. */
.kk-header .hfe-search-button-wrapper:not(.hfe-input-focus) .hfe-search-form__input{border-color:transparent!important;background:transparent!important}

/* ── Header araması (Aşama 23, assets/js/header-arama.js) ──────────────────────────
   HFE'nin genişleyen alanı menüyü/logoyu örtüyordu. Betik çalışınca HFE formu gizlenir; arama satırı header'ın
   altında tam genişlikte açılır. Betik yoksa HFE formu görünür kalır. */
.kk-header{position:relative}
.kk-header.kk-search-ready .hfe-search-button-wrapper{display:none!important}
.kk-header .kk-search-toggle{
  display:inline-grid;place-items:center;width:44px;height:44px;padding:0;margin:0;cursor:pointer;
  border:0!important;border-radius:50%!important;background:transparent!important;color:var(--kk-primary)!important;box-shadow:none!important
}
.kk-header .kk-search-toggle svg{width:22px;height:22px;fill:currentColor}
.kk-header .kk-search-toggle:hover,.kk-header .kk-search-toggle[aria-expanded="true"]{background:var(--kk-sky-light)!important}
.kk-header .kk-search-toggle:focus-visible,.kk-search-panel button:focus-visible{outline:3px solid var(--kk-accent);outline-offset:2px}
.kk-search-panel{
  position:absolute;left:0;right:0;top:100%;z-index:60;padding:16px var(--kk-gutter);
  background:var(--kk-white);border-top:1px solid var(--kk-line);box-shadow:var(--kk-shadow-raised)
}
.kk-search-panel[hidden]{display:none}
.kk-search-panel__form{display:flex;align-items:center;gap:10px;max-width:760px;margin:0 auto}
.kk-header .kk-search-panel__input{
  flex:1;min-width:0;min-height:50px;margin:0;padding:0 22px;box-sizing:border-box;
  border:2px solid var(--kk-secondary)!important;border-radius:var(--kk-radius-pill)!important;background:var(--kk-white)!important;
  color:var(--kk-text)!important;font:600 16px/1.2 var(--kk-font-body)!important;box-shadow:none!important
}
.kk-header .kk-search-panel__input::placeholder{color:var(--kk-blue);opacity:1}
.kk-header .kk-search-panel__input:focus{border-color:var(--kk-primary)!important;outline:3px solid rgba(255,196,68,.55);outline-offset:1px}
.kk-header .kk-search-panel__submit{
  flex:none;min-height:50px;padding:0 26px;margin:0;cursor:pointer;
  border:0!important;border-radius:var(--kk-radius-pill)!important;background:var(--kk-primary)!important;color:var(--kk-white)!important;
  font:800 16px/1 var(--kk-font-body)!important;box-shadow:none!important;transform:none!important
}
.kk-header .kk-search-panel__submit:hover{background:var(--kk-navy-dark)!important}
.kk-header .kk-search-panel__close{
  flex:none;display:inline-grid;place-items:center;width:46px;height:46px;padding:0;margin:0;cursor:pointer;
  border:0!important;border-radius:50%!important;background:transparent!important;color:var(--kk-primary)!important;box-shadow:none!important
}
.kk-header .kk-search-panel__close svg{width:20px;height:20px;fill:currentColor}
.kk-header .kk-search-panel__close:hover{background:var(--kk-sky-light)!important}
@media (max-width:480px){
  .kk-search-panel{padding:12px}
  .kk-search-panel__form{gap:6px}
  .kk-header .kk-search-panel__input{padding:0 16px}
  .kk-header .kk-search-panel__submit{padding:0 18px}
  .kk-header .kk-search-panel__close{width:44px;height:44px}
}
@media (prefers-reduced-motion:no-preference){
  .kk-search-panel:not([hidden]){animation:kk-search-in .18s var(--kk-ease)}
  @keyframes kk-search-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
}

/* ── Masaüstü menü (Aşama 23): yarı kalın yazı, etkin sayfada sarı alt çizgi (referans) ── */
@media (min-width:1025px){
  .kk-header .hfe-nav-menu__layout-horizontal .hfe-menu-item{font-weight:600}
  .kk-header .hfe-nav-menu__layout-horizontal .current-menu-item > .hfe-menu-item,
  .kk-header .hfe-nav-menu__layout-horizontal .current-menu-ancestor > .hfe-menu-item{
    color:var(--kk-primary);font-weight:800;
    text-decoration:underline 3px var(--kk-accent);text-underline-offset:10px;text-decoration-skip-ink:none
  }
  .kk-header .hfe-nav-menu__layout-horizontal .hfe-menu-item:hover{text-decoration:underline 3px rgba(255,196,68,.5);text-underline-offset:10px}
}

/* Mobil/tablet açılır menü: marka yazısı, etkin sayfa vurgusu (Aşama 10). */
@media (max-width:1024px){
  .kk-header .hfe-nav-menu__layout-horizontal .hfe-menu-item{font-weight:700;padding-inline:20px}
  .kk-header .hfe-nav-menu__layout-horizontal .current-menu-item > .hfe-menu-item{background:var(--kk-sky-light);color:var(--kk-primary)}
}
