/* ==========================================================================
   ELN Atölye — Masaüstü ana şerit (logo + arama + çağrı merkezi + düğmeler)
   Kaynak: Kod Stüdyosu → parcacik/header_masaustu_ana_serit.twig → stil bloğu
   Hedef: ampulcu.benomcore.com ana şerit görünümü, ELN mavisine uyarlanmış.

   Çekirdeğin HTML'i parça olarak AYNEN basılır (logo, arama AJAX'ı, zil ve
   üyelik açılırları, sepet yuvası). Bu blok yalnız görünümü değiştirir;
   betik yok, DOM'a dokunulmaz.

   KAPSAM: .header-desktop-main-div ve içi + .header-main-div yazı tipi.
   Sepet açılır kutusunun İÇİ (.cart-drop ve altı) BU DOSYADA YOK — o,
   header_sepet_acilir yuvasının işi. Burada yalnız tetikleyici (.carting > a).

   ÖZGÜLLÜK: seçiciler html body .header-main-div ile başlar. Çekirdek
   style.css, panelden üretilen site_style.css ve header-stilleri.css
   ([data-header-stil] 0,3,x / 0,4,0) yükleme sırasından bağımsız yenilir.
   !important yalnız şu yerlerde: satır içi style (header.php:67 font,
   çağrı merkezi margin-right:30px), çekirdekte !important taşıyan özellikler
   (arama odak kenarı, rozet padding/border, responsive çağrı no boyutu,
   header-stilleri arama kenar boşluğu), arama sonuç satırlarının satır içi
   renkleri.

   YERLEŞİM KURALLARI YALNIZ data-header-stil="klasik" İÇİN: panelden başka
   header stili seçilirse (iki satır, ortalı, kompakt…) onun yerleşimi
   bozulmasın; renk/köşe/yazı kuralları her stilde geçerli kalır.
   ========================================================================== */

/* 0) Belirteçler — yalnız bu şeridin içine kapsanır (diğer yuvalarla çakışmaz) */
html body .header-main-div .header-desktop-main-div{
  --eas-vurgu:#2165a7;
  --eas-koyu:#1d5993;
  --eas-acik:#eef4fa;
  --eas-cizgi:#e5e9f0;
  --eas-cizgi-soluk:#eef1f5;
  --eas-kenar:#d9dee5;
  --eas-metin:#111827;
  --eas-ikincil:#6b7280;
  --eas-soluk:#9ca3af;
  --eas-tehlike:#dc2626;
}

/* 1) Yazı tipi — header.php:67 satır içi font-family:'Solway' ezilir.
      Satır içi stil !important taşımadığı için author !important yeter.
      İkon fontları (Line Awesome .las/.lar, FontAwesome .fa) kendi
      sınıflarında font-family tanımlar; kalıtımdan etkilenmez. */
html body .header-main-div{
  font-family:Inter,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif!important;
}

/* 2) Şerit ve iç kap ------------------------------------------------------ */
html body .header-main-div .header-desktop-main-div{
  background-color:#fff;
  padding-top:14px;
  padding-bottom:14px;
}
/* 1300px sabit kap, 3% yan boşlukla 1361-1400px arası ekranlarda taşıyordu */
html body .header-main-div .header-desktop-main-div-in{
  max-width:100%;
  align-items:center;
}
html body .header-main-div .header-desktop-right-area{min-width:0}

/* 3) Logo: en fazla 64px yükseklik, dikey ortalı -------------------------- */
html body .header-main-div .header-desktop-logo-div{
  display:flex;
  align-items:center;
}
html body .header-main-div .header-desktop-logo-div a{
  display:flex;
  align-items:center;
  line-height:0;
}
html body .header-main-div .header-desktop-logo-div img{
  display:block;
  width:auto;
  height:auto;
  max-height:64px;
  max-width:260px;
}
html body .header-main-div[data-header-stil="klasik"] .header-desktop-logo-div{
  flex:0 0 auto;
  margin-right:24px;
}

/* 4) Arama kutusu -----------------------------------------------------------
      Kutu esnek: en az 430px, en fazla 560px, arada kalan yeri doldurur.
      mx-auto (Bootstrap, !important) korunur: kutu tavana ulaşırsa ortalanır.
      header-stilleri.css 1380px altında klasik için margin 16px !important
      ve input min-width 300px basıyor; aşağıdaki seçiciler onu yeniyor. */
