/** Shopify CDN: Minification failed

Line 1288:0 Unexpected "<"
Line 1326:0 Unexpected "<"

**/
/* Ürün sayfası başlık bölümü için esnek düzenleme ve boşluk ayarı */

/* Esnek kutu içindeki tüm öğelerin dikey margin'lerini sıfırla */
.product__block--product-header-inner > * {
  margin-top: -10px !important;
  margin-bottom: 0 !important;
}
.product__block--product-header-inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
/* Fiyat satırındaki öğelerin hizalanması ve taşma sorunu çözümü */
.product__price-and-ratings .product__price {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  row-gap: 5px !important;
  column-gap: 5px !important;
}
/* Yıldız ve Sayaç için dikey boşlukları hassas ayarlama */

/* Judge.me Yıldızlarının (Önizleme Rozeti) Dikey Konumunu Ayarlama */
.jdgm-preview-badge {
  margin-top: -40px !important;
}
/* Geri sayım sayacının üstündeki boşluğu ayarlar */
.product-countdown-container,
.product-countdown {
  margin-top: -12px !important;
}

/* ==========================================================================
   NİHAİ VE EN GÜÇLÜ GLOBAL FONT UYGULAMASI (KALIN BAŞLIKLAR İLE)
   ========================================================================== */

/* 1. Fontlarımızı CSS'e tanıtıyoruz
   -------------------------------------------------------------------------- */

/* ===============================
   ATELIER MERIEN — GLOBAL THEME PATCH (STABLE)
   =============================== */

