/* ==========================================================================
   1. SEPET BUTONU & BUBBLE (ADET) TASARIMI
   ========================================================================== */
.cart-btn {
  border: none;
  background: transparent;
  position: relative;
}

.cart-btn .cart-items {
  position: absolute;
  right: -1rem;
  top: -0.875rem;
  padding: 0 6px;
  font-size: 0.875rem;
  border-radius: 30%;
  background-color: #FFB338;
  color: #fff;
  font-weight: bold;
}

.cart-btn .fa-cart-shopping {
  font-size: 1.2rem;
  color: #fff;
}

/* ==========================================================================
   2. ÜRÜN KARTLARI LİSTELEME ALANI
   ========================================================================== */
.product-area {
  margin-top: 3.5rem;
}

.product-area-title {
  font-size: 3rem;
  font-family: 'Times New Roman', Times, serif;
  font-weight: bold;
  text-align: center;
}

@media (max-width: 768px) {
  .product-area-title {
    font-size: 2rem;
  }
}

.product-area .product {
  position: relative;
  margin-bottom: 1rem;
  border: 4px solid transparent;
  border-radius: 0.875rem;
  -webkit-transition: .5s ease all;
  transition: .5s ease all;
}

.product-area .product-image > img {
  width: 100%;
  border-radius: 0.625rem;
}

