/*
Theme Name: mutebag — Blocksy Child
Theme URI: https://mutebag.com.tr
Description: mutebag için Blocksy alt teması. Hipicon-tarzı editoryal/minimal vitrin. Tasarım token'ları assets/tokens.css içinde.
Author: Serksahin Design Studio
Template: blocksy
Version: 1.0.1
Text Domain: blocksy-child
*/

/* ============================================================
   Bu dosya bileşen/override stilleri içindir.
   Marka değişkenleri (renk/tipografi/boşluk) => assets/tokens.css
   ============================================================ */

/* --- Ürün kartı: hover'da 2. görsel (JS ile media container'a taşınır) --- */
.woocommerce ul.products li.product .ct-media-container,
.woocommerce ul.products li.product figure {
  position: relative;
  overflow: hidden;
}
.mb-hover-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .5s ease;
  pointer-events: none;
  z-index: 2;
}
.woocommerce ul.products li.product:hover .mb-hover-img {
  opacity: 1;
}

/* --- Sepete ekle butonu: masaüstünde hover'da beliren editoryal his;
       dokunmatik cihazlarda her zaman görünür --- */
@media (hover: hover) {
  .woocommerce ul.products li.product .button,
  .woocommerce ul.products li.product .ct-woocommerce-loop-button {
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .3s ease, transform .3s ease;
  }
  .woocommerce ul.products li.product:hover .button,
  .woocommerce ul.products li.product:hover .ct-woocommerce-loop-button {
    opacity: 1;
    transform: none;
  }
}

/* --- Editoryal ürün kartı sadeleştirme --- */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: .95rem;
  font-weight: 500;
  letter-spacing: var(--mb-tracking);
}
.woocommerce ul.products li.product .price {
  color: var(--mb-muted);
  font-size: .9rem;
}

/* --- Bölüm yardımcı sınıfı --- */
.mb-section { padding-block: var(--mb-section-y); }
.mb-container { max-width: 1280px; margin-inline: auto; padding-inline: clamp(16px, 4vw, 40px); }

/* --- Duyuru barı (Hipicon tarzı, dönen) --- */
.mb-announce {
  position: relative;
  height: 38px;
  background: var(--mb-primary);
  color: #fff;
  overflow: hidden;
}
.mb-announce__item {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .78rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .5s ease, transform .5s ease;
  padding: 0 16px;
  text-align: center;
}
.mb-announce__item.is-active { opacity: 1; transform: none; }

/* --- Header altı tam genişlik arama çubuğu (Hipicon imzası) --- */
.mb-searchbar {
  border-bottom: 1px solid var(--mb-line);
  background: var(--mb-bg);
}
.mb-searchbar__form {
  display: flex;
  align-items: center;
  max-width: 1280px;
  margin-inline: auto;
  padding: 12px clamp(16px, 4vw, 40px);
  gap: 10px;
}
.mb-searchbar__form input[type="search"] {
  flex: 1;
  border: 1px solid var(--mb-line);
  background: var(--mb-card);
  padding: 13px 18px;
  font-size: .92rem;
  color: var(--mb-ink);
  border-radius: var(--mb-radius);
  outline: none;
  transition: border-color .2s ease;
}
.mb-searchbar__form input[type="search"]:focus { border-color: var(--mb-primary); }
.mb-searchbar__form input::placeholder { color: var(--mb-muted); }
.mb-searchbar__form button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 0;
  background: var(--mb-primary);
  color: #fff;
  cursor: pointer;
  border-radius: var(--mb-radius);
  transition: background .2s ease;
}
.mb-searchbar__form button:hover { background: var(--mb-primary-dark); }
@media (max-width: 560px) {
  .mb-searchbar__form { padding: 10px 16px; }
  .mb-searchbar__form input[type="search"] { padding: 11px 14px; font-size: .88rem; }
}

/* --- Blocksy accent/link rengini marka cognac'ına taşı --- */
:root {
  --theme-palette-color-1: #B86E18;  /* accent/link (cognac) */
  --theme-palette-color-2: #8A5312;  /* hover (dark leather) */
  --theme-link-initial-color: #B86E18;
  --theme-link-hover-color: #8A5312;
}
/* İndirim rozeti ve aktif menü — marka cognac (Blocksy mavisini geç) */
.woocommerce span.onsale,
.ct-sale-badge,
.wc-block-components-product-sale-badge {
  background-color: var(--mb-primary) !important;
  color: #fff !important;
}
/* Rozet metnini "İndirim" yap (Blocksy'nin "Sale" metnini gizle, üzerine yaz) */
.woocommerce span.onsale,
.ct-sale-badge { font-size: 0 !important; }
.woocommerce span.onsale::after,
.ct-sale-badge::after {
  content: "İndirim";
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
}
.ct-header .current-menu-item > a,
.ct-header .current_page_item > a,
.ct-header .menu-item.current-menu-item > a { color: var(--mb-primary) !important; }