/* ---------------------------------
   0) FONT YÜKLEME (güvenli)
-----------------------------------*/
@font-face {
  font-family: "Athelas";
  src: url('{{ "Athelas-Regular.woff" | asset_url }}') format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Athelas";
  src: url('{{ "Athelas-BoldItalic.woff" | asset_url }}') format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "AlbertSans";
  src: url('{{ "albertsans-variablefont_wght-webfont.woff2" | asset_url }}') format("woff2"),
       url('{{ "albertsans-variablefont_wght-webfont.woff"  | asset_url }}') format("woff");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root{
  --font-family-base: "Athelas", var(--font-system-stack);
  --font-family-heading: "Athelas", var(--font-system-stack);
  --font-special: "AlbertSans", var(--font-family-base);
}
/* Tema yardımcı sınıflarını Athelas yap */
:root{
  --ff-body: "Athelas", serif;
  --ff-heading: "Athelas", serif; /* istersen başlıklarda da */
}

/* Güvence: ff-body her yerde Athelas */
.ff-body { 
  font-family: "Athelas", serif !important;
}


/* Varsayılanları bu satırın hemen altına taşıyın */
body, button, input, select, textarea, p, div, span, a, li {
  font-family: var(--font-family-base) !important;
  font-weight: 400 !important;
  
}
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6 {
  font-family: var(--font-family-heading) !important;
  font-weight: 600 !important;
  font-size:24px !important;
  letter-spacing: 0.8px !important; /* TÜM BAŞLIKLAR İÇİN GENEL LETTER-SPACING */
}

h1.product__title {
  font-size: 20px !important;
  font-weight: 600 !important;        /* Font kalınlığını normale düşürür (700 bold, 400 normaldir) */
  /* letter-spacing başlıkların genel kuralından gelir */
}

/* Ürün tablarındaki (Description, FAQ vb.) başlıkların kalınlığını ayarlama */
/* 1. Kural: Sadece h2 ve h3 başlıklarını istediğiniz gibi biçimlendirir */
.rte h2,
.rte h3 {
  font-family: var(--font-family-heading) !important;
  font-weight: 600 !important;
  font-size: 24px !important;
  /* letter-spacing başlıkların genel kuralından gelir */
}

/* Ürün açıklaması içindeki maddeleme listelerinin girintisini ve stilini ayarla */
.rte ul {
  padding-left: 0 !important;
  list-style-position: inside !important;
  list-style-type: disc !important; /* Madde işaretini dolu daire (•) yapar */
}

/* Paragraf içindeki <strong> etiketini, boyutunu değiştirmeden, tutarlı bir şekilde kalın yapar */
.rte p strong {
  font-family: inherit !important;       /* Fontu paragraftan miras almasını sağlar */
  font-weight: 600 !important;      /* Yazıyı yarı-kalın (semi-bold) yapar */
  font-size: 24px !important;      /* Boyutun paragraftakiyle AYNI kalmasını sağlar */
  letter-spacing: inherit !important; /* Harf aralığını paragraftan miras alır */
}

/* Ürün başlıklarını her yerde aynı boy yap (koleksiyon + anasayfa mini kart) */
.product-item__product-title,
.product-card-mini__product-title,
.product-item__product-title a,
.product-card-mini__product-title a,
.fs-product-card-title {
  font-weight: 400 !important;
  font-size: 18px !important;
  line-height: 1.35 !important;
  letter-spacing: normal !important;
}
/* Breadcrumb fontunu Athelas yap */
.product__breadcrumbs,
.product__breadcrumbs .breadcrumbs__list,
.product__breadcrumbs .breadcrumbs__item,
.product__breadcrumbs .breadcrumbs__link {
  font-family: "Athelas", serif !important;
}
.product-countdown-container strong {
  font-family: "Athelas", serif !important;
  font-weight: 600; /* çok kalın olmasın diye */
}



/* Tüm paragraflar için genel letter-spacing */
p, .rte p {
  letter-spacing: 0.8px !important;
}
/* Buttons: global letter-spacing */
:where(
  button,
  .button,
  .btn,
  a.btn,
  [role="button"],
  input[type="button"],
  input[type="submit"],
  .product-form__submit,
  .product-tabs__tab-button,
  .shopify-payment-button__button,      /* unbranded ise çalışır */
  .jdgm-write-rev-link,
  .jdgm-write-review__button
) 
{
  letter-spacing: 1.5px !important;
}

/* Bazı temalarda buton içindeki <span>’e sıfırlama veriliyor; miras aldır. */
:where(button, .button, .btn) * {
  letter-spacing: inherit !important;
}
/* --- Product labels + variant dropdown + quantity için letter-spacing --- */

/* "Size:" , "Material:" etiketleri */
.product__controls-group > .product__label,
.product__controls-group-quantity > .product__label {
  letter-spacing: 0.3px !important;
}

/* Variant seçimi (kapalı select üzerindeki görünen metin) */
.product__controls-group .select-wrapper.dynamic-variant-input-wrap select {
  letter-spacing: 0.3px !important;
}

/* (Tarayıcı izin verirse) açılır listedeki seçenekler */
.product__controls-group .select-wrapper.dynamic-variant-input-wrap select option {
  letter-spacing: 0.3px !important;
}

/* Quantity satırı (– 1 +) */
.product__controls-group-quantity .quantity-input > *,
.product__controls-group-quantity .quantity-input input[type="number"] {
  letter-spacing: 0.3px !important;
}


/* ————— 2) Yalnızca hedef bölümlerde uygulayalım ————— */

/* ——— 2a) Ürün fiyatları (sale & regular) ——— */
.product__price,
.product__price .price-item--regular,
.product__price .price-item--sale,
.unit-price__price {
  font-family: var(--font-special) !important;
}

/* ——— 2b) Quantity input’taki sayı ——— */
input.quantity-input__input {
  font-family: var(--font-special) !important;
}

/* ——— 2c) Size/Material dropdown metinleri ——— */
select[name^="options"] {
  font-family: var(--font-special) !important;
}

/* ——— 2d) Size: ve Material: etiketleri ——— */
/* Inspect → kopyaladığınız tam label seçici örneği: */
.product__controls-group > .product__label,
.product__controls-group-quantity > .product__label {
  font-family: var(--font-special) !important;
}


/* Ürün tablarındaki metin içeriği sütununu sola hizala */
.product-tabs__tab-column {
  text-align: left !important;
}

/* FAQ listesinin (dl) varsayılan girintisini kaldır */
.rte dl {
  margin-left: 0 !important;
  margin-top: -50px !important;
  padding-left: 0 !important;
}
/* FAQ (Sıkça Sorulan Sorular) Bölümü için Geliştirilmiş Yerleşim */

/* Soruları (dt) biçimlendirir */
.rte dt {
  font-weight: 600 !important;
  margin-top: -15px !important;
  letter-spacing: 0.8px !important;
}

/* Cevapları (dd) biçimlendirir */
.rte dd {
  margin-left: 0 !important;
  margin-top: 4px !important;   /* Soru ile cevap arasındaki boşluk */
  padding-left: 0 !important;
  letter-spacing: 0.8px !important;
  font-size: 16px !important;
}




/* 1) Logo konteyneri butonların üstünde ortalanır */
.header__custom-logo-container {
  text-align: center;
  width: 100%;
  margin-bottom: -14px;
  margin-left: -40px;
  
}

/* 2) Logo boyutu ve yumuşak geçiş */
.header__custom-logo {
  max-height: 100px;       /* isteğe göre ayarla */
  width: auto;
  transition: opacity 0.3s ease;
  opacity: 1;
}

/* 3) Sayfa kayınca logo kaybolsun */
.header__custom-logo--hidden {
  opacity: 0 !important;
}
/* Logo metni: font ve boyut ayarı */
.header__logo-text {
  font-family: "Athelas", serif !important;
  font-size: 24px !important;
}

/* ----------------------------------
   NAV BUTONLARINI SAĞA KAYDIRMA
-------------------------------------*/
/* Masaüstü (1200px ve üstü) için:
   Logo üstüne gelecek şekilde sağa itme */
@media screen and (min-width: 1200px) {
  .header__inner .header__row-desktop.lower {
    display: flex;
    align-items: center;
  }
  .header__inner .header__links-primary-scroll-container {
    margin-left: 345px;
  }
}
.header__links-primary .header__links-list {
  display: flex;
  gap: 20px; /* Bu değeri ihtiyacınıza göre ayarlayın */
}
/* Tablet (750px–1199px) için:
   Navigasyonu tam ortala */
@media screen and (min-width: 750px) and (max-width: 1199px) {
  .header__inner .header__row-desktop.lower {
    display: flex;
    align-items: center;
  }
  .header__inner .header__links-primary-scroll-container {
    margin: 0 auto;
  }
  /* logo resmi için (yüzde 0 opaklık zaten daha önce vardı) */
  .header__custom-logo--hidden {
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
  }
  /* logo konteynerini (yükseklik 0 yap) */
  .header__custom-logo-container--hidden {
    height: 0 !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
    transition: height 0.3s ease !important;
  }
}
/* — Mobilde scroll’ta logo konteynerini gizle — */
@media screen and (max-width: 749px) {
  /* logo resmi için (yüzde 0 opaklık zaten daha önce vardı) */
  .header__custom-logo--hidden {
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
  }
  /* logo konteynerini (yükseklik 0 yap) */
  .header__custom-logo-container--hidden {
    height: 0 !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
    transition: height 0.3s ease !important;
  }
}
/* -------------------------------
   NAVBAR ARKAPLANINI BEYAZA ÇEVİRME
---------------------------------*/

/* Tüm header’lara beyaz arkaplan ver */
.header {
  background-color: #ffffff !important;
}

/* Eğer transparent header aktifse, onu da beyaz yap */
.header--transparent,
.header.header--transparent {
  background-color: #ffffff !important;
}

/* Sticky header durumunda da beyaz kalsın */
.sticky-header-enabled .header {
  background-color: #ffffff !important;
}

/* --------------------------------------------------
   SAĞ UÇ BUTON GRUBUNU SAĞA KAYDIRMA ve BOŞLUK VERME
----------------------------------------------------*/

/* Desktop’taki üst ve alt satırdaki sağ segment için */
.header__row-segment-desktop.right {
  display: flex;               /* ikonları yatay sıralı tutar */
  align-items: center;         /* dikey ortalar */
  gap: 1rem;                   /* ikonlar arasına 1rem boşluk */
  margin-left: auto !important;/* solundaki içerikten mümkün olduğunca uzaklaşır */
  padding-right: -1px;         /* sağ kenarda ekstra boşluk bırakır */
}


/* Sadece seçilen değeri gizlemek için */
[data-selected-value-for-option] {
  display: none !important;
}

/* Ürün sayfasındaki ana fiyatı vurgula */
.product__price.fs-body-100 span[data-price] {
  font-size: 2rem !important;        /* Yazı boyutu */
  font-weight: 700 !important;       /* Kalın (bold) */
  color: #111 !important;            /* Daha koyu siyah */
  opacity: 1 !important;             /* Tam görünür */
  letter-spacing: 0.5px !important;  /* Harf aralığı */
  line-height: 1.2 !important;       /* Satır yüksekliği */
}




/* === ÜRÜN GALERİSİ - NİHAİ ÇERÇEVE & GÖRÜNÜR BUTONLAR === */

/* 1. Ana sol sütunu, içindeki mutlak konumlandırılmış öğeler (butonlar) için referans noktası yapar */
.product__primary-left {
  position: relative;
}

/* 2. Ana görseli tutan alana (çerçeveye) stil verir ve onu butonların arkasına yerleştirir */
/* === PRODUCT MEDIA (Desktop Only) === */
@media screen and (min-width: 750px) {
  .product__media {
    position: relative;
    background-color: #ffffff;
    padding: 20px;
    padding-top: 5px; 
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1; /* Butonların arkasında kalması için */
  }

  .product__media .product__media-item img {
    max-height: 600px;   /* tüm görseller aynı yükseklikte */
    width: auto;
    object-fit: contain;
  }
}


/* 4. Ok butonlarının kapsayıcısını GÖRSELİN ÜSTÜNE getirir ve ortalar */
/* Ok butonlarının kapsayıcısını GÖRSEL ÇERÇEVESİNİN DIŞINA taşır */
.custom-media-nav-wrapper {
  position: absolute;
  top: 16%;
  left: 85px;  /* Sol oku çerçevenin dışına taşır */
  right: -30px; /* Sağ oku çerçevenin dışına taşır */
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Fare ana görselin üzerine gelince okları görünür yap */
.product__primary-left:hover .custom-media-nav-wrapper {
  opacity: 1;
}

/* 5. Butonların stilini ayarlar */
.custom-media-nav-button {
  pointer-events: auto;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* Ok ikonunu döndür ve boyutlandır */
.custom-media-nav-button .icon-chevron {
  width: 12px;
  height: 12px;
  fill: currentColor;
}
.custom-media-nav-button--prev .icon-chevron {
  transform: rotate(90deg);
}
.custom-media-nav-button--next .icon-chevron {
  transform: rotate(270deg);
}

/* option listesinin açılmasını engeller */
.product-item__variant-info {
  display: none !important;
}


/* Quick View pop-up'ının sağ tarafına scroll eklemek için */
.quick-product--right-viewport {
  overflow-y: auto !important; /* Dikey scroll'u her zaman aktif et */
  max-height: 75vh; /* Alanın maksimum yüksekliğini ekranın %75'i ile sınırla */
}

.quick-product--right-inner {
  padding-bottom: 20px; /* En alttaki butona rahat basmak için boşluk */
}

/* Sadece "Shop by design" menüsündeki özel başlıkları hedefler */
.meganav-baslik {
  display: inline-block;
  border-bottom: 1.5px solid #000;
  padding-bottom: 0.25em;
  margin-bottom: 0.75em;
  font-weight: 500;
  color: #000;
}
/* 2. Link ve Yazı Stilleri
   -------------------------------------------------------------------------- */
/* Menüdeki her bir linkin ana stilini burada tanımlıyoruz. */
.meganav__nav .color-swatch-link {
  /* Hizalama ve Boşluklar */
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 0;

  /* Yazı ve Görünüm */
  font-size: 1rem; /* 16px'e denk gelir, isteğe göre değiştirebilirsiniz */
  color: #1c1c1c;
  text-decoration: none;
  font-weight: normal;

  /* Arka Plan ve Kenarlık Sıfırlama */
  background: none;
  border: none;

  /* Geçiş Efekti */
  transition: color 0.2s ease;
}

/* Linkin içindeki yazı etiketinin de kalın olmamasını garantiliyoruz. */
.meganav__nav .color-swatch-link .color-swatch-label {
  font-weight: normal;
}

/* 3. Renk Örneği (Swatch) Stili
   -------------------------------------------------------------------------- */
/* Renk örneklerinin sabit stilini belirliyoruz. */
.meganav__nav .color-swatch {
  width: 25px;
  height: 25px;
  border-radius: 70%;
  border: 1px solid rgba(0, 0, 0, 0.15); /* Açık renklerin görünmesi için */
  flex-shrink: 0; /* Küçülmesini engeller */
  
  /* Resimli swatch kullanma ihtimaline karşı */
  background-size: cover;
  background-position: center;
}

/* 4. Hover Efektleri (Fare Üzerine Gelme)
   -------------------------------------------------------------------------- */
/* Linkin üzerine gelindiğinde sadece yazının rengi değişecek ve altı çizilecektir. */
.meganav__nav .color-swatch-link:hover {
  color: #8a8a8a;
  text-decoration: underline;
}

/* Mobil Drawer Menüde Swatch ve Label */
/* Drawer menu için renk swatch stilleri */
.drawer-menu__link-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.drawer-menu__link-title .color-swatch {
  width: 20px;
  height: 20px;
  border-radius: 70%;
  border: 1px solid rgba(0,0,0,0.15);
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
}

.drawer-menu__link-title .color-swatch-label {
  font-size: 1rem;
  color: #1c1c1c;
  font-weight: normal;
}



.product__sku {
  margin-bottom: 1.5rem; /* Altındaki "Size" butonuyla arasına boşluk koyar */
  font-size: 0.9em;
  color: #555555; /* Rengi biraz daha soluk yapar */
  margin-top: 5px;
}
.product__sku span:first-child {
  font-weight: bold;
  margin-right: 5px;
}
/* ------------------------------------------- */
/* ------------------------------------------- */
/* Özel navigasyon stilleri */
.stiletto-custom-nav {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.stiletto-nav-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid #e0e0e0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  pointer-events: auto;
  transition: all 0.3s ease;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  z-index: 20;
}

.stiletto-nav-btn:hover {
  background: #333;
  color: #fff;
  border-color: #333;
}

.stiletto-prev {
  left: 15px;
}

.stiletto-next {
  right: 15px;
}

/* Mobil uyumluluk */
@media (max-width: 767px) {
  .stiletto-nav-btn {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
  
  .stiletto-prev {
    left: 5px;
  }
  
  .stiletto-next {
    right: 5px;
  }
}
.st-wishlist-button {
  position: absolute;
  top: 10px;    /* Görselin üstünden boşluk */
  right: 10px;  /* Görselin sağından boşluk */
  z-index: 5;   /* Görselin üzerinde kalması için */
}
/* Wishlist'teki "More Details" butonunun rengini değiştirir */
.st-atc-button {
  background-color: #eb6d20 !important; /* Arka plan rengini ayarlar */
  border-color: #eb6d20 !important;     /* Kenarlık rengini arka planla aynı yapar */
  color: white !important;              /* Yazı renginin beyaz kalmasını sağlar */
}
/* İkonlu yazıların çerçevelerini kaldırma */
.product__callouts-mini-item {
  border: none !important;
}

/* Eğer border değil de box-shadow kullanıldıysa bunu da ekleyebilirsiniz */
.product__callouts-mini-item {
  box-shadow: none !important;
}
/* PROMO callout: spark/shine ikonlu satırı yeşil banner yap */
@supports selector(:has(*)) {

  /* Sol hiza: üstteki metinlerle aynı çizgiye çek (gerekirse -12/-20px arası oynat) */
  .product__block.product__callouts-mini:has(.product__callouts-mini-item-icon img[src*="shines"])
  .product__callouts-mini-items {
    margin-left: -16px;   /* hizayı ayarlamak için küçükçe oynatabilirsin */
    margin-bottom: -18px !important ;
  }

  /* Yeşil arka planlı banner görünümü */
  .product__block.product__callouts-mini:has(.product__callouts-mini-item-icon img[src*="shines"])
  .product__callouts-mini-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;                     /* satırın tamamını kapsasın */
    background: #E6F7C8;             /* açık yeşil */
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 12px;
    padding: 10px 14px;
    box-shadow: none;
  }

  /* İkon ve metin mikro düzeni */
  .product__block.product__callouts-mini:has(.product__callouts-mini-item-icon img[src*="shines"])
  .product__callouts-mini-item-icon {
    width: 18px; height: 18px;
    margin-right: 6px;
  }

  .product__block.product__callouts-mini:has(.product__callouts-mini-item-icon img[src*="shines"])
  .product__callouts-mini-item-text {
    color: #234d20;                   /* koyu yeşil */
    font-weight: 600;                 /* biraz vurgulu metin */
    letter-spacing: .3px;
  }
}



/* 1) Tüm dropdown wrapper’larını tam satır genişliği yapalım */
.product__controls-group .select-wrapper.dynamic-variant-input-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;

  border: 1px solid #ccc !important;
  border-radius: 10px !important;
  padding: 0.25em 0.5em !important;
  margin-bottom: 1em !important;
}

/* 2) İçindeki <select>’in de %100 genişlik almasını sağlayalım */
.product__controls-group .select-wrapper.dynamic-variant-input-wrap select {
  width: 100% !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* 3) Quantity kontrolünü aynı genişlik ve stile uyarlayalım */
.product__controls-group-quantity .quantity-input {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;

  border: 1px solid #ccc !important;
  border-radius: 10px !important;
  padding: 0.5em !important;       /* iç boşluğu arttırmak istersen burayı ayarlayın */
  margin-bottom: 1em !important;
}

/* 4) Quantity içindeki buton ve input’ları esnet */
.product__controls-group-quantity .quantity-input > button,
.product__controls-group-quantity .quantity-input > input {
  /* Dilerseniz butonların/input’un oranını ayarlayın; örnek:
  width: auto !important;
  flex: none !important;
  */
}

/* Eğer quantity-input elemanı flex ise, blok seviyeye çevirip içindekileri yeniden yerleştirmeniz gerekebilir: */
.product__controls-group-quantity .quantity-input {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
}


/* ───────── GLOBAL BUTTON BORDER (sadece border & radius) ───────── */

button,
input[type="button"],
input[type="submit"],
.button,
.btn,
.action-button {
  border: 1px solid #ccc !important;
  border-radius: 15px !important;
}
/* Newsletter e-posta alanını yuvarla */
.newsletter__signup .input.newsletter__signup-input,
#newsletter-subscribe .input.newsletter__signup-input,
.newsletter__signup input#newsletter-subscribe-email {
  border-radius: 15px !important;
  appearance: none;
}
/* Cancel review butonu da radius alsın */
.jdgm-btn.jdgm-btn--border,
.jdgm-btn.jdgm-cancel-rev {
  border-radius: 15px !important;
}

/* Birden çok butonun border, background ve gölgesini tek kuralda kaldır */
.slider-nav-button.slider-nav-button-prev,
.slider-nav-button.slider-nav-button-next,
.quantity-input .quantity-input__button,
button.social-share__button,
.product-tabs__tab-buttons .product-tabs__tab-button,
button.footer__newsletter-button,
button.st-wishlist-details-button--header-icon,
button.filter-bar__button.filter-bar__button--filters,
button.filter-bar__button.filter-bar__button--sort,
.collapsible-row-list-item__trigger,
.quick-search__submit,
.quick-search__close,
.quick-view-view-product-details-link,
.modal__close-icon,
button[data-modal-close],
.quick-cart__footer-order-note-trigger,
.quick-cart__footer-order-note-trigger:hover,
.quick-cart__footer-order-note-trigger:focus,
.quick-cart__item-remove,
.quick-cart__item-remove:hover,
.quick-cart__item-remove:focus,
.filter-group,
.filter-drawer__group-toggle,
.filter-drawer__close,
.product-item__hoverless-quick-view-button,
.header__menu-icon,
.footer__header,
.accordion__label,
.st-share-button,
.st-close-button,
.paper-types-trigger-button,
.cart__footer-order-note-trigger,
.cart__form-item-remove
 { /* <<< YENİ EKLENEN SATIR */
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none; /* istersen kaldırma */
}


/* Sticky “Change” butonundan border, gölge ve background’u kaldır */
.sticky-atc-bar__meta-change-option-trigger {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
.collection__empty .btn--text-link {
  border: none !important;
  background: none !important;
  box-shadow: none !important;
}
/* Quick Cart (mini sepet) quantity kapsayıcısı — köşeleri yuvarla */
.quick-cart .quantity-input {
  border: 1px solid #ccc !important;
  border-radius: 15px !important;
  overflow: hidden;                 /* köşeleri düzgün kes */
  display: inline-flex !important;
  align-items: stretch;
}

/* İçteki buton ve input çizgilerini kapat */
.quick-cart .quantity-input__button,
.quick-cart .quantity-input__input {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
/* === Özel İletişim Formu - TÜM Checkbox'lar İçin Stil === */

/* 1. Hem grid hem de tekil checkbox'ların metin hizalamasını düzenler */
.checkbox-grid label,
.checkbox-label {
  display: flex;
  align-items: center;
  cursor: pointer;
}

/* 2. Checkbox kutusunun kendisini stillendirir (artık gizlemiyoruz) */
.form-container input[type="checkbox"] {
  /* Görünürlüğü garantiler */
  appearance: none;
  -webkit-appearance: none;
  display: inline-block !important;

  /* Boyutlandırma */
  width: 18px;
  height: 18px;
  
  /* Çerçeve (Border) */
  border: 1px solid #ccc !important;
  border-radius: 4px;
  
  /* Konumlandırma */
  margin-right: 12px;
  position: relative;
  top: -1px; /* Dikeyde metinle daha iyi hizalanması için */
  
  cursor: pointer;
}

/* 3. Checkbox seçildiğinde kutunun içine tik işareti ekler ve rengini değiştirir */
.form-container input[type="checkbox"]:checked {
  background-color: #001100;
  border-color: #001100;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8l2.5 2.5L12 5'/%3e%3c/svg%3e");
  background-position: center;
  background-repeat: no-repeat;
}



/* ─── Ürün sayfası ve sticky bar’daki silinen fiyatı turuncu yap ─── */
:is(
  .product__price-and-ratings .product__price,
  .sticky-atc-bar__price.product__price
) > s[data-compare-price] {
  margin-top: 15px !important;
  color: #000 !important;
  opacity: 1 !important;
}

/* ─── Ürün sayfası ve sticky bar’daki güncel fiyatı turuncu yeşil yap ─── */
:is(
  .product__price-and-ratings .product__price,
  .sticky-atc-bar__price.product__price
) > span[data-price] {
  margin-top: 15px !important;
  color: #eb6d20 !important;
  font-size: 1.50em !important;  
}

/* ─── musterı sepetındekı güncel fiyatı turuncu yeşil yap ─── */
/* QUICK CART – fiyat ağırlıkları */
.quick-cart .quick-cart__item-price.sale-price {
  font-weight: 800 !important;   /* güncel/sale fiyat: daha kalın */
  color: #eb6d20 !important;
}

.quick-cart .quick-cart__item-price-wrapper s,
.quick-cart s.quick-cart__item-price {
  font-weight: 300 !important;   /* eski fiyat: daha ince */
  color: var(--color-text-subdued, #8a8a8a) !important;
}



/* ───────── MODERN DISCOUNT BADGE v2 ───────── */

/* Ortalamayı düzeltiyoruz: inline-flex + align-items */
.product__price-displayed-discount,
[data-discount-display],
.displayed-discount,
.product-item__price .displayed-discount {
  margin-top: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: #eb6d20 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  padding: 0.25em 0.75em !important;
  font-size: 0.875em !important;
  line-height: 1 !important;
  text-transform: none !important;
}

/* Geri Sayım Sayacı Stilleri (Sade ve Turuncu - Boşluklar Kaldırıldı) */
.product-countdown {
  margin-bottom: 0 !important; /* Alttaki boşluğu kaldırır */
  font-size: 1.1em; /* Metin boyutu */
  color: #333; /* Genel metin rengi (Sales ends in: için) */
  display: flex !important; /* Flexbox düzenini zorlar */
  align-items: baseline; /* İçerikleri dikeyde hizalar */
  gap: 0.5ch; /* İçerikler arasında boşluk bırakır */
  font-family: 'Inter', sans-serif; /* Fontu ayarlar */
  visibility: visible !important; /* Görünürlüğü zorlar */
  opacity: 1 !important; /* Şeffaflığı kaldırır */
  position: relative !important; /* Konumlandırma için */
  z-index: 9998 !important; /* Katman sırası */
}

.product-countdown strong {
  font-family: "Athelas", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: #eb6d20 !important; /* "Sales ends in:" yazısının rengini korur */
}

.product-countdown .countdown-timer {
  background: none !important; /* Arka planı kaldırır */
  padding: 0 !important; /* İç boşluğu kaldırır */
  border-radius: 0 !important; /* Köşeleri yuvarlaklığını kaldırır */
  font-variant-numeric: tabular-nums;
  color: #eb6d20 !important; /* Turuncu renk (DarkOrange) */
  font-weight: bold !important; /* Zamanlayıcı metnini kalın yapar */
  display: inline-block !important; /* Elementin görünür olmasını sağlar */
  box-shadow: none !important; /* Gölgeyi kaldırır */
  min-width: unset !important; /* Minimum genişliği sıfırlar */
  text-align: left !important; /* Metni sola hizalar */
  visibility: visible !important; /* Görünürlüğü zorlar */
  opacity: 1 !important; /* Şeffaflığı kaldırır */
  position: static !important; /* Konumlandırma sorunlarını önler */
  z-index: 9999 !important; /* Katman sırası */
}

.product__price-and-ratings {
  padding-bottom: 0 !important;
}
/* Eğer ::before pseudo-element kullanılıyorsa font-size ile de kontrol edilebilir */
.jdgm-star::before {
  font-size: 0.60em !important;
}
.jdgm-prev-badge__text {
  font-weight: 500 !important;
  font-size: 1em !important;
}


/* Güncel tarayıcılar için (Chromium/WebKit) */
@supports selector(:has(*)) {
  /* 1) TİKLİ bloğun tamamını sola kaydır (üstteki içerikle hizalansın) */
  .product__block.product__callouts-mini:has(.product__callouts-mini-item-icon img[src*="check"])
  .product__callouts-mini-items {
    margin-left: -20px; /* ihtiyaca göre -8 ile -14 arası dene */
   
  }

  /* 2) İkon–metin arası boşluğu kısalt */
  .product__callouts-mini-item-icon:has(img[src*="check"]) {
    margin-right: 6px !important;
  }

  /* 3) (Opsiyonel) Metni hafifçe daha sola al – küçük tut! */
  .product__callouts-mini-item:has(.product__callouts-mini-item-icon img[src*="check"])
  .product__callouts-mini-item-text {
    margin-left: -13px !important; /* -15 yerine küçük değer kullan: -2/-6 arası */
  }
}
/* Quick-view modal içinde SALE rozetini gizle */
.quick-add-modal .product-badges,
.quick-add-modal .product-badge--sale,
.quick-add-modal .badge--sale,
.quick-add-modal [data-badge="sale"]{
  display: none !important;
}

/* Bazı temalarda modal/drawer sınıfı farklı olabilir: */
.modal .product-badge--sale,
.modal .badge--sale{
  display: none !important;
}

/* "Back to Top" Butonunu Özelleştirme */

/* Butonun ana gövdesi: Boyut ve Arka Plan Rengi */
/* Butonun ana gövdesi: Boyut, Renk ve Ortalama */
.back-to-top__button {
  width: 56px !important;
  height: 56px !important;
  background-color: #1c1c1c !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);

  /* --- YENİ EKLENEN ORTALAMA KODLARI --- */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Butonun üzerine gelince (hover) rengini değiştir */
.back-to-top__button:hover {
  background-color: #333333 !important; /* Hover rengini ayarlar */
}

/* Butonun içindeki ok (ikon) rengini değiştir */
.back-to-top__button svg {
  fill: #FFFFFF !important; /* Ok rengini beyaza çevirir */
}
/* Koleksiyon Sayfası "Read More" Butonu Stilleri */
.collapsible-description {
  position: relative;
}

.read-more-button {
  display: inline-block;
  margin-top: 15px;
  padding: 8px 20px;
  border: 1px solid #1c1c1c;
  background-color: transparent;
  color: #1c1c1c;
  text-align: center;
  cursor: pointer;
  border-radius: 30px;
  font-family: var(--font-family-base);
  font-size: 14px;
  transition: all 0.3s ease;
}

.read-more-button:hover {
  background-color: #1c1c1c;
  color: #ffffff;
}

/* Ürün sekmeleri içinde tema tarafından otomatik eklenen başlığı gizle */
.product-tabs__tab-heading {
  display: none !important;
}

/* Koleksiyon Sayfası Başlık ve Paragraf Stilleri */


/* Koleksiyon Sayfası Açıklama Metnini Sola Hizala */
.collection-hero,
.collection__description,
.template-collection .rte {
  text-align: left;
}
/* Koleksiyon Sayfası Başlık ve Açıklama Metni Stilleri (v2) */
/* KOLEKSİYON ANA BAŞLIĞINI MANUEL HİZALAMA KODU */
h1.collection-banner__text-container-heading {
  margin-left: -60px !important; /* Bu değeri değiştirerek başlığı sola/sağa kaydırabilirsiniz */
}
/* 2. Açıklama metninin (paragrafların) font boyutunu ve satır aralığını artırır */
.collapsible-description.rte p {
  font-size: 1.2rem !important; /* Yazı boyutunu büyütür */
  line-height: 1.6 !important;   /* Satırlar arası boşluğu artırır */
}

/* Sadece "Our Promise" bölümünün başlığını gizler */
#shopify-section-template--18449328472108__multi_column_Jb3MkN .multi-column__heading {
  display: none !important;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* Fiyat bloğu içindeki sayacı bir alt satıra indir */
.product__price-and-ratings .product__price .product-countdown-container {
  flex-basis: 100%; /* Sayacı kendi satırına zorla */
  order: 99;         /* Her zaman en sonda görünmesini garantile */
  margin-top: 5px;   /* Üstündeki fiyat ile arasına boşluk koy */
}
/*customer revievs alanı duzenlemeleri*/

/* Customer Reviews alanı tam beyaz zeminde, görsellerden ayrı dursun */
#judgeme_product_reviews {
  margin-top: 20px !important;   /* görsellerden ayrılma mesafesi */
  padding: 20px !important;
  background: #fff !important;
  border: none !important;
  border-radius: 0 !important;
  clear: both;                   /* görsel bloklarıyla çakışmayı engeller */
  display: block !important;
}

a.jdgm-write-rev-link {
  border-radius: 15px !important;
}

.footer__header {
  display: block !important;     /* emin ol görünür olsun */
  font-family: "Athelas", serif; /* veya temadaki genel font */
  font-size: 14px !important;
  font-weight: 600 !important;
  margin-bottom: 12px !important;
  text-transform: uppercase !important;
  color: #fff !important;        /* siyah arka plan üzeri beyaz */
}

/* Ürün sayfasındaki 'Signature Details' scroll butonunu stillendirir */
.product-scroll-btn {
  display: block;                /* Butonun tam satırı kaplamasını sağlar */
  width: 100%;                   /* Genişliği %100 yapar */
  margin-bottom: 1.5rem;         /* Altındaki 'Size' alanı ile arasına boşluk koyar */
  text-align: center;
  padding: 12px 20px;
}
/* Sadece bu buton için ::before’u iptal et */
.btn.btn--secondary.product-scroll-btn::before {
  display: none !important;   /* pseudo-element görünmez olur */
  content: none !important;   /* oluşturulmasını da engelle */
}




/* "Learn about paper types" butonu stili */
.paper-types-trigger-button {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  color: var(--color-text);
  text-decoration: underline;
  cursor: pointer;
  padding: 5px 0;
  margin-top: -10px;
  margin-bottom: 15px;
  font-size: 0.85rem;
  letter-spacing: 0.8px !important; 
}

/* Açılır Pencere (Drawer) Ana Stilleri */
.paper-types-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0.3s, opacity 0.3s;
}
.paper-types-drawer.is-open {
  visibility: visible;
  opacity: 1;
}
.paper-types-drawer__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}
.paper-types-drawer__container {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 480px; /* Pencere genişliği */
  height: 100%;
  background-color: #fff;
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
  display: flex;
  flex-direction: column;
}
.paper-types-drawer.is-open .paper-types-drawer__container {
  transform: translateX(0);
}
.paper-types-drawer__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #e5e5e5;
  flex-shrink: 0;
}
.paper-types-drawer__title {
  font-size: 1.25rem;
  margin: 0;
}
.paper-types-drawer__close-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 5px;
}
.paper-types-drawer__body {
  padding: 1.5rem;
  overflow-y: auto;
  flex-grow: 1;
}
.paper-types-drawer__body .loading-spinner {
  border: 4px solid #f3f3f3;
  border-top: 4px solid #3498db;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 1s linear infinite;
  margin: 50px auto;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
<style>
  .paper-types-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
    max-width: 1200px;
    margin: 2rem auto;
    padding: 1rem;
  }
  .paper-type-column h3 {
    font-size: 1.5em;
    margin-bottom: 0.5em;
  }
  .paper-type-column h4 {
    font-size: 1.1em;
    margin-top: 1.5em;
    margin-bottom: 0.75em;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 0.25em;
  }
  .paper-type-column p {
    line-height: 1.6;
    margin: 0;
  }
  .paper-type-column ul {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
  }
  .paper-type-column li {
    margin-bottom: 0.75em;
    line-height: 1.5;
  }
  @media (max-width: 990px) {
    .paper-types-container {
      grid-template-columns: 1fr;
    }
  }
