/* ── Frontend SweetAlert2 Özel Stil ────────────────────────────
   Site ana rengi: #F5C34B (altın sarı)
   ─────────────────────────────────────────────────────────── */

/* Genel popup */
.swal2-popup {
  font-family: 'Nunito', 'Segoe UI', Arial, sans-serif !important;
  border-radius: 18px !important;
  padding: 32px 28px 28px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.18) !important;
  border: none !important;
  max-width: 420px !important;
}

/* Başlık */
.swal2-title {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #1a1a2e !important;
  padding: 0 !important;
  margin-bottom: 8px !important;
  line-height: 1.3 !important;
}

/* İçerik metni */
.swal2-html-container,
.swal2-content {
  font-size: 14px !important;
  color: #5a5f7a !important;
  line-height: 1.6 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* İkon alanı */
.swal2-icon {
  width: 62px !important;
  height: 62px !important;
  margin: 0 auto 18px !important;
  border-width: 3px !important;
}

/* Başarı ikonu — site sarısı */
.swal2-icon.swal2-success {
  border-color: #F5C34B !important;
  color: #F5C34B !important;
}
.swal2-icon.swal2-success .swal2-success-ring {
  border-color: rgba(245,195,75,.25) !important;
}
.swal2-icon.swal2-success [class^=swal2-success-line] {
  background-color: #F5C34B !important;
}

/* Hata ikonu */
.swal2-icon.swal2-error {
  border-color: #ff4d6a !important;
  color: #ff4d6a !important;
}
.swal2-icon.swal2-error [class^=swal2-x-mark-line] {
  background-color: #ff4d6a !important;
}

/* Uyarı ikonu */
.swal2-icon.swal2-warning {
  border-color: #ff9500 !important;
  color: #ff9500 !important;
}

/* Bilgi ikonu */
.swal2-icon.swal2-info {
  border-color: #3a86ff !important;
  color: #3a86ff !important;
}

/* Onay (Confirm) butonu — altın sarı */
.swal2-confirm {
  background: linear-gradient(135deg, #F5C34B 0%, #e8a820 100%) !important;
  color: #1a1a2e !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  padding: 11px 28px !important;
  border-radius: 50px !important;
  border: none !important;
  box-shadow: 0 4px 15px rgba(245,195,75,.4) !important;
  transition: all .2s ease !important;
  letter-spacing: .3px !important;
}
.swal2-confirm:hover {
  background: linear-gradient(135deg, #e8a820 0%, #d4940f 100%) !important;
  box-shadow: 0 6px 20px rgba(245,195,75,.55) !important;
  transform: translateY(-1px) !important;
}
.swal2-confirm:focus {
  box-shadow: 0 0 0 3px rgba(245,195,75,.35) !important;
}

/* İptal butonu */
.swal2-cancel {
  background: #f0f2f7 !important;
  color: #5a5f7a !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 11px 24px !important;
  border-radius: 50px !important;
  border: none !important;
  transition: all .2s ease !important;
}
.swal2-cancel:hover {
  background: #e0e4f0 !important;
  color: #333 !important;
}

/* Buton grubu boşluğu */
.swal2-actions {
  margin-top: 22px !important;
  gap: 10px !important;
}

/* Timer progress bar */
.swal2-timer-progress-bar {
  background: linear-gradient(135deg, #F5C34B, #e8a820) !important;
  height: 4px !important;
  border-radius: 2px !important;
}
.swal2-timer-progress-bar-container {
  border-radius: 0 0 18px 18px !important;
}

/* Miktar block — flexbox düzeni, position:absolute buton sorunları giderildi */
.quantity-block.home_page_sidebar {
  display: flex !important;
  align-items: center !important;
  overflow: visible !important;
  padding: 0 4px !important;
  height: 42px !important;
  box-sizing: border-box !important;
  gap: 2px !important;
}

/* Miktar butonları — normal akış (position:absolute değil) */
.quantity-block.home_page_sidebar .quantity-arrow-minus2,
.quantity-block.home_page_sidebar .quantity-arrow-plus2 {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  flex: 0 0 30px !important;
  width: 30px !important;
  height: 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  border-radius: 50% !important;
  outline: none !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  padding: 0 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #041E42 !important;
}

.quantity-block.home_page_sidebar .quantity-arrow-minus2:hover,
.quantity-block.home_page_sidebar .quantity-arrow-plus2:hover {
  background: #F3F5F6 !important;
}

.quantity-block.home_page_sidebar .quantity-arrow-minus2 img {
  width: 12px !important;
  height: 12px !important;
  pointer-events: none !important;
}

/* Miktar input */
.quantity-block.home_page_sidebar .quantity-num2 {
  flex: 1 !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: none !important;
  border: none !important;
  border-radius: 0 !important;
  outline: none !important;
  text-align: center !important;
  height: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #041E42 !important;
  -moz-appearance: textfield !important;
}

.quantity-block.home_page_sidebar .quantity-num2::-webkit-inner-spin-button,
.quantity-block.home_page_sidebar .quantity-num2::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* Detay sayfası sticky bar — overlay (z:9990) altında kalmalı ki cart kapanabilsin */
.detay-sticky-bar {
  z-index: 9985 !important;
}

/* Overlay — backdrop kapalı */
.swal2-backdrop-show {
  background: rgba(0,0,0,0) !important;
  backdrop-filter: none !important;
  pointer-events: none !important;
}
.swal2-container:not(.swal2-top-end):not(.swal2-top-right) {
  pointer-events: auto !important;
}

/* Animasyon */
.swal2-show {
  animation: swal2-custom-show .28s cubic-bezier(.18,.89,.32,1.28) !important;
}
.swal2-hide {
  animation: swal2-custom-hide .2s ease-in forwards !important;
}
@keyframes swal2-custom-show {
  from { opacity:0; transform:scale(.88) translateY(12px); }
  to   { opacity:1; transform:scale(1)  translateY(0); }
}
@keyframes swal2-custom-hide {
  from { opacity:1; transform:scale(1); }
  to   { opacity:0; transform:scale(.92); }
}


/* ══════════════════════════════════════════════════════════════
   MEGA MENÜ — PC ONLY (≥ 992px)  —  Mobil menüye dokunmaz
   ══════════════════════════════════════════════════════════════ */
@media (min-width: 992px) {

  /* ── 0. Header stacking context ─────────────────────────────
     Backdrop body'de z-index:999. Header'a z-index:10000 vererek
     header (ve içindeki dropdown) her zaman backdrop'un üstünde
     kalır. position:relative layout'u bozmaz.                 */
  header.header-nav {
    position: relative !important;
    z-index:  10000   !important;
  }

  /* ── 1. Dropdown panel ───────────────────────────────────────
     Yatay padding YOK — her kolon kendi padding'ini taşır.
     left:0 right:0 ile Bootstrap .row margin'i sorun çıkarmaz. */
  li.megamenu_style.menu-active  > ul.dropdown-megamenu {
    display:         flex !important;
    flex-wrap:       wrap !important;
    align-items:     flex-start !important;
    padding:         0 !important;
    left:            0 !important;
    right:           0 !important;
    width:           auto !important;
    margin:          0 !important;
    box-sizing:      border-box !important;
    z-index:         99999 !important;
    background:      #fff !important;
    box-shadow:      0 8px 30px rgba(0,0,0,.12) !important;
    border-top:      2px solid #F5C34B !important;
    position:        absolute !important;
  }

  /* ── 2. Kategori kolonları — eşit genişlik ──────────────────*/
  .dropdown-megamenu > li.mega_menu_list {
    float:     none !important;
    flex:      1 1 0 !important;
    min-width: 150px !important;
    max-width: 280px !important;
    width:     auto !important;
    padding:   24px 16px 24px !important;
    box-sizing: border-box !important;
  }

  /* ── 3. Kategori görseli ────────────────────────────────────*/
  .dropdown-megamenu .mega_menu_list .megamenu-cat-img {
    display:         flex;
    align-items:     center;
    justify-content: center;
    height:          130px;
    margin:          0 0 12px;
    overflow:        hidden;
    background:      #ffffff;
    border-radius:   8px;
  }
  .dropdown-megamenu .mega_menu_list .megamenu-cat-img a {
    display: flex; align-items: center; justify-content: center;
    width: 100%; height: 100%;
  }
  .dropdown-megamenu .mega_menu_list .megamenu-cat-img img {
    max-height: 118px;
    max-width:  88%;
    object-fit: contain;
    transition: transform .3s ease;
  }
  .dropdown-megamenu .mega_menu_list:hover .megamenu-cat-img img {
    transform: scale(1.07);
  }
  /* Resim linki üzerinde underline animasyonu kapat */
  .dropdown-megamenu .megamenu-cat-img a::before { display: none !important; }

  /* ── 4. Üst kategori başlığı ────────────────────────────────*/
  .dropdown-megamenu .mega_menu_list h4.title {
    background:    none !important;
    border:        none !important;
    border-bottom: 1px solid #eef0f4 !important;
    padding:       0 0 8px !important;
    margin:        0 0 10px !important;
    font-size:     14px !important;
    font-weight:   900 !important;
    line-height:   1.3 !important;
    letter-spacing: .2px;
  }
  .dropdown-megamenu .mega_menu_list h4.title a {
    color:           #1a1a2e !important;
    text-decoration: none !important;
    display:         block;
    position:        relative;
    z-index:         1;
  }
  .dropdown-megamenu .mega_menu_list h4.title a::before { display: none !important; }
  .dropdown-megamenu .mega_menu_list h4.title a:hover { color: #F5C34B !important; }
  .dropdown-megamenu .mega_menu_list h4.title a::after {
    content: ' ›'; font-size: 14px; opacity: 0; transition: opacity .15s;
  }
  .dropdown-megamenu .mega_menu_list h4.title a:hover::after { opacity: 1; }

  /* ── 5. Alt kategori linkleri ───────────────────────────────*/
  .dropdown-megamenu .mega_menu_list > ul.sub-menu {
    list-style: none !important;
    padding:    0 !important;
    margin:     0 !important;
    float:      none !important;
    width:      100% !important;
    display:    block !important;
    position:   static !important;
    box-shadow: none !important;
    border:     none !important;
  }
  .dropdown-megamenu .mega_menu_list > ul.sub-menu > li {
    padding: 0 !important;
    margin:  0 !important;
  }
  .dropdown-megamenu .mega_menu_list > ul.sub-menu > li > a {
    font-size:       13.5px !important;
    line-height:     1.45 !important;
    padding:         4px 0 !important;
    color:           #4a4f6a !important;
    display:         block;
    text-decoration: none !important;
    border-bottom:   none !important;
    transition:      color .15s, padding-left .15s;
  }
  .dropdown-megamenu .mega_menu_list > ul.sub-menu > li > a::before { display: none !important; }
  .dropdown-megamenu .mega_menu_list > ul.sub-menu > li > a:hover {
    color:        #1E9FF2 !important;
    padding-left: 4px !important;
  }

  /* ── 6. Manuel kapatma butonu (sağ üst köşe) ───────────────*/
  .dropdown-megamenu > li.megamenu-close-item {
    position:   absolute !important;
    top:        10px !important;
    right:      12px !important;
    flex:       none !important;
    width:      auto !important;
    padding:    0 !important;
    margin:     0 !important;
  }
  .megamenu-close-x {
    display:         flex !important;
    align-items:     center;
    justify-content: center;
    width:           28px;
    height:          28px;
    background:      #f0f0f0;
    color:           #555 !important;
    font-size:       16px;
    font-weight:     700;
    border-radius:   50%;
    text-decoration: none !important;
    transition:      background .15s, color .15s;
    line-height:     1;
  }
  .megamenu-close-x::before { display: none !important; }
  .megamenu-close-x:hover {
    background: #1a1a2e;
    color:      #F5C34B !important;
  }

  /* ── 7. Footer "Tüm Ürünler" barı ──────────────────────────
     Container'da yatay padding kalmadı → footer tam 100% gider. */
  .dropdown-megamenu > li.megamenu-footer-item {
    flex:       0 0 100% !important;
    width:      100% !important;
    max-width:  none !important;
    padding:    0 !important;
    margin:     0 !important;
    float:      none !important;
    box-sizing: border-box !important;
  }
  .megamenu-footer-btn {
    display:         flex !important;
    align-items:     center;
    justify-content: center;
    width:           100%;
    background:      #1a1a2e !important;
    color:           #F5C34B !important;
    font-size:       13px !important;
    font-weight:     700 !important;
    padding:         13px 24px !important;
    text-decoration: none !important;
    letter-spacing:  .8px;
    text-transform:  uppercase;
    transition:      background .2s;
    border-radius:   0 !important;
  }
  .megamenu-footer-btn::before { display: none !important; }
  .megamenu-footer-btn:hover {
    background: #F5C34B !important;
    color:      #1a1a2e !important;
  }

}

/* ── Megamenu koyu backdrop ─────────────────────────────────────
   Header'a append edilir → aynı stacking context.
   Dropdown z:99999 > backdrop z:1 → dropdown tıklanabilir.
   Karanlık alanda mouseover → menü kapanır.                    */
#ace-mm-backdrop {
  position:       fixed;
  left:           0;
  right:          0;
  bottom:         0;
  background:     rgba(0,0,0,.45);
  z-index:        1;
  pointer-events: auto;
  cursor:         default;
  animation:      mm-bd-in .2s ease forwards;
}
@keyframes mm-bd-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Favori Kalp İkonu ──────────────────────────────────────── */
.fav-active {
  color: #ff4961 !important;
}
.fav-btn:hover .fav-icon {
  color: #ff4961 !important;
  transition: color .2s;
}

/* Wishlist alanındaki fav-btn → li a ile aynı görünüm */
.shop_single_wishlist_area li .fav-btn {
  color: #041E42;
  font-family: 'Jost', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
}
.shop_single_wishlist_area li .fav-btn span {
  vertical-align: middle;
}

/* ── Ürün Kartı — Sepete Ekle Butonu ───────────────────────── */

/* İki buton olduğunda hover alanı biraz daha yüksek kalkar */
.shop_item:hover .shop_item_cart_btn {
  -webkit-transform: translateY(-30px) !important;
  -ms-transform: translateY(-30px) !important;
  transform: translateY(-30px) !important;
}

/* İki buton için standart yüksekliği küçült */
.shop_item .shop_item_cart_btn a.btn,
.shop_item .shop_item_cart_btn .btn-sepet-ekle {
  height: 42px !important;
  line-height: 30px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .5px !important;
}

/* SEPETE EKLE butonu stili */
.btn-sepet-ekle {
  display: block;
  width: 100%;
  background: #1a1a2e;
  color: #F5C34B;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  text-align: center;
  transition: background .2s, color .2s, transform .15s;
  box-shadow: 0 5px 20px rgba(26,26,46,.25);
}
.btn-sepet-ekle:hover {
  background: #F5C34B;
  color: #1a1a2e;
  transform: translateY(-2px);
}

/* Form'u d-grid gibi tam genişlik yap */
.shop_item_cart_btn form.d-grid {
  display: block !important;
}

/* Küçük ekranlar */
@media (max-width: 480px) {
  .swal2-popup {
    max-width: 92vw !important;
    padding: 24px 18px 20px !important;
  }
  .swal2-title { font-size: 17px !important; }
}

/* ─── Toast (sağ üst minimal bildirim) ──────────────────────── */
.swal2-popup.swal2-toast {
  padding: 10px 14px 10px 12px !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 18px rgba(0,0,0,.13) !important;
  max-width: 280px !important;
  min-width: 0 !important;
  background: #fff !important;
  border-left: 4px solid #F5C34B !important;
  align-items: center !important;
  gap: 0 !important;
}
.swal2-popup.swal2-toast.swal2-icon-success { border-left-color: #F5C34B !important; }
.swal2-popup.swal2-toast.swal2-icon-info    { border-left-color: #3a86ff !important; }
.swal2-popup.swal2-toast.swal2-icon-warning { border-left-color: #ff9500 !important; }
.swal2-popup.swal2-toast.swal2-icon-error   { border-left-color: #ff4d6a !important; }

/* İkonu gizle — sadece renkli kenar yeter */
.swal2-popup.swal2-toast .swal2-icon { display: none !important; }

/* Başlık */
.swal2-popup.swal2-toast .swal2-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1a1a2e !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  justify-content: flex-start !important;
}

/* Alt içerik */
.swal2-popup.swal2-toast .swal2-html-container {
  font-size: 12px !important;
  color: #666 !important;
  margin: 2px 0 0 !important;
  text-align: left !important;
}

/* Timer bar */
.swal2-popup.swal2-toast .swal2-timer-progress-bar-container {
  border-radius: 0 !important;
}
.swal2-popup.swal2-toast .swal2-timer-progress-bar {
  height: 2px !important;
  background: #F5C34B !important;
  border-radius: 0 !important;
}

/* Container konumu */
.swal2-container.swal2-top-end,
.swal2-container.swal2-top-right {
  top: 12px !important;
  right: 12px !important;
  padding: 0 !important;
}

/* Animasyon — yukarıdan aşağı, sağdan gelmiyor */
.swal2-popup.swal2-toast.swal2-show {
  animation: toast-in .2s ease-out !important;
}
.swal2-popup.swal2-toast.swal2-hide {
  animation: toast-out .15s ease-in forwards !important;
}
@keyframes toast-in {
  from { opacity:0; transform:translateY(-8px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes toast-out {
  from { opacity:1; transform:translateY(0); }
  to   { opacity:0; transform:translateY(-6px); }
}

/* ═══════════════════════════════════════════════════════════
   KATEGORİ — Sepete Ekle butonu
   ═══════════════════════════════════════════════════════════ */
.btn-kat-sepet {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
  padding: 9px 10px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  background: #003792;
  color: #F5C34B;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background .2s, color .2s;
  white-space: nowrap;
}
.btn-kat-sepet:hover,
.btn-kat-sepet:focus { background: #F5C34B; color: #003792; outline: none; }
.btn-kat-sepet.btn-kat-sepette { background: #28a745; color: #fff; }
.btn-kat-sepet img { width: 14px; height: 14px; flex-shrink: 0; }

/* ═══════════════════════════════════════════════════════════
   KATEGORİ — Eşit kart yüksekliği
   ═══════════════════════════════════════════════════════════ */
.col-6 .shop_item,
.col-lg-3 .shop_item,
.col-lg-4 .shop_item {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.col-6 .shop_item .details,
.col-lg-3 .shop_item .details,
.col-lg-4 .shop_item .details {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.col-6 .shop_item .details form.d-grid,
.col-lg-3 .shop_item .details form.d-grid,
.col-lg-4 .shop_item .details form.d-grid {
  margin-top: auto !important;
}

/* ═══════════════════════════════════════════════════════════
   MOBİL (≤ 575px) — küçük ekran düzeltmeleri
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 575px) {

  /* Kategori sepet butonu daha kompakt */
  .btn-kat-sepet {
    font-size: 10px;
    padding: 7px 6px;
    gap: 3px;
  }
  .btn-kat-sepet img { width: 11px; height: 11px; }

  /* Ürün detay — SEPETE EKLE & diğer butonlar */
  .cart_btn_widget .btn-thm,
  .cart_btns .btn-thm {
    font-size: 11px !important;
    padding: 8px 12px !important;
    height: auto !important;
    line-height: 1.4 !important;
    white-space: nowrap;
  }

  /* Ürün detay — miktar + buton yan yana sıkışmasın */
  .cart_btn_widget.shop_single3_style {
    flex-wrap: wrap !important;
    gap: 8px;
  }
  .cart_btn_widget.shop_single3_style form {
    width: 100%;
  }
  .cart_btn_widget.shop_single3_style form button {
    width: 100%;
    font-size: 12px !important;
    padding: 10px !important;
    height: auto !important;
    line-height: 1.4 !important;
  }
}