.product-area .product-hover {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: absolute;
  bottom: 0;
  background: -webkit-gradient(linear, left bottom, left top, from(#181813), color-stop(174.29%, rgba(24, 24, 19, 0)));
  background: linear-gradient(0deg, #181813 100%, rgba(24, 24, 19, 0) 174.29%);
  border-radius: 0px 0px 10px 10px;
  padding: 1rem;
  opacity: 0;
  -webkit-transition: .5s ease all;
  transition: .5s ease all;
}

.product-area .product-hover .product-title {
  color: #fff;
  font-family: 'Jacques Francois', serif; 
}

.product-area .product-hover .product-price {
  text-align: center;
  color: #fff;
  font-family: 'Jacques Francois', serif;
}

.product-area .product-hover .btn-add-to-cart {
  width: 2.625rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: #FFB338;
  border-radius: 30%;
  border: 3px solid transparent;
  -webkit-transition: .5s ease all;
  transition: .5s ease all;
}

.product-area .product-hover .btn-add-to-cart:focus {
  border-color: #fff;
}

.product-area .product-hover .btn-add-to-cart > .fa-cart-shopping {
  color: #fff;
  pointer-events: none;
}

.product-area .product:hover {
  border-color: #FFB338;
}

.product-area .product:hover .product-hover {
  opacity: 1;
}

/* ==========================================================================
   3. BOOTSTRAP OFFCANVAS (SEPET PANELİ) VE İÇERİK YAPISI
   ========================================================================== */
.offcanvas-header {
  padding: 1.25rem;
}

.offcanvas-body {
  padding: 0;
}

.shopping-cart .cart-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Kırılmayı önlemek için flex yapısı korumaya alındı */
.shopping-cart .cart-list-item {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  column-gap: 1rem;
  padding: 1.25rem;
  border-top: 1px solid #E6E6E6;
  width: 100% !important;
  box-sizing: border-box !important;
}

.shopping-cart .cart-list-item:last-child {
  border-bottom: 1px solid #E6E6E6;
}

.shopping-cart .cart-list-item .cart-left {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  column-gap: 1rem;
}

.shopping-cart .cart-list-item .cart-left-image > img {
  height: 60px;
  display: block;
}

.shopping-cart .cart-list-item .cart-left-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.shopping-cart .cart-list-item .cart-left-info-title {
  font-size: 0.75rem;
  text-decoration: none;
  color: #000000;
}

.shopping-cart .cart-list-item .cart-left-info-price {
  font-size: 0.875rem;
  font-weight: bold;
}

.shopping-cart .cart-list-item .cart-right {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  column-gap: 1rem;
}

.shopping-cart .cart-list-item .cart-right-quantity {
  display: flex !important;
  align-items: center !important;
  padding: 6px 8px;
  border: 1px solid #E6E6E6;
  column-gap: 1rem;
  border-radius: 8px;
  font-size: 0.875rem;
}

.shopping-cart .cart-list-item .cart-right-quantity button {
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  padding: 2px 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.shopping-cart .cart-list-item .cart-right-quantity .quantity-minus .fa-minus {
  pointer-events: none;
  font-size: 0.875rem;
}

.shopping-cart .cart-list-item .cart-right-quantity .quantity-plus .fa-plus {
  pointer-events: none;
  font-size: 0.875rem;
}

.shopping-cart .cart-list-item .cart-right-remove .cart-remove-btn {
  background: #cf0101;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 100%;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: none !important;
  cursor: pointer !important;
}

.shopping-cart .cart-list-item .cart-right-remove .cart-remove-btn .fa-trash {
  color: #fff;
  font-size: 0.875rem;
  pointer-events: none;
}

/* ==========================================================================
   4. SEPET ALTI VE BUTONLAR
   ========================================================================== */
.shopping-cart-bottom {
  padding: 1.25rem;
}

.shopping-cart-bottom .total {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.shopping-cart-bottom .total .total-title {
  font-size: 1.125rem;
  font-weight: bold;
}

.shopping-cart-bottom .total .total-value {
  font-size: 1.125rem;
}

.shopping-cart-bottom .btn-clear {
  font-weight: bold;
  width: 100%;
  background: #FFB338;
  color: #fff;
  padding: 0.812rem 0;
  border-radius: 4px;
  margin-top: 1rem;
  display: block !important;
  text-align: center !important;
  border: none !important;
}

.shopping-cart-bottom .btn-checkout {
  font-weight: bold;
  width: 100%;
  background: #1965E0;
  color: #fff;
  padding: 0.812rem 0;
  border-radius: 4px;
  margin-top: 1rem;
  display: block !important;
  text-align: center !important;
  border: none !important;
}

/* Z-Index Ayarları */
.btn-add-to-cart * { pointer-events: none !important; }
.offcanvas.offcanvas-end { z-index: 100050 !important; }
.offcanvas-backdrop { z-index: 100040 !important; }
.modal { z-index: 100020 !important; }
.modal-backdrop { z-index: 100010 !important; }

/* Kapatma Butonu Tasarımı (RTL Uyumlu) */
.custom-modal-close {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background-color: #ffffff !important;
    border-radius: 50% !important;
    padding: 10px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
    opacity: 0.8 !important;
    transition: all 0.2s ease-in-out !important;
    font-size: 0.75rem !important;
}
html:not([dir="rtl"]) .custom-modal-close { right: 15px !important; left: auto !important; }
html[dir="rtl"] .custom-modal-close { left: 15px !important; right: auto !important; }

.custom-modal-close:hover {
    opacity: 1 !important;
    background-color: #dc3545 !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://w3.org' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 2.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") !important;
    transform: translateY(-50%) scale(1.1) !important;
}

/* BOOTSTRAP CAROUSEL OK BUTONLARI TASARIMI */
.custom-carousel-btn {
    opacity: 1 !important;
    width: 50px !important;
}
.custom-carousel-icon {
    width: 40px;
    height: 40px;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.3s ease;
}
.custom-carousel-btn:hover .custom-carousel-icon {
    background: #FFB338;
}

/* Bootstrap RTL modunda ok yönlerini otomatik ayarlar. İkonların dönmesi yeterlidir. */
html[dir="rtl"] .custom-carousel-btn .custom-carousel-icon i {
    transform: rotate(180deg);
}

/* ALT NOKTALARIN (DOTS) YENİ TASARIMI */
.custom-carousel-dots {
    bottom: 15px !important;
    margin: 0 !important;
    z-index: 15 !important;
}
.custom-carousel-dots button {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    border: none !important;
    background-color: rgba(255, 255, 255, 0.5) !important;
    opacity: 1 !important;
    margin: 0 5px !important;
    transition: all 0.3s ease !important;
}
.custom-carousel-dots .active {
    background-color: #FFB338 !important;
    width: 12px !important;
    height: 12px !important;
}

/* Modal Hizalama */
.modal.show {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
#marketpop .modal-dialog {
    margin: 0 auto !important;
    width: 100% !important;
    max-width: 500px;
}

/* 🛡️ NİHAİ KORUMA: SEPET AÇIKKEN ARKA PLANDAKİ TÜM SLIDER VE BUTON ETKİLEŞİMLERİNİ DONDURUR */
body.offcanvas-open .main-wrapper,
body.offcanvas-open .btn-add-to-cart,
body.offcanvas-open .ltn__product-item,
body:has([id="offcanvasRight"].show) .main-wrapper,
body:has([id="offcanvasRight"].show) .btn-add-to-cart,
body:has(.offcanvas.show) .main-wrapper,
body:has(.offcanvas.show) .btn-add-to-cart {
    pointer-events: none !important;
    user-select: none !important;
    cursor: not-allowed !important;
}

/* Sepet panelinin kendi içindeki tüm işlemlerin kusursuz devam etmesi için kesin muafiyet */
#offcanvasRight,
#offcanvasRight * {
    pointer-events: auto !important;
    cursor: pointer !important;
    opacity: 1 !important;
}


/* Ürün kartı içindeki noktaların (dots) sitenizin turuncu rengiyle uyumu */
.product-image-bootstrap-carousel .custom-prod-dots {
    bottom: 10px !important;
    margin: 0 !important;
    z-index: 5 !important;
}

.product-image-bootstrap-carousel .custom-prod-dots button {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    border: none !important;
    background-color: rgba(255, 255, 255, 0.5) !important;
    opacity: 1 !important;
    margin: 0 4px !important;
    transition: all 0.3s ease !important;
}

/* Aktif noktanın turuncu renk ve hafif büyüme efekti */
.product-image-bootstrap-carousel .custom-prod-dots .active {
    background-color: #FFB338 !important;
    width: 10px !important;
    height: 10px !important;
}

/* Resimlerin taşmasını önleme ve uyumluluk */
.product-image-bootstrap-carousel .carousel-item img {
    max-width: 100%;
    object-fit: cover;
}

/* ÜRÜN DETAY SLIDER VE KÜÇÜK RESİMLER İÇİN ÖZEL CSS  */

.product-detail-bootstrap-carousel {
    position: relative;
    width: 100%;
}
.product-detail-bootstrap-carousel .custom-detail-thumbs {
    position: relative !important;
    bottom: 0 !important;
    margin: 15px 0 0 0 !important;
    display: flex !important;
    justify-content: center !important;
    gap: 10px;
    z-index: 10 !important;
}
.product-detail-bootstrap-carousel .custom-detail-thumbs button {
    width: 70px !important;
    height: 70px !important;
    text-indent: 0 !important;
    border: 2px solid #ddd !important;
    border-radius: 8px;
    overflow: hidden;
    padding: 0 !important;
    opacity: 0.6 !important;
    transition: all 0.3s ease;
    background: none !important;
}
.product-detail-bootstrap-carousel .custom-detail-thumbs button img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.product-detail-bootstrap-carousel .custom-detail-thumbs .active {
    opacity: 1 !important;
    border-color: #FFB338 !important;
    box-shadow: 0 0 8px rgba(255, 179, 56, 0.5);
}
.product-detail-bootstrap-carousel .carousel-control-prev-icon,
.product-detail-bootstrap-carousel .carousel-control-next-icon {
    background-color: rgba(0,0,0,0.5);
    padding: 15px;
    border-radius: 50%;
    background-size: 50%;
}


/*# sourceMappingURL=style.css.map */