</style>

/* 1) Sticky bozulmasın: body serbest, yatay kısma HTML + içerik sarmalayıcı bakar */
html { overflow-x: hidden; }              /* (Safari 16+ için clip varsa daha da iyi) */
@supports (overflow: clip) { html { overflow-x: clip; } }

body { overflow-x: visible; }             /* sticky için önemli */

/* 2) Tüm sayfa içeriğini saran güvenli kapsayıcıda taşmayı kes */
main#main,
main.main,
#MainContent,
.page-content,
.shopify-section-group,
.shopify-section {                         /* temanda mevcut üst kapsayıcılar */
  max-width: 100vw;
  overflow-x: hidden;                      /* yatay kaymayı burada kesiyoruz */
  position: relative;
}

/* 3) Marquee (kayan yazı) yatay taşma yapmasın */
.scrolling-content__inner { overflow: hidden; }
.scrolling-content__marquee { width: 100vw; }

/* 4) Newsletter görseli zaten absolute; yine de emniyet kemeri */
.newsletter__background-image-wrapper { max-width: 100vw; overflow: hidden; }

/* 5) (Önceden eklediğin logo ayarlarını koru) */
.header__custom-logo-container { text-align: center; }
.header__custom-logo-container img,
.header__custom-logo-container svg { display: inline-block !important; }




