/**
 * Theme Name: Blocksy Child
 * Description: sareaslan.com - Kadın giyim mağazası için Blocksy child teması
 * Author: Creative Themes
 * Template: blocksy
 * Version: 1.3.0
 *
 * NOT: Stil dosyası "?ver=" ile sürüm damgalanıyor ve 30 gün önbellekleniyor.
 * İçeriği değiştirdikten sonra BU SÜRÜMÜ DE artırın; aksi hâlde ziyaretçilerin
 * tarayıcısı eski dosyayı 30 gün boyunca kullanmaya devam eder.
 * Text Domain: blocksy
 */

/* ==========================================================================
   Marka renkleri
   ========================================================================== */
:root {
  --sare-ink: #1f1a1d;
  --sare-accent: #b76e79;      /* pudra/gül kurusu - kadın giyim */
  --sare-accent-d: #9c545f;
  --sare-soft: #f7f1f0;
  --sare-line: #ece5e4;
}

/* ==========================================================================
   Genel tipografi ve butonlar
   ========================================================================== */
body {
  color: var(--sare-ink);
}

.wc-block-components-product-button .wp-block-button__link,
a.button, button.button, .button,
.woocommerce a.button, .woocommerce button.button,
.woocommerce #respond input#submit, .woocommerce input.button {
  background: var(--sare-accent) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 12px 26px !important;
  font-weight: 600 !important;
  letter-spacing: .01em;
  border: 0 !important;
  transition: background .2s ease, transform .2s ease;
}
a.button:hover, button.button:hover, .button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce #respond input#submit:hover, .woocommerce input.button:hover {
  background: var(--sare-accent-d) !important;
  transform: translateY(-2px);
}

/* ==========================================================================
   Ürün kartları (mağaza / arşiv)
   ========================================================================== */
.woocommerce ul.products li.product,
.wc-block-grid__product {
  transition: transform .25s ease, box-shadow .25s ease;
  border-radius: 14px;
  overflow: hidden;
  padding-bottom: 14px;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 34px rgba(31,26,29,.10);
}
.woocommerce ul.products li.product img {
  border-radius: 12px;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 1rem;
  font-weight: 600;
  padding-top: 10px;
}
.woocommerce ul.products li.product .price {
  color: var(--sare-accent-d);
  font-weight: 700;
}
.woocommerce ul.products li.product del {
  color: #b3a9a9;
  font-weight: 400;
}

/* İndirim rozeti */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
  background: var(--sare-accent) !important;
  color: #fff !important;
  border-radius: 999px !important;
  min-height: auto !important;
  min-width: auto !important;
  padding: 5px 14px !important;
  font-weight: 600;
  line-height: 1.2;
}

/* ==========================================================================
   Kategori vitrini shortcode'u: [sare_kategoriler]
   ========================================================================== */
.sare-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 22px;
  margin: 30px 0;
}
.sare-cat-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--sare-line);
  border-radius: 16px;
  overflow: hidden;
  text-align: center;
  text-decoration: none !important;
  transition: transform .25s ease, box-shadow .25s ease;
}
.sare-cat-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 34px rgba(31,26,29,.12);
}
.sare-cat-thumb {
  display: block;
  width: 100%;
  padding-top: 120%;
  background-size: cover;
  background-position: center;
  background-color: var(--sare-soft);
}
.sare-cat-name {
  display: block;
  padding: 14px 10px 2px;
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--sare-ink);
}
.sare-cat-count {
  display: block;
  padding: 0 10px 16px;
  font-size: .85rem;
  color: #a89c9c;
}

/* ==========================================================================
   Sepet / ödeme küçük dokunuşlar
   ========================================================================== */
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--sare-accent) !important;
}
.woocommerce-message::before,
.woocommerce-info::before {
  color: var(--sare-accent) !important;
}

/* ==========================================================================
   Alt bar gizleme (güvenli alışveriş rozeti + copyright + ödeme logoları şeridi)
   ========================================================================== */
#ecommerce_n_secure_payment_footer {
  display: none !important;
}

/* ==========================================================================
   Mobil
   ========================================================================== */
@media (max-width: 600px) {
  .sare-category-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
  a.button, button.button, .button {
    padding: 11px 20px !important;
  }
}

/* ==========================================================================
   Ürün kartında kategori bilgisi gizlendi
   --------------------------------------------------------------------------
   Blocksy, ürün kartına başlık ve fiyatın altına kategori listesi basıyordu
   ("KADIN, KAZAK"). Kart zaten kategori sayfasında duruyor; tekrar bilgi katmıyor
   ve kartları gereksiz uzatıyordu.

   Yalnız ÜRÜN kartlarında gizlenir — blog yazılarındaki entry-meta etkilenmez.
   Tek ürün sayfasındaki kategori bağlantıları da yerinde kalır.
   ========================================================================== */
.woocommerce ul.products li.product .entry-meta,
ul.products li.product .entry-meta,
.product .ct-woo-card-extra .entry-meta,
li.product .entry-meta .meta-categories {
  display: none !important;
}

/* ==========================================================================
   Masaüstünde de soldan açılan menü
   --------------------------------------------------------------------------
   Masaüstünde yatay menü vardı (ANASAYFA · ÜRÜNLER · HAKKIMIZDA · İLETİŞİM),
   mobilde ise soldan açılan panel. İkisi tek davranışta birleştirildi.

   Blocksy başlığı iki kez basıyor: data-device="desktop" ve data-device="mobile".
   Mobil satırın tamamını masaüstünde göstermek başlığı ikiye katlıyordu; bu yüzden
   yalnız yatay menü gizleniyor ve başlığa kendi hamburger düğmemiz ekleniyor
   (functions.php). Düğme, Blocksy'nin kendi gizli tetikleyicisini tıklıyor —
   panelin açılma/kapanma mantığı temanın kendi kodunda kalıyor.
   ========================================================================== */
@media (min-width: 1000px) {

  /* Yatay menü satırı (JS ile işaretlenir) */
  .sare-pc-menu-gizli { display: none !important; }

  /* Panel içeriği mobil olarak işaretli; masaüstünde de görünmeli */
  #offcanvas .ct-panel-content[data-device="mobile"] {
    display: flex !important;
    justify-content: flex-start;
  }

  .sare-burger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; padding: 0; margin-right: 16px;
    background: none; border: 0; cursor: pointer; color: inherit;
  }
  .sare-burger span { display: block; width: 20px; height: 2px; background: currentColor; position: relative; }
  .sare-burger span::before,
  .sare-burger span::after {
    content: ""; position: absolute; left: 0; width: 20px; height: 2px; background: currentColor;
    transition: transform .2s;
  }
  .sare-burger span::before { top: -6px; }
  .sare-burger span::after  { top: 6px; }
  .sare-burger:hover span::before { transform: translateY(-1px); }
  .sare-burger:hover span::after  { transform: translateY(1px); }
}

/* ==========================================================================
   Footer ödeme logoları şeridi
   ========================================================================== */
.sare-odeme-serit {
  padding: 18px 20px;
  border-top: 1px solid rgba(255,255,255,.12);
}
.sare-odeme-serit__ic {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: center;
  gap: 14px; flex-wrap: wrap;
}
.sare-odeme-serit__baslik {
  font-size: 12px; letter-spacing: .4px; text-transform: uppercase; opacity: .75;
}
.sare-odeme-serit__logolar { display: inline-flex; align-items: center; gap: 10px; }
.sare-odeme-serit__logolar img {
  height: 30px; width: auto; display: block;
  background: #fff; border-radius: 4px; padding: 3px 5px;
}