/* ==========================================================================
   Ampulcu — Mega Menü v3 (ampulcu.com yeni menüsü, 2026-10-07)
   Kaynak: Kod Stüdyosu → parcacik/header_menu_serit.twig
   Çekirdeğin menü HTML'i AYNEN basılır; bu blok yalnız görünümü değiştirir.
     · Kökler "Mega açılır menü" (menu_sablon = 2): ızgarada sütun başlığı +
       alt bağlantılar. Linksiz sütun başlığı (url boş) gri etiket olur.
     · "Kategoriler" kökü "Standart açılır menü" (menu_sablon = 1): gri dikey liste.
   Betik: linksiz kökün yarım "void(0" bağlantısını kaldırır, 6+ alt bağlantılı
   sütuna kırmızı "Tümünü Gör" ekler. Betik çalışmasa da menü düzgün kalır.
   ⚠ font-size / padding'de !important ŞART: çekirdeğin responsive.css'i
   (1152x864.css, 1280x1024.css) 1152-1360px arasında menüdeki HER span'e
   font-size:12px !important + padding:9px !important basıyor.
   ========================================================================== */

:root{
  --amm-turuncu:#ff6000;
  --amm-kirmizi:#dc2626;
  --amm-siyah:#000;
  --amm-gri:#6b7280;
  --amm-cizgi:#e5e7eb;
  --amm-liste:#f3f4f6;
  --amm-golge:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
}

/* Menü şeridi: beyaz, ince çizgi + hafif gölge. Paneller şerit kabı
   genişliğinde açılır (logo ve sepet hizasıyla aynı sınırlar). */
html body .top-level-menu-main-div{
  background:#fff;border-top:1px solid #f9fafb;border-bottom:1px solid #f9fafb;
  box-shadow:0 1px 2px 0 rgba(0,0,0,.05)!important;
}
html body .top-level-menu-main-div-in{position:relative}
html body .top-level-menu{position:static}
html body .head-new-area-right a{white-space:nowrap}

/* 1) Kök bağlantılar ------------------------------------------------------ */
html body .top-level-menu > li{position:static}
html body .top-level-menu > li[style*="relative"]{position:relative!important}
html body .top-level-menu > li > a{display:block;text-decoration:none}
html body .top-level-menu > li > a > span,
html body .top-level-menu > li:hover > a > span,
html body .top-level-menu > li:focus-within > a > span{
  display:flex;align-items:center;gap:4px;
  font-size:14px!important;line-height:20px;padding:12px 16px!important;
  font-weight:500;letter-spacing:normal;white-space:nowrap;color:var(--amm-siyah);
  transition:color .15s ease;
}
html body .top-level-menu > li:first-child > a > span{padding-left:0!important}
html body .top-level-menu > li:hover > a > span,
html body .top-level-menu > li:focus-within > a > span{color:var(--amm-turuncu)}
html body .top-level-menu > li > a > span i{display:none}
html body .top-level-menu > li > a:not([href]){cursor:default}

/* "Kategoriler" (standart açılır menü) kökünün önünde liste simgesi */
html body .top-level-menu > li[style*="relative"] > a > span::before{
  content:"";flex:0 0 20px;width:20px;height:20px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5'/%3E%3C/svg%3E") center/20px 20px no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5m0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5'/%3E%3C/svg%3E") center/20px 20px no-repeat;
}