/*MOBİL DUZENLEMELER*/

/* Koleksiyon kartı başlıklarını küçült ve sola hizala */
.collection-item__title {
  font-size: 1rem !important; /* Yazı boyutunu küçültür (değeri ayarlayabilirsiniz) */
  text-align: left !important;   /* Metni sola hizalar */
  line-height: 1.3 !important;    /* Satırlar arası boşluğu ayarlar */
}


/* === Hero: Butonları görselin en altına sabitle === */

/* 1) İç sarmalayıcıyı referans noktası yap */
.image-hero__inner {
  position: relative;
}

/* 2) Metin bloğunun altında butonlar için boşluk bırak 
      (metin butonların üstünde kalsın diye) */
.image-hero__text-container {
  padding-bottom: clamp(180px, 18vw, 250px);
}

.image-hero__text-container .section-blocks__inline-buttons,
.image-hero__text-container .button-block__inline-wrapper {
  position: absolute !important;
  bottom: var(--hero-btn-bottom, clamp(25px, 2vw, 20px));
  left: 0;
  width: 100%;                 /* tam genişlik */
  display: flex;
  justify-content: center;     /* ortala */
  margin-left: -5px !important;
  z-index: 3;
  flex-wrap: nowrap;
}

/* Butonları birbirine yaklaştırmak için ikinci butona negatif margin uygula */
.image-hero__text-container .button-block__button + .button-block__button {
  margin-left: -3px !important;

}
/* 4) Butonların kendisi – küçük ekranlarda taşmayı engelle */
.image-hero__text-container .button-block__button,
.image-hero__text-container .section-blocks__button {
  white-space: nowrap;
}