html body .header-main-div[data-header-stil="klasik"] .header-desktop-search1{
  flex:1 1 auto;
  width:auto;
  min-width:430px;
  max-width:560px;
}
html body .header-main-div[data-header-stil="klasik"] .header-desktop-search1.mx-auto{
  margin-left:auto!important;
  margin-right:auto!important;
}
html body .header-main-div[data-header-stil="klasik"] .header-desktop-search1 form input.arama{
  display:block;
  width:100%;
  min-width:0;
  height:46px;
  margin:0;
  padding:0 52px 0 16px;
  box-sizing:border-box;
  font-size:14px;
}
html body .header-main-div .header-desktop-search1{position:relative}
html body .header-main-div .header-desktop-search1 form{
  position:relative;
  display:block;
  width:100%;
  margin:0;
}
html body .header-main-div .header-desktop-search1 form input.arama{
  border:1px solid var(--eas-kenar);
  border-radius:10px;
  background-color:#fff;
  color:var(--eas-metin);
  font-weight:400;
  outline:0;
  box-shadow:none;
  transition:border-color .15s ease,box-shadow .15s ease;
}
html body .header-main-div .header-desktop-search1 form input.arama:hover{
  border-color:#c3cad4;
}
/* site_style.css odakta border + box-shadow'u !important basıyor */
html body .header-main-div .header-desktop-search1 form input.arama:focus{
  border:1px solid var(--eas-vurgu)!important;
  box-shadow:0 0 0 3px rgba(33, 101, 167, .12)!important;
  outline:0;
}
html body .header-main-div .header-desktop-search1 form input.arama::placeholder{
  color:var(--eas-soluk);
  opacity:1;
}

/* Büyüteç düğmesi: form'un DOĞRUDAN çocuğu. "form button" yazılmadı —
   sonuç tablosundaki "Daha Fazla" düğmesi de form'un içinde. */
html body .header-main-div .header-desktop-search1 form > button{
  position:absolute;
  top:50%;
  right:5px;
  transform:translateY(-50%);
  width:38px;
  height:38px;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--eas-metin);
  font-size:22px;
  line-height:1;
  cursor:pointer;
  transition:color .15s ease,background-color .15s ease;
}
html body .header-main-div .header-desktop-search1 form > button:hover{
  color:var(--eas-vurgu);
  background-color:var(--eas-acik);
}
html body .header-main-div .header-desktop-search1 form > button:focus-visible{
  box-shadow:0 0 0 2px rgba(33, 101, 167, .35);
}
html body .header-main-div .header-desktop-search1 form > button i{
  font-size:inherit;
  line-height:1;
  color:inherit;
}

/* Canlı arama sonuçları: çekirdek tbody#listele'yi AJAX ile doldurur.
   Tablo satır içi style ile absolute + beyaz zemin + z-index 9999. */
html body .header-main-div .header-desktop-search1 table.table{
  top:calc(100% + 6px);
  left:0;
  width:100%;
  margin:0;
  border-collapse:separate;
  border-spacing:0;
  border-radius:10px;
  overflow:hidden;
}
/* Boş tabloya gölge düşmesin: yalnız satır varken çerçeve + gölge.
   (:has desteklemeyen tarayıcıda yalnız bu kural düşer, satırlar yine görünür) */
html body .header-main-div .header-desktop-search1 table.table:has(tr){
  border:1px solid var(--eas-cizgi);
  box-shadow:0 14px 36px rgba(17, 24, 39, .12);
}
html body .header-main-div .header-desktop-main-div #listele td{
  padding:8px 12px;
  border-top:1px solid var(--eas-cizgi-soluk);
  vertical-align:middle;
  font-size:13px;
}
html body .header-main-div .header-desktop-main-div #listele tr:first-child td{border-top:0}
html body .header-main-div .header-desktop-main-div #listele tr.product-item:hover{
  background-color:var(--eas-acik);
}
html body .header-main-div .header-desktop-main-div #listele tr.product-item a{
  color:var(--eas-metin)!important;
  font-weight:500;
  text-decoration:none;
}
html body .header-main-div .header-desktop-main-div #listele tr.product-item:hover a{
  color:var(--eas-vurgu)!important;
}
html body .header-main-div .header-desktop-main-div #listele tr.product-item img{
  border-radius:6px;
}
/* "Daha Fazla" satırı: çekirdek satır içi yeşil zemin (#578a4d) ve 522px
   sabit genişlikli düğme basıyor → marka rengi, tam genişlik */
