/* =========================================================
   ME AJAX SEARCH — CLEAN FINAL (Lensfiyat)
   ✔ Tasarım var
   ✔ Dropdown çalışır
   ✔ JS davranışına dokunmaz
   ✔ Çakışma yok
========================================================= */

#me_search *{ box-sizing:border-box; }

#me_search{
  position:relative;
  z-index:10;
}

/* ================= SEARCH BAR (CAPSULE) ================= */

#me_search .me_seach_dropdown{
  display:flex;
  align-items:center;
  width:100%;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 8px 22px rgba(0,0,0,.10);
}

/* INPUT */
#me_search .me-search-input{
  flex:1;
  position:relative; /* dropdown referansı */
}

#me_search .input-lg{
  width:100%;
  height:46px;
  border:none;
  background:#fff;
  padding:0 16px;
  font-size:14px;
  color:#111;
}

#me_search .input-lg::placeholder{
  color:#9ca3af;
}

/* CATEGORY */
#me_search .searchcategories{
  height:46px;
  border:none;
  border-left:1px solid #eee;
  padding:0 16px;
  font-size:14px;
  background:#fff;
  color:#111;
  min-width:160px;
  appearance:none;
}

/* BUTTON */
#me_search .btn-me-search{
  height:46px;
  width:56px;
  border:none;
  border-left:1px solid #eee;
  background:#facc15;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

/* CLEAR ICON */
#me_search .clearable__clear{
  display:none; /* başlangıçta gizli */
  position:absolute;
  right:60px;
  top:50%;
  transform:translateY(-50%);
  font-size:14px;
  color:#9ca3af;
  cursor:pointer;
  z-index:20;
  width:22px;
  height:22px;
  line-height:22px;
  text-align:center;
  border-radius:50%;
  background:#fff;
}

/* EXTRA SEARCH ICONLARI KAPAT */
.search-trigger,
.dropdown-toggle.search-trigger,
.header-search,
#search_toggle,
.mobile-search-icon{
  display:none !important;
}

/* ================= DROPDOWN STYLING ================= */
/* ⚠️ display / visibility / opacity AYARLANMIYOR */

#me_search .me_dropdown{
  margin-top:6px;
}

#me_search .me_dropdown .dropdown-menu{
  border-radius:14px;
  border:1px solid #e5e7eb;
  box-shadow:0 12px 30px rgba(0,0,0,.14);
  overflow:hidden;
}

/* Ürün satırı */
#me_search .me_image{ float:left; width:20%; padding:0 10px; }
#me_search .me_caption{ float:left; width:80%; padding:0 10px; }

#me_search .me_caption h4{
  font-size:13px;
  font-weight:600;
  margin:4px 0 6px;
}

#me_search .me_caption .price-new{ font-weight:700; }
#me_search .me_caption .price-old{
  color:#9ca3af;
  text-decoration:line-through;
  margin-left:10px;
}

/* ================= MOBILE ================= */

@media (max-width:768px){

  .header-main{
    position:relative;
    padding-bottom:64px;
  }

  #me_search{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    bottom:-14px;
    width:94%;
  }

  #me_search .searchcategories{
    min-width:120px;
    padding:0 10px;
    font-size:13px;
  }

}
/* ================= FLEX ORDER FIX ================= */

/* Flex container */
#me_search .me_seach_dropdown{
  display:flex;
  align-items:center;
}

/* Sıra düzeni */
#me_search .me-search-input{ order:1; flex:1; }
#me_search .searchcategories{ order:2; width:180px; }
#me_search .btn-me-search{ order:3; }

/* Kategori inputu ezmesin */
#me_search .searchcategories{
  flex:0 0 180px;
}

/* Input kesin görünsün */
#me_search .me-search-input{
  min-width:120px;
}
/* =========================================
   MOBILE SEARCH FLEX FIX
========================================= */
@media (max-width:768px){

  #me_search .me_seach_dropdown{
    display:flex;
    width:100%;
  }

  #me_search .me-search-input{
    flex:1 1 auto;
    min-width:0;
  }

  #me_search .searchcategories{
    flex:0 0 110px;   /* sabit ama küçük */
    width:auto;
    padding:0 8px;
    font-size:13px;
  }

  #me_search .btn-me-search{
    flex:0 0 44px;    /* buton garanti görünsün */
    width:auto;
  }
}
/* =========================================
   MOBILE SEARCH POSITION FIX (CRITICAL)
========================================= */
@media (max-width:768px){

  #me_search{
    position:relative !important;   /* absolute KALDIR */
    left:auto !important;
    transform:none !important;
    bottom:auto !important;
    width:100% !important;
    margin:10px auto 0;
  }

  .header-main{
    padding-bottom:0 !important;   /* eski boşluk hackini iptal */
  }
}
/* =========================================
   MOBILE SEARCH COMPACT DESIGN
========================================= */
@media (max-width:768px){

  /* Üstten biraz aşağı al */
  #me_search{
    margin:6px auto 12px !important;
    width:92% !important;
  }

  /* Arama barının yüksekliği küçülsün */
  #me_search .input-lg{
    height:40px !important;
    font-size:13px !important;
  }

  #me_search .searchcategories{
    height:40px !important;
    min-width:110px !important;
    font-size:12px !important;
    padding:0 10px !important;
  }

  #me_search .btn-me-search{
    height:40px !important;
    width:46px !important;
  }

  /* Kapsül daha zarif */
  #me_search .me_seach_dropdown{
    border-radius:12px !important;
    box-shadow:0 6px 16px rgba(0,0,0,.08) !important;
    margin:88px auto -10px auto 
  }
}
/* =========================================
   MOBILE SEARCH POSITION FIX
   Header sabit — sadece arama aşağı insin
========================================= */
@media (max-width:768px){

  #me_search{
    bottom:-36px !important;   /* aşağı indiriyoruz */
  }

}
/* =========================================
   MOBILE SEARCH FIX — HEADER ALTINA OTURT
   Slider üstüne çıkmasın
========================================= */
@media (max-width:768px){

  #me_search{
    position:relative !important;   /* absolute iptal */
    left:auto !important;
    transform:none !important;
    bottom:auto !important;
    width:94%;
  }

  .header-main{
    padding-bottom:0 !important;    /* eski boşluk hack'lerini iptal */
  }

}
/* =========================================
   ME SEARCH DROPDOWN — SEPETE EKLE BUTTON
========================================= */
#me_search .me_dropdown a.btn.btn-me_search{
    background:#17aa78 !important;
    color:#fed801 !important;
    border:none !important;
    font-weight:600;
    text-transform:none !important;
}

/* Hover da aynı */
#me_search .me_dropdown a.btn.btn-me_search:hover{
    background:#17aa78 !important;
    color:#fed801 !important;
}

#me_search .clearable__clear{
  position:absolute;
  right:60px;
  top:50%;
  transform:translateY(-50%);
  font-size:14px;
  color:#9ca3af;
  cursor:pointer;
  z-index:20;
  display:none;
  background:#fff;
  width:22px;
  height:22px;
  line-height:22px;
  text-align:center;
  border-radius:50%;
}
#me_search ul.me_dropdown:empty{
  display:none !important;
  padding:0 !important;
  margin:0 !important;
  height:0 !important;
}