/* 5) Çok dar telefonlarda taşma oluyorsa en dar kırılımda satır kırdır */
@media (max-width: 360px) {
  .image-hero__text-container .section-blocks__inline-buttons,
  .image-hero__text-container .button-block__inline-wrapper {
    flex-wrap: wrap;                    /* gerekirse alta geçsin */
    row-gap: 8px;
    bottom: var(--hero-btn-bottom, clamp(6px, 2vw, 20px));
  }
}




/* Ürün sayfası – MOBİL: desktop düzenini aynen uygula */
@media (max-width: 749px){

  /* Fiyat satırı bir flex satır olsun */
  .product__price-and-ratings .product__price{
    display: flex !important;
    flex-wrap: wrap !important;           /* sayaç yeni satıra inebilsin */
    align-items: baseline !important;
    column-gap: 8px !important;
    row-gap: 2px !important;
    padding-bottom: 2px;
  }

  /* 1) Güncel fiyat (ilk) */
  .product__price-and-ratings .product__price > span[data-price]{
    order: 10 !important;
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }

  /* 2) Eski fiyat (ikinci) */
  .product__price-and-ratings .product__price > s[data-compare-price]{
    order: 20 !important;
    font-size: 1rem !important;
    opacity: .75 !important;
    align-self: baseline !important;
    margin-left: 0 !important;
  }

  /* 3) İndirim rozeti (üçüncü) */
  .product__price-and-ratings .product__price .product__price-displayed-discount{
    order: 30 !important;
    margin-left: 0 !important;
    padding: 3px 8px !important;
    font-size: .85rem !important;
    line-height: 1 !important;
  }

  /* 4) Sayaç (her zaman ALT SATIR) — DOĞRU SINIF ADI! */
  .product__price-and-ratings .product__price .product-countdown-container{
    order: 99 !important;                  /* fiyat satırından sonra */
    flex: 0 0 100% !important;             /* yeni satıra zorla */
    
    position: relative; top: -8px;
  }
  .product-countdown{
    display: flex !important;
    align-items: baseline !important;
    gap: .5ch !important;
    font-size: 15px !important;
    margin: 0 !important;
  }
}
/* Mobil görünümde ürün görseli üzerindeki sağ/sol ok navigasyonunu gizle */
@media screen and (max-width: 749px) {
  .custom-media-nav-wrapper {
    display: none !important;
  }
}

