/* v6.9.89 — E-Ticaret header düzeni (yalnizca masaüstü, >=901px). */
/* Yeni ogeler varsayilan olarak gizli; sadece ecommerce + masaüstünde görünür. */
.hst-ecommerce-search,
.hst-ecommerce-categories-toggle,
.hst-ecommerce-categories-dropdown,
.hst-ecommerce-contact{display:none}

@media (min-width:901px){
  /* ============================================================
   * 1) Header temel düzeltmeler: yan gölgeler/çizgiler kaldırılır.
   * ============================================================ */
  .hst-header.hst-header-layout-ecommerce{
    background:#fff;
    box-shadow:0 4px 16px -4px rgba(15,23,42,.1);
    border-left:0!important;
    border-right:0!important;
    position:relative;
  }

  /* ============================================================
   * 2) Header-inner iki satırlı ızgaraya çevrilir.
   *    Temanın !important kuralları daha yüksek özgüllükle ezilir.
   * ============================================================ */
  html body .hst-header.hst-header-layout-ecommerce > .hst-container.hst-header-inner,
  html body .hst-header.hst-header-layout-ecommerce.hst-has-woocommerce > .hst-container.hst-header-inner,
  html body .hst-header.hst-header-layout-ecommerce.hst-no-woocommerce > .hst-container.hst-header-inner{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    grid-template-rows:auto auto!important;
    column-gap:18px!important;
    row-gap:8px!important;
    align-items:center!important;
    height:auto!important;
    min-height:88px!important;
    padding:12px 0!important;
    gap:8px 18px!important;
  }

  /* Üst satır: logo | arama | ikonlar */
  html body .hst-header.hst-header-layout-ecommerce .hst-logo{grid-column:1!important;grid-row:1!important}
  html body .hst-header.hst-header-layout-ecommerce .hst-ecommerce-search{display:block!important;grid-column:2!important;grid-row:1!important;width:100%!important;max-width:640px!important;justify-self:center!important}
  html body .hst-header.hst-header-layout-ecommerce .hst-header-actions{
    grid-column:3!important;grid-row:1!important;
    position:relative!important;top:auto!important;right:auto!important;left:auto!important;
    transform:none!important;justify-self:end!important;
  }
  /* Alt satır: kategoriler butonu | menü */
  html body .hst-header.hst-header-layout-ecommerce .hst-ecommerce-categories-toggle{display:inline-flex!important;grid-column:1!important;grid-row:2!important;align-self:center!important;justify-self:start!important}
  html body .hst-header.hst-header-layout-ecommerce .hst-nav{grid-column:2/span 2!important;grid-row:2!important;flex:1!important;justify-content:flex-start!important;display:flex!important}

  /* ============================================================
   * 2b) Müşteri Hizmetleri iletişim butonu — menü sağı.
   *    Sadece hst-has-contact sınıfı varken ve e-ticaret düzeninde aktif.
   * ============================================================ */
  html body .hst-header.hst-header-layout-ecommerce.hst-has-contact .hst-nav{grid-column:2!important}
  html body .hst-header.hst-header-layout-ecommerce.hst-has-contact .hst-ecommerce-contact{
    display:flex!important;grid-column:3!important;grid-row:2!important;
    align-items:center!important;gap:10px;text-decoration:none;
    white-space:nowrap;justify-self:end!important;
  }
  .hst-ecommerce-contact-icon{
    display:flex;align-items:center;justify-content:center;
    width:36px;height:36px;border-radius:50%;flex:0 0 auto;
    font-size:16px;color:#fff;
    background:var(--hst-primary,#2563eb);
    transition:filter .15s ease;
  }
  .hst-ecommerce-contact:hover .hst-ecommerce-contact-icon{filter:brightness(.9)}
  .hst-ecommerce-contact[data-contact-type="whatsapp"] .hst-ecommerce-contact-icon{background:#25D366}
  .hst-ecommerce-contact[data-contact-type="phone"] .hst-ecommerce-contact-icon{background:var(--hst-primary,#2563eb)}
  /* v6.9.89 düzeltme — Müşteri Hizmetleri metinlerinde gerçek optik eşitlik.
   * text-align:justify / yüksek letter-spacing kullanılmaz. Bunlar özellikle
   * iki kelimelik başlıklarda yapay boşluk üretir. Başlık, JS ile gerçek
   * telefon genişliğine göre yalnızca yatay eksende ölçeklenir. */
  .hst-ecommerce-contact-text{
    display:flex;flex-direction:column;line-height:1.18;align-items:center;text-align:center;
    width:160px;min-width:160px;
    visibility:hidden;
  }
  .hst-ecommerce-contact-text.hst-width-ready{visibility:visible;}
  .hst-ecommerce-contact-text small,.hst-ecommerce-contact-text strong{
    display:block!important;width:max-content!important;max-width:none!important;
    box-sizing:border-box!important;text-align:center!important;white-space:nowrap;
    transform-origin:center center;
  }
  .hst-ecommerce-contact-text small{
    font-size:12px;color:#94a3b8;text-transform:uppercase;
    letter-spacing:.06em;
    will-change:transform;
  }
  .hst-ecommerce-contact-text strong{
    font-size:16px;color:var(--hst-primary,#2563eb);font-weight:600;
    letter-spacing:.01em;
  }
  /* İkon kapalıysa */
  .hst-has-contact.hst-no-contact-icon .hst-ecommerce-contact-icon{display:none!important}

  /* E-ticaret düzeninde telefon gizlenir (arama yerine geçer). */
  html body .hst-header.hst-header-layout-ecommerce .hst-phone{display:none!important}
  /* Arama ikonu butonu masaüstünde gereksiz. */
  html body .hst-header.hst-header-layout-ecommerce .hst-header-actions .hst-v462-search-trigger{display:none!important}

  /* ============================================================
   * 3) Temanın compact sınıfını e-ticaret header'da etkisiz kıl.
   *    Tema body.hst-header-compact eklediğinde e-ticaret düzeni
   *    etkilenmesin — kendi sınıfımızı (hst-ecommerce-compact) kullanırız.
   * ============================================================ */
  body.hst-header-compact .hst-header.hst-header-layout-ecommerce > .hst-container.hst-header-inner,
  body.hst-header-compact .hst-header.hst-header-layout-ecommerce.hst-has-woocommerce > .hst-container.hst-header-inner{
    grid-template-rows:auto auto!important;
    height:auto!important;
    min-height:88px!important;
    padding:12px 0!important;
    row-gap:8px!important;
  }
  body.hst-header-compact .hst-header.hst-header-layout-ecommerce .hst-logo{display:block!important}
  body.hst-header-compact .hst-header.hst-header-layout-ecommerce .hst-ecommerce-search{display:block!important}
  body.hst-header-compact .hst-header.hst-header-layout-ecommerce .hst-ecommerce-categories-toggle{grid-column:1!important;grid-row:2!important}
  body.hst-header-compact .hst-header.hst-header-layout-ecommerce .hst-nav{grid-column:2/span 2!important;grid-row:2!important}
  body.hst-header-compact .hst-header.hst-header-layout-ecommerce .hst-header-actions{grid-column:3!important;grid-row:1!important}

  /* ============================================================
   * 3b) E-ticaret compact modu — kendi sınıfımız.
   *    Logo ve arama gizlenir, tek satırda menü + ikonlar.
   * ============================================================ */
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce > .hst-container.hst-header-inner,
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce.hst-has-woocommerce > .hst-container.hst-header-inner{
    grid-template-columns:auto minmax(0,1fr) auto!important;
    grid-template-rows:auto!important;
    height:58px!important;
    min-height:58px!important;
    padding:6px 0!important;
    row-gap:0!important;
  }
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce .hst-logo,
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce .hst-ecommerce-search{
    display:none!important;
  }
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce .hst-ecommerce-categories-toggle{
    grid-column:1!important;grid-row:1!important;
  }
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce .hst-nav{
    grid-column:2/span 2!important;grid-row:1!important;
  }
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce .hst-header-actions{
    grid-column:3!important;grid-row:1!important;
  }
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce.hst-has-contact .hst-nav{
    grid-column:2!important;grid-row:1!important;
  }
  body.hst-ecommerce-compact .hst-header.hst-header-layout-ecommerce.hst-has-contact .hst-ecommerce-contact{
    display:none!important;
  }

  /* ============================================================
   * 4) Arama çubuğu — sade, beyaz, butonsuz (referans görsel).
   * ============================================================ */
  .hst-ecommerce-search{position:relative}
  .hst-ecommerce-search-form{
    display:flex;align-items:center;gap:10px;
    background:#fff;border:1px solid #e5e7eb;border-radius:10px;
    padding:0 16px;
    height:44px;
    transition:border-color .15s ease,box-shadow .15s ease;
  }
  .hst-ecommerce-search-form:focus-within{
    border-color:var(--hst-primary,#2563eb);
    box-shadow:0 0 0 3px rgba(37,99,235,.08);
  }
  .hst-ecommerce-search-form > i{color:#9ca3af;font-size:16px;flex:0 0 auto}
  .hst-ecommerce-search-form input{
    flex:1;min-width:0;border:0;background:transparent;outline:none;
    font-size:14px;color:#1f2937;padding:0;font-family:inherit;
  }
  .hst-ecommerce-search-form input::placeholder{color:#9ca3af}

  /* Canlı arama sonuçları — çizgisiz */
  .hst-ecommerce-search-results{
    position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:60;
    background:#fff;border-radius:10px;
    box-shadow:0 14px 40px rgba(15,23,42,.12);max-height:440px;overflow-y:auto;
  }
  .hst-ecommerce-search-results[hidden]{display:none}
  .hst-ecommerce-search-results .hst-v470-search-list{list-style:none;margin:0;padding:0}
  .hst-ecommerce-search-results .hst-v470-search-item{
    display:flex;align-items:center;gap:12px;padding:10px 14px;
    text-decoration:none;color:#1f2937;transition:background .12s ease;
  }
  .hst-ecommerce-search-results .hst-v470-search-item:hover{background:#f8fafc}
  .hst-ecommerce-search-results .hst-v470-search-thumb{width:42px;height:42px;border-radius:8px;overflow:hidden;flex:0 0 42px;background:#f1f5f9;display:grid;place-items:center}
  .hst-ecommerce-search-results .hst-v470-search-thumb img{width:100%;height:100%;object-fit:contain}
  .hst-ecommerce-search-results .hst-v470-search-item small{display:block;font-size:11px;color:#94a3b8;text-transform:uppercase;letter-spacing:.04em}
  .hst-ecommerce-search-results .hst-v470-search-item strong{display:block;font-size:14px}
  .hst-ecommerce-search-results .hst-v470-search-item .price{color:var(--hst-primary,#2563eb);font-weight:700;font-size:13px}
  .hst-ecommerce-search-results .hst-v470-search-empty{padding:18px;text-align:center;color:#94a3b8;font-size:14px}
  .hst-ecommerce-search-results .hst-v470-search-all{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:calc(100% - 0px)!important;
    box-sizing:border-box!important;
    min-height:48px!important;
    margin:0!important;
    padding:12px 16px!important;
    border:0!important;
    border-radius:10px!important;
    background:var(--hst-primary,#2563eb)!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:700!important;
    line-height:1.2!important;
    text-align:center!important;
    text-decoration:none!important;
    opacity:1!important;
    visibility:visible!important;
}
.hst-ecommerce-search-results .hst-v470-search-all:hover{
    color:#fff!important;
    filter:brightness(.94)!important;
}


  /* ============================================================
   * 5) Kategoriler butonu — geniş, sağda ok işareti.
   * ============================================================ */
  .hst-ecommerce-categories-toggle{
    align-items:center;justify-content:space-between;gap:10px;cursor:pointer;
    background:var(--hst-primary,#2563eb);color:#fff;border:0;
    padding:10px 16px;border-radius:8px;font-weight:600;font-size:13px;
    transition:filter .15s ease;font-family:inherit;
    white-space:nowrap;min-width:170px;
  }
  .hst-header-layout-ecommerce .hst-ecommerce-categories-toggle:hover{filter:brightness(.9)}
  .hst-ecommerce-categories-toggle .hst-cat-chevron{transition:transform .2s ease;font-size:11px;margin-left:auto}
  .hst-ecommerce-categories-toggle[aria-expanded="true"] .hst-cat-chevron{transform:rotate(180deg)}

  /* ============================================================
   * 6) Kategoriler açılır paneli — hover ile açılır, dikey akordiyon.
   *    Alt menüler aşağı doğru genişler (sağa değil).
   * ============================================================ */
  .hst-ecommerce-categories-dropdown{
    position:absolute;left:0;top:100%;z-index:55;
    background:#fff;
    border:1px solid #e5e7eb;border-top:0;
    box-shadow:0 18px 40px rgba(15,23,42,.12);
    display:none;
    max-height:calc(100vh - 120px);
    overflow-y:auto;overflow-x:hidden;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  .hst-ecommerce-categories-dropdown::-webkit-scrollbar{display:none}
  .hst-ecommerce-categories-dropdown.is-open{display:block}

  .hst-ecommerce-categories-dropdown .hst-container{padding:0;width:auto;max-width:none}
  .hst-ecommerce-categories-menu{
    list-style:none;margin:0;padding:4px 0;display:block;
    grid-template-columns:none;
    min-width:220px;max-width:300px;
  }
  .hst-ecommerce-categories-menu > li{display:block;position:relative}
  .hst-ecommerce-categories-menu > li > a{
    display:flex;align-items:center;justify-content:space-between;
    padding:5px 16px;color:#334155;text-decoration:none;font-size:13px;font-weight:500;
    line-height:1.4;transition:all .12s ease;
    white-space:normal;overflow-wrap:break-word;word-break:break-word;
  }
  .hst-ecommerce-categories-menu > li > a:hover{
    background:#f8fafc;color:var(--hst-primary,#2563eb);
  }
  /* Alt menü göstergesi — sağ ok */
  .hst-ecommerce-categories-menu .menu-item-has-children > a{
    font-weight:600;color:#1e293b;
  }
  /* Alt menü — her zaman açık, normal liste (akordeon yok) */
  .hst-ecommerce-categories-menu .sub-menu{
    position:static;display:block;
    background:transparent;border:none;border-radius:0;
    box-shadow:none;padding:0 0 2px 0;list-style:none;
  }
  .hst-ecommerce-categories-menu .sub-menu .sub-menu{
    padding-left:12px;
  }
  .hst-ecommerce-categories-menu .sub-menu > li > a{
    display:block;padding:4px 16px 4px 28px;color:#64748b;text-decoration:none;font-size:13px;
    line-height:1.4;transition:all .12s ease;
    white-space:normal;overflow-wrap:break-word;word-break:break-word;
  }
  .hst-ecommerce-categories-menu .sub-menu > li > a:hover{
    color:var(--hst-primary,#2563eb);background:#f1f5f9;
  }

  /* ============================================================
   * 7) Ana menü (hst-menu) hover ile aşağı açılan alt menüler.
   * ============================================================ */
  html body .hst-header.hst-header-layout-ecommerce .hst-menu{align-items:center;gap:0}
  html body .hst-header.hst-header-layout-ecommerce .hst-menu li{position:relative}
  html body .hst-header.hst-header-layout-ecommerce .hst-menu .sub-menu{
    position:absolute;top:100%;left:0;min-width:220px;
    background:#fff;border:1px solid #e5e7eb;border-radius:0 0 10px 10px;
    box-shadow:0 14px 30px rgba(15,23,42,.1);
    padding:8px;list-style:none;display:none;z-index:60;
  }
  html body .hst-header.hst-header-layout-ecommerce .hst-menu li:hover > .sub-menu,
  html body .hst-header.hst-header-layout-ecommerce .hst-menu li:focus-within > .sub-menu{display:block}
  html body .hst-header.hst-header-layout-ecommerce .hst-menu .sub-menu .sub-menu{
    top:0;left:100%;border-radius:10px;
  }
  html body .hst-header.hst-header-layout-ecommerce .hst-menu .sub-menu a{
    display:block;padding:9px 14px;color:#475569;text-decoration:none;font-size:14px;
    border-radius:8px;transition:all .12s ease;
  }
  html body .hst-header.hst-header-layout-ecommerce .hst-menu .sub-menu a:hover{
    background:#f1f5f9;color:var(--hst-primary,#2563eb);
  }
  /* Üst menü öğesinde alt menü ok işareti */
  html body .hst-header.hst-header-layout-ecommerce .hst-menu .menu-item-has-children > a::after{
    content:"\f078";font-family:"Font Awesome 6 Free";font-weight:900;
    font-size:10px;margin-left:6px;color:#94a3b8;
  }
}