/* 2) Mega panel (menu_sablon = 2) ----------------------------------------- */
html body .top-level-menu > li > .sablon2-level-menu{
  display:block;position:absolute;left:0;right:0;top:100%;
  width:auto!important;max-width:none;margin:0!important;padding:24px 24px 28px;box-sizing:border-box;
  background:#fff!important;border:0;border-top:1px solid var(--amm-cizgi)!important;
  border-radius:0 0 8px 8px;box-shadow:var(--amm-golge)!important;
  max-height:calc(100vh - 210px);overflow-y:auto;scrollbar-width:thin;
  opacity:0;visibility:hidden;z-index:1000;transition:none;
}
html body .top-level-menu > li:hover > .sablon2-level-menu,
html body .top-level-menu > li:focus-within > .sablon2-level-menu{opacity:1;visibility:visible}
html body .sablon2-level-menu > .sablon2-level-menu-left{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:24px;row-gap:28px;
  width:100%;margin:0;padding:0;flex:none;
}
html body .sablon2-level-menu .sablon2-level-menu-right{display:none!important}
html body .sablon2-level-menu .sablon2-level-menu-left-item{
  display:flex;flex-direction:column;align-items:flex-start;
  width:auto;min-width:0;margin:0;padding:0;
}
html body .top-level-menu .sablon2-level-menu .sablon2-level-menu-left-item-h{
  display:block;width:auto;margin:0 0 8px;padding:0;border:0!important;
  font-size:14px;line-height:20px;font-weight:600;color:var(--amm-siyah)!important;
  text-decoration:none!important;transition:color .15s ease;
}
html body .top-level-menu .sablon2-level-menu .sablon2-level-menu-left-item-h:hover{color:var(--amm-turuncu)!important}
html body .top-level-menu .sablon2-level-menu .sablon2-level-menu-left-item-h[href=""],
html body .top-level-menu .sablon2-level-menu .sablon2-level-menu-left-item-h:not([href]){
  color:var(--amm-gri)!important;pointer-events:none;cursor:default;
}
html body .top-level-menu .sablon2-level-menu .sablon2-level-menu-left-item-s{
  display:block;width:auto;margin:0 0 4px;padding:0;
  font-size:12px;line-height:24px;font-weight:400;color:var(--amm-siyah)!important;
  text-decoration:none!important;transition:color .15s ease;
}
html body .top-level-menu .sablon2-level-menu .sablon2-level-menu-left-item-s:last-child{margin-bottom:0}
html body .top-level-menu .sablon2-level-menu .sablon2-level-menu-left-item-s:hover{color:var(--amm-turuncu)!important}
html body .top-level-menu .sablon2-level-menu .amp-mm3-tumu,
html body .top-level-menu .sablon2-level-menu .amp-mm3-tumu:hover{color:var(--amm-kirmizi)!important}
html body .top-level-menu .sablon2-level-menu .amp-mm3-tumu:hover{text-decoration:underline!important}

/* 3) Standart açılır menü (menu_sablon = 1, "Kategoriler"): gri dikey liste */
html body .top-level-menu > li > .second-level-menu{
  position:absolute;left:0;top:100%;width:270px!important;margin:0!important;padding:0!important;
  list-style:none;background:var(--amm-liste)!important;border:0!important;
  border-radius:0 0 8px 8px;box-shadow:var(--amm-golge)!important;overflow:hidden;
  opacity:0;visibility:hidden;z-index:1000;transition:none;
}
html body .top-level-menu > li:hover > .second-level-menu,
html body .top-level-menu > li:focus-within > .second-level-menu{opacity:1;visibility:visible}
html body .top-level-menu .second-level-menu > li{
  width:100%;margin:0;padding:0!important;border:0!important;background:transparent!important;
}
html body .top-level-menu .second-level-menu > li > a{
  display:flex;align-items:center;justify-content:space-between;padding:16px;
  text-decoration:none!important;transition:background-color .15s ease;
}
html body .top-level-menu .second-level-menu > li > a > p,
html body .top-level-menu .second-level-menu > li:hover > a > p{
  margin:0;font-size:14px!important;line-height:20px;font-weight:600;color:var(--amm-siyah)!important;
  transition:color .15s ease;
}
html body .top-level-menu .second-level-menu > li:hover > a{background:#fff}
html body .top-level-menu .second-level-menu > li:hover > a > p{color:var(--amm-turuncu)!important}

/* 4) Dar masaüstü: 11 kök tek satıra sığsın ------------------------------- */
@media (max-width:1360px){
  html body .top-level-menu > li > a > span,
  html body .top-level-menu > li:hover > a > span,
  html body .top-level-menu > li:focus-within > a > span{font-size:13px!important;padding:12px 12px!important}
  html body .sablon2-level-menu > .sablon2-level-menu-left{column-gap:20px}
}
@media (max-width:1150px){
  html body .top-level-menu > li > a > span,
  html body .top-level-menu > li:hover > a > span,
  html body .top-level-menu > li:focus-within > a > span{font-size:12.5px!important;padding:12px 8px!important}
  html body .sablon2-level-menu > .sablon2-level-menu-left{grid-template-columns:repeat(5,minmax(0,1fr))}
}

/* Fiyat filtresi tutamaçları (çekirdek style.css: .price-field ::-webkit-slider-thumb z-index:100) yapışkan başlığın
   ve mega menünün üstüne çıkıyordu → kendi katmanına hapsedildi (2026-10-07). */
.price-field{isolation:isolate}