@media screen and (max-width: 768px) {
  .st-wishlist-button {
    transition: opacity 0.3s ease;
    opacity: 1;
  }
}
/* ============ DÜZELTİLMİŞ KOD ============ */
/* === NEWSLETTER: solda küçük görsel, sağda metin === */

/* SADECE DESKTOP İÇİN UYGULA */
@media (min-width: 900px){

  :root{
    --nl-img-w: clamp(100px, 12vw, 180px);
    --nl-gap: clamp(20px, 3vw, 40px);
  }

  /* Desktop: 2 sütun */
  .newsletter__inner{
    display: grid;
    grid-template-columns: var(--nl-img-w) 1fr;
    gap: var(--nl-gap);
    align-items: center;
  }

  /* Full-bleed davranışını sadece desktop'ta kapat */
  .newsletter__background-image-wrapper,
  .newsletter__background-image,
  .newsletter__overlay{
    position: static !important;
    inset: auto !important;
    width: auto !important;
    height: auto !important;
  }
  .newsletter__overlay{ display: none !important; }

  /* Soldaki görsel sütunu */
  .newsletter__background-image-wrapper{ grid-column: 1; }
  .newsletter__background-image{
    width: 100%;
    aspect-ratio: 3 / 4;                  /* görseline göre 4/3, 1/1 vb. */
    background-size: contain !important;   /* tüm görsel görünsün */
    background-repeat: no-repeat !important;
    background-position: left center !important;
    pointer-events: none;
    z-index: 0;
  }

  /* Sağdaki metin */
  .newsletter__block-content{
    grid-column: 2;
    min-width: 300px;
    position: relative;
    z-index: 1;
  }
}