html body .header-main-div .header-desktop-main-div #listele td.mx-auto{
  padding:0;
  background-color:var(--eas-vurgu)!important;
  transition:background-color .15s ease;
}
html body .header-main-div .header-desktop-main-div #listele td.mx-auto:hover{
  background-color:var(--eas-koyu)!important;
}
html body .header-main-div .header-desktop-main-div #listele .dahaFazlaButton{
  width:100%!important;
  height:38px!important;
  padding:0!important;
  border:0;
  background:transparent;
  color:#fff!important;
  font-size:14px!important;
  font-weight:600;
  cursor:pointer;
}

/* 5) Çağrı Merkezi: sade — vurgu renkli ikon, gri üst yazı, koyu numara.
      Sağında ince ayraç; düğme grubundan ayrılır. Çekirdekte satır içi
      margin-right:30px var → !important. */
html body .header-main-div[data-header-stil="klasik"] .header-desktop-call{
  flex:0 0 auto;
  width:auto;
  margin-left:24px;
  margin-right:0!important;
  padding-right:22px;
  border-right:1px solid var(--eas-cizgi);
}
html body .header-main-div .header-desktop-call{
  display:flex;
  align-items:center;
  gap:8px;
}
html body .header-main-div .header-desktop-call-i{
  display:flex;
  align-items:center;
  margin:0;
  font-size:30px;
  line-height:1;
  color:var(--eas-vurgu);
}
html body .header-main-div .header-desktop-call-i i{
  font-size:inherit;
  line-height:1;
}
html body .header-main-div .header-desktop-call-t{
  color:var(--eas-metin);
  line-height:1.2;
  white-space:nowrap;
}
html body .header-main-div .header-desktop-call-t-1{
  margin-bottom:2px;
  font-size:11px;
  font-weight:500;
  color:var(--eas-ikincil);
  letter-spacing:.01em;
}
/* responsive/1152x864.css 1152-1360px arasında 11px !important basıyor */
html body .header-main-div .header-desktop-call-t-2{
  font-size:15px!important;
  font-weight:600;
  color:var(--eas-metin);
}
html body .header-main-div .header-desktop-call-t-2 a,
html body .header-main-div .header-desktop-call-t a{
  color:var(--eas-metin);
  text-decoration:none;
  transition:color .15s ease;
}
html body .header-main-div .header-desktop-call-t-2 a:hover,
html body .header-main-div .header-desktop-call-t a:hover{
  color:var(--eas-vurgu);
  text-decoration:none;
}

/* 6) Sağ düğmeler (Bildirimler / Üyelik / Favoriler / Sepetiniz)
      İkon SOLDA, yazı SAĞDA. Seçiciler "> a" ve "> a > i": açılır kutuların
      içindeki bağlantı ve ikonlara (bell-drop, user-drop, cart-drop) SIZMAZ. */
html body .header-main-div[data-header-stil="klasik"] .header-desktop-navbutton-box{
  margin-left:22px;
}
html body .header-main-div .header-desktop-navbutton-box > a{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 0;
  color:var(--eas-metin);
  text-decoration:none;
  transition:color .15s ease;
}
html body .header-main-div .header-desktop-navbutton-box > a:hover,
html body .header-main-div .header-desktop-navbutton-box:hover > a,
html body .header-main-div .header-desktop-navbutton-box.show > a,
html body .header-main-div .header-desktop-navbutton-box > a[aria-expanded="true"]{
  color:var(--eas-vurgu);
  text-decoration:none;
}
/* Sepet açılırı: çekirdek betiği (cart_dropdown.php) Bootstrap'i
   stopPropagation ile devre dışı bırakır, .show'u yalnız .cart-drop'a
   ekler; kutu ve aria-expanded değişmez. Kart tıklamayla sabitlenip fare
   çıkınca tetikleyici yine vurgu renginde kalsın. Ayrı kural: :has
   desteklemeyen tarayıcıda yalnız bu kural düşer, yukarıdaki liste kalır. */