/* --- Logo varken Blocksy site adı metnini gizle (çakışmayı önle) --- */
.site-branding .site-title,
.ct-header .site-title { display: none; }
/* Logo boyutu */
.site-branding .site-logo-container img,
.ct-header .site-branding img { max-height: 42px; width: auto; }

/* --- Header: hesap + sepet ikonları (functions.php enjekte eder) --- */
.mb-header-icons {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.mb-header-icons .mb-ico {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--mb-ink);
  padding: 6px;
  line-height: 0;
}
.mb-header-icons .mb-ico:hover { opacity: .6; }
.mb-header-icons .mb-cart-count {
  position: absolute;
  top: -2px;
  right: -2px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 9px;
  background: var(--mb-accent);
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 16px;
  text-align: center;
}

/* --- 4 kolonlu footer (blocksy:footer:before hook) — koyu marka zemini --- */
.mb-footer {
  background: var(--mb-footer-bg);
  color: var(--mb-stone);
  padding-block: clamp(40px, 6vw, 72px) 28px;
}
.mb-footer__grid {
  display: grid;
  grid-template-columns: 1.3fr repeat(4, 1fr);
  gap: clamp(24px, 4vw, 56px);
}
.mb-footer__logo {
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: .02em;
  margin-bottom: 14px;
  color: #fff;
}
.mb-footer__logo img { height: 30px; width: auto; display: block; filter: brightness(0) invert(1); opacity: .95; }
.mb-footer__brand p {
  color: var(--mb-taupe);
  font-size: .9rem;
  line-height: 1.6;
  max-width: 30ch;
  margin: 0 0 18px;
}
.mb-footer__social { display: flex; gap: 12px; }
.mb-footer__social a { color: var(--mb-stone); opacity: .75; }
.mb-footer__social a:hover { opacity: 1; color: var(--mb-primary-light); }
.mb-footer__col h4 {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  margin: 0 0 16px;
  color: #fff;
}
.mb-footer__col ul { list-style: none; margin: 0; padding: 0; }
.mb-footer__col li { margin-bottom: 10px; }
.mb-footer__col a {
  color: var(--mb-taupe);
  text-decoration: none;
  font-size: .88rem;
  transition: color .2s ease;
}
.mb-footer__col a:hover { color: var(--mb-primary-light); }
/* .mb-footer__pay kaldırıldı — Güvenli Ödeme artık ızgara içinde bir sütun */
/* Kendi credit satırımız var — Blocksy'nin varsayılan credit footer'ını gizle */
footer.ct-footer { display: none !important; }

/* Şirket künyesi — koyu footer'a yedirilmiş, varsayılan kapalı */
.mb-footer__legal {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.08);
  font-size: .74rem;
  letter-spacing: .02em;
  color: var(--mb-dark-taupe);
}
.mb-footer__firm summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px 14px;
}
.mb-footer__firm summary::-webkit-details-marker { display: none; }
.mb-footer__firm summary > span { color: var(--mb-taupe); }
.mb-footer__firm summary em {
  font-style: normal;
  font-size: .7rem;
  color: var(--mb-dark-taupe);
  text-decoration: underline dotted;
  text-underline-offset: 3px;
  transition: color .2s ease;
}
.mb-footer__firm summary:hover em { color: var(--mb-primary-light); }
.mb-footer__firm[open] summary em { color: var(--mb-taupe); }
/* Kapalıyken gizli kalmalı — display:flex, <details> gizlemesini eziyordu */
.mb-footer__firm-detail { display: none; }
.mb-footer__firm[open] .mb-footer__firm-detail {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-top: 8px;
  color: var(--mb-dark-taupe);
  line-height: 1.6;
}

/* Künye varken copyright ayrı çizgi açmasın — tek blok görünsün */
.mb-footer__legal + .mb-footer__credit { margin-top: 10px; padding-top: 0; border-top: 0; }

/* mutebag credit satırı (serksahin logolu) */
.mb-footer__credit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.08);
  color: var(--mb-dark-taupe);
  font-size: .74rem;
  letter-spacing: .02em;
}
.mb-footer__by {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--mb-dark-taupe);
  text-decoration: none;
  transition: opacity .2s ease;
}
.mb-footer__by:hover { opacity: .8; }
.mb-footer__by img { height: 15px; width: auto; display: block; }
@media (max-width: 560px) {
  .mb-footer__credit { flex-direction: column; align-items: flex-start; gap: 10px; }
}
@media (max-width: 900px) {
  .mb-footer__grid { grid-template-columns: 1fr 1fr; }
  .mb-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .mb-footer__grid { grid-template-columns: 1fr; }
  
}

/* --- Editoryal eyebrow / başlık --- */
.mb-eyebrow {
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--mb-muted);
}