@media (max-width: 768px) {
  .newsletter__background-image-wrapper {
    position: absolute !important;
    inset: 0; /* tüm kenarlara yayılır */
    z-index: 0;
    overflow: hidden;
    display: flex;
    justify-content: center;
    pointer-events: none; /* tıklanabilirliği kapat */
    opacity: 0.3;
    height: 100%;
  }

  .newsletter__background-image--mobile {
    position: relative !important;
    top: 50% !important;
    left: 35% !important;
    transform: translate(-50%, -50%) !important;
    width: 450px !important;  /* örnek genişlik */
    max-width: none !important; /* sınırı kaldır */
    height: auto;
    display: block;
  }
.newsletter__inner {
  position: relative;
  z-index: 1; /* yazı içerikleri görselin üstünde kalsın */
}
  .newsletter__block-content h2 {
    font-size: 1.3rem;
    margin-bottom: 1rem;
    text-align:left !important;
  }

  .newsletter__block-content p {
    font-size: 0.95rem;
    line-height: 1.5;
    text-align:left !important;
  }

  .newsletter__signup {
    margin: 1rem auto 0 auto; /* Butonu da ortala */
    max-width: 300px;
  }

  .newsletter__signup button {
    width: 100%; /* Buton tam genişlik olsun */
  }

  /* --- Email input şeffaf görünüm --- */
  .newsletter__signup input[type="email"] {
    background: transparent !important;  /* Arka planı kaldır */
    border: 1px solid rgba(0, 0, 0, 0.74);   /* Hafif çerçeve kalsın */
    color: #000;                         /* Yazı siyah görünsün */
    z-index: 2;
    position: relative;
  }

  .newsletter__signup input::placeholder {
    color: rgba(0, 0, 0, 0.5);  /* Placeholder da hafif saydam */
  }
}