html body .header-main-div .header-desktop-navbutton-box:has(> .dropdown-menu.show) > a{
  color:var(--eas-vurgu);
}
html body .header-main-div .header-desktop-navbutton-box > a:focus-visible{
  color:var(--eas-vurgu);
  outline:2px solid rgba(33, 101, 167, .35);
  outline-offset:3px;
  border-radius:6px;
}
/* style.css: i{30px; margin-bottom:4px; line-height:30px}, .carting i{36px} */
html body .header-main-div .header-desktop-navbutton-box > a > i{
  flex:0 0 auto;
  width:1em;
  margin:0;
  font-size:26px;
  line-height:1;
  text-align:center;
  color:inherit;
}
/* style.css: 12px / 600 */
html body .header-main-div .header-desktop-navbutton-box > a > .header-desktop-navbutton-box-t{
  font-size:13px;
  font-weight:500;
  line-height:1.2;
  letter-spacing:-.005em;
  white-space:nowrap;
  color:inherit;
}

/* Sayaç rozetleri: ikonun sağ üstünde 18px daire.
   Sepet (count_bg_2 = button-blue) vurgu rengi, zil (count_bg = button-red)
   tehlike rengi. style.css padding ve border'ı !important basıyor.
   Rozet SAĞ kenarından sabitli (ikonun solundan 31px = 26px ikon + 5px):
   iki-üç haneli sayıda sola, ikonun üstüne doğru büyür, yazıya binmez.
   Tek hanede 13-31px aralığında kalır. Yalnız ikon basıldığında da
   (header_text_status=0) aynı noktaya düşer. */
html body .header-main-div .header-desktop-navbutton-box > a > .header-desktop-navbutton-box-count-cart,
html body .header-main-div .header-desktop-navbutton-box > a > .header-desktop-navbutton-box-count{
  position:absolute;
  top:-2px;
  left:auto;
  right:calc(100% - 31px);
  z-index:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  min-width:18px;
  height:18px;
  padding:0 5px!important;
  border:0!important;
  border-radius:9px;
  background-color:var(--eas-vurgu);
  color:#fff;
  font-size:11px;
  font-weight:600;
  line-height:1;
  font-variant-numeric:tabular-nums;
  box-shadow:0 0 0 2px #fff;
}
html body .header-main-div .header-desktop-navbutton-box > a > .header-desktop-navbutton-box-count{
  background-color:var(--eas-tehlike);
}

/* 7) Zil ve üyelik açılırları (sepet açılırı HARİÇ) — marka rengi, yumuşak
      köşe ve gölge. Genişlik çekirdekte kalır.
      KAYNAK: köşe, gölge, üst boşluk ve ok biçimi header_sepet_acilir
      yuvasındaki sepet kartından (1. bölüm + ok işareti) birebir alındı;
      üç açılır aynı dili konuşur. Değer değişecekse önce sepet yuvasında
      değiştirip buraya kopyalayın. */
html body .header-main-div .header-desktop-main-div .dropdown-menu.bell-drop,
html body .header-main-div .header-desktop-main-div .dropdown-menu.user-drop{
  margin-top:12px;
  border:1px solid var(--eas-cizgi)!important;
  border-radius:16px;
  box-shadow:0 18px 40px rgb(17 24 39 / 16%);
}
/* Ok: sepet kartıyla aynı yuvarlatılmış 14px kare. Sepette betik oku
   ikonun ortasına hizalıyor; burada betik yok, bu yüzden sepetin betiksiz
   varsayılanı (sağdan 22px) kullanıldı. Ok 16px köşe yuvarlamasının
   dışında kalır ve tetikleyicinin sağ yarısını gösterir. */
html body .header-main-div .header-desktop-main-div .dropdown-menu.bell-drop:before,
html body .header-main-div .header-desktop-main-div .dropdown-menu.user-drop:before{
  content:'';
  position:absolute;
  top:-8px;
  right:22px;
  left:auto;
  box-sizing:border-box;
  width:14px;
  height:14px;
  background:#fff;
  border:0;
  border-top:1px solid var(--eas-cizgi);
  border-left:1px solid var(--eas-cizgi);
  border-radius:4px 0 0 0;
  transform:rotate(45deg);
  z-index:1;
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-header a.button-blue{
  padding:10px 5px;
  border:1px solid var(--eas-vurgu);
  border-radius:8px!important;
  background-color:var(--eas-vurgu);
  color:#fff!important;
  font-weight:600;
  box-shadow:none;
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-header a.button-blue:hover{
  border-color:var(--eas-koyu);
  background-color:var(--eas-koyu);
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-header a.button-green{
  padding:10px 5px;
  border:1px solid var(--eas-vurgu);
  border-radius:8px!important;
  background-color:#fff;
  color:var(--eas-vurgu)!important;
  font-weight:600;
  box-shadow:none;
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-header a.button-green:hover{
  background-color:var(--eas-acik);
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-lineText{
  border-bottom-color:var(--eas-cizgi);
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-lineText-in{
  color:var(--eas-ikincil);
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-userarea-header{
  border-bottom-color:var(--eas-cizgi);
  color:var(--eas-metin);
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-link-area{
  border-top-color:var(--eas-cizgi);
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-link-area a{
  padding:7px 0;
  border-bottom-color:var(--eas-cizgi-soluk);
  color:var(--eas-metin);
  transition:color .15s ease;
}
html body .header-main-div .header-desktop-main-div .user-drop .dropdown-user-area-link-area a:hover{
  color:var(--eas-vurgu)!important;
  text-decoration:none;
}
/* Bildirim listesi (header.php:340-367, yalnız okunmamış bildirim varken
   basılır). Çekirdek: başlık #000 + #EBEBEB çizgi, tarih #558cff zemin +
   kesikli kenar, bağlantı hover'ı style.css:633'te #558cff !important. */
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-header{
  color:var(--eas-metin);
  border-bottom-color:var(--eas-cizgi);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-list-box{
  border-bottom-color:var(--eas-cizgi-soluk);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-list-box-baslik{
  color:var(--eas-metin);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-list-box-baslik a{
  color:var(--eas-metin)!important;
  text-decoration:none;
  transition:color .15s ease;
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-list-box-baslik a:hover{
  color:var(--eas-vurgu)!important;
  text-decoration:none;
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-list-box-s{
  color:var(--eas-ikincil);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-list-box-date{
  border:0;
  border-radius:6px;
  background-color:var(--eas-acik);
  color:var(--eas-koyu);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-no i{
  color:var(--eas-soluk);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-no-t{
  color:var(--eas-metin);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-no-s{
  color:var(--eas-ikincil);
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-fullhref{
  border-color:var(--eas-cizgi);
  border-radius:8px;
  background-color:#f8fafc;
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-fullhref a{
  color:var(--eas-vurgu)!important;
}
html body .header-main-div .header-desktop-main-div .bell-drop .dropdown-bell-fullhref a:hover{
  color:var(--eas-koyu)!important;
  text-decoration:none;
}

/* 8) Dar masaüstü ----------------------------------------------------------
      Çekirdek kap genişlikleri: 1152-1360px → 1075px (responsive/1152x864),
      1280-1359px → 1200px (responsive/1280x1024), 1361px ve üstü → 1300px. */
@media screen and (max-width:1380px){
  html body .header-main-div[data-header-stil="klasik"] .header-desktop-search1{
    min-width:300px;
  }
}
@media screen and (max-width:1360px){
  html body .header-main-div .header-desktop-logo-div img{
    max-height:56px;
    max-width:220px;
  }
  html body .header-main-div[data-header-stil="klasik"] .header-desktop-logo-div{
    margin-right:16px;
  }
  /* responsive/1152x864: width:140px; margin 9px (sağ !important) */
  html body .header-main-div[data-header-stil="klasik"] .header-desktop-call{
    width:auto;
    margin-left:16px;
    margin-right:0!important;
    padding-right:16px;
  }
  html body .header-main-div .header-desktop-call{gap:6px}
  html body .header-main-div .header-desktop-call-i{font-size:26px}
  html body .header-main-div .header-desktop-call-t-2{font-size:13px!important}
  html body .header-main-div[data-header-stil="klasik"] .header-desktop-navbutton-box{
    margin-left:16px;
  }
  html body .header-main-div .header-desktop-navbutton-box > a > i{font-size:24px}
  /* ikon 24px: rozetin sağ kenarı ikonun solundan 30px */
  html body .header-main-div .header-desktop-navbutton-box > a > .header-desktop-navbutton-box-count-cart,
  html body .header-main-div .header-desktop-navbutton-box > a > .header-desktop-navbutton-box-count{
    left:auto;
    right:calc(100% - 30px);
  }
}
/* 1024-1151px: responsive dosyası kap genişliği vermiyor (1300px kalıyor);
   üstteki max-width:100% kabı sığdırır, arama biraz daha daralabilir. */
@media screen and (max-width:1151px){
  html body .header-main-div[data-header-stil="klasik"] .header-desktop-search1{
    min-width:200px;
  }
}