/* --- Mobil için özel düzenleme --- */
@media screen and (max-width: 749px) {
  .header__custom-logo-container {
    margin-left: 0 !important; /* Mobilde sola kaymayı engelle */
    text-align: center !important; /* Ortala */
  }

  .header__custom-logo {
    max-height: 80px; /* mobil için biraz daha küçük logo */
  }
}
@media screen and (max-width: 749px) {
  .header__logo .header__logo-text {
    font-size: 12 px !important;
  }
}

/* Mesajın kendisi için yuvarlak köşeler */
#form-status--newsletter-subscribe .form-status__message--success {
  border-radius: 15px !important;
}

/* =========================
   Collection banner – MOBILE
   ========================= */
@media (max-width: 749px) {

  /* Başlık ve metin kutusunun güvenli kenar boşlukları */
  .collection-banner__text-container,
  .collection-banner__text-container-inner,
  .collapsible-description.rte {
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }

  /* Desktop’ta verdiğin negatif margin’i mobile’da sıfırla
     ve başlığı ekrana göre küçült */
  h1.collection-banner__text-container-heading {
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-size: clamp(22px, 6vw, 28px);
    line-height: 1.25;
  }

  /* Açıklama paragrafları daha küçük ve rahat satır aralığıyla */
  .collapsible-description.rte p {
    font-size: 1rem !important;
    line-height: 1.55 !important;
  }

  /* Buton mobilde daha kompakt dursun */
  .read-more-button {
    font-size: 13px;
    padding: 8px 16px;
  }
}

.drawer-menu__link-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.drawer-menu__link-title .color-swatch {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  flex-shrink: 0;
}