/* ==========================================================================
   WOOD THEME — Safira-style 1:1 layout for icanad
   --------------------------------------------------------------------------
   Admin override sözleşmesi: --primary, --accent, --text-primary,
   --font-family, --site-font-weight  (5 token)
   ========================================================================== */

:root {
  /* === ICANAD KONTRAT (admin override) === */
  --font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-heading: "Playfair Display", "Open Sans", serif;
  --site-font-weight: 400;
  --primary: #1a1a1a;
  --accent: #b59677;
  --text-primary: #1a1a1a;
  --menu: #1a1a1a;

  /* === Tema sabitleri === */
  --accent-dark: #9c7d5c;
  --accent-light: #d6b598;

  --campaign-top-bg: #fce5e6;
  --campaign-top-fg: #1a1a1a;
  --campaign-bottom-bg: #fed700;
  --campaign-bottom-fg: #111111;

  --bg: #ffffff;
  --surface: #f7f5f0;
  --surface-2: #f1ede4;
  --border: #ebebeb;
  --border-strong: #dadada;
  --muted: #777777;
  --muted-2: #999999;

  --danger: #e74c3c;
  --success: #5cb85c;
  --star: #f5b400;

  --container: 1410px;

  --transition: 250ms ease;
  --transition-slow: 450ms ease;
}

/* ----- Reset ---------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-family);
  font-weight: var(--site-font-weight);
  color: var(--text-primary);
  background: var(--bg);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--accent); }
button { font: inherit; cursor: pointer; border: none; background: transparent; color: inherit; padding: 0; }
input, select, textarea { font: inherit; }
ul { list-style: none; padding: 0; margin: 0; }
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; line-height: 1.25; color: var(--text-primary); }

.wood-container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 15px;
}

/* ==========================================================================
   1. CAMPAIGN BAR (top, marquee)
   ========================================================================== */
.wood-campaign-top {
  position: relative;
  background: var(--campaign-top-bg);
  color: var(--campaign-top-fg);
  font-size: 12px;
  line-height: 1;
}
.wood-campaign-top.is-hidden { display: none; }
.wood-campaign-top__viewport {
  overflow: hidden;
  padding-right: 40px;
}
.wood-campaign-top__track {
  display: flex;
  gap: 50px;
  padding: 9px 0;
  white-space: nowrap;
  width: max-content;
  animation: wood-marquee 38s linear infinite;
}
.wood-campaign-top__item { display: inline-flex; align-items: center; }
.wood-campaign-top__item a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  opacity: .92;
  font-weight: 400;
}
.wood-campaign-top__item a:hover { opacity: 1; color: var(--primary); }
.wood-campaign-top__item i {
  font-size: 14px;
  color: var(--accent);
  flex: none;
}
.wood-campaign-top__close {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--campaign-top-fg);
  background: transparent;
  opacity: .55;
  transition: opacity .2s ease, background .2s ease;
  cursor: pointer;
  z-index: 2;
}
.wood-campaign-top__close i { font-size: 14px; line-height: 1; }
.wood-campaign-top__close:hover { opacity: 1; background: rgba(0,0,0,.07); }

@keyframes wood-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* (legacy utility/header/nav blocks removed — see sections "Header (Safira)" and "Nav (Safira)" below) */

/* mobile drawer */
.wood-mobile-drawer {
  position: fixed;
  top: 0; left: 0;
  width: 320px;
  max-width: 90vw;
  height: 100vh;
  background: #fff;
  box-shadow: 4px 0 24px rgba(0,0,0,.15);
  z-index: 1000;
  transform: translateX(-100%);
  transition: transform 350ms ease;
  overflow-y: auto;
  padding: 24px 20px;
}
.wood-mobile-drawer.is-open { transform: translateX(0); }
.wood-mobile-drawer__close {
  position: absolute;
  top: 14px; right: 14px;
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 20px;
}
.wood-mobile-drawer ul li a {
  display: block;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
  font-size: 14px;
  font-weight: 600;
  color: var(--primary);
  text-transform: uppercase;
  letter-spacing: .4px;
}
.wood-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.4);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: all var(--transition);
}
.wood-overlay.is-open { opacity: 1; visibility: visible; }

/* (legacy hero block removed — see "Hero (Safira)" section below) */

/* ==========================================================================
   6. SECTION SPACING HELPERS
   (Promo banners moved to "Banners-3" section below — Hero Safira block)
   ========================================================================== */
.wood-section { padding: 60px 0; }
.wood-section--tight { padding: 40px 0; }

/* ==========================================================================
   7. SECTION TITLE
   ========================================================================== */
.wood-section-head {
  text-align: center;
  margin-bottom: 40px;
}
.wood-section-head__title,
.wood-section-head h2,
.wood-section-head h3 {
  font-family: var(--font-heading);
  font-size: 32px;
  font-weight: 600;
  margin: 0 0 8px;
  letter-spacing: -.3px;
  color: var(--primary);
  line-height: 1.2;
}
.wood-section-head__note,
.wood-section-head p {
  display: block;
  font-size: 14px;
  color: var(--muted);
  margin: 0;
}
@media (max-width: 640px) {
  .wood-section-head { margin-bottom: 28px; }
  .wood-section-head__title,
  .wood-section-head h2,
  .wood-section-head h3 { font-size: 24px; }
}

/* ==========================================================================
   8. CATEGORIES (Safira-style cards) — see "Cat slider" block below
   ========================================================================== */

/* ==========================================================================
   9. MID FULL-WIDTH BANNER (overridden later in section "Banner-mid")
   ========================================================================== */

/* ==========================================================================
   10. PRODUCT TABS + GRID
   ========================================================================== */
/* Outer .wood-tabs wraps both the tab buttons and the panes; it MUST stack
   them vertically. The tab-button row is styled via .wood-tabs__list below. */
.wood-tabs { display: block; }
.wood-tab {
  padding: 8px 20px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
  transition: all var(--transition);
}
.wood-tab.is-active,
.wood-tab:hover {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.wood-products {
  display: grid;
  gap: 30px;
}
.wood-products--5 { grid-template-columns: repeat(5, 1fr); }
.wood-products--4 { grid-template-columns: repeat(4, 1fr); }
.wood-products--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 1199px) {
  .wood-products--5 { grid-template-columns: repeat(4, 1fr); }
  .wood-products--4 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 991px) {
  .wood-products--5 { grid-template-columns: repeat(3, 1fr); }
  .wood-products--4 { grid-template-columns: repeat(2, 1fr); }
  .wood-products--2 { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .wood-products--5,
  .wood-products--4 { grid-template-columns: repeat(2, 1fr); gap: 18px; }
}

.wood-product { position: relative; }
.wood-product__media {
  position: relative;
  background: var(--wood-card-bg, var(--surface));
  overflow: hidden;
  margin-bottom: 14px;
  aspect-ratio: 1/1;
}
.wood-product__img {
  width: 100%; height: 100%; object-fit: cover;
  transition: opacity var(--transition);
}
.wood-product__img--hover {
  position: absolute;
  inset: 0;
  opacity: 0;
}
/* Ana görsel yalnızca ikinci (hover) görsel varsa gizlenir; yoksa kart
   arka planı (pembe) görünmesin. */
.wood-product:hover .wood-product__media.has-hover .wood-product__img--main { opacity: 0; }
.wood-product:hover .wood-product__img--hover { opacity: 1; }

.wood-product__badges {
  position: absolute;
  top: 12px; left: 12px; right: 12px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  z-index: 3;
  pointer-events: none;
}
.wood-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  border-radius: 3px;
  color: #fff;
}
.wood-badge--new  { background: var(--success); }
.wood-badge--sale { background: var(--danger); margin-left: auto; }

/* Hover overlay + cart/icon button styles live in section "Products grids"
   below (around line ~2200). The previous block here was an older variant
   that conflicted with the Safira-style pill bar; intentionally removed. */

.wood-product__cat {
  display: block;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 4px;
}
.wood-product__title {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--primary);
  line-height: 1.4;
  margin-bottom: 6px;
}
.wood-product__title:hover { color: var(--accent); }
.wood-product__rating {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  font-size: 12px;
  color: var(--muted);
}
.wood-product__stars { color: var(--star); letter-spacing: 1px; font-size: 13px; }
.wood-product__price {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.wood-product__price-current {
  font-size: 16px;
  font-weight: 700;
  color: var(--primary);
}
.wood-product__price--sale .wood-product__price-current { color: var(--danger); }
.wood-product__price-old {
  font-size: 14px;
  color: var(--muted);
  text-decoration: line-through;
}

/* ==========================================================================
   11. BANNERS BOTTOM (overridden later in section "Banners-2")
   ========================================================================== */

/* ==========================================================================
   12. HOT DEALS (2 large cards)
   ========================================================================== */
/* Real rules live in section "Hot deals" lower (line ~2249+). The previous
   block here applied `display: grid` directly to the <section.wood-deals>
   element, which crushed the inner container into a single grid column.
   Intentionally removed — only the canonical block below is kept. */

/* ==========================================================================
   13. BRAND LOGOS
   ========================================================================== */
/* Real rules live in section "Brands" lower (line ~2373+). The previous
   block here applied `display: grid` directly to <section.wood-brands>,
   collapsing the inner container into a single grid cell (~20% width) and
   hiding most of the logos. Intentionally removed. */

/* ==========================================================================
   14. FEATURED PRODUCTS — alt look (action panel below)
   ========================================================================== */
.wood-featured .wood-product__hover { display: none; }
.wood-featured .wood-product__qty { display: none; }
.wood-featured .wood-product__atc {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  transform: translateY(100%);
}

/* ==========================================================================
   15. BLOG (wood-post / wood-blog)
   ========================================================================== */
.wood-blog { padding: 70px 0 60px; }
.wood-blog__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
@media (max-width: 991px) { .wood-blog__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .wood-blog__grid { grid-template-columns: 1fr; } }

.wood-post {
  display: block;
  background: #fff;
}
.wood-post__media {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16/11;
  margin-bottom: 18px;
}
.wood-post__media img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform var(--transition-slow);
  display: block;
}
.wood-post:hover .wood-post__media img { transform: scale(1.05); }

.wood-post__date {
  position: absolute;
  bottom: 16px; left: 16px;
  background: var(--accent);
  color: #fff;
  width: 64px; height: 64px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: .6px;
  line-height: 1.1;
  text-align: center;
}
.wood-post__date strong { font-size: 20px; font-weight: 700; }
.wood-post__date em { font-style: normal; }

.wood-post__body { padding: 4px 4px 0; }
.wood-post__cat {
  display: inline-block;
  font-size: 12px;
  color: var(--accent);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 8px;
  font-weight: 600;
}
.wood-post__title {
  font-size: 18px;
  font-weight: 600;
  color: var(--primary);
  margin: 0 0 10px;
  line-height: 1.35;
  font-family: var(--font-heading);
}
.wood-post__title a { color: inherit; }
.wood-post:hover .wood-post__title a { color: var(--accent); }
.wood-post__excerpt {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.6;
  margin: 0 0 12px;
}
.wood-post__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.wood-post__more i { transition: transform .2s ease; }
.wood-post__more:hover i { transform: translateX(3px); }

/* ==========================================================================
   16. FOOTER
   ========================================================================== */
.wood-footer {
  background: #fff;
  border-top: 1px solid var(--border);
  padding-top: 60px;
  margin-top: 60px;
}
.wood-footer__grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 2fr;
  gap: 40px;
  padding-bottom: 50px;
}
@media (max-width: 991px) {
  .wood-footer__grid { grid-template-columns: 1fr 1fr; gap: 30px; }
}
@media (max-width: 480px) {
  .wood-footer__grid { grid-template-columns: 1fr; }
}

.wood-footer h3 {
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 18px;
  color: var(--primary);
}
.wood-footer__brand img { height: 40px; width: auto; margin-bottom: 16px; }
.wood-footer__desc {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.7;
  margin-bottom: 18px;
}
.wood-footer__hotline {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.wood-footer__hotline i {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--surface);
  color: var(--accent);
  font-size: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.wood-footer__hotline-label {
  display: block;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.wood-footer__hotline-num {
  font-size: 16px;
  font-weight: 700;
  color: var(--primary);
}
/* Older sibling rules removed:
   - duplicate `.wood-footer__social` with conflicting font-size/transition
   - generic `.wood-footer ul li a { display: inline-block; padding: 5px 0 }`
     which had higher specificity (1 class + 3 elements) than the canonical
     `.wood-footer__social a` rule, forcing the social icon anchors to
     `inline-block` and breaking the inner flex centering — so the icon
     glyph rendered at the text baseline (upper-left of the circle).
   The canonical rules live further down in the file. */

/* NOTE: an older `.wood-newsletter { display: flex; ... }` block lived here
   and stripped the input border (`border: none`) plus forced the section
   into flex layout — conflicting with the dedicated newsletter partial.
   The canonical rules now live further down (search "NEWSLETTER (above
   footer, below blog)"). This stub kept intentionally so future grep
   pings find the change history. */

.wood-app-store { display: flex; gap: 10px; }
.wood-app-store a {
  background: var(--primary);
  color: #fff;
  padding: 8px 14px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  line-height: 1.2;
}
.wood-app-store a i { font-size: 22px; }
.wood-app-store a span { display: block; }
.wood-app-store a span small { display: block; font-size: 9px; opacity: .85; text-transform: uppercase; letter-spacing: .5px; }
.wood-app-store a span strong { font-size: 13px; font-weight: 700; }

.wood-footer__bottom {
  border-top: 1px solid var(--border);
  padding: 20px 0;
}
.wood-footer__bottom-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}
.wood-footer__copy {
  font-size: 13px;
  color: var(--muted);
}
.wood-footer__copy a { color: var(--primary); font-weight: 600; }
.wood-footer__pay {
  display: flex;
  gap: 6px;
  align-items: center;
}
.wood-footer__pay span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  min-width: 42px;
  padding: 0 7px;
  background: var(--surface);
  color: var(--primary);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .5px;
  border-radius: 3px;
  border: 1px solid var(--border);
}
.wood-back-top {
  position: fixed;
  right: 24px;
  bottom: 90px;
  width: 44px; height: 44px;
  background: var(--primary);
  color: #fff;
  border: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0;
  cursor: pointer;
  font-size: 18px;
  z-index: 70;
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease, background-color .2s ease;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.wood-back-top span { display: none; }
.wood-back-top:hover { background: var(--accent); }
.wood-back-top.is-show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
@media (max-width: 991px) {
  .wood-back-top { right: 14px; bottom: 130px; }
}

/* ==========================================================================
   17. CAMPAIGN BAR (footer sticky / yellow)
   ========================================================================== */
.wood-campaign-bottom {
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  width: min(640px, 92vw);
  background: var(--campaign-bottom-bg);
  color: var(--campaign-bottom-fg);
  z-index: 90;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
  display: flex;
  align-items: center;
}
.wood-campaign-bottom.is-hidden { display: none; }
.wood-campaign-bottom__track {
  display: flex;
  gap: 50px;
  padding: 12px 0;
  white-space: nowrap;
  animation: wood-marquee 22s linear infinite;
  width: max-content;
  flex: 1;
}
.wood-campaign-bottom__close {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 24px; height: 24px;
  border-radius: 50%;
  background: rgba(0,0,0,.15);
  color: #111;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  cursor: pointer;
}
@media (max-width: 991px) {
  .wood-campaign-bottom { bottom: 70px; }
}

/* ==========================================================================
   18. MOBILE BOTTOM NAV (wood-mnav)
   ========================================================================== */
.wood-mnav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: #fff;
  border-top: 1px solid var(--border);
  z-index: 95;
  padding: 4px 0 6px;
  box-shadow: 0 -4px 16px rgba(0,0,0,.06);
  grid-template-columns: repeat(5, 1fr);
}
.wood-mnav__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 8px 4px;
  font-size: 10px;
  color: var(--primary);
  position: relative;
  text-align: center;
}
.wood-mnav__icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.wood-mnav__icon i { font-size: 22px; line-height: 1; }
.wood-mnav__badge {
  position: absolute;
  top: -6px; right: -10px;
  background: var(--accent);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  font-style: normal;
  border-radius: 9px;
  min-width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  line-height: 1;
}
.wood-mnav__label {
  font-size: 11px;
  letter-spacing: .2px;
  color: var(--primary);
}
.wood-mnav__item:hover,
.wood-mnav__item.is-active { color: var(--accent); }
.wood-mnav__item:hover .wood-mnav__label,
.wood-mnav__item.is-active .wood-mnav__label { color: var(--accent); }

/* "Ara" sekmesine dokununca alt menünün yerini alan satır içi arama kutusu */
.wood-mnav__search {
  display: none;
  grid-column: 1 / -1;
  align-items: center;
  gap: 8px;
  margin: 6px 12px 4px;
  padding: 4px 4px 4px 12px;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 10px;
}
.wood-mnav__search input {
  flex: 1 1 auto;
  min-width: 0;
  height: 40px;
  border: none;
  background: transparent;
  font-size: 16px; /* iOS otomatik zoom'u engeller */
  color: var(--primary, #2a2a2a);
  outline: none;
  -webkit-appearance: none;
}
.wood-mnav__search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.wood-mnav__search-go {
  flex-shrink: 0;
  width: 36px; height: 36px;
  border: none;
  border-radius: 8px;
  background: var(--accent, #b9442d);
  color: #fff;
  font-size: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.wood-mnav__search-close {
  flex-shrink: 0;
  width: 36px; height: 36px;
  border: none;
  background: transparent;
  color: var(--muted, #8a7d6a);
  font-size: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.wood-mnav.is-search .wood-mnav__item { display: none; }
.wood-mnav.is-search .wood-mnav__search { display: flex; }

@media (max-width: 991px) {
  .wood-mnav { display: grid; }
  body { padding-bottom: 64px; }
  /* Yüzen WhatsApp butonu alt sabit menünün üstünde dursun
     (whatsapp-float.php inline stili body sonunda geldiği için !important) */
  a.wa-float { bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; }
}

/* ==========================================================================
   19. RECENT-ORDER NOTIFY (wood-recent — bottom-left popup, slide cycle)
   ========================================================================== */
.wood-recent {
  position: fixed;
  bottom: 24px;
  left: 20px;
  width: 320px;
  max-width: calc(100vw - 28px);
  background: #fff;
  box-shadow: 0 14px 38px rgba(0,0,0,.16);
  border-radius: 8px;
  padding: 14px 14px 14px 14px;
  z-index: 80;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 350ms ease, transform 350ms ease;
  pointer-events: none;
}
.wood-recent.is-show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.wood-recent__close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f1efe9;
  border: 0;
  border-radius: 50%;
  padding: 0;
  margin: 0;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  color: #3a342d;
  z-index: 5;
  transition: background .2s ease, color .2s ease;
}
.wood-recent__close::before {
  content: '';
  position: absolute;
  inset: -6px;
  border-radius: 50%;
}
.wood-recent__close i {
  font-size: 14px;
  line-height: 1;
  display: block;
  pointer-events: none;
}
.wood-recent__close:hover { background: var(--accent); color: #fff; }

.wood-recent__track {
  position: relative;
  height: 124px;
}
.wood-recent__slide {
  position: absolute;
  inset: 0;
  display: flex;
  gap: 12px;
  align-items: stretch;
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s ease;
  pointer-events: none;
}
.wood-recent__slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.wood-recent__media {
  position: relative;
  flex: none;
  display: block;
  width: 92px;
  height: 100%;
  background: var(--surface);
  overflow: hidden;
  border-radius: 4px;
}
.wood-recent__label {
  position: absolute;
  top: 6px; left: 6px;
  background: var(--accent);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 3px;
  z-index: 2;
}
.wood-recent__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: opacity .35s ease;
}
.wood-recent__img--hover { opacity: 0; }
.wood-recent__media.has-hover:hover .wood-recent__img--main { opacity: 0; }
.wood-recent__media:hover .wood-recent__img--hover { opacity: 1; }

.wood-recent__body {
  flex: 1;
  min-width: 0;
  padding-right: 36px;
  align-self: center;
}
.wood-recent__pre {
  display: block;
  font-size: 11px;
  text-transform: uppercase;
  color: var(--muted-2);
  letter-spacing: .4px;
  margin-bottom: 2px;
}
.wood-recent__title {
  font-size: 13px;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 4px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wood-recent__title a { color: inherit; }
.wood-recent__meta {
  display: flex;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
  overflow: hidden;
  margin: 0 0 2px;
}
.wood-recent__time {
  flex: none;
  font-size: 11px;
  color: var(--accent);
  font-weight: 600;
}
.wood-recent__place {
  flex: 1;
  min-width: 0;
  font-size: 11px;
  color: var(--muted-2);
  overflow: hidden;
  text-overflow: ellipsis;
}
.wood-recent__rating {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  font-size: 11px;
  color: var(--muted);
}
.wood-recent__reviews { font-size: 11px; color: var(--muted-2); }
.wood-recent__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 4px;
}
.wood-recent__price .wood-product__price--new { font-size: 13px; }
.wood-recent__price .wood-product__price--old { font-size: 11px; }

@media (max-width: 640px) {
  .wood-recent { width: calc(100vw - 28px); left: 14px; bottom: 80px; }
}

/* ==========================================================================
   20. UTILITY
   ========================================================================== */
.wood-only-mobile { display: none; }
@media (max-width: 991px) { .wood-only-mobile { display: inline-flex; } .wood-hide-mobile { display: none !important; } }

/* ==========================================================================
   21. PARTIAL ALIGNMENT (definitive layout for all partial classes)
   These rules complement / override the earlier "scaffold" rules so that the
   actual partial DOM (header__row/col, drawer, hero__viewport, product__*, etc.)
   renders correctly in 1:1 with the safira-style intent.
   ========================================================================== */

/* ---------- Header (Safira) --------------------------------------------- */
.wood-header {
  background: #fff;
  border-bottom: 1px solid var(--border);
  position: relative;
  z-index: 60;
}
.wood-header.is-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 95;
  background: #fff;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .08);
  animation: woodHeadSlideDown .3s ease both;
}
.wood-header.is-sticky .wood-header__row {
  padding: 14px 15px;
}
.wood-header.is-sticky .wood-logo__img {
  height: 38px;
}
@keyframes woodHeadSlideDown {
  from { transform: translateY(-100%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.wood-header__spacer { display: none; }
.wood-header__spacer.is-active { display: block; }
.wood-header__row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 28px 15px;
}
.wood-header__col { display: flex; align-items: center; min-width: 0; }
.wood-header__col--left  { flex: 1 1 0; gap: 22px; justify-content: flex-start; }
.wood-header__col--logo  {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  z-index: 1;
}
.wood-header__col--right { flex: 1 1 0; gap: 18px; justify-content: flex-end; }

.wood-logo { display: inline-flex; align-items: center; justify-content: center; }
.wood-logo__img { display: block; height: 48px; width: auto; max-width: 240px; object-fit: contain; }

.wood-header__hamburger {
  display: none;
  width: 38px; height: 38px;
  flex-direction: column;
  gap: 5px;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 4px;
}
.wood-header__hamburger span {
  display: block; width: 18px; height: 2px;
  background: var(--primary); border-radius: 2px;
}

/* Switchers (lang / currency) */
.wood-header__sw { position: relative; }
.wood-header__sw-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  color: var(--primary);
  font-size: 13px;
  font-weight: 500;
  padding: 4px 0;
  cursor: pointer;
  line-height: 1;
}
.wood-header__sw-btn:hover { color: var(--accent); }
.wood-header__sw-btn .ph-caret-down { font-size: 11px; opacity: .55; }
.wood-header__sw-flag {
  font-size: 14px;
  line-height: 1;
}
.wood-header__sw-menu {
  position: absolute;
  top: calc(100% + 12px);
  /* Switcher'lar header'ın en solunda; menü ortalanırsa (translateX(-50%))
     sol kenardan taşıp editör önizlemesinde/dar viewport'ta kesiliyordu.
     Trigger'ın sol kenarına hizalayıp sağa doğru açıyoruz. */
  left: 0;
  min-width: 170px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 6px 0;
  box-shadow: 0 14px 28px rgba(0,0,0,.10);
  opacity: 0;
  visibility: hidden;
  transform: translate(0, 6px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
  z-index: 80;
}
.wood-header__sw:hover .wood-header__sw-menu {
  opacity: 1;
  visibility: visible;
  transform: translate(0, 0);
}

/* Upward-pointing triangle — trigger'ın soluna yakın konumlanır. */
.wood-header__sw-menu::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 22px;
  width: 12px;
  height: 12px;
  margin-left: 0;
  background: #fff;
  border-left: 1px solid var(--border);
  border-top: 1px solid var(--border);
  transform: rotate(45deg);
}

/* Hover bridge — keeps the menu open when crossing the gap between
   trigger and panel. */
.wood-header__sw::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 190px;
  margin-left: -95px;
  height: 14px;
  pointer-events: none;
}
.wood-header__sw:hover::after { pointer-events: auto; }
.wood-header__sw-menu li a {
  display: block;
  padding: 8px 14px;
  font-size: 13px;
  color: var(--primary);
}
.wood-header__sw-menu li a:hover { background: var(--surface); color: var(--accent); }

/* Header hızlı linkler (Giriş/Kayıt, Adreslerim) — header aksiyon ikonlarıyla
   aynı ağırlıkta okunsun diye ikonlar bold + büyük, yazı yarı kalın. */
.wood-header__quick {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--primary);
  font-size: 13.5px;
  font-weight: 600;
  padding: 4px 0;
  line-height: 1;
  white-space: nowrap;
}
.wood-header__quick:hover { color: var(--accent); }
.wood-header__quick i { font-size: 19px; }

/* Üyede "Siparişlerim" quick link olarak açıkta — dropdown'daki kopyası yalnızca
   quick linkler gizlenince (≤1199px) görünür. */
@media (min-width: 1200px) {
  .wood-header__account-orders { display: none; }
}

/* Misafirde Giriş/Kayıt quick linkleri görünürken Hesabım dropdown'ı gereksiz;
   quick linkler gizlenince (≤1199px) dropdown tekrar devreye girer. */
@media (min-width: 1200px) {
  .wood-header__account--guest { display: none; }
}

/* ---------- Account dropdown -------------------------------------------- *
 * Reuses the .wood-header__sw hover-dropdown pattern (relative wrapper +
 * absolute menu fading in on parent hover). The trigger renders a user
 * icon, the "Hesabım" label, and a down-caret. The menu shows two
 * centered options (Giriş Yap / Kayıt Ol) separated by a thin divider,
 * with a small upward-pointing triangle linking the menu to the trigger
 * (same affordance as the reference Safira/m2-style dropdown).
 * ----------------------------------------------------------------------- */
.wood-header__account { position: relative; }

.wood-header__account-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: transparent;
  border: 0;
  padding: 4px 0;
  margin: 0;
  cursor: pointer;
  color: var(--primary);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1;
  font-family: inherit;
  transition: color .2s ease;
}
.wood-header__account-btn:hover,
.wood-header__account:hover .wood-header__account-btn { color: var(--accent); }

/* Match the existing language/currency switcher caret behavior exactly
   (intrinsic glyph size, no explicit box) so the three triggers in the
   header row read as a uniform set. */
.wood-header__account-btn .ph-user { font-size: 19px; line-height: 1; }
.wood-header__account-caret {
  font-size: 11px;
  opacity: .55;
  line-height: 1;
  transition: transform .2s ease, opacity .2s ease;
}
.wood-header__account:hover .wood-header__account-caret {
  transform: rotate(180deg);
  opacity: .9;
}

/* Menu — own absolute-positioned dropdown panel (does NOT piggyback on
   .wood-header__sw-menu so we can keep the account widget visible at
   the 1199px breakpoint while the language/currency switchers hide).
   Anchored to the trigger's horizontal center so the panel opens
   directly beneath "Hesabım" rather than skewed to one side. */
/* Account dropdown — minimal, sabit-genişlik ikon sütunlu kompakt liste.
   180px genişlik 5–6 menü item için yeterli; ikonlar 16px width box ile
   hizalı.  Trigger butonunda zaten kullanıcı adı (ör. "Ahmet") gözüktüğü
   için panel içinde ayrıca "Hoş geldin, Ahmet Yılmaz" gibi karşılama
   bloğu tutmuyoruz — direkt ilk menü item'ı (Hesap Paneli) görünür. */
.wood-header__account-menu {
  position: absolute;
  top: calc(100% + 12px);
  left: 50%;
  width: 180px;
  margin: 0;
  padding: 6px 0;
  list-style: none;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 18px 36px rgba(0, 0, 0, .12);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 6px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
  z-index: 80;
}
.wood-header__account:hover .wood-header__account-menu,
.wood-header__account:focus-within .wood-header__account-menu {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
.wood-header__account-menu li { list-style: none; margin: 0; padding: 0; }

.wood-header__account-sep {
  height: 1px;
  background: var(--border);
  margin: 4px 12px;
}

/* Liste itemları — sabit genişlik ikon kutusu (16px), 11px gap. Bu
   sayede tüm metinler aynı sol marjdan başlar, ikonlar tek sütunda
   hizalı olur. */
.wood-header__account-menu li a {
  display: flex;
  align-items: center;
  gap: 11px;
  text-align: left;
  padding: 9px 14px;
  font-size: 13px;
  color: var(--primary);
  font-weight: 500;
  text-decoration: none;
  transition: background-color .15s ease, color .15s ease;
  white-space: nowrap;
}
.wood-header__account-menu li a i {
  flex: 0 0 16px;
  width: 16px;
  font-size: 16px;
  text-align: center;
  color: var(--muted);
  transition: color .15s ease;
}
.wood-header__account-menu li a:hover {
  background: var(--surface);
  color: var(--accent);
}
.wood-header__account-menu li a:hover i { color: var(--accent); }
.wood-header__account-logout { color: var(--muted) !important; }
.wood-header__account-logout:hover { color: var(--danger) !important; }
.wood-header__account-logout:hover i { color: var(--danger); }

/* Upward-pointing triangle that visually connects the menu to the
   trigger. Centered on the menu (which is itself centered on the
   trigger) so the arrow points directly at "Hesabım". */
.wood-header__account-menu::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 50%;
  width: 12px;
  height: 12px;
  margin-left: -6px;
  background: #fff;
  border-left: 1px solid var(--border);
  border-top: 1px solid var(--border);
  transform: rotate(45deg);
}

/* Bridge the 12px gap between trigger and menu so the dropdown doesn't
   close when the cursor crosses the gap. Spans wide enough to cover
   the whole menu width below it, not just the trigger. */
.wood-header__account::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  width: 220px;
  margin-left: -110px;
  height: 14px;
  pointer-events: none;
}
.wood-header__account:hover::after {
  pointer-events: auto;
}

/* Search (pill style) */
.wood-header__search {
  position: relative;
  flex: 1;
  max-width: 360px;
  height: 44px;
  display: flex;
  align-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: #fff;
  padding: 0 16px;
  height: 40px;
  transition: border-color .2s ease;
}
.wood-header__search:focus-within { border-color: var(--primary); }
.wood-header__search > i {
  font-size: 16px;
  color: var(--muted);
  margin-right: 8px;
}
.wood-header__search input {
  flex: 1;
  border: 0;
  background: transparent;
  padding: 0;
  font-size: 13px;
  color: var(--primary);
  outline: none;
  height: 100%;
}
.wood-header__search input::placeholder { color: var(--muted-2); }

/* Actions (compare, wishlist, cart) — minimal icons */
.wood-header__actions { display: flex; align-items: center; gap: 18px; }
.wood-header__act, .wood-header__cart {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--primary);
  font-size: 24px;
  border-radius: 50%;
  transition: color .2s ease, background .2s ease;
}
.wood-header__act:hover, .wood-header__cart:hover {
  color: var(--accent);
}
.wood-header__cart-count,
.wood-header__act-count {
  position: absolute;
  top: -3px; right: -4px;
  background: #ee3f3f;
  color: #fff;
  min-width: 18px; height: 18px;
  border-radius: 9px;
  font-size: 10px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  line-height: 1;
}
.wood-header__act-count { background: var(--accent); }

@media (max-width: 1199px) {
  .wood-header__sw,
  .wood-header__quick { display: none; }
  .wood-header__account span { display: none; }
}
@media (max-width: 991px) {
  .wood-header__row { gap: 12px; padding: 14px 12px; }
  .wood-header__col--logo {
    position: static;
    transform: none;
    flex: 1 1 auto;
    justify-content: center;
  }
  .wood-header__hamburger { display: inline-flex; }
  .wood-header__search,
  .wood-header__sw,
  .wood-header__quick,
  .wood-header__account { display: none; }
  .wood-header__actions { gap: 10px; }
}

/* ---------- Mobile drawer + overlay -------------------------------------- */
.wood-drawer {
  position: fixed;
  top: 0; left: 0;
  height: 100vh;
  width: min(320px, 86vw);
  background: #fff;
  z-index: 110;
  transform: translateX(-105%);
  transition: transform .35s ease;
  box-shadow: 8px 0 28px rgba(0,0,0,.18);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}
.wood-drawer.is-open { transform: translateX(0); }
.wood-drawer__head {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px 18px;
  border-bottom: 1px solid var(--border);
}
.wood-drawer__close {
  position: absolute;
  top: 12px; right: 12px;
  width: 36px; height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: var(--muted);
  border-radius: 50%;
  background: transparent;
  border: 0;
}
.wood-drawer__close:hover { color: var(--primary); background: var(--surface); }
.wood-drawer__list { padding: 8px 0; }
.wood-drawer__list li a {
  display: block;
  padding: 12px 22px;
  font-size: 14px;
  font-weight: 500;
  color: var(--primary);
  border-bottom: 1px solid var(--border);
}
.wood-drawer__list li a:hover { background: var(--surface); color: var(--accent); }

/* Drill-down panelleri: aktif panel görünür, digerleri sağda bekler */
.wood-drawer__panels { position: relative; flex: 1; overflow: hidden; }
.wood-drawer__panel {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  background: #fff;
  transform: translateX(100%);
  transition: transform .3s ease;
  visibility: hidden;
}
.wood-drawer__panel.is-active { transform: translateX(0); visibility: visible; }
.wood-drawer__panel.is-left   { transform: translateX(-30%); visibility: hidden; }
.wood-drawer__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 12px 22px;
  font-size: 14px;
  font-weight: 500;
  color: var(--primary);
  border: 0;
  border-bottom: 1px solid var(--border);
  background: transparent;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.wood-drawer__item:hover { background: var(--surface); color: var(--accent); }
.wood-drawer__item--parent i { font-size: 14px; color: var(--muted); }
.wood-drawer__back {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 12px 18px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  background: var(--surface);
  border: 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  font-family: inherit;
}
.wood-drawer__back:hover { color: var(--primary); }
.wood-drawer__all {
  display: block;
  padding: 12px 22px;
  font-size: 14px;
  font-weight: 600;
  color: var(--accent);
  border-bottom: 1px solid var(--border);
}
.wood-drawer__all--static { color: var(--primary); }

.wood-mobile-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
}
.wood-mobile-overlay.is-open { opacity: 1; visibility: visible; }

/* ---------- Nav (Safira) ------------------------------------------------ */
.wood-nav {
  background: #fff;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  position: relative;
  z-index: 50;
}
.wood-nav__spacer { display: none; }
.wood-nav__spacer.is-active { display: block; }
.wood-nav__row {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4px 15px;
  min-height: 56px;
}
.wood-nav__list {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}
.wood-nav__item { position: relative; display: inline-flex; }
.wood-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 18px 22px;
  font-size: 14px;
  font-weight: 600;
  color: var(--menu);
  letter-spacing: .2px;
  line-height: 1;
}
.wood-nav__caret { font-size: 11px; opacity: .55; margin-left: 2px; }
.wood-nav__item:hover .wood-nav__link,
.wood-nav__item.is-active .wood-nav__link { color: var(--menu); }

/* "Hot" badge sticking up-right of nav text */
.wood-nav__badge {
  position: absolute;
  top: 4px;
  right: -2px;
  transform: translateY(0);
  background: #ee3f3f;
  color: #fff;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .4px;
  padding: 2px 5px;
  border-radius: 3px;
  text-transform: uppercase;
  line-height: 1;
}

/* simple dropdown panel (Aksesuar) */
.wood-nav__dropdown {
  position: absolute;
  /* li altı ile nav alt kenarı arasında 5px var (row padding 4px + nav border 1px);
     panel nav'ın hemen altından (slider üstünden) başlasın. */
  top: calc(100% + 5px);
  left: 50%;
  transform: translate(-50%, 8px);
  min-width: 220px;
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 14px 38px rgba(0,0,0,.10);
  padding: 12px 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
  z-index: 60;
  list-style: none;
  margin: 0;
}
/* 5px boşlukta hover kopmasın diye görünmez köprü */
.wood-nav__dropdown::before {
  content: '';
  position: absolute;
  left: 0; right: 0;
  top: -6px;
  height: 6px;
}
.wood-nav__item.has-dropdown:hover .wood-nav__dropdown {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
}
.wood-nav__dropdown li a {
  display: block;
  padding: 9px 22px;
  font-size: 13px;
  color: var(--primary);
  font-weight: 500;
}
.wood-nav__dropdown li a:hover { color: var(--menu); background: var(--surface); }

/* mega menu (anchored to .wood-nav for true centering) */
.wood-nav__item.has-mega { position: static; }
.wood-nav__mega {
  position: absolute;
  top: calc(100% + 1px); /* nav border-bottom'ın altından başla */
  left: 50%;
  width: 1080px;
  max-width: 96vw;
  background: #fff;
  border: 1px solid var(--border);
  box-shadow: 0 14px 38px rgba(0,0,0,.10);
  padding: 26px;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 8px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
  z-index: 60;
}
.wood-nav__item.has-mega:hover .wood-nav__mega {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
}
.wood-nav__mega-inner { display: grid; grid-template-columns: 2fr 1fr; gap: 28px; }
.wood-nav__mega-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.wood-nav__mega-col h4 {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .6px;
  margin: 0 0 12px;
  color: var(--primary);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}
.wood-nav__mega-col ul li a {
  display: block;
  padding: 6px 0;
  font-size: 13px;
  color: var(--muted);
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}
.wood-nav__mega-col ul li a:hover { color: var(--menu); padding-left: 4px; }
.wood-nav__mega-banners { display: grid; gap: 14px; align-content: start; }
.wood-nav__mega-banner {
  position: relative;
  display: block;
  height: 130px;
  border-radius: 4px;
  overflow: hidden;
}
.wood-nav__mega-banner-img {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform .5s ease;
}
.wood-nav__mega-banner:hover .wood-nav__mega-banner-img { transform: scale(1.05); }
.wood-nav__mega-banner-txt {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  padding: 14px 18px;
  color: #fff;
  text-shadow: 0 1px 6px rgba(0,0,0,.4);
}
.wood-nav__mega-banner-txt em { font-style: normal; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; opacity: .9; }
.wood-nav__mega-banner-txt strong { font-size: 17px; font-weight: 700; margin-top: 2px; }
.wood-nav__mega-banner-cta {
  display: inline-block;
  margin-top: 8px;
  padding: 5px 12px;
  background: var(--accent);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  width: max-content;
  border-radius: 3px;
}

@media (max-width: 991px) {
  .wood-nav { display: none; }
}

/* ---------- Hero (Safira) ----------------------------------------------- */
.wood-hero {
  position: relative;
  overflow: hidden;
  background: var(--surface);
}
.wood-hero__viewport {
  position: relative;
  height: calc(100vh - var(--wood-head-h, 200px));
  min-height: 480px;
  max-height: 760px;
  transition: height .35s ease;
}
/* "Ekrana Sığdır" (Slider Ayarları → Slide Görünümü): 760px tavanı kalkar,
   slider header'ın altından ekranın altına kadar uzanır → altta boşluk kalmaz.
   svh: mobil tarayıcıda adres çubuğu kaynaklı zıplamayı önler (destek yoksa vh). */
.wood-hero--fit .wood-hero__viewport {
  height: calc(100vh - var(--wood-head-h, 200px));
  height: calc(100svh - var(--wood-head-h, 200px));
  min-height: 360px;
  max-height: none;
}
.wood-hero__slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  opacity: 0;
  transition: opacity .8s ease;
  pointer-events: none;
}
.wood-hero__slide.is-active { opacity: 1; pointer-events: auto; }

/* Not: Slaytın üstüne sabit bir krem degrade basılmıyor; okunabilirlik için
   blok ayarlarındaki "Overlay" (renk + opaklık) kullanılır. */
.wood-hero__slide > * { position: relative; z-index: 1; }

/* container row → text occupies the LEFT column */
.wood-hero__caption {
  display: flex;
  align-items: center;
  justify-content: var(--wh-justify, flex-start);
  width: 100%;
  height: 100%;
}
/* --wh-* değişkenleri Slider Ayarları → Yazı Ayarları bölümünden gelir;
   tanımlı değilse tema varsayılanları (ikinci parametre) kullanılır. */
.wood-hero__txt {
  max-width: var(--wh-maxw, 540px);
  padding: 40px 0;
  text-align: var(--wh-align, left);
  color: var(--primary);
  font-family: var(--wh-font, inherit);
}

/* ---- Staggered fadeInUp animations (Safira-like) ---------------------- */
.wood-hero__slide .wood-hero__pre,
.wood-hero__slide .wood-hero__title,
.wood-hero__slide .wood-hero__sub,
.wood-hero__slide .wood-hero__cta {
  opacity: 0;
  transform: translate3d(0, 40px, 0);
  will-change: opacity, transform;
}
.wood-hero__slide.is-active .wood-hero__pre   { animation: woodHeroIn .9s .25s cubic-bezier(.2,.7,.2,1) both; }
.wood-hero__slide.is-active .wood-hero__title { animation: woodHeroIn 1.0s .55s cubic-bezier(.2,.7,.2,1) both; }
.wood-hero__slide.is-active .wood-hero__sub   { animation: woodHeroIn 1.0s .85s cubic-bezier(.2,.7,.2,1) both; }
.wood-hero__slide.is-active .wood-hero__cta   { animation: woodHeroIn 1.0s 1.15s cubic-bezier(.2,.7,.2,1) both; }
@keyframes woodHeroIn {
  0%   { opacity: 0; transform: translate3d(0, 40px, 0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .wood-hero__slide .wood-hero__pre,
  .wood-hero__slide .wood-hero__title,
  .wood-hero__slide .wood-hero__sub,
  .wood-hero__slide .wood-hero__cta { opacity: 1; transform: none; animation: none !important; }
}

/* Editör "Slider Ayarları > Renkler" override'ı (wood-only).
   Ayar yoksa fallback ile universal tema renkleri kullanılır. */
.wood-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.wood-hero__pre {
  font-size: var(--wh-pre-size, 14px);
  font-weight: var(--wh-pre-weight, 600);
  text-transform: var(--wh-pre-transform, uppercase);
  letter-spacing: var(--wh-pre-spacing, 4px);
  color: var(--wh-text, var(--accent));
  margin: 0 0 18px;
}
.wood-hero__title {
  font-family: var(--wh-title-font, var(--font-heading));
  font-size: var(--wh-title-size, clamp(34px, 4.4vw, 58px));
  font-weight: var(--wh-title-weight, 700);
  line-height: var(--wh-title-lh, 1.1);
  margin: 0 0 20px;
  color: var(--wh-text, var(--primary));
}
.wood-hero__sub {
  font-size: var(--wh-sub-size, 15px);
  font-weight: var(--wh-sub-weight, 400);
  color: var(--wh-text, var(--muted));
  margin: 0 0 30px;
  margin-left: var(--wh-sub-ml, 0);
  margin-right: var(--wh-sub-mr, 0);
  line-height: 1.7;
  max-width: 460px;
}
.wood-hero__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 32px;
  background: var(--wh-btn-bg, var(--primary));
  color: var(--wh-btn-fg, #fff);
  font-size: var(--wh-cta-size, 12px);
  font-weight: var(--wh-cta-weight, 700);
  letter-spacing: 2px;
  text-transform: var(--wh-cta-transform, uppercase);
  border-radius: 999px;
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
  transition: background-color .25s ease, color .25s ease, transform .25s ease, filter .25s ease;
}
.wood-hero__cta:hover { background: var(--wh-btn-bg, var(--accent)); color: var(--wh-btn-fg, #fff); filter: brightness(.94); transform: translateY(-1px); }
.wood-hero__cta i { font-size: 14px; }

.wood-hero__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  min-width: 52px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: #ffffff;
  color: var(--primary);
  border: 0;
  padding: 0;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease, background-color .25s ease, color .25s ease, transform .25s ease;
  z-index: 4;
}
.wood-hero__nav--prev { left: 24px; transform: translate(-12px, -50%); }
.wood-hero__nav--next { right: 24px; transform: translate(12px, -50%); }
.wood-hero:hover .wood-hero__nav { opacity: 1; visibility: visible; }
.wood-hero:hover .wood-hero__nav--prev { transform: translate(0, -50%); }
.wood-hero:hover .wood-hero__nav--next { transform: translate(0, -50%); }
.wood-hero__nav:hover { background: var(--primary); color: #fff; }
.wood-hero:hover .wood-hero__nav--prev:hover { transform: translate(0, -50%) scale(1.05); }
.wood-hero:hover .wood-hero__nav--next:hover { transform: translate(0, -50%) scale(1.05); }

.wood-hero__dots {
  position: absolute;
  bottom: 24px; left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 4;
}
.wood-hero__dot {
  width: 9px; height: 9px;
  border-radius: 50%;
  background: rgba(0,0,0,.3);
  border: 0;
  cursor: pointer;
  transition: background-color .25s ease, width .25s ease;
}
.wood-hero__dot.is-active { background: var(--primary); width: 28px; border-radius: 5px; }

@media (max-width: 991px) {
  .wood-hero__viewport {
    height: calc(100vh - var(--wood-head-h, 110px));
    min-height: 420px;
    max-height: 620px;
  }
  .wood-hero__slide { background-position: 70% center; }
  .wood-hero__txt { max-width: 70%; }
}
@media (max-width: 640px) {
  .wood-hero__viewport { min-height: 380px; }
  .wood-hero__txt { max-width: 100%; padding: 24px 0; }
  .wood-hero__title { font-size: var(--wh-title-size-m, 30px); }
  .wood-hero__sub { font-size: 13px; }
  .wood-hero__nav { display: none; }
}

/* Mobilde slider görselin gerçek oranına ölçeklenir (--wood-hero-ar adaptörden
   gelir) — görselin tamamı görünür, kırpma olmaz. Oran yoksa eski davranış. */
@media (max-width: 768px) {
  .wood-hero[style*="--wood-hero-ar"] .wood-hero__viewport {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: var(--wood-hero-ar, 16 / 9);
  }
  .wood-hero[style*="--wood-hero-ar"] .wood-hero__slide { background-position: center; }
  /* Küçülen alanda caption sığsın: kompakt tipografi + açıklamada 2 satır sınırı */
  .wood-hero[style*="--wood-hero-ar"] .wood-hero__txt { padding: 10px 0; max-width: 85%; }
  .wood-hero[style*="--wood-hero-ar"] .wood-hero__pre { font-size: 11px; margin-bottom: 4px; }
  .wood-hero[style*="--wood-hero-ar"] .wood-hero__title { font-size: 21px; margin-bottom: 6px; }
  .wood-hero[style*="--wood-hero-ar"] .wood-hero__sub {
    font-size: 12px;
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .wood-hero[style*="--wood-hero-ar"] .wood-hero__cta { padding: 9px 18px; font-size: 12px; }
}

/* ---------- Banners-3 ---------------------------------------------------- */
.wood-banners-3 { padding: 60px 0 30px; }
.wood-banners-3__row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
@media (max-width: 991px) { .wood-banners-3__row { grid-template-columns: 1fr; gap: 20px; } }
.wood-banner-3, .wood-banner-2 {
  position: relative;
  display: flex;
  align-items: stretch;
  overflow: hidden;
  height: 240px;
  background: var(--surface, #f4f1ec);
  border-radius: 4px;
  color: var(--primary);
}
.wood-banner-3__img,
.wood-banner-2__img {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 60%;
  display: block;
  pointer-events: none;
}
.wood-banner-3__img img,
.wood-banner-2__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center center;
  transition: transform .6s ease;
}
.wood-banner-3:hover .wood-banner-3__img img,
.wood-banner-2:hover .wood-banner-2__img img { transform: scale(1.04); }
.wood-banner-3__content,
.wood-banner-2__content {
  position: relative;
  z-index: 2;
  padding: 32px 28px;
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.wood-banner-3__sub,
.wood-banner-2__sub {
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 14px;
  letter-spacing: 0;
  color: var(--muted);
  font-weight: 400;
  margin-bottom: 6px;
  text-transform: none;
}
.wood-banner-3__main,
.wood-banner-2__main {
  font-family: "Open Sans", sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.15;
  color: var(--primary);
  margin-bottom: 18px;
}
.wood-banner-3__cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--primary);
  width: max-content;
  border: 0;
  padding: 0;
  transition: color .25s ease;
}
.wood-banner-3__cta i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  font-size: 11px;
  border-radius: 50%;
  background: #ee3f3f;
  color: #fff;
  transition: background .25s ease, transform .25s ease;
}
.wood-banner-3:hover .wood-banner-3__cta { color: var(--accent); }
.wood-banner-3:hover .wood-banner-3__cta i { background: var(--accent); transform: translateX(3px); }

/* ---------- Banners-2 ---------------------------------------------------- */
.wood-banners-2 { padding: 30px 0; }
.wood-banners-2__row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
}
@media (max-width: 640px) { .wood-banners-2__row { grid-template-columns: 1fr; } }
.wood-banner-2 { height: 280px; }
.wood-banner-2__img { width: 55%; }
.wood-banner-2__content { width: 50%; }

/* ==========================================================================
   PROMO BANNERS — MOBILE STACK
   IMPORTANT: this block must come AFTER all the default `.wood-banner-3*`
   and `.wood-banner-2*` rules. A previous attempt placed it earlier in the
   file, which let later default rules (notably the absolute-positioned
   .__img with `width: 60%`) override the mobile overrides — the banners
   then rendered with the desktop overlap layout on phones, cropping
   products and squeezing text onto 4-line wraps.

   Placed here at the end so the cascade naturally lets the stacked layout
   win for ≤640px viewports. Both promo-banners-top (.wood-banner-3) and
   promo-banners-bottom (.wood-banner-2) get the same treatment.
   ========================================================================== */
@media (max-width: 640px) {
  .wood-banner-3, .wood-banner-2 {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 280px;
  }
  /* Centered text + CTA on mobile so the stacked layout reads as
     deliberately balanced rather than left-floating in the cream card. */
  .wood-banner-3__content,
  .wood-banner-2__content {
    position: relative;
    width: 100%;
    padding: 22px 18px 18px;
    z-index: 1;
    align-items: center;
    text-align: center;
  }
  .wood-banner-3__cta,
  .wood-banner-2__cta { margin: 0 auto; }
  .wood-banner-3__img,
  .wood-banner-2__img {
    position: relative;
    width: 100%;
    height: 200px;
    flex: 0 0 200px;
    inset: auto;
  }
  .wood-banner-3__img img,
  .wood-banner-2__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
  }
  .wood-banner-3__sub,
  .wood-banner-2__sub { font-size: 13px; }
  .wood-banner-3__main,
  .wood-banner-2__main { font-size: 20px; line-height: 1.2; margin-bottom: 14px; }

  /* ------------------------------------------------------------------ *
   * FOOTER — center every column on small screens.                      *
   * ------------------------------------------------------------------ */
  .wood-footer__col { text-align: center; }
  .wood-footer__col--brand { max-width: 100%; }
  .wood-footer__logo { display: inline-block; }
  .wood-footer__about { margin-left: auto; margin-right: auto; max-width: 460px; }
  /* Title underline centering is handled in the final mobile-centering
     block at the end of this file (must come after the canonical
     `.wood-footer__title::after` declaration to win the cascade). */
  /* Inline-flex contact box auto-centers itself in the column. */
  .wood-footer__contact { margin-left: auto; margin-right: auto; }
  .wood-footer__social { justify-content: center; }
  .wood-footer__news-form,
  .wood-footer__apps { justify-content: center; }
  .wood-footer__bottom-row { justify-content: center; text-align: center; }
  .wood-footer__pay { justify-content: center; }

  /* ------------------------------------------------------------------ *
   * BRANDS — anchor centering only here. The grid-template-columns:1fr *
   * lives in its own @media block AFTER the canonical brands rules so  *
   * the cascade order isn't fighting with us. Logos read big, calm,    *
   * one-per-row, each anchored center.                                  *
   * ------------------------------------------------------------------ */
  .wood-brands__item a { justify-content: center; }
}

/* ---------- Banner-mid --------------------------------------------------- */
.wood-banner-mid { padding: 30px 0; }
.wood-banner-mid__link {
  position: relative;
  display: flex;
  align-items: center;
  height: 220px;
  overflow: hidden;
  border-radius: 4px;
  color: #fff;
}
.wood-banner-mid__img { position: absolute; inset: 0; }
.wood-banner-mid__img img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s ease;
}
.wood-banner-mid__link:hover .wood-banner-mid__img img { transform: scale(1.04); }
.wood-banner-mid__content {
  position: relative;
  padding: 24px 60px;
  text-shadow: 0 1px 8px rgba(0,0,0,.4);
  z-index: 2;
}
.wood-banner-mid__sub {
  display: block;
  font-size: 13px;
  letter-spacing: 4px;
  text-transform: uppercase;
  margin-bottom: 8px;
  font-weight: 600;
  opacity: .9;
}
.wood-banner-mid__main {
  display: block;
  font-family: var(--font-heading);
  font-size: clamp(28px, 3.2vw, 44px);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 6px;
}
.wood-banner-mid__sale { color: var(--accent); }
.wood-banner-mid__phrase { display: block; font-size: 13px; opacity: .85; }

/* ---------- Promo banner editör renk override'ları (.wood-pb-scope) -------
   Adaptör, editörde seçilen özel renkleri scope div'ine inline CSS değişkeni
   olarak basar. Boş bırakılanlarda fallback (tema varsayılanı) geçerli kalır. */
.wood-pb-scope { background: var(--wpb-section-bg, transparent); }
.wood-pb-scope .wood-banner-3,
.wood-pb-scope .wood-banner-2 { background: var(--wpb-card-bg, var(--surface, #f4f1ec)); }
.wood-pb-scope .wood-banner-3__main,
.wood-pb-scope .wood-banner-2__main { color: var(--wpb-title, var(--primary)); }
.wood-pb-scope .wood-banner-3__sub,
.wood-pb-scope .wood-banner-2__sub { color: var(--wpb-sub, var(--muted)); }
.wood-pb-scope .wood-banner-3__cta { color: var(--wpb-cta, var(--primary)); }
.wood-pb-scope .wood-banner-3__cta i { background: var(--wpb-cta, #ee3f3f); }
.wood-pb-scope .wood-banner-3:hover .wood-banner-3__cta { color: var(--wpb-cta, var(--accent)); }
.wood-pb-scope .wood-banner-3:hover .wood-banner-3__cta i { background: var(--wpb-cta, var(--accent)); }
.wood-pb-scope .wood-banner-mid__main { color: var(--wpb-title, #fff); }
.wood-pb-scope .wood-banner-mid__sub { color: var(--wpb-sub, #fff); }
.wood-pb-scope .wood-banner-mid__sale { color: var(--wpb-cta, var(--accent)); }

/* ---------- Popüler Kategoriler editör renk override'ları (.wood-bc-scope) -- */
.wood-bc-scope { background: var(--wbc-section-bg, transparent); }
.wood-bc-scope .wood-section-head__title { color: var(--wbc-title, var(--text-primary)); }
.wood-bc-scope .wood-section-head__note { color: var(--wbc-note, var(--muted)); }
.wood-bc-scope .wood-cat-card,
.wood-bc-scope .wood-cat-card__media { background: var(--wbc-card-bg, var(--surface, #f4f1ec)); }
.wood-bc-scope .wood-cat-card__title { color: var(--wbc-card-title, var(--text-primary)); }
.wood-bc-scope .wood-cat-card__cta { color: var(--wbc-cta, var(--accent)); }

/* ---------- Yeni Gelenler / Öne Çıkan editör renk override'ları (.wood-na-scope) -- */
.wood-na-scope { background: var(--wna-section-bg, transparent); }
.wood-na-scope .wood-product__media { background: var(--wna-card-bg, var(--wood-card-bg, var(--surface, #f4f1ec))); }
.wood-na-scope .wood-section-head__title { color: var(--wna-title, var(--text-primary)); }
.wood-na-scope .wood-section-head__note { color: var(--wna-note, var(--muted)); }
.wood-na-scope .wood-product__name,
.wood-na-scope .wood-product__name a { color: var(--wna-name, var(--text-primary)); }
.wood-na-scope .wood-product__price--new { color: var(--wna-price, var(--accent)); }
/* Featured varyantı kendi rengini geç tanımladığından (source order),
   daha yüksek specificity ile scope değişkenlerini geri al. */
.wood-na-scope .wood-products--featured .wood-product__media { background: var(--wna-card-bg, var(--wood-card-bg, var(--surface, #f4f1ec))); }
.wood-na-scope .wood-products--featured .wood-product__name,
.wood-na-scope .wood-products--featured .wood-product__name a { color: var(--wna-name, var(--text-primary)); }
.wood-na-scope .wood-products--featured .wood-product__price--new { color: var(--wna-price, var(--accent)); }

/* ---------- Günün Fırsatları editör renk override'ları (.wood-deal-scope) ---- */
.wood-deal-scope .wood-deals { background: var(--wdl-section-bg, var(--surface)); }
.wood-deal-scope .wood-deal { background: var(--wdl-card-bg, #fff); }
.wood-deal-scope .wood-deal__media { background: var(--wdl-card-bg, var(--surface)); }
.wood-deal-scope .wood-section-head__title { color: var(--wdl-title, var(--text-primary)); }
.wood-deal-scope .wood-section-head__note { color: var(--wdl-note, var(--muted)); }
.wood-deal-scope .wood-deal__body .wood-product__name,
.wood-deal-scope .wood-deal__body .wood-product__name a { color: var(--wdl-name, var(--text-primary)); }
.wood-deal-scope .wood-product__price--new { color: var(--wdl-price, var(--accent)); }
.wood-deal-scope .wood-deal__label { background: var(--wdl-label, var(--danger)); }
.wood-deal-scope .wood-deal__count-msg { color: var(--wdl-countdown, var(--danger)); }
.wood-deal-scope .wood-deal__count-boxes span { color: var(--wdl-countdown, var(--primary)); }

/* ---------- Blog editör renk override'ları (.wood-blog-scope) ------------- */
.wood-blog-scope .wood-blog { background: var(--wbl-section-bg, transparent); }
.wood-blog-scope .wood-section-head__title { color: var(--wbl-title, var(--text-primary)); }
.wood-blog-scope .wood-section-head__note { color: var(--wbl-note, var(--muted)); }
.wood-blog-scope .wood-post__title a { color: var(--wbl-post-title, var(--text-primary)); }
.wood-blog-scope .wood-post__cat { color: var(--wbl-cat, var(--accent)); }
.wood-blog-scope .wood-post__more { color: var(--wbl-more, var(--accent)); }

/* ---------- Bülten editör renk override'ları (.wood-news-scope) ----------- */
.wood-news-scope .wood-newsletter { background: var(--wnl-section-bg, #fff); }
.wood-news-scope .wood-newsletter__inner { background: var(--wnl-card-bg, #fff); }
.wood-news-scope .wood-newsletter__pre { color: var(--wnl-pre, var(--accent)); }
.wood-news-scope .wood-newsletter__title { color: var(--wnl-title, var(--text-primary)); }
.wood-news-scope .wood-newsletter__desc { color: var(--wnl-desc, var(--muted)); }
.wood-news-scope .wood-newsletter__btn { background: var(--wnl-btn-bg, var(--primary)); color: var(--wnl-btn-text, #fff); }
.wood-news-scope .wood-newsletter__note { color: var(--wnl-note, var(--muted)); }

/* ---------- Cat slider (Safira style) ----------------------------------- */
.wood-cat-slider { padding: 60px 0; }
.wood-cat-slider__grid {
  display: grid;
  grid-template-columns: repeat(var(--cat-cols, 6), 1fr);
  gap: 16px;
}
@media (max-width: 1199px) { .wood-cat-slider__grid { grid-template-columns: repeat(var(--cat-cols-t, 4), 1fr); } }
@media (max-width: 768px)  { .wood-cat-slider__grid { grid-template-columns: repeat(var(--cat-cols-m, 3), 1fr); gap: 14px; } }
@media (max-width: 480px)  { .wood-cat-slider__grid { grid-template-columns: repeat(var(--cat-cols-s, 2), 1fr); gap: 12px; } }

.wood-cat-card {
  position: relative;
  display: block;
  background: var(--surface, #f4f1ec);
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 190/220;
  transition: border-color .25s ease, box-shadow .25s ease;
  text-decoration: none;
  color: inherit;
}
.wood-cat-card:hover {
  border-color: #c8c8c8;
  box-shadow: 0 12px 24px rgba(0,0,0,.06);
}
.wood-cat-card__media {
  position: absolute;
  inset: 0;
  display: block;
  background: var(--surface, #f4f1ec);
  z-index: 1;
  overflow: hidden;
}
.wood-cat-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
  display: block;
}
/* Image hover scale removed — keep the visual flat & calm. The white
   overlay slide-up remains as the only hover affordance. */
.wood-cat-card:hover .wood-cat-card__media img { transform: none; }

.wood-cat-card__overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 14px 10px 12px;
  text-align: center;
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(2px);
  border-top: 1px solid var(--border);
  transform: translateY(100%);
  opacity: 0;
  transition: transform .35s ease, opacity .35s ease;
}
.wood-cat-card:hover .wood-cat-card__overlay,
.wood-cat-card:focus-visible .wood-cat-card__overlay {
  transform: translateY(0);
  opacity: 1;
}
.wood-cat-card__title {
  font-size: 14px;
  font-weight: 700;
  color: var(--primary);
  letter-spacing: .2px;
}
.wood-cat-card__count {
  font-size: 11px;
  color: var(--muted);
  letter-spacing: .3px;
}
.wood-cat-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--accent);
}
.wood-cat-card__cta i { transition: transform .2s ease; }
.wood-cat-card:hover .wood-cat-card__cta i { transform: translateX(3px); }

@media (hover: none) {
  /* Touch devices: keep overlay always visible so users see the title */
  .wood-cat-card__overlay { transform: translateY(0); opacity: 1; }
}

/* ---------- Tabs --------------------------------------------------------- */
.wood-tabs__list {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 0 0 28px;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
}
/* When there is only one tab, the row adds no value — hide it so the section
   looks like a clean grid (matches Safira-style "New Arrivals"). */
.wood-tabs__list:has(> li:only-child) { display: none; }
.wood-tab {
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--muted);
  cursor: pointer;
  border-radius: 30px;
  transition: background-color .2s ease, color .2s ease;
}
.wood-tab.is-active, .wood-tab:hover { background: var(--primary); color: #fff; }
.wood-tabs-pane { display: none; }
.wood-tabs-pane.is-active { display: block; }

/* ---------- Products grids ---------------------------------------------- */
.wood-products { padding: 50px 0; }
.wood-products__grid { display: grid; gap: 26px; }
.wood-products__grid--5 { grid-template-columns: repeat(5, 1fr); }
.wood-products__grid--4 { grid-template-columns: repeat(4, 1fr); }
.wood-products__grid--3 { grid-template-columns: repeat(3, 1fr); }
.wood-products__grid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 1199px) {
  .wood-products__grid--5 { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 991px) {
  .wood-products__grid--5,
  .wood-products__grid--4 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .wood-products__grid--5,
  .wood-products__grid--4,
  .wood-products__grid--3 { grid-template-columns: repeat(2, 1fr); }
  .wood-products__grid { gap: 16px; }
}

/* product card */
.wood-product { position: relative; text-align: center; }
.wood-product__media {
  position: relative;
  background: var(--wood-card-bg, var(--surface));
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 1/1;
  margin-bottom: 14px;
}
.wood-product__link { display: block; height: 100%; }
.wood-product__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: opacity .35s ease, transform .6s ease;
}
.wood-product__img--hover { opacity: 0; }
.wood-product__media.has-hover:hover .wood-product__img--main { opacity: 0; }
.wood-product__media:hover .wood-product__img--hover { opacity: 1; transform: scale(1.04); }
/* Hover görseli olmayan kartta ana görsel hafif büyüsün (görsel geri bildirim) */
.wood-product__media:not(.has-hover):hover .wood-product__img--main { transform: scale(1.04); }

.wood-product__labels {
  position: absolute;
  top: 10px; left: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  z-index: 3;
}
.wood-product__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 3px;
  color: #fff;
}
.wood-product__label--new  { background: var(--success); }
.wood-product__label--sale { background: var(--danger); }

/* Compact Safira-style hover pill — 4 equal icon buttons centered at the
   bottom of the product image. NOTE: scoped to `.wood-product` so the
   `.wood-deal__hover` block (hot-deals) keeps its own larger button. */
.wood-product .wood-product__hover {
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translate(-50%, 8px);
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 5px;
  background: rgba(255,255,255,.96);
  border-radius: 999px;
  box-shadow: 0 6px 22px rgba(0,0,0,.12);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
  z-index: 4;
  white-space: nowrap;
}
.wood-product:hover .wood-product__hover {
  opacity: 1;
  transform: translate(-50%, 0);
  pointer-events: auto;
}

/* Baseline icon button (used by both small product cards and deal cards). */
.wood-product__act {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: transparent;
  color: var(--primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  border: 0;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}
.wood-product__act:hover { background: var(--primary); color: #fff; }

/* Deal cards keep the big pill cart button — give it its baseline here so
   nothing else regresses. */
.wood-product__cart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--primary);
  color: #fff;
  padding: 11px 14px;
  border-radius: 30px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  border: 0;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}
.wood-product__cart:hover { background: var(--accent); color: #fff; }

.wood-product__body { padding: 0 4px; }
.wood-product__cat {
  display: inline-block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: var(--muted);
  margin-bottom: 4px;
}
.wood-product__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--primary);
  margin: 0 0 6px;
  line-height: 1.4;
  /* Kartlarda ürün adı en fazla 2 satır; min-height ile fiyat satırları hizalı kalır */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 2.8em;
}
.wood-shop-grid.is-list .wood-product__name { display: block; -webkit-line-clamp: unset; min-height: 0; overflow: visible; }
.wood-product__name a { color: inherit; }
.wood-product:hover .wood-product__name a { color: var(--accent); }

.wood-product__rating {
  display: flex;
  align-items: center;
  gap: 6px;
  justify-content: center;
  margin-bottom: 6px;
  font-size: 12px;
  color: var(--muted);
}
.wood-product__stars {
  --w: 0%;
  position: relative;
  display: inline-flex;
  font-size: 12px;
  color: var(--border-strong);
  letter-spacing: 1px;
  line-height: 1;
}
.wood-product__stars::before {
  content: "★★★★★";
  position: absolute;
  inset: 0;
  color: var(--star);
  width: var(--w);
  overflow: hidden;
  white-space: nowrap;
}
.wood-product__stars i { font-size: 13px; }
.wood-product__reviews { font-size: 11px; color: var(--muted-2); }

.wood-product__price {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  justify-content: center;
}
.wood-product__price--new {
  font-size: 15px;
  font-weight: 700;
  color: var(--accent);
}
.wood-product__price--old {
  font-size: 13px;
  color: var(--muted-2);
  text-decoration: line-through;
}

/* ---------- Hot deals ---------------------------------------------------- */
.wood-deals { padding: 50px 0; background: var(--surface); }
.wood-deals__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
}
@media (max-width: 768px) { .wood-deals__grid { grid-template-columns: 1fr; } }
.wood-deal {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 22px;
  background: #fff;
  border-radius: 6px;
  padding: 18px;
  box-shadow: 0 6px 22px rgba(0,0,0,.05);
}
@media (max-width: 480px) { .wood-deal { grid-template-columns: 1fr; } }

.wood-deal__media {
  position: relative;
  background: var(--surface);
  border-radius: 4px;
  overflow: hidden;
  aspect-ratio: 1/1;
}
.wood-deal__label {
  position: absolute;
  top: 10px; left: 10px;
  background: var(--danger);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 3px;
  z-index: 3;
}
.wood-deal__link { display: block; height: 100%; }
.wood-deal__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: opacity .4s ease;
}
.wood-deal__img--hover { opacity: 0; }
.wood-deal__media.has-hover:hover .wood-deal__img--main { opacity: 0; }
.wood-deal__media:hover .wood-deal__img--hover { opacity: 1; }
.wood-deal__hover {
  position: absolute;
  left: 8px; right: 8px; bottom: 8px;
  display: flex;
  gap: 6px;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .25s ease, transform .25s ease;
  z-index: 4;
}
.wood-deal__media:hover .wood-deal__hover { opacity: 1; transform: translateY(0); }
.wood-deal__hover .wood-product__cart { padding: 9px 12px; font-size: 11px; }
.wood-deal__hover .wood-product__act { width: 34px; height: 34px; font-size: 14px; }

.wood-deal__body { display: flex; flex-direction: column; gap: 8px; text-align: left; }
.wood-deal__body .wood-product__rating { justify-content: flex-start; }
.wood-deal__body .wood-product__price { justify-content: flex-start; }
.wood-deal__body .wood-product__name { font-size: 16px; font-family: var(--font-heading); }

.wood-deal__progress { margin-top: 8px; }
.wood-deal__progress-labels {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 6px;
}
.wood-deal__progress-labels strong { color: var(--primary); }
.wood-deal__bar {
  height: 8px;
  background: var(--surface-2);
  border-radius: 4px;
  overflow: hidden;
}
.wood-deal__bar span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--accent-dark));
  border-radius: 4px;
}

.wood-deal__count { margin-top: 10px; }
.wood-deal__count-msg {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--danger);
  margin-bottom: 6px;
}
.wood-deal__count-boxes {
  display: flex;
  gap: 6px;
}
.wood-deal__count-boxes > div {
  background: var(--surface);
  border-radius: 4px;
  padding: 8px 10px;
  text-align: center;
  min-width: 56px;
}
.wood-deal__count-boxes span {
  display: block;
  font-size: 18px;
  font-weight: 700;
  color: var(--primary);
  line-height: 1;
}
.wood-deal__count-boxes em {
  display: block;
  font-style: normal;
  font-size: 10px;
  color: var(--muted);
  margin-top: 2px;
  text-transform: uppercase;
}

/* ---------- Brands ------------------------------------------------------- */
.wood-brands { padding: 40px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.wood-brands__list {
  display: grid;
  grid-template-columns: repeat(var(--brand-cols, 8), 1fr);
  gap: 20px;
  align-items: center;
}
@media (max-width: 991px) { .wood-brands__list { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 768px) { .wood-brands__list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .wood-brands__list { grid-template-columns: 1fr; gap: 14px; } }
.wood-brands__item a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  opacity: .5;
  transition: opacity .25s ease;
}
.wood-brands__item a:hover { opacity: 1; }
.wood-brands__item img { max-height: 38px; width: auto; }
.wood-brands__text {
  font-size: 22px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--wbr-text, #999);
  transition: color .25s ease;
}
.wood-brands__item a:hover .wood-brands__text { color: var(--wbr-text-hover, var(--primary)); }

/* ---------- Markalar editör renk override'ları (.wood-brands-scope) ------- */
.wood-brands-scope .wood-brands { background: var(--wbr-section-bg, transparent); }
.wood-brands-scope .wood-brands {
  border-top-color: var(--wbr-border, var(--border));
  border-bottom-color: var(--wbr-border, var(--border));
}

/* ---------- Footer ------------------------------------------------------- */
.wood-footer { background: #fff; border-top: 1px solid var(--border); padding-top: 60px; margin-top: 60px; }
.wood-footer__row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 2fr;
  gap: 40px;
  padding-bottom: 50px;
}
@media (max-width: 991px) { .wood-footer__row { grid-template-columns: 1fr 1fr; gap: 30px; } }
@media (max-width: 480px) { .wood-footer__row { grid-template-columns: 1fr; gap: 24px; } }

.wood-footer__col--brand { max-width: 360px; }
.wood-footer__logo { display: inline-block; margin-bottom: 16px; }
.wood-footer__logo img { height: 34px; width: auto; }
.wood-footer__about {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.7;
  margin: 0 0 18px;
}
.wood-footer__contact {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--surface);
  border-radius: 4px;
  margin-bottom: 18px;
}
.wood-footer__contact-icon i { font-size: 28px; color: var(--accent); }
.wood-footer__contact em {
  display: block;
  font-style: normal;
  font-size: 11px;
  color: var(--muted-2);
  text-transform: uppercase;
  letter-spacing: .4px;
}
.wood-footer__contact strong { font-size: 16px; color: var(--primary); }

/* Social icons — kept dead simple. The previous attempt over-styled the
   inner <i> (forcing width/height + nested flex) which left the icon
   glyph stuck in the upper-left of its em box. The cleanest centering
   is: parent <a> = inline-flex centered, leave <i> default inline. */
.wood-footer__social {
  display: flex;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.wood-footer__social li { list-style: none; margin: 0; padding: 0; }
.wood-footer__social a {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--surface);
  color: var(--primary);
  font-size: 18px;
  line-height: 1;
  text-decoration: none;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.wood-footer__social a i { line-height: 1; }
.wood-footer__social a:hover {
  background: var(--accent);
  color: #fff;
  transform: translateY(-2px);
}

.wood-footer__title {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 18px;
  color: var(--primary);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.wood-footer__links li a {
  display: block;
  padding: 6px 0;
  font-size: 13px;
  color: var(--muted);
  transition: color .2s ease, padding-left .2s ease;
}
.wood-footer__links li a:hover { color: var(--accent); padding-left: 4px; }

.wood-footer__news-text {
  font-size: 13px;
  color: var(--muted);
  margin: 0 0 14px;
  line-height: 1.6;
}
.wood-footer__news-form {
  position: relative;
  display: flex;
  border: 1px solid var(--border-strong);
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  margin-bottom: 16px;
}
.wood-footer__news-form input {
  flex: 1;
  border: 0;
  padding: 12px 16px;
  font-size: 13px;
  outline: none;
}
.wood-footer__news-form button {
  width: 50px;
  background: var(--primary);
  color: #fff;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.wood-footer__news-form button:hover { background: var(--accent); }

.wood-footer__apps {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.wood-footer__apps a { display: inline-block; line-height: 0; }
.wood-footer__apps img {
  height: 40px;
  width: auto;
  max-width: none;
  aspect-ratio: 140 / 44;
  display: block;
}

.wood-footer__bottom {
  border-top: 1px solid var(--border);
  padding: 18px 0;
}
.wood-footer__bottom-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.wood-footer__copy {
  font-size: 12px;
  color: var(--muted);
}
.wood-footer__copy a { color: var(--primary); font-weight: 600; }
.wood-footer__pay img {
  height: 22px;
  width: auto;
  max-width: none;
  aspect-ratio: 280 / 28;
  display: block;
}

/* ==========================================================================
   GLOBAL — prevent stray horizontal scroll on mobile/tablet.
   Some absolutely positioned components (recent-order popup, sticky header
   shadows, marquee campaign bar) can briefly overflow at narrow viewports.
   The page itself never needs horizontal scroll, so clip at the body level.
   ========================================================================== */
html, body { overflow-x: clip; }

/* ==========================================================================
   FOOTER ALIGNMENT TWEAKS
   - Columns top-aligned so all titles sit on the same baseline.
   - Subtle accent underline on each column title for Safira-like crispness.
   - Reset default <ul> padding/list-style so social icons sit flush left
     and don't appear to be "shifted" right of the brand text.
   - Help-line ("Yardım Hattı") box hugs its content instead of stretching
     across the whole brand column.
   ========================================================================== */
.wood-footer__row { align-items: start; }
.wood-footer__title {
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 22px;
}
.wood-footer__title::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 28px; height: 2px;
  background: var(--accent);
  border-radius: 2px;
}
.wood-footer__col--brand .wood-footer__logo img { display: block; max-height: 34px; width: auto; }

/* Browsers add list-style + padding-inline-start to <ul> by default; reset
   them so social-icon and link rows align with the rest of the column. */
.wood-footer__social,
.wood-footer__links {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Help-line / Yardım Hattı box must shrink to fit content (icon + 2 lines
   of text), NOT span the full 360px brand column. */
.wood-footer__contact {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
}

/* ==========================================================================
   HEADER — MOBILE / TABLET POLISH
   - Compare button covers the logo on phones; collapse the actions at <=991px.
   - Constrain logo size so it can never overlap right-side actions.
   ========================================================================== */
@media (max-width: 991px) {
  /* Logo cannot grow beyond a safe size — prevents overlap with actions.
     Admin tema ayarındaki yüksekliği (inline height) mobilde de onurlandır,
     yalnızca güvenli bir tavanla sınırla (önceki 28px değeri çok küçüktü). */
  .wood-header__col--logo .wood-logo__img { max-height: 54px; width: auto; }
  /* "Compare" is rare on mobile; remove to free space. The drawer still
     exposes it for users who need it. */
  .wood-header__actions a[title="Karşılaştır"] { display: none; }
  /* Tighter spacing for the remaining heart + cart icons. */
  .wood-header__act { width: 36px; height: 36px; font-size: 18px; }
  .wood-header__cart { width: 36px; height: 36px; font-size: 18px; }
}
@media (max-width: 480px) {
  /* On very narrow phones also hide the heart icon — cart is the only
     action that absolutely must remain reachable from the top bar. */
  .wood-header__actions a[title="Favoriler"] { display: none; }
  .wood-header__col--logo .wood-logo__img { max-height: 46px; }
  .wood-header__row { padding: 12px 10px; gap: 8px; }
}

/* ==========================================================================
   LIGHTBOX (product image preview) — opens from the eye button on hover.
   Centered modal with soft backdrop, scale-in animation, click-outside or
   ESC to close. JS injects src/title into the inner img/figcaption.
   ========================================================================== */
.wood-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
}
.wood-lightbox.is-open {
  opacity: 1;
  pointer-events: auto;
}
.wood-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(14, 14, 14, .94);
}
.wood-lightbox__figure {
  position: relative;
  margin: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 72px 80px 24px;
  box-sizing: border-box;
  transform: scale(.97);
  transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.wood-lightbox.is-open .wood-lightbox__figure { transform: scale(1); }
.wood-lightbox__img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
}
/* Başlık ekranda gösterilmez; ekran okuyucular için tutulur */
.wood-lightbox__caption {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.wood-lightbox__close {
  position: absolute;
  top: 14px; right: 18px;
  z-index: 3;
  width: 40px; height: 40px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #fff;
  font-size: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: .85;
  transition: opacity .2s ease, background-color .2s ease;
}
.wood-lightbox__close:hover { opacity: 1; background: rgba(255,255,255,.08); }
.wood-lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 48px; height: 64px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: .75;
  transition: opacity .2s ease;
}
.wood-lightbox__nav:hover { opacity: 1; }
.wood-lightbox__nav--prev { left: 6px; }
.wood-lightbox__nav--next { right: 6px; }
.wood-lightbox__nav[hidden], .wood-lightbox__thumbs[hidden] { display: none; }
.wood-lightbox__thumbs {
  position: absolute;
  top: 18px; left: 18px;
  z-index: 3;
  display: flex;
  gap: 4px;
  max-width: calc(100vw - 100px);
  overflow-x: auto;
  scrollbar-width: none;
}
.wood-lightbox__thumbs::-webkit-scrollbar { display: none; }
.wood-lightbox__thumb {
  flex: 0 0 auto;
  width: 40px; height: 52px;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 2px;
  background: #1a1a1a;
  cursor: pointer;
  opacity: .55;
  transition: opacity .2s ease, border-color .2s ease;
  overflow: hidden;
}
.wood-lightbox__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wood-lightbox__thumb:hover { opacity: .85; }
.wood-lightbox__thumb.is-active { opacity: 1; border-color: #fff; }
@media (max-width: 640px) {
  .wood-lightbox__figure { padding: 64px 12px 84px; }
  .wood-lightbox__nav { width: 40px; height: 56px; font-size: 24px; }
  .wood-lightbox__nav--prev { left: 0; }
  .wood-lightbox__nav--next { right: 0; }
  .wood-lightbox__thumbs { top: auto; bottom: 16px; left: 12px; right: 12px; max-width: none; justify-content: center; }
  .wood-lightbox__thumb { width: 44px; height: 44px; }
}
body.wood-no-scroll { overflow: hidden; }

/* ==========================================================================
   NEWSLETTER (above footer, below blog) — Safira-style two-col panel
   LEFT: pre-title + heading + description + email input + accent CTA
   RIGHT: square product image. Falls back to a single column on mobile.
   ========================================================================== */
.wood-newsletter { padding: 30px 0 60px; background: #fff; }
.wood-newsletter__inner {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 48px;
  align-items: center;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 44px 50px;
  box-shadow: 0 8px 28px rgba(0,0,0,.04);
}
@media (max-width: 768px) {
  .wood-newsletter__inner {
    grid-template-columns: 1fr;
    padding: 30px 24px;
    gap: 28px;
  }
}

.wood-newsletter__content { max-width: 540px; }
.wood-newsletter__pre {
  display: inline-block;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 14px;
  color: var(--accent);
  font-weight: 400;
  margin-bottom: 10px;
}
.wood-newsletter__title {
  font-family: var(--font-heading);
  font-size: clamp(24px, 2.6vw, 34px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -.3px;
  margin: 0 0 14px;
  color: var(--primary);
}
.wood-newsletter__desc {
  font-size: 14px;
  line-height: 1.65;
  color: var(--muted);
  margin: 0 0 22px;
}

/* Visually hidden but accessible label. */
.wood-newsletter__label {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

.wood-newsletter__form {
  display: flex;
  gap: 10px;
  max-width: 480px;
  margin: 0;
  align-items: stretch;
}
.wood-newsletter__input {
  flex: 1 1 auto;
  min-width: 0;
  height: 50px;
  padding: 0 16px;
  /* Border in the same dark tone as the CTA so input + button form a
     visually matched pair; clearly visible on any background. */
  border: 1.5px solid var(--primary);
  background: #fff;
  font-family: inherit;
  font-size: 14px;
  color: var(--primary);
  outline: 0;
  border-radius: 3px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.wood-newsletter__input::placeholder { color: var(--muted); font-style: italic; }
.wood-newsletter__input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(181,150,119,.18);
}

.wood-newsletter__btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 50px;
  padding: 0 26px;
  background: var(--primary);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: 0;
  border-radius: 3px;
  cursor: pointer;
  transition: background-color .2s ease, transform .2s ease;
}
.wood-newsletter__btn:hover { background: var(--accent); color: #fff; }
.wood-newsletter__btn:active { transform: translateY(1px); }
.wood-newsletter__btn i { font-size: 14px; }

.wood-newsletter__note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 14px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.wood-newsletter__note i { font-size: 14px; color: var(--accent); }

.wood-newsletter__media {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 4px;
  overflow: hidden;
  background: var(--surface);
}
.wood-newsletter__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 768px) {
  .wood-newsletter__media { aspect-ratio: 16 / 10; }
}
/* On narrow phones, stack input above the CTA so the button can't
   overflow the rounded card edge. */
@media (max-width: 480px) {
  .wood-newsletter__form { flex-direction: column; gap: 10px; }
  .wood-newsletter__btn  { width: 100%; justify-content: center; padding: 0 18px; }
}

/* ==========================================================================
   AUTH PAGES (Giriş / Kayıt) — wood-auth namespace
   --------------------------------------------------------------------------
   Layout:
   1) Top section (.wood-auth__top): Welcome heading + 4 member-benefit cards
      on the LEFT, narrow lifestyle photo on the RIGHT. Replaces the typical
      gray "Customer Login" breadcrumb banner with content that motivates
      registration and reinforces the brand.
   2) Forms section (.wood-auth__forms): two equal cards. LEFT = login form
      (email + password + forgot link + sign-in CTA). RIGHT = register CTA
      with a short bullet list of benefits and an outline button.
   --------------------------------------------------------------------------
   Stacks to a single column on tablet (forms first then thumb hidden if
   needed), and a single column for benefits on phones.
   ========================================================================== */
.wood-auth { background: #fff; }

/* ==========================================================================
   PAGE HERO — reusable framed-card top section
   --------------------------------------------------------------------------
   One rounded cream card spans the container; LEFT half holds the page
   title block (italic Playfair pre-title + heading + breadcrumb), RIGHT
   half is a content slot that varies per page:

     • Auth (login/register): 4 member-benefit cards in a 2x2 grid
       → `.wood-page-hero__benefits`
     • Category/Blog: a wide hero photo
       → `.wood-page-hero__image`
     • Add other variants (e.g. featured tags, sub-cat chips) by dropping
       the corresponding markup into the right column.

   Stacks to a single column on tablet so the card stays balanced; tightens
   further on phones (single-column benefits, smaller card padding).
   ========================================================================== */
.wood-page-hero { padding: 20px 0 70px; background: #fff; }

/* `--band` variant — full-bleed slim band (used on both top placement
   like About/Category/Blog AND bottom placement like login/register
   bottom benefits). Behavior:
     • The cream/surface background extends FULL-BLEED to the viewport
       edges (no rounded card, no container constraint).
     • Inner content (text + image / text + benefits grid) is still
       capped to the container width so the line-length stays readable.
     • Vertical rhythm is tighter so the hero reads as a page band,
       not a tall rounded card. */
.wood-page-hero--band {
  padding: 0;
  background: var(--wood-hero-bg, var(--surface));
}
/* Banner özel renkleri — editör "Banner Renkleri" açıkken inline --wood-hero-* set edilir. */
.wood-page-hero--band .wood-page-hero__title { color: var(--wood-hero-text, var(--primary)); }
.wood-page-hero--band .wood-page-hero__lede { color: var(--wood-hero-text, var(--muted)); }
.wood-page-hero--band .wood-page-hero__crumbs { color: var(--wood-hero-text, var(--muted)); }
.wood-page-hero--band .wood-page-hero__crumbs a { color: var(--wood-hero-text, var(--primary)); }
.wood-page-hero--band .wood-page-hero__crumbs span[aria-current] { color: var(--wood-hero-text, var(--accent)); }
.wood-page-hero--band > .wood-container {
  /* override site container to span the viewport */
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
.wood-page-hero--band .wood-page-hero__card {
  background: transparent;
  border-radius: 0;
  padding: 32px clamp(20px, 4vw, 50px);
  max-width: var(--container);
  margin: 0 auto;
  gap: 36px;
}
/* Image variant inside the band: cap the natural 16/10 aspect-ratio
   height so the about-hero band reads as a slim horizontal strip
   matching the height of the auth benefits 2x2 grid. The image inside
   keeps `object-fit: cover` so it crops gracefully. */
.wood-page-hero--band .wood-page-hero__image {
  aspect-ratio: auto;
  height: 240px;
  max-height: 240px;
}
@media (max-width: 991px) {
  .wood-page-hero--band .wood-page-hero__card {
    padding: 28px clamp(20px, 4vw, 32px);
    gap: 22px;
  }
  .wood-page-hero--band .wood-page-hero__image {
    height: 220px;
    max-height: 220px;
  }
}
@media (max-width: 640px) {
  .wood-page-hero--band .wood-page-hero__card { padding: 22px 18px; }
  .wood-page-hero--band .wood-page-hero__image {
    height: 180px;
    max-height: 180px;
  }
}

.wood-page-hero__card {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 44px;
  align-items: center;
  padding: 44px 50px;
  background: var(--surface);
  border-radius: 8px;
}

/* ---------- Left column: title + breadcrumb ----------------------------- */
.wood-page-hero__text { max-width: 480px; }
.wood-page-hero__pre {
  display: inline-block;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 14px;
  font-weight: 500;
  color: var(--accent);
  margin: 0 0 8px;
}
.wood-page-hero__title {
  font-family: var(--font-heading);
  font-size: clamp(26px, 2.6vw, 36px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -.3px;
  color: var(--primary);
  margin: 0 0 14px;
}
.wood-page-hero__lede {
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
  margin: 0;
  max-width: 460px;
}

/* Optional breadcrumb variant — kept here for reuse on category/blog
   pages where the page-hero IS the page header (login uses an in-card
   breadcrumb instead). */
.wood-page-hero__crumbs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--muted);
  margin-top: 14px;
}
.wood-page-hero__crumbs a {
  color: var(--primary);
  text-decoration: none;
  transition: color .2s ease;
}
.wood-page-hero__crumbs a:hover { color: var(--accent); }
.wood-page-hero__crumbs i {
  font-size: 11px;
  opacity: .55;
  line-height: 1;
}
.wood-page-hero__crumbs span[aria-current] {
  color: var(--accent);
  font-weight: 600;
}

/* ---------- Right column: BENEFITS variant (auth pages) ----------------- */
.wood-page-hero__benefits {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wood-page-hero__benefits li {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 12px;
  align-items: start;
  padding: 16px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 5px;
  list-style: none;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.wood-page-hero__benefits li:hover {
  border-color: var(--accent);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .04);
  transform: translateY(-1px);
}
.wood-page-hero__benefit-icon {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--accent);
  border-radius: 50%;
  font-size: 18px;
  flex: none;
}
.wood-page-hero__benefits li strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 2px;
  letter-spacing: .1px;
}
.wood-page-hero__benefits li > div > span {
  display: block;
  font-size: 12px;
  line-height: 1.5;
  color: var(--muted);
}

/* ---------- Right column: IMAGE variant (category / blog pages) --------- */
.wood-page-hero__image {
  margin: 0;
  position: relative;
  aspect-ratio: 16 / 10;
  border-radius: 6px;
  overflow: hidden;
  background: var(--surface-2, #ece6dc);
}
.wood-page-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ---------- Responsive --------------------------------------------------- */
@media (max-width: 991px) {
  .wood-page-hero__card {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 36px 32px;
  }
  .wood-page-hero__text { max-width: none; }
}
@media (max-width: 640px) {
  .wood-page-hero { padding: 22px 0 28px; }
  .wood-page-hero__card { padding: 26px 22px; }
  .wood-page-hero__benefits { grid-template-columns: 1fr; gap: 10px; }
  .wood-page-hero__benefits li { padding: 14px; }
}

/* ---------- Forms: login + register --------------------------------- */
.wood-auth__forms { padding: 50px 0 20px; }
.wood-auth__forms-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  align-items: stretch;
}
.wood-auth__card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 38px 36px;
  display: flex;
  flex-direction: column;
}
.wood-auth__card--register {
  background: var(--surface);
  border: 1px solid var(--border);
}
.wood-auth__card-title {
  font-family: var(--font-heading);
  font-size: clamp(22px, 1.9vw, 26px);
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 8px;
  letter-spacing: -.2px;
}

/* ---------- Card-level page header (login card only) ------------------- *
 * Appears at the very top of the left login card: a small uppercase
 * breadcrumb, the page heading "Hesabınıza Giriş Yapın", and a thin
 * accent rule. Mirrors a Safira/m2-style page header but lives inside
 * the form card itself so the section reads as one cohesive unit.
 * ----------------------------------------------------------------------- */
.wood-auth__card-head {
  margin: 0 0 22px;
}
.wood-auth__crumbs {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 12px;
}
.wood-auth__crumbs a {
  color: var(--muted);
  text-decoration: none;
  transition: color .2s ease;
}
.wood-auth__crumbs a:hover { color: var(--accent); }
.wood-auth__crumbs i {
  font-size: 10px;
  opacity: .6;
  line-height: 1;
}
.wood-auth__crumbs span[aria-current] {
  color: var(--accent);
  font-weight: 700;
}
/* Override the default `wood-auth__card-title { margin: 0 0 8px }` when
   the title sits inside the new card-head — the head wraps its own
   margins around the rule. */
.wood-auth__card-head .wood-auth__card-title {
  margin: 0 0 14px;
}
.wood-auth__title-rule {
  display: block;
  width: 36px;
  height: 2px;
  background: var(--accent);
  border-radius: 2px;
}

.wood-auth__card-desc {
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
  margin: 0 0 24px;
}

/* Inline alert (kayıt/login hata mesajı) */
.wood-auth__alert {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  padding: 12px 14px;
  background: #fdecea;
  border: 1px solid #f5c2bf;
  color: #b22d28;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
}
.wood-auth__alert i { font-size: 20px; flex: 0 0 auto; }
.wood-auth__notice {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  padding: 12px 14px;
  background: #e8f3ec;
  border: 1px solid #b9deca;
  color: #1f6b4a;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
}
.wood-auth__notice i { font-size: 20px; flex: 0 0 auto; }

/* Form skeleton */
.wood-auth__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.wood-auth__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wood-auth__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
  letter-spacing: .1px;
}
.wood-auth__req { color: var(--accent); margin-left: 2px; }

.wood-auth__input {
  height: 48px;
  padding: 0 14px;
  border: 1.5px solid var(--border-strong);
  background: #fff;
  border-radius: 3px;
  font-family: inherit;
  font-size: 14px;
  color: var(--primary);
  outline: 0;
  transition: border-color .2s ease, box-shadow .2s ease;
  width: 100%;
}
.wood-auth__input::placeholder { color: var(--muted-2); }
.wood-auth__input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(181,150,119,.18);
}

/* Show/hide password */
.wood-auth__input-wrap { position: relative; }
.wood-auth__input-wrap .wood-auth__input { padding-right: 46px; }
.wood-auth__pw-toggle {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  color: var(--muted);
  font-size: 18px;
  cursor: pointer;
  border-radius: 3px;
  transition: color .2s ease, background-color .2s ease;
}
.wood-auth__pw-toggle:hover { color: var(--primary); background: var(--surface); }

/* Remember + forgot row */
.wood-auth__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 4px 0 6px;
  flex-wrap: wrap;
}
.wood-auth__check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--primary);
  cursor: pointer;
  user-select: none;
}
.wood-auth__check input {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
  cursor: pointer;
}
.wood-auth__forgot {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color .2s ease;
}
.wood-auth__forgot:hover { color: var(--accent); }

/* CTA button — solid (sign in) and outline (register) variants */
.wood-auth__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 50px;
  padding: 0 28px;
  background: var(--primary);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: 0;
  border-radius: 3px;
  cursor: pointer;
  font-family: inherit;
  text-decoration: none;
  transition: background-color .2s ease, color .2s ease, transform .15s ease;
}
.wood-auth__btn:hover { background: var(--accent); color: #fff; }
.wood-auth__btn:active { transform: translateY(1px); }
.wood-auth__btn i { font-size: 14px; }
.wood-auth__btn--outline {
  background: transparent;
  color: var(--primary);
  border: 1.5px solid var(--primary);
  height: 48px;
  align-self: flex-start;
}
.wood-auth__btn--outline:hover {
  background: var(--primary);
  color: #fff;
}

.wood-auth__required-note {
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 12px;
}
.wood-auth__required-note span { margin-right: 2px; }

/* Register card mini-benefits */
.wood-auth__benefits-mini {
  list-style: none;
  margin: 4px 0 22px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wood-auth__benefits-mini li {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: var(--primary);
  list-style: none;
}
.wood-auth__benefits-mini li i {
  font-size: 18px;
  color: var(--accent);
  line-height: 1;
  flex: none;
}

/* ==========================================================================
   REGISTER-SPECIFIC ELEMENTS
   --------------------------------------------------------------------------
   The register card has more fields than login, so the .--register grid
   weights the LEFT card heavier (1.5fr/1fr) to give the form room to
   breathe while keeping the small "Already a member?" CTA on the right
   compact and tidy.
   ========================================================================== */
.wood-auth__forms-grid--register {
  grid-template-columns: 1.5fr 1fr;
  /* `stretch` (the default for CSS grid) lets the right-column wrapper
     grow to match the tall left form card. */
  align-items: stretch;
}

/* Right column: `height: 100%` makes the wrapper fill the row so the
   CTA card can stretch to the same bottom edge as the left form card. */
.wood-auth__side-stack {
  display: flex;
  flex-direction: column;
  gap: 22px;
  height: 100%;
}
.wood-auth__side-stack > .wood-auth__card { flex: none; }
/* Tek kart kaldığı için CTA kartı sütunu boydan boya doldurur; içerik
   dikeyde ortalanır ki uzun form yanında tepede sıkışmış durmasın. */
.wood-auth__side-stack > .wood-auth__card--register {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Hint text below an input (e.g. password strength tip). */
.wood-auth__hint {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
}

/* Two inputs side-by-side (Cinsiyet + Doğum Tarihi). */
.wood-auth__row-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.wood-auth__row-2col > .wood-auth__field { min-width: 0; }

/* iOS: date input diğer alanlarla aynı görünsün, kolonundan taşmasın */
.wood-auth__input[type="date"] {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  min-width: 0;
  background-color: #fff;
  text-align: left;
}
.wood-auth__input[type="date"]::-webkit-date-and-time-value {
  text-align: left;
  margin: 0;
}

/* Select dropdown — visual parity with text inputs, custom caret. */
.wood-auth__select-wrap {
  position: relative;
}
.wood-auth__select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 40px;
  background-image: none;
  cursor: pointer;
}
.wood-auth__select-wrap > i {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  color: var(--muted);
  pointer-events: none;
}

/* Browser-native date picker styling — match font + color tokens. */
input[type="date"].wood-auth__input::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: .55;
  transition: opacity .2s ease;
}
input[type="date"].wood-auth__input::-webkit-calendar-picker-indicator:hover {
  opacity: 1;
}

/* KVKK checkbox row — wraps long privacy-policy sentence cleanly under
   the inline link. */
.wood-auth__check--kvkk {
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  line-height: 1.55;
  margin: 4px 0 4px;
}
.wood-auth__check--kvkk input { margin-top: 2px; }
.wood-auth__check--kvkk a {
  color: var(--primary);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.wood-auth__check--kvkk a:hover { color: var(--accent); }
.wood-auth__check--kvkk em { font-style: normal; margin-left: 2px; }

/* "veya" divider between native form and social signup. */
.wood-auth__divider {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 28px 0 22px;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  color: var(--muted);
}
.wood-auth__divider::before,
.wood-auth__divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--border);
}

/* Social signup buttons — outlined, neutral so they sit calmly next to
   the dark primary CTA above. Hover tints with the brand-correct color
   (Google red, Facebook blue) just on the icon, never overpowering. */
.wood-auth__social {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.wood-auth__social-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 48px;
  padding: 0 18px;
  background: #fff;
  border: 1.5px solid var(--border-strong);
  border-radius: 3px;
  color: var(--primary);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .4px;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .2s ease, color .2s ease, background-color .2s ease, transform .15s ease;
}
.wood-auth__social-btn i { font-size: 18px; line-height: 1; }
.wood-auth__social-btn:active { transform: translateY(1px); }
.wood-auth__social-btn--google:hover {
  border-color: #ea4335;
  color: #ea4335;
}
.wood-auth__social-btn--facebook:hover {
  border-color: #1877f2;
  color: #1877f2;
}

/* ---------- Responsive --------------------------------------------------- */
@media (max-width: 991px) {
  .wood-auth__top-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .wood-auth__thumb {
    aspect-ratio: 16 / 9;
    max-height: 200px;
  }
}
@media (max-width: 991px) {
  /* Register: collapse the asymmetric 1.5/1 grid to a single column on
     tablet so the long form has more horizontal room, with the small
     "Already a member?" CTA stacking below. */
  .wood-auth__forms-grid--register {
    grid-template-columns: 1fr;
    gap: 22px;
  }
}
@media (max-width: 768px) {
  .wood-auth__forms-grid { grid-template-columns: 1fr; gap: 22px; }
  .wood-auth__card { padding: 30px 24px; }
}
@media (max-width: 520px) {
  /* Cinsiyet + Doğum Tarihi stack on phones — they're optional and the
     half-width inputs become too narrow at this breakpoint. */
  .wood-auth__row-2col { grid-template-columns: 1fr; gap: 14px; }
  .wood-auth__social { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .wood-auth__top { padding: 36px 0 28px; }
  .wood-auth__forms { padding: 32px 0 14px; }
  .wood-auth__benefits {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .wood-auth__welcome { text-align: center; }
  .wood-auth__lede { margin-left: auto; margin-right: auto; }
  .wood-auth__benefits li { text-align: left; }
}
@media (max-width: 480px) {
  .wood-auth__row {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .wood-auth__btn--outline { align-self: stretch; justify-content: center; }
}

/* ==========================================================================
   BLOG ARCHIVE PAGE — wood-blog-page / wood-blog-archive / wood-blog-card
   / wood-blog-side / wood-blog-pager
   --------------------------------------------------------------------------
   Layout: 2-col (post grid + sidebar). Cards stay in a 2-col grid inside
   the main column on desktop, collapse to 1-col on smaller widths.
   Sidebar slots below main on tablet/mobile.

   Note: this is the BLOG ARCHIVE page (route: /blog). The homepage's
   featured-blog block lives under .wood-blog (see top of the file) and
   is a separate component — naming is `wood-blog-page` here to avoid
   collision.
   ========================================================================== */
.wood-blog-page { background: #fff; }

/* ---------- Section wrapper ------------------------------------------- */
.wood-blog-archive { padding: 50px 0 80px; }
.wood-blog-archive__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 40px;
  align-items: start;
}
.wood-blog-archive__main { min-width: 0; }

/* ---------- Post grid (2-col cards inside the main column) ------------ */
.wood-blog-archive__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
  margin: 0 0 40px;
}

/* ---------- Blog post card (vertical: media + body) ------------------- */
.wood-blog-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.wood-blog-card:hover {
  border-color: var(--accent);
  box-shadow: 0 12px 28px rgba(20, 16, 12, .07);
  transform: translateY(-2px);
}

.wood-blog-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  background: var(--surface);
  overflow: hidden;
}
.wood-blog-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s ease;
}
.wood-blog-card:hover .wood-blog-card__media img { transform: scale(1.04); }

/* Date badge — overlay top-left of the image */
.wood-blog-card__date {
  position: absolute;
  top: 14px;
  left: 14px;
  width: 56px;
  height: 56px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--primary);
  border-radius: 4px;
  font-family: var(--font-heading);
  line-height: 1;
  box-shadow: 0 4px 14px rgba(20, 16, 12, .12);
}
.wood-blog-card__date strong {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.5px;
}
.wood-blog-card__date span {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent);
  margin-top: 2px;
  font-family: "Open Sans", sans-serif;
}

.wood-blog-card__body {
  display: flex;
  flex-direction: column;
  padding: 22px 24px 24px;
  flex: 1;
}

.wood-blog-card__meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 10px;
  letter-spacing: .2px;
}
.wood-blog-card__cat {
  color: var(--accent);
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1.2px;
  font-size: 11px;
  transition: color .2s ease;
}
.wood-blog-card__cat:hover { color: var(--primary); }
.wood-blog-card__sep { opacity: .5; }
.wood-blog-card__author { font-weight: 500; }

.wood-blog-card__title {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.2px;
  margin: 0 0 10px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wood-blog-card__title a {
  color: var(--primary);
  text-decoration: none;
  transition: color .2s ease;
}
.wood-blog-card__title a:hover { color: var(--accent); }

.wood-blog-card__excerpt {
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
  margin: 0 0 16px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.wood-blog-card__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--primary);
  text-decoration: none;
  transition: color .2s ease, gap .2s ease;
  align-self: flex-start;
}
.wood-blog-card__more i { font-size: 14px; transition: transform .2s ease; }
.wood-blog-card__more:hover { color: var(--accent); gap: 10px; }
.wood-blog-card__more:hover i { transform: translateX(2px); }

/* ---------- Pagination ------------------------------------------------- */
.wood-blog-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 20px 0 0;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}
.wood-blog-pager__list {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.wood-blog-pager__list li { list-style: none; margin: 0; padding: 0; }

.wood-blog-pager__btn,
.wood-blog-pager__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 38px;
  min-width: 38px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, color .2s ease;
}
.wood-blog-pager__btn:hover,
.wood-blog-pager__num:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.wood-blog-pager__num.is-active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.wood-blog-pager__btn--disabled {
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
}
.wood-blog-pager__gap {
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 6px;
  color: var(--muted);
  font-weight: 600;
}

/* ---------- Sidebar (search / cats / recent / archive) ---------------- */
.wood-blog-side {
  display: flex;
  flex-direction: column;
  gap: 28px;
  position: sticky;
  top: 24px;
}
.wood-blog-side__widget {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 22px 24px 24px;
}
.wood-blog-side__title {
  font-family: var(--font-heading);
  font-size: 17px;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 14px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--border);
  letter-spacing: -.2px;
  position: relative;
}
/* Accent underline beneath the divider */
.wood-blog-side__title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 28px;
  height: 2px;
  background: var(--accent);
  border-radius: 2px;
}

/* Search */
.wood-blog-side__search {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--border);
  border-radius: 4px;
  overflow: hidden;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.wood-blog-side__search:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(181, 150, 119, .12);
}
.wood-blog-side__search-input {
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  height: 42px;
  padding: 0 14px;
  font: inherit;
  font-size: 14px;
  color: var(--primary);
  font-family: inherit;
  min-width: 0;
}
.wood-blog-side__search-input::placeholder { color: var(--muted); opacity: .65; }
.wood-blog-side__search-btn {
  border: 0;
  background: var(--primary);
  color: #fff;
  width: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  transition: background-color .2s ease;
}
.wood-blog-side__search-btn:hover { background: var(--accent); }

/* Generic list (categories + archive) */
.wood-blog-side__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.wood-blog-side__list li {
  list-style: none;
  margin: 0;
  padding: 0;
  border-bottom: 1px dashed var(--border);
}
.wood-blog-side__list li:last-child { border-bottom: 0; }
.wood-blog-side__list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  font-size: 14px;
  color: var(--primary);
  text-decoration: none;
  transition: color .2s ease, padding .2s ease;
}
.wood-blog-side__list a:hover {
  color: var(--accent);
  padding-left: 6px;
}
.wood-blog-side__list-name {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.wood-blog-side__list-name::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
  opacity: .6;
}
.wood-blog-side__list-count {
  width: 28px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--wood-blog-detail-bg, var(--surface));
  color: var(--muted);
  border-radius: 3px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
  flex: none;
  transition: background-color .2s ease, color .2s ease;
}
.wood-blog-side__list a:hover .wood-blog-side__list-count {
  background: var(--accent);
  color: #fff;
}

/* Active category in sidebar — applied when on /blog-kategori with
   matching ?cat slug. Accent name, filled dot, accent badge. */
.wood-blog-side__list li.is-active > a { color: var(--accent); padding-left: 6px; }
.wood-blog-side__list li.is-active .wood-blog-side__list-name::before { opacity: 1; }
.wood-blog-side__list li.is-active .wood-blog-side__list-count {
  background: var(--accent);
  color: #fff;
}

/* Recent posts list (thumbnail + title + date) */
.wood-blog-side__recent {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.wood-blog-side__recent li { list-style: none; margin: 0; padding: 0; }
.wood-blog-side__recent-link {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 12px;
  align-items: center;
  text-decoration: none;
  color: inherit;
}
.wood-blog-side__recent-thumb {
  margin: 0;
  width: 72px;
  height: 72px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--surface);
}
.wood-blog-side__recent-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.wood-blog-side__recent-link:hover .wood-blog-side__recent-thumb img {
  transform: scale(1.06);
}
.wood-blog-side__recent-body { min-width: 0; }
.wood-blog-side__recent-title {
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--primary);
  margin: 0 0 4px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color .2s ease;
}
.wood-blog-side__recent-link:hover .wood-blog-side__recent-title { color: var(--accent); }
.wood-blog-side__recent-date {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--muted);
  letter-spacing: .2px;
}
.wood-blog-side__recent-date i { font-size: 12px; color: var(--accent); }

/* ---------- Detail page (single post — article + sidebar) ------------- */
/* Hero band variant: pre-title rendered as a linked italic chip pointing
   to the post's category. Meta row directly below the title (author /
   date / reading time). */
.wood-page-hero__pre--link {
  text-decoration: none;
  transition: color .2s ease;
}
.wood-page-hero__pre--link:hover { color: var(--primary); }

.wood-blog-detail__hero-meta {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  font-size: 13px;
  color: var(--muted);
}
.wood-blog-detail__hero-meta li {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.wood-blog-detail__hero-meta i { color: var(--accent); font-size: 16px; }

/* Article + sidebar layout — same proportions as blog archive */
.wood-blog-detail { padding: 50px 0 80px; background: #fff; }
.wood-blog-detail__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 40px;
  align-items: start;
}
.wood-blog-detail__article { min-width: 0; max-width: 760px; }

/* Lead paragraph — slightly larger, lighter weight */
.wood-blog-detail__lead {
  font-family: var(--font-heading);
  font-size: 18px;
  font-style: italic;
  line-height: 1.55;
  color: var(--primary);
  margin: 0 0 28px;
  padding: 0 0 22px;
  border-bottom: 1px solid var(--border);
}

/* Article rich-text body — paragraph / heading / quote / list / figure */
.wood-blog-detail__body { color: var(--primary); }
.wood-blog-detail__body p {
  font-size: 15.5px;
  line-height: 1.8;
  color: var(--primary);
  margin: 0 0 18px;
}
.wood-blog-detail__body h2 {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.2px;
  color: var(--primary);
  margin: 28px 0 14px;
}
.wood-blog-detail__body h3 {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--primary);
  margin: 22px 0 10px;
}
.wood-blog-detail__body ul,
.wood-blog-detail__body ol {
  margin: 0 0 22px;
  padding: 0 0 0 22px;
  color: var(--primary);
}
.wood-blog-detail__body li {
  font-size: 15.5px;
  line-height: 1.7;
  margin: 0 0 8px;
}
.wood-blog-detail__body ul li::marker { color: var(--accent); }
.wood-blog-detail__body blockquote {
  margin: 28px 0;
  padding: 22px 28px 22px 32px;
  background: var(--surface);
  border-left: 3px solid var(--accent);
  border-radius: 4px;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 17px;
  line-height: 1.6;
  color: var(--primary);
}
.wood-blog-detail__body blockquote cite {
  display: block;
  margin-top: 10px;
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent);
}
.wood-blog-detail__body figure {
  margin: 28px 0;
  border-radius: 6px;
  overflow: hidden;
}
.wood-blog-detail__body figure img {
  width: 100%;
  height: auto;
  display: block;
}
.wood-blog-detail__body figcaption {
  padding: 10px 14px;
  background: var(--surface);
  font-size: 13px;
  color: var(--muted);
  text-align: center;
  font-style: italic;
}
.wood-blog-detail__body a { color: var(--accent); text-decoration: underline; }
.wood-blog-detail__body a:hover { color: var(--primary); }
.wood-blog-detail__body strong { font-weight: 700; color: var(--primary); }

/* ---------- Article footer: share row -------------------------------- */
.wood-blog-detail__footer {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin: 36px 0 0;
  padding: 22px 0 0;
  border-top: 1px solid var(--border);
}
.wood-blog-detail__share-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--primary);
}
.wood-blog-detail__share {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.wood-blog-detail__share li { list-style: none; margin: 0; padding: 0; }
.wood-blog-detail__share a {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--wood-blog-detail-bg, var(--surface));
  color: var(--primary);
  border-radius: 50%;
  font-size: 15px;
  text-decoration: none;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.wood-blog-detail__share a:hover {
  background: var(--accent);
  color: #fff;
  transform: translateY(-2px);
}

/* ---------- Author bio card ------------------------------------------ */
.wood-blog-detail__author {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 22px;
  align-items: center;
  margin: 36px 0 0;
  padding: 26px 28px;
  background: var(--wood-blog-detail-bg, var(--surface));
  border-radius: 8px;
}
.wood-blog-detail__author-monogram {
  width: 96px;
  height: 96px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 50%;
  flex: none;
}
.wood-blog-detail__author-monogram > span {
  font-family: var(--font-heading);
  font-size: 30px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: -.5px;
  line-height: 1;
}
.wood-blog-detail__author-pre {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.6px;
  color: var(--accent);
  margin: 0 0 4px;
}
.wood-blog-detail__author-name {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 2px;
  letter-spacing: -.2px;
}
.wood-blog-detail__author-role {
  display: block;
  font-size: 13px;
  color: var(--muted);
  margin: 0 0 8px;
}
.wood-blog-detail__author-bio {
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
}

/* ---------- Related Articles section --------------------------------- */
.wood-blog-related {
  padding: 70px 0 80px;
  background: var(--wood-blog-detail-bg, var(--surface));
}
.wood-blog-related__pre {
  display: inline-block;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 14px;
  color: var(--accent);
  margin: 0 0 6px;
}
.wood-blog-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

/* Detail-page responsive — collapse sidebar / related grid alongside the
   blog-archive breakpoints further below. */
@media (max-width: 1199px) {
  .wood-blog-detail__layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 32px; }
}
@media (max-width: 991px) {
  .wood-blog-detail { padding: 40px 0 60px; }
  .wood-blog-detail__layout { grid-template-columns: 1fr; gap: 40px; }
  .wood-blog-related__grid { grid-template-columns: repeat(2, 1fr); }
  .wood-blog-related { padding: 50px 0 60px; }
}
@media (max-width: 768px) {
  .wood-blog-related__grid { grid-template-columns: 1fr; gap: 22px; }
  .wood-blog-detail__author { grid-template-columns: 72px 1fr; gap: 16px; padding: 22px 20px; }
  .wood-blog-detail__author-monogram { width: 72px; height: 72px; }
  .wood-blog-detail__author-monogram > span { font-size: 24px; }
}
@media (max-width: 520px) {
  .wood-blog-detail__lead { font-size: 16px; }
  .wood-blog-detail__body p,
  .wood-blog-detail__body li { font-size: 15px; }
  .wood-blog-detail__body h2 { font-size: 20px; }
  .wood-blog-detail__body blockquote { padding: 18px 20px; font-size: 15.5px; }
}

/* ---------- Category page (full-width, no sidebar, 3-col) ------------- */
/* Same .wood-blog-card / .wood-blog-pager primitives reused; only the
   grid wrapper differs — wider cards in a 3-col layout because the
   sidebar is absent on this template. */
.wood-blog-category { padding: 50px 0 80px; }
.wood-blog-category__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin: 0 0 40px;
}

/* ---------- Responsive ------------------------------------------------- */
@media (max-width: 1199px) {
  .wood-blog-archive__layout { grid-template-columns: minmax(0, 1fr) 280px; gap: 32px; }
}
@media (max-width: 991px) {
  .wood-blog-archive,
  .wood-blog-category { padding: 40px 0 60px; }
  .wood-blog-archive__layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .wood-blog-side {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
  .wood-blog-category__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .wood-blog-archive__grid { grid-template-columns: 1fr; gap: 22px; }
  .wood-blog-side { grid-template-columns: 1fr; gap: 20px; }
  .wood-blog-category__grid { grid-template-columns: 1fr; gap: 22px; }
}
@media (max-width: 520px) {
  .wood-blog-card__body { padding: 18px 18px 20px; }
  .wood-blog-card__date { width: 48px; height: 48px; }
  .wood-blog-card__date strong { font-size: 18px; }
  .wood-blog-pager { gap: 4px; }
  .wood-blog-pager__btn span { display: none; } /* keep just arrow on tiny screens */
}

/* ==========================================================================
   CONTACT PAGE (İletişim) — wood-contact / wood-contact-map /
   wood-contact-card / wood-contact-form / wood-contact-info
   --------------------------------------------------------------------------
   Layout: Safira-style "map + 2 floating cards":
     • Full-bleed Google Maps iframe at the top of the section
     • Two cards positioned on top/below the map's lower edge so they
       visually float over it. Left card holds the message form, right
       card holds the icon+text contact info on a dimmed photo backdrop.
     • Cards stack vertically on tablet/mobile, map height shrinks.
   ========================================================================== */
.wood-contact { background: #fff; }

/* Visually hidden — for the map section's labelling heading. */
.wood-sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* ---------- Section wrapper (map + cards) ------------------------------ */
.wood-contact-map {
  position: relative;
  /* No top padding so the map butts directly against the main header.
     Bottom padding is kept smaller because the closing band below
     brings its own internal padding (32px from .wood-page-hero--band). */
  padding: 0 0 50px;
  background: #fff;
}

/* Full-bleed map. Tall enough that the card overlap (margin-top: -200px)
   still leaves the upper half of the map visible. */
.wood-contact-map__map {
  width: 100%;
  height: 520px;
  background: var(--surface);
  position: relative;
}
.wood-contact-map__map iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  filter: saturate(.95);
}

/* Two cards floating below the map, overlapping its bottom edge. */
.wood-contact-map__cards {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 28px;
  margin-top: -200px;
  position: relative;
  z-index: 2;
}

/* ---------- Card base -------------------------------------------------- */
.wood-contact-card {
  background: #fff;
  border-radius: 8px;
  padding: 38px 40px 36px;
  box-shadow: 0 18px 48px rgba(20, 16, 12, .12);
  position: relative;
  overflow: hidden;
}

/* Card head (pre + title + rule). Light variants for the dark right card. */
.wood-contact-card__head { margin: 0 0 26px; }
.wood-contact-card__pre {
  display: inline-block;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 13px;
  font-weight: 500;
  color: var(--accent);
  margin: 0 0 6px;
}
.wood-contact-card__pre--light { color: rgba(255, 255, 255, .85); }
.wood-contact-card__title {
  font-family: var(--font-heading);
  font-size: clamp(22px, 2vw, 26px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.3px;
  color: var(--primary);
  margin: 0 0 14px;
}
.wood-contact-card__title.wood-contact-card__title--light { color: #fff !important; }
.wood-contact-card__rule {
  display: block;
  width: 36px;
  height: 2px;
  background: var(--accent);
  border-radius: 2px;
}
.wood-contact-card__rule--light { background: #fff; opacity: .85; }

/* ---------- LEFT card: form ------------------------------------------- */
.wood-contact-card--form { /* default white background OK */ }

.wood-contact-form {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.wood-contact-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.wood-contact-form__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wood-contact-form__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
  letter-spacing: .1px;
}
.wood-contact-form__req { color: var(--danger, #c0392b); margin-left: 2px; }

.wood-contact-form__input {
  width: 100%;
  height: 44px;
  padding: 0 14px;
  font: inherit;
  font-size: 14px;
  color: var(--primary);
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  transition: border-color .2s ease, box-shadow .2s ease;
  font-family: inherit;
}
.wood-contact-form__input:hover { border-color: var(--border-strong, #c8beb1); }
.wood-contact-form__input:focus {
  outline: 0;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(181, 150, 119, .15);
}
.wood-contact-form__input::placeholder { color: var(--muted); opacity: .65; }

.wood-contact-form__textarea {
  height: auto;
  min-height: 130px;
  padding: 12px 14px;
  resize: vertical;
  line-height: 1.55;
}

.wood-contact-form__actions {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.wood-contact-form__note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
  flex: 1;
  min-width: 220px;
}
.wood-contact-form__note i { color: var(--accent); font-size: 16px; }

/* ---------- RIGHT card: dark info card (görselsiz) --------------------- */
.wood-contact-card--info {
  /* Fotoğraf yok: koyu zemin + köşelerde yumuşak accent ışımaları ve
     üstte ince accent şeridi ile derinlik verilir.
     Zemin düz --primary yerine accent'e çekilmiş koyu tondan türer;
     böylece kart, temanın vurgu rengiyle uyumlu kalır (düz siyah sırıtmaz). */
  --wood-contact-ink: color-mix(in srgb, var(--accent) 26%, color-mix(in srgb, var(--primary) 55%, #14090f));
  background:
    radial-gradient(420px 260px at 110% -10%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%),
    radial-gradient(360px 240px at -15% 115%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 70%),
    linear-gradient(160deg, color-mix(in srgb, var(--wood-contact-ink) 88%, #fff), var(--wood-contact-ink));
  color: #fff;
}
.wood-contact-card--info::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 35%, transparent));
}
.wood-contact-card__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.wood-contact-info {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.wood-contact-info li {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 16px;
  align-items: center;
  list-style: none;
}
.wood-contact-info__icon {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  border-radius: 50%;
  font-size: 18px;
  flex: none;
  backdrop-filter: blur(2px);
}
.wood-contact-info strong {
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .75);
  margin: 0 0 2px;
}
.wood-contact-info p { margin: 0; font-size: 14.5px; line-height: 1.5; color: #fff; }
.wood-contact-info p a { color: inherit; text-decoration: none; transition: opacity .2s ease; }
.wood-contact-info p a:hover { opacity: .8; }

/* WhatsApp CTA — info kartının altında tam genişlik buton */
.wood-contact-wa {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 24px 0 0;
  padding: 13px 18px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(255, 255, 255, .18);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.wood-contact-wa i:first-child { font-size: 20px; color: #4ade80; }
.wood-contact-wa .ph-arrow-right { margin-left: auto; font-size: 15px; opacity: .7; transition: transform .2s ease; }
.wood-contact-wa:hover { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .3); transform: translateY(-1px); }
.wood-contact-wa:hover .ph-arrow-right { transform: translateX(3px); }

/* Social row at the bottom of the info card */
.wood-contact-social {
  list-style: none;
  margin: auto 0 0;        /* push to bottom of flex column */
  padding: 18px 0 0;
  border-top: 1px solid rgba(255, 255, 255, .15);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.wood-contact-social li { list-style: none; margin: 0; padding: 0; }
.wood-contact-social a {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .10);
  color: #fff;
  border-radius: 50%;
  font-size: 15px;
  text-decoration: none;
  transition: background-color .2s ease, transform .2s ease;
}
.wood-contact-social a:hover {
  background: var(--accent);
  transform: translateY(-2px);
}

/* ---------- Responsive ------------------------------------------------- */
@media (max-width: 991px) {
  .wood-contact-map__map { height: 380px; }
  .wood-contact-map__cards {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: -120px;
  }
  .wood-contact-card { padding: 30px 28px 28px; }
}
@media (max-width: 640px) {
  .wood-contact-map { padding-bottom: 60px; }
  .wood-contact-map__map { height: 280px; }
  .wood-contact-map__cards { margin-top: -80px; }
  .wood-contact-card { padding: 26px 22px 24px; }
  .wood-contact-form__row { grid-template-columns: 1fr; }
  .wood-contact-form__actions { flex-direction: column; align-items: stretch; }
  .wood-contact-form__note { min-width: 0; text-align: center; justify-content: center; }
}

/* ==========================================================================
   ABOUT PAGE (Hakkımızda) — wood-about / wood-mv / wood-reasons /
   wood-locator / wood-team
   --------------------------------------------------------------------------
   Each section is independent so the same primitives (mission/vision card,
   feature reasons grid, image+content split, team monogram cards) can be
   reused on similar editorial pages later. The page hero at the top is
   the reusable .wood-page-hero pattern (image variant).
   ========================================================================== */
.wood-about { background: #fff; }

/* ---------- Mission + Vision (icon-on-left, daraltılmış grid) ----------- */
.wood-mv { padding: 70px 0 60px; }
.wood-mv__grid {
  /* daha kompakt görünmesi için container'dan dar tutuyoruz */
  max-width: 920px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}
/* Each card: icon on the LEFT, title + rule + paragraph on the RIGHT.
   On mobile the grid collapses to a single column but each card keeps
   its own internal icon+body row, so the icon stays on the left.
   `align-items: center` keeps the icon vertically aligned to the middle
   of the body block (title + rule + paragraph) instead of stuck at top. */
.wood-mv__card {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 20px;
  align-items: center;
}
.wood-mv__icon {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--accent);
  border-radius: 50%;
  font-size: 26px;
  flex: none;
}
.wood-mv__body { min-width: 0; } /* prevents overflow on long lines */
.wood-mv__title {
  font-family: var(--font-heading);
  font-size: clamp(22px, 2vw, 26px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.3px;
  color: var(--primary);
  margin: 0 0 10px;
}
.wood-mv__rule {
  display: block;
  width: 32px;
  height: 2px;
  background: var(--accent);
  border-radius: 2px;
  margin: 0 0 14px;
}
.wood-mv__body p {
  font-size: 14px;
  line-height: 1.7;
  color: var(--muted);
  margin: 0;
}

@media (max-width: 768px) {
  .wood-mv { padding: 50px 0 40px; }
  .wood-mv__grid { grid-template-columns: 1fr; gap: 28px; max-width: 560px; }
}
@media (max-width: 480px) {
  .wood-mv__card { grid-template-columns: 48px 1fr; gap: 16px; }
  .wood-mv__icon { width: 48px; height: 48px; font-size: 22px; }
}

/* ---------- Reasons to choose us (5-feature grid) ----------------------- */
.wood-reasons {
  padding: 70px 0;
  background: var(--surface);
}
.wood-reasons__pre {
  display: inline-block;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 14px;
  font-weight: 500;
  color: var(--accent);
  margin: 0 0 6px;
}
.wood-reasons__list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wood-reasons__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 28px 20px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  list-style: none;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.wood-reasons__item:hover {
  border-color: var(--accent);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .05);
  transform: translateY(-2px);
}
.wood-reasons__icon {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--accent);
  border-radius: 50%;
  font-size: 26px;
  margin: 0 0 16px;
}
.wood-reasons__title {
  display: block;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .1px;
  color: var(--primary);
  margin: 0 0 8px;
  line-height: 1.3;
}
.wood-reasons__desc {
  font-size: 13px;
  line-height: 1.55;
  color: var(--muted);
  margin: 0;
}

@media (max-width: 1199px) { .wood-reasons__list { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .wood-reasons__list { grid-template-columns: repeat(2, 1fr); gap: 16px; } }
@media (max-width: 480px)  { .wood-reasons__list { grid-template-columns: 1fr; } }
@media (max-width: 768px)  { .wood-reasons { padding: 50px 0; } }

/* ---------- Store Locator (image + content split) ----------------------- */
.wood-locator { padding: 80px 0 70px; }
.wood-locator__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}
/* Image (legacy) and Map (Google Maps iframe) variants share the same
   wrapper sizing — pick whichever markup the page needs. */
.wood-locator__img,
.wood-locator__map {
  margin: 0;
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--border);
}
.wood-locator__img img,
.wood-locator__map iframe {
  width: 100%;
  height: 100%;
  display: block;
}
.wood-locator__img img { object-fit: cover; }
.wood-locator__map iframe { border: 0; }
.wood-locator__content { max-width: 520px; }
.wood-locator__pre {
  display: inline-block;
  font-family: var(--font-heading);
  font-style: italic;
  font-size: 14px;
  color: var(--accent);
  font-weight: 500;
  margin: 0 0 6px;
}
.wood-locator__title {
  font-family: var(--font-heading);
  font-size: clamp(26px, 2.6vw, 36px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -.3px;
  color: var(--primary);
  margin: 0 0 14px;
}
.wood-locator__rule {
  display: block;
  width: 36px;
  height: 2px;
  background: var(--accent);
  border-radius: 2px;
  margin: 0 0 22px;
}
.wood-locator__desc {
  font-size: 15px;
  line-height: 1.7;
  color: var(--muted);
  margin: 0 0 26px;
}
.wood-locator__info {
  list-style: none;
  margin: 0 0 30px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wood-locator__info li {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 14px;
  color: var(--primary);
  list-style: none;
}
.wood-locator__info li i {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--accent);
  border-radius: 50%;
  font-size: 16px;
  flex: none;
}

/* Generic CTA button (also reusable on other editorial pages) */
.wood-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 50px;
  padding: 0 28px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: 0;
  border-radius: 3px;
  text-decoration: none;
  cursor: pointer;
  font-family: inherit;
  transition: background-color .2s ease, color .2s ease, transform .15s ease;
}
.wood-btn:active { transform: translateY(1px); }
.wood-btn i { font-size: 14px; }
.wood-btn--primary {
  background: var(--primary);
  color: #fff;
}
.wood-btn--primary:hover { background: var(--accent); color: #fff; }

@media (max-width: 991px) {
  .wood-locator { padding: 60px 0 50px; }
  .wood-locator__grid { grid-template-columns: 1fr; gap: 32px; }
}

/* ---------- Meet Our Team (3 monogram cards) ---------------------------- */
.wood-team {
  padding: 70px 0 80px;
  background: var(--surface);
}
.wood-team__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.wood-team__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 36px 28px 32px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 8px;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.wood-team__card:hover {
  border-color: var(--accent);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .06);
  transform: translateY(-3px);
}

/* Monogram circle — placeholder until real headshots are added.
   To swap to real photos:
     <figure class="wood-team__photo"><img src="..." alt=""></figure>
   The .wood-team__photo style below is ready for that markup. */
.wood-team__monogram {
  width: 96px;
  height: 96px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  border-radius: 50%;
  margin: 0 0 20px;
}
.wood-team__monogram > span {
  font-family: var(--font-heading);
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -.5px;
  color: var(--accent);
  line-height: 1;
}
.wood-team__photo {
  width: 96px;
  height: 96px;
  margin: 0 0 20px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--surface);
}
.wood-team__photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.wood-team__name {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 700;
  color: var(--primary);
  margin: 0 0 4px;
  letter-spacing: -.2px;
}
.wood-team__role {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 16px;
}
.wood-team__bio {
  font-size: 13px;
  line-height: 1.65;
  color: var(--muted);
  margin: 0 0 22px;
}
.wood-team__social {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  list-style: none;
  margin: auto 0 0; /* push to bottom of card */
  padding: 0;
}
.wood-team__social li { list-style: none; margin: 0; padding: 0; }
.wood-team__social a {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--primary);
  border-radius: 50%;
  font-size: 14px;
  text-decoration: none;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.wood-team__social a:hover {
  background: var(--accent);
  color: #fff;
  transform: translateY(-2px);
}

@media (max-width: 991px) {
  .wood-team__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .wood-team { padding: 50px 0 60px; }
  .wood-team__grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   FEATURED PRODUCTS — Safira-style compact horizontal card variant
   The shared `_product-card.php` partial renders a vertical card by default.
   Inside `<section class="wood-products wood-products--featured">` we flip
   each card to a 2-col layout: small product thumb on the LEFT, text on the
   RIGHT (cat / name / stars / price). Tighter rows, bordered cards, no
   hover pill (cards are too compact for icon overlay).
   ========================================================================== */
.wood-products--featured { padding: 50px 0; }
.wood-products--featured .wood-products__grid { gap: 18px; }

.wood-products--featured .wood-product {
  display: grid;
  grid-template-columns: 110px 1fr;
  align-items: center;
  gap: 14px;
  padding: 12px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 4px;
  text-align: left;
}
.wood-products--featured .wood-product__media {
  margin-bottom: 0;
  aspect-ratio: 1 / 1;
  background: var(--wood-card-bg, var(--surface));
  border-radius: 3px;
  overflow: hidden;
}
.wood-products--featured .wood-product__labels { top: 6px; left: 6px; }
.wood-products--featured .wood-product__label {
  font-size: 9px;
  padding: 2px 5px;
  letter-spacing: .3px;
}

.wood-products--featured .wood-product__body {
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.wood-products--featured .wood-product__cat {
  font-size: 10px;
  letter-spacing: .8px;
  margin-bottom: 0;
  color: var(--muted);
}
.wood-products--featured .wood-product__name {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
  /* Single-line ellipsis so long Turkish names don't break the row. */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wood-products--featured .wood-product__name a {
  color: var(--primary);
}
.wood-products--featured .wood-product__rating {
  margin: 0;
  font-size: 12px;
  justify-content: flex-start;
}
.wood-products--featured .wood-product__reviews { display: none; }
.wood-products--featured .wood-product__price {
  margin: 0;
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: flex-start;
}
.wood-products--featured .wood-product__price--new { font-size: 14px; }
.wood-products--featured .wood-product__price--old { font-size: 13px; }

/* Hover pill (sepet/kalp/karşılaştır/göz) doesn't fit in a 110×110 thumb;
   hide it for this compact variant. */
.wood-products--featured .wood-product__hover { display: none; }

/* Image-swap on hover still works on the small thumb. */
.wood-products--featured .wood-product__img { transition: opacity .35s ease; }

@media (max-width: 480px) {
  .wood-products--featured .wood-product { grid-template-columns: 90px 1fr; gap: 10px; padding: 10px; }
  .wood-products--featured .wood-products__grid--4 { grid-template-columns: 1fr; }
}

/* =========================================================================
   MOBILE CENTERING — FINAL CASCADE OVERRIDES
   This block is intentionally last so it wins against earlier defaults
   that get redefined further down the stylesheet (e.g. footer title
   underline at line ~2486 overriding the centering rule at line ~1773).

   Goal: on phones (≤640px) every text-bearing section reads as a
   centered, balanced column instead of a left-floating block.
   ========================================================================= */

/* =============================================================================
   SHOP — toolbar / grid / pager / drawer (filter)
   ============================================================================= */

/* ---------------- toolbar ---------------- */
.wood-shop-toolbar {
  background: var(--wood-tb-bg, var(--surface, #f6efe6));
  border: 1px solid var(--border, #e5dccf);
  border-radius: 14px;
  margin-top: 28px;
  margin-bottom: 28px;
}
.wood-shop-toolbar > .wood-container { padding-top: 0; padding-bottom: 0; }
.wood-shop-toolbar__row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 18px;
  flex-wrap: wrap;
}
.wood-shop-toolbar__view {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 8px;
}
.wood-shop-toolbar__view-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: none;
  background: transparent;
  color: var(--muted, #8a7d6a);
  border-radius: 6px;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}
.wood-shop-toolbar__view-btn i { font-size: 18px; }
.wood-shop-toolbar__view-btn:hover { color: var(--primary, #2a2a2a); }
.wood-shop-toolbar__view-btn.is-active {
  background: var(--wood-tb-active, var(--accent, #b9442d));
  color: #fff;
}

.wood-shop-toolbar__center {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 auto;
  justify-content: center;
  flex-wrap: wrap;
}
.wood-shop-toolbar__select {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.wood-shop-toolbar__select select {
  appearance: none;
  -webkit-appearance: none;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 999px;
  padding: 9px 38px 9px 16px;
  font: inherit;
  font-size: 14px;
  color: var(--primary, #2a2a2a);
  cursor: pointer;
  min-width: 180px;
  transition: border-color .2s ease;
}
.wood-shop-toolbar__select select:hover { border-color: var(--border-strong, #cdbfa9); }
.wood-shop-toolbar__select select:focus { outline: none; border-color: var(--accent, #b9442d); }
.wood-shop-toolbar__select i {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 12px;
  color: var(--muted, #8a7d6a);
}

.wood-shop-toolbar__filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--accent, #b9442d);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 11px 22px;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .08em;
  cursor: pointer;
  transition: background .2s ease, transform .15s ease;
  box-shadow: none;
}
.wood-shop-toolbar__filter-btn i { font-size: 16px; }
.wood-shop-toolbar__filter-btn:hover { background: #9a3624; transform: translateY(-1px); }
.wood-shop-toolbar__filter-btn:active { transform: translateY(0); }

/* ---------------- shop section + grid ---------------- */
.wood-shop-section { padding-bottom: 64px; }
.wood-shop-section__bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 18px;
}
.wood-shop-section__count {
  margin: 0;
  color: var(--muted, #8a7d6a);
  font-size: 13.5px;
}
.wood-shop-section__count strong {
  color: var(--primary, #2a2a2a);
  font-weight: 600;
}

.wood-shop-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
  align-items: stretch;
}

/* ----- Grid view: hide list-only elements (desc + CTA row) ---------- */
.wood-product__desc,
.wood-product__cta { display: none; }

/* ----- Ürün kartı stili: "çerçeveli" (theme-editor → wood_card_style) ---
   body.wood-cards-bordered: kartın etrafına ince çizgi, görsel contain +
   iç boşlukla küçültülmüş. Liste görünümü kendi (daha spesifik) kuralını korur. */
.wood-cards-bordered .wood-product {
  background: #fff;
  border: 1px solid var(--border, #ebebeb);
  border-radius: 12px;
  padding: 12px 12px 16px;
  transition: box-shadow .25s ease, border-color .2s ease;
}
.wood-cards-bordered .wood-product:hover { border-color: var(--border-strong, #dadada); }
.wood-cards-bordered .wood-product__media {
  border-radius: 8px;
  background: var(--wood-card-bg, #fff);
  margin-bottom: 12px;
}
.wood-cards-bordered .wood-product__img {
  object-fit: contain;
  padding: 8%;
  box-sizing: border-box;
}
.wood-cards-bordered .wood-product__body { padding: 0 2px; }
.wood-cards-bordered .wood-product__labels { top: 8px; left: 8px; }
/* Ürün detay galerisi de aynı dille: çerçeve + küçültülmüş (contain) kapak görseli */
.wood-cards-bordered .wood-pgallery__main {
  background: var(--wood-card-bg, #fff);
  border: 1px solid var(--border, #ebebeb);
}
.wood-cards-bordered .wood-pgallery__img {
  object-fit: contain;
  padding: 8%;
  box-sizing: border-box;
}
.wood-cards-bordered .wood-pgallery__thumb { background: #fff; border-color: var(--border, #ebebeb); }
.wood-cards-bordered .wood-pgallery__thumb:hover { border-color: var(--border-strong, #dadada); }
.wood-cards-bordered .wood-pgallery__thumb.is-active { border-color: var(--accent, #b9442d); }
.wood-cards-bordered .wood-pgallery__thumb img { object-fit: contain; padding: 6%; box-sizing: border-box; }

/* ----- List view: horizontal card with description + CTAs ----------- */
.wood-shop-grid.is-list { grid-template-columns: 1fr; gap: 18px; }
.wood-shop-grid.is-list .wood-product {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 32px;
  align-items: stretch;
  padding: 18px;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 16px;
  text-align: left;
  transition: box-shadow .25s ease, border-color .2s ease;
}
.wood-shop-grid.is-list .wood-product:hover {
  box-shadow: 0 14px 32px rgba(20, 16, 12, .08);
  border-color: var(--border-strong, #cdbfa9);
}
.wood-shop-grid.is-list .wood-product__media {
  aspect-ratio: 1 / 1;
  border-radius: 12px;
  overflow: hidden;
  background: var(--wood-card-bg, var(--surface, #f6efe6));
}
/* Body column: tüm liste-görünümü öğeleri (kategori, başlık, puan, fiyat,
   açıklama, CTA) yatayda ORTALANIR — Safira'daki editorial his.  Auto
   margin ile CTA blok altta, içeriğin ortasında durur.  Mobile blok zaten
   center, burada desktop için de aynı davranışı tek yerden veriyoruz. */
.wood-shop-grid.is-list .wood-product__body {
  padding: 6px 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  align-items: center;
  text-align: center;
  width: 100%;
  min-width: 0;
}
.wood-shop-grid.is-list .wood-product__cat {
  align-self: center;
  font-size: 12px;
}
.wood-shop-grid.is-list .wood-product__name {
  font-size: 20px;
  margin: 2px 0 0;
}
.wood-shop-grid.is-list .wood-product__rating {
  margin: 0;
  justify-content: center;
}

/* Açıklama gövdesi merkez hizalı, üst sınıra kadar uzanır, 3 satırda
   clamp.  max-width ile çok uzun satırlar daraltılır → okunaklı kalır. */
.wood-shop-grid.is-list .wood-product__desc {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 6px auto 4px;
  color: var(--muted, #8a7d6a);
  font-size: 14px;
  line-height: 1.65;
  width: 100%;
  max-width: 640px;
  text-align: center;
}
.wood-shop-grid.is-list .wood-product__price {
  margin: 4px 0;
  font-size: 18px;
  justify-content: center;
}
.wood-shop-grid.is-list .wood-product__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.wood-shop-grid.is-list .wood-product__cta-main {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--accent, #b9442d);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 11px 22px;
  font-weight: 600;
  font-size: 13.5px;
  letter-spacing: .04em;
  cursor: pointer;
  transition: background .2s ease, transform .15s ease;
}
.wood-shop-grid.is-list .wood-product__cta-main:hover { background: #9a3624; transform: translateY(-1px); }
.wood-shop-grid.is-list .wood-product__cta-main i { font-size: 16px; }
.wood-shop-grid.is-list .wood-product__cta-icon {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--primary, #2a2a2a);
  border: 1px solid var(--border, #e5dccf);
  border-radius: 50%;
  cursor: pointer;
  transition: border-color .2s ease, color .2s ease, background .2s ease;
}
.wood-shop-grid.is-list .wood-product__cta-icon:hover {
  border-color: var(--accent, #b9442d);
  color: var(--accent, #b9442d);
}
.wood-shop-grid.is-list .wood-product__cta-icon i { font-size: 16px; }

/* In list view, hide the floating hover-action pill (we use inline CTAs) */
.wood-shop-grid.is-list .wood-product__hover { display: none; }

/* Pager — reuse blog pager styles, just spacing */
.wood-shop-pager { margin-top: 36px; }

/* ---------------- drawer (filter) ---------------- */
.wood-shop-drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(20, 16, 12, .55);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
  z-index: 1000;
  backdrop-filter: blur(2px);
}
.wood-shop-drawer-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

.wood-shop-drawer {
  position: fixed;
  inset: 0 auto 0 0;
  width: min(420px, 92vw);
  background: #fff;
  z-index: 1001;
  display: flex;
  flex-direction: column;
  box-shadow: 8px 0 32px rgba(20, 16, 12, .18);
  transform: translateX(-100%);
  transition: transform .35s cubic-bezier(.32,.72,.32,1);
  visibility: hidden;
}
.wood-shop-drawer.is-open {
  transform: translateX(0);
  visibility: visible;
}

.wood-shop-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border, #e5dccf);
  flex: 0 0 auto;
}
.wood-shop-drawer__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 600;
  color: var(--primary, #2a2a2a);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.wood-shop-drawer__close {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--primary, #2a2a2a);
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
  transition: background .2s ease;
}
.wood-shop-drawer__close:hover { background: #000; }

.wood-shop-drawer__body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 8px 24px 24px;
}
.wood-shop-drawer__foot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 24px;
  border-top: 1px solid var(--border, #e5dccf);
  background: var(--surface, #f6efe6);
  flex: 0 0 auto;
}
.wood-shop-drawer__foot .wood-btn { flex: 1 1 auto; justify-content: center; }
.wood-btn--ghost {
  background: transparent;
  color: var(--primary, #2a2a2a);
  border: 1px solid var(--border-strong, #cdbfa9);
}
.wood-btn--ghost:hover { background: #fff; border-color: var(--primary, #2a2a2a); }

/* body scroll lock when drawer is open */
body.wood-shop-drawer-open { overflow: hidden; }

/* ---------------- filter accordion ---------------- */
.wood-shop-filter {
  padding: 18px 0;
  border-bottom: 1px solid #f0e8db;
}
.wood-shop-filter:last-child { border-bottom: none; }
.wood-shop-filter__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  list-style: none;
  user-select: none;
  padding-bottom: 6px;
}
.wood-shop-filter__head::-webkit-details-marker { display: none; }
.wood-shop-filter__title {
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 17px;
  color: var(--primary, #2a2a2a);
  letter-spacing: .01em;
}
.wood-shop-filter__caret {
  font-size: 14px;
  color: var(--muted, #8a7d6a);
  transition: transform .25s ease;
}
.wood-shop-filter[open] .wood-shop-filter__caret { transform: rotate(180deg); }
.wood-shop-filter__rule {
  display: block;
  width: 56px;
  height: 2px;
  background: var(--accent, #b9442d);
  margin: 4px 0 14px;
  border-radius: 2px;
}

.wood-shop-filter__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.wood-shop-check {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 14.5px;
  color: var(--primary, #2a2a2a);
  line-height: 1.4;
}
.wood-shop-check input { position: absolute; opacity: 0; pointer-events: none; }
.wood-shop-check__box {
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--border-strong, #cdbfa9);
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  transition: border-color .2s ease, background .2s ease;
  background: #fff;
}
.wood-shop-check__box::after {
  content: '';
  width: 10px;
  height: 10px;
  background: var(--accent, #b9442d);
  border-radius: 1px;
  transform: scale(0);
  transition: transform .15s ease;
}
.wood-shop-check input:checked + .wood-shop-check__box {
  border-color: var(--accent, #b9442d);
}
.wood-shop-check input:checked + .wood-shop-check__box::after { transform: scale(1); }
.wood-shop-check__text em {
  font-style: normal;
  color: var(--muted, #8a7d6a);
  margin-left: 4px;
}
.wood-shop-check:hover .wood-shop-check__text { color: var(--accent, #b9442d); }

/* ---------------- price range (visual only) ---------------- */
.wood-shop-filter__price-label {
  margin: 4px 0 14px;
  font-size: 14px;
  color: var(--muted, #8a7d6a);
}
.wood-shop-filter__price-label strong {
  color: var(--primary, #2a2a2a);
  font-weight: 600;
}
.wood-price-fields {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}
.wood-price-input {
  width: 100%;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--border, #e3ddd2);
  border-radius: 8px;
  font-size: 13px;
  color: var(--primary, #2a2a2a);
  background: #fff;
  -moz-appearance: textfield;
}
.wood-price-input::-webkit-outer-spin-button,
.wood-price-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.wood-price-input:focus {
  outline: none;
  border-color: var(--primary, #2a2a2a);
}
.wood-price-sep { color: var(--muted, #8a7d6a); }
.wood-price-apply {
  flex-shrink: 0;
  padding: 8px 14px;
  border: none;
  border-radius: 8px;
  background: var(--wood-btn-bg, var(--primary, #2a2a2a));
  color: var(--wood-btn-text, #fff);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: opacity .15s ease;
}
.wood-price-apply:hover { opacity: .88; }
.wood-shop-filter__range {
  position: relative;
  height: 22px;
  margin: 4px 4px 8px;
}
.wood-shop-filter__range-track,
.wood-shop-filter__range-fill {
  position: absolute;
  top: 50%;
  height: 4px;
  border-radius: 4px;
  transform: translateY(-50%);
}
.wood-shop-filter__range-track {
  left: 0; right: 0;
  background: var(--border, #e5dccf);
}
.wood-shop-filter__range-fill {
  left: 14%;
  right: 18%;
  background: var(--accent, #b9442d);
}
.wood-shop-filter__range-thumb {
  position: absolute;
  top: 50%;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid var(--accent, #b9442d);
  transform: translate(-50%, -50%);
  box-shadow: 0 2px 6px rgba(20, 16, 12, .15);
}
.wood-shop-filter__range-thumb--min { left: 14%; }
.wood-shop-filter__range-thumb--max { left: 82%; }

/* ---------------- swatches ---------------- */
.wood-shop-filter__swatches {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.wood-shop-swatch {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--swatch, #ddd);
  border: 2px solid #fff;
  outline: 1px solid var(--border, #e5dccf);
  cursor: pointer;
  padding: 0;
  transition: transform .15s ease, outline-color .2s ease;
}
.wood-shop-swatch:hover { transform: scale(1.1); }
.wood-shop-swatch.is-active,
.wood-shop-swatch:focus-visible {
  outline-color: var(--accent, #b9442d);
  outline-width: 2px;
}

/* ---------------- size chips ---------------- */
.wood-shop-filter__chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.wood-shop-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--primary, #2a2a2a);
  background: #fff;
  border: 1px solid var(--border-strong, #cdbfa9);
  border-radius: 4px;
  cursor: pointer;
  transition: border-color .2s ease, color .2s ease, background .2s ease;
}
.wood-shop-chip:hover {
  border-color: var(--accent, #b9442d);
  color: var(--accent, #b9442d);
}
.wood-shop-chip.is-active {
  border-color: var(--accent, #b9442d);
  background: var(--accent, #b9442d);
  color: #fff;
}

/* ---------------- responsive (tablet) ---------------- */
@media (max-width: 1199px) {
  .wood-shop-grid { grid-template-columns: repeat(3, 1fr); }
  .wood-shop-toolbar__select select { min-width: 160px; }
}
@media (max-width: 991px) {
  .wood-shop-grid { grid-template-columns: repeat(2, 1fr); }
  .wood-shop-toolbar__row { padding: 12px 14px; }
  .wood-shop-toolbar__center { gap: 8px; }
  .wood-shop-toolbar__select select { min-width: 140px; padding: 8px 32px 8px 12px; }
}

/* =============================================================================
   SHOP — aktif filtre şeridi (chip + temizleme)
   ============================================================================= */
.wood-shop-active {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 14px;
  padding: 14px 18px;
  margin-bottom: 18px;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-left: 3px solid var(--accent, #b9442d);
  border-radius: 10px;
}
.wood-shop-active__label {
  font-weight: 600;
  font-size: 13px;
  color: var(--primary, #2a2a2a);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-right: 4px;
}
.wood-shop-active__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1 1 auto;
}
.wood-shop-active__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 6px 6px 12px;
  background: var(--surface, #f6efe6);
  border: 1px solid var(--border, #e5dccf);
  border-radius: 999px;
  font-size: 13px;
  color: var(--primary, #2a2a2a);
  transition: border-color .2s ease, background .2s ease;
}
.wood-shop-active__chip:hover {
  border-color: var(--border-strong, #cdbfa9);
  background: #fff;
}
.wood-shop-active__key {
  color: var(--muted, #8a7d6a);
  font-weight: 500;
}
.wood-shop-active__val {
  font-weight: 600;
}
.wood-shop-active__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  background: var(--accent, #b9442d);
  color: #fff;
  border-radius: 50%;
  text-decoration: none;
  font-size: 11px;
  transition: background .2s ease, transform .15s ease;
}
.wood-shop-active__remove:hover {
  background: #9a3624;
  transform: rotate(90deg);
}
.wood-shop-active__clear {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  padding: 8px 14px;
  background: transparent;
  color: var(--accent, #b9442d);
  border: 1px solid var(--accent, #b9442d);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s ease, color .2s ease;
}
.wood-shop-active__clear:hover {
  background: var(--accent, #b9442d);
  color: #fff;
}
.wood-shop-active__clear i { font-size: 13px; }

/* =============================================================================
   ÜRÜN DETAY — galeri / bilgi paneli / countdown / tabs / related
   ============================================================================= */

.wood-product-page { padding-bottom: 64px; }

/* slim band variant — text only, no image. Diğer sayfalardaki band ile aynı
   bilgi-veren ritmi tutar: pre-title, h1, info paragrafı, breadcrumb. */
.wood-page-hero--text .wood-page-hero__card {
  display: block;
  text-align: center;
  padding: 18px 0;
}
.wood-page-hero--text .wood-page-hero__text {
  align-items: center;
  text-align: center;
  margin: 0 auto;
  max-width: 760px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wood-page-hero--text .wood-page-hero__pre { font-size: 11px; margin: 0; }
.wood-page-hero--text .wood-page-hero__title {
  font-size: clamp(22px, 2.4vw, 30px);
  margin: 2px 0 4px;
}
.wood-page-hero--text .wood-page-hero__lede {
  font-size: 14px;
  line-height: 1.65;
  color: var(--muted, #8a7d6a);
  margin: 0;
  max-width: 620px;
}
.wood-page-hero--text .wood-page-hero__crumbs {
  justify-content: center;
  margin-top: 10px;
}

/* ---------- main detail grid ---------- */
.wood-product-detail { padding: 36px 0 24px; }
.wood-product-detail__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: 48px;
  align-items: start;
}

/* ---------- gallery (left) ---------- */
.wood-pgallery { position: relative; }
.wood-pgallery__main {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 16px;
  background: var(--wood-card-bg, var(--surface, #f6efe6));
  margin: 0;
}
.wood-pgallery__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  cursor: zoom-in;
  transition: transform .35s ease;
}
.wood-pgallery__main:hover .wood-pgallery__img { transform: scale(1.04); }

.wood-pgallery__label {
  position: absolute;
  top: 14px;
  left: 14px;
  background: var(--accent, #b9442d);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  padding: 5px 10px;
  border-radius: 4px;
  z-index: 2;
}

.wood-pgallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: rgba(255, 255, 255, .9);
  color: var(--primary, #2a2a2a);
  border-radius: 50%;
  cursor: pointer;
  font-size: 18px;
  opacity: 0;
  transition: opacity .2s ease, background .2s ease;
  z-index: 2;
  box-shadow: 0 4px 10px rgba(20, 16, 12, .12);
}
.wood-pgallery__main:hover .wood-pgallery__nav { opacity: 1; }
.wood-pgallery__nav:hover { background: #fff; }
.wood-pgallery__nav--prev { left: 14px; }
.wood-pgallery__nav--next { right: 14px; }

.wood-pgallery__zoom {
  position: absolute;
  bottom: 14px;
  right: 14px;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, .92);
  color: var(--primary, #2a2a2a);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 16px;
  z-index: 2;
  transition: background .2s ease;
  box-shadow: 0 4px 10px rgba(20, 16, 12, .12);
}
.wood-pgallery__zoom:hover { background: #fff; }

.wood-pgallery__thumbs {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.wood-pgallery__thumb {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  border: 2px solid transparent;
  background: var(--wood-card-bg, var(--surface, #f6efe6));
  border-radius: 10px;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  transition: border-color .2s ease;
}
.wood-pgallery__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}
.wood-pgallery__thumb:hover { border-color: var(--border-strong, #cdbfa9); }
.wood-pgallery__thumb.is-active { border-color: var(--accent, #b9442d); }

/* ---------- info (right) ---------- */
.wood-pinfo { min-width: 0; }

.wood-pinfo__head { padding-bottom: 18px; border-bottom: 1px solid var(--border, #e5dccf); margin-bottom: 18px; }
.wood-pinfo__title {
  font-family: var(--font-heading);
  font-size: clamp(24px, 2.6vw, 32px);
  line-height: 1.2;
  margin: 0 0 16px;
  color: var(--primary, #2a2a2a);
}
.wood-pinfo__meta {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wood-pinfo__meta-row {
  display: grid;
  grid-template-columns: 116px 1fr;
  gap: 12px;
  align-items: baseline;
  font-size: 14px;
  color: var(--primary, #2a2a2a);
  margin: 0;
}
.wood-pinfo__meta-row dt { font-weight: 600; color: var(--primary, #2a2a2a); }
.wood-pinfo__meta-row dd { margin: 0; color: var(--muted, #8a7d6a); }
.wood-pinfo__meta-row dd p { margin: 0; display: inline; }
.wood-pinfo__meta-row dd a { color: var(--accent, #b9442d); text-decoration: none; }
.wood-pinfo__meta-row dd a:hover { text-decoration: underline; }
.wood-pinfo__meta-row dd.is-instock { color: #2f7a3a; font-weight: 600; }
.wood-pinfo__meta-row dd.is-outstock { color: #b9442d; font-weight: 600; }

.wood-pinfo__rating {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  font-size: 13.5px;
  color: var(--muted, #8a7d6a);
}
.wood-pinfo__review-link { color: var(--muted, #8a7d6a); text-decoration: none; transition: color .2s ease; }
.wood-pinfo__review-link:hover { color: var(--accent, #b9442d); }
.wood-pinfo__review-link--add { font-weight: 600; }
.wood-pinfo__review-sep { color: var(--border-strong, #cdbfa9); }

.wood-pinfo__price {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin: 4px 0 18px;
}
.wood-pinfo__price-new {
  font-family: var(--font-heading);
  font-size: 30px;
  font-weight: 700;
  color: var(--accent, #b9442d);
}
.wood-pinfo__price-old {
  font-size: 18px;
  color: var(--muted, #8a7d6a);
  text-decoration: line-through;
}

.wood-pinfo__short {
  margin: 0 0 22px;
  color: var(--muted, #8a7d6a);
  font-size: 14.5px;
  line-height: 1.7;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--border, #e5dccf);
}

/* qty + cart */
.wood-pinfo__buy {
  display: flex;
  align-items: stretch;
  gap: 12px;
  margin-bottom: 14px;
}
.wood-pinfo__qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 4px;
  background: #fff;
  overflow: hidden;
  flex: 0 0 auto;
}
.wood-pinfo__qty-btn {
  width: 44px;
  height: 52px;
  border: none;
  background: transparent;
  color: var(--primary, #2a2a2a);
  cursor: pointer;
  font-size: 16px;
  transition: background .2s ease, color .2s ease;
}
.wood-pinfo__qty-btn:hover { background: var(--surface, #f6efe6); color: var(--accent, #b9442d); }
.wood-pinfo__qty-input {
  width: 50px;
  height: 52px;
  border: none;
  background: transparent;
  text-align: center;
  font: inherit;
  font-weight: 600;
  font-size: 15px;
  color: var(--primary, #2a2a2a);
  -moz-appearance: textfield;
}
.wood-pinfo__qty-input::-webkit-outer-spin-button,
.wood-pinfo__qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.wood-pinfo__cart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: 1 1 auto;
  background: var(--wood-btn-bg, var(--accent, #b9442d));
  color: var(--wood-btn-text, #fff);
  border: none;
  border-radius: 4px;
  padding: 0 28px;
  height: 52px;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s ease, filter .2s ease;
  box-shadow: none;
}
.wood-pinfo__cart i { font-size: 18px; }
.wood-pinfo__cart:hover { background: var(--wood-btn-bg, var(--accent, #b9442d)); filter: brightness(1.18); box-shadow: none; }
.wood-pinfo__cart--ghost {
  background: transparent;
  color: var(--accent, #b9442d);
  border: 1px solid var(--accent, #b9442d);
  box-shadow: none;
  height: 44px;
  padding: 0 22px;
  font-size: 12.5px;
  letter-spacing: .06em;
}
.wood-pinfo__cart--ghost:hover { background: var(--accent, #b9442d); color: #fff; transform: none; }

.wood-pinfo__sub-actions {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-bottom: 22px;
}
.wood-pinfo__sub-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--muted, #8a7d6a);
  font-size: 13.5px;
  transition: color .2s ease;
}
.wood-pinfo__sub-btn i { font-size: 18px; }
.wood-pinfo__sub-btn:hover { color: var(--accent, #b9442d); }

/* ---------- countdown deal box ---------- */
.wood-pinfo__deal {
  background: var(--wood-cd-bg, var(--surface, #f6efe6));
  border-radius: 12px;
  padding: 18px 20px;
  margin: 4px 0 22px;
  border: 1px solid var(--border, #e5dccf);
}
.wood-pinfo__deal-title {
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-align: center;
  color: var(--primary, #2a2a2a);
  text-transform: uppercase;
}
.wood-pinfo__deal-clock {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.wood-pinfo__deal-clock li {
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 8px;
  padding: 12px 4px 8px;
  text-align: center;
}
.wood-pinfo__deal-clock strong {
  display: block;
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--wood-cd-accent, var(--primary, #2a2a2a));
}
.wood-pinfo__deal-clock em {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  font-style: normal;
  letter-spacing: .08em;
  color: var(--muted, #8a7d6a);
  text-transform: uppercase;
}

.wood-pinfo__deal-stock-meta {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--muted, #8a7d6a);
  margin-bottom: 6px;
}
.wood-pinfo__deal-stock-meta strong { color: var(--primary, #2a2a2a); font-weight: 700; }
.wood-pinfo__deal-stock-bar {
  height: 4px;
  background: var(--border, #e5dccf);
  border-radius: 2px;
  overflow: hidden;
}
.wood-pinfo__deal-stock-bar > span {
  display: block;
  height: 100%;
  background: var(--wood-cd-accent, var(--accent, #b9442d));
  transition: width .35s ease;
}

/* tags */
.wood-pinfo__tags { font-size: 13.5px; color: var(--muted, #8a7d6a); margin: 0 0 18px; }
.wood-pinfo__tags strong { color: var(--primary, #2a2a2a); font-weight: 600; margin-right: 6px; }
.wood-pinfo__tags a { color: var(--accent, #b9442d); text-decoration: none; margin-right: 4px; }
.wood-pinfo__tags a:hover { text-decoration: underline; }

/* USPs */
.wood-pinfo__usps {
  list-style: none;
  margin: 0 0 18px;
  padding: 18px 0;
  border-top: 1px solid var(--border, #e5dccf);
  border-bottom: 1px solid var(--border, #e5dccf);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.wood-pinfo__usps li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12.5px;
  color: var(--muted, #8a7d6a);
  line-height: 1.4;
}
.wood-pinfo__usps li i {
  font-size: 28px;
  color: var(--accent, #b9442d);
  flex: none;
}
.wood-pinfo__usps li strong {
  display: block;
  color: var(--primary, #2a2a2a);
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 2px;
}

/* share */
.wood-pinfo__share { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.wood-pinfo__share-label { font-weight: 600; font-size: 13.5px; color: var(--primary, #2a2a2a); }
.wood-pinfo__share-btn {
  width: 32px; height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface, #f6efe6);
  color: var(--primary, #2a2a2a);
  border-radius: 4px;
  text-decoration: none;
  font-size: 14px;
  transition: background .2s ease, color .2s ease, transform .15s ease;
}
.wood-pinfo__share-btn:hover { background: var(--accent, #b9442d); color: #fff; transform: translateY(-2px); }

/* ---------- TABS ---------- */
.wood-ptabs { padding: 48px 0 24px; }
.wood-ptabs__nav {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 28px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border, #e5dccf);
}
/* Global .wood-tab pill stilini sıfırla — bu sayfada ince, satır altı çizgili
   editöryal sekmeler kullanıyoruz (border/border-radius/bg dahil hepsi reset). */
.wood-ptabs__nav .wood-tab {
  position: relative;
  padding: 14px 2px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted, #8a7d6a) !important;
  cursor: pointer;
  transition: color .2s ease;
  list-style: none;
}
.wood-ptabs__nav .wood-tab:hover {
  color: var(--primary, #2a2a2a) !important;
  background: transparent !important;
  border-color: transparent !important;
}
.wood-ptabs__nav .wood-tab.is-active {
  color: var(--accent, #b9442d) !important;
  background: transparent !important;
  border-color: transparent !important;
}
.wood-ptabs__nav .wood-tab.is-active::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--accent, #b9442d);
}

.wood-ptabs__pane {
  display: none;
  padding: 28px 32px;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 14px;
  color: var(--primary, #2a2a2a);
  line-height: 1.75;
  font-size: 14.5px;
}
.wood-ptabs__pane.is-active { display: block; }
.wood-ptabs__pane p { margin: 0 0 14px; color: var(--muted, #8a7d6a); }
.wood-ptabs__pane h3 { font-family: var(--font-heading); font-size: 18px; margin: 18px 0 10px; }
.wood-ptabs__pane ul { padding-left: 18px; margin: 0 0 14px; color: var(--muted, #8a7d6a); }
.wood-ptabs__pane ul li { margin-bottom: 6px; }
.wood-ptabs__lead { color: var(--primary, #2a2a2a) !important; font-size: 15px; }

.wood-ptabs__gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin: 22px 0;
}
.wood-ptabs__gallery figure {
  margin: 0;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
  overflow: hidden;
  background: var(--wood-card-bg, var(--surface, #f6efe6));
}
.wood-ptabs__gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.wood-ptabs__gallery figure:hover img { transform: scale(1.06); }

.wood-ptabs__features {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.wood-ptabs__features li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  background: var(--surface, #f6efe6);
  border-radius: 10px;
}
.wood-ptabs__features i {
  font-size: 22px;
  color: var(--accent, #b9442d);
  flex: none;
  margin-top: 2px;
}
.wood-ptabs__features li strong {
  display: block;
  color: var(--primary, #2a2a2a);
  font-weight: 700;
  margin-bottom: 2px;
  font-size: 14px;
}
.wood-ptabs__features li span { font-size: 13px; color: var(--muted, #8a7d6a); line-height: 1.5; }

.wood-ptabs__specs {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.wood-ptabs__specs th,
.wood-ptabs__specs td {
  padding: 12px 14px;
  text-align: left;
  border-bottom: 1px solid var(--border, #e5dccf);
}
.wood-ptabs__specs th {
  width: 38%;
  background: var(--surface, #f6efe6);
  font-weight: 600;
  color: var(--primary, #2a2a2a);
}
.wood-ptabs__specs td { color: var(--muted, #8a7d6a); }
.wood-ptabs__specs tr:last-child th,
.wood-ptabs__specs tr:last-child td { border-bottom: none; }

/* reviews — summary kartı: solda büyük puan + yıldız+meta, sağda CTA buton */
.wood-ptabs__reviews-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 24px;
  background: var(--surface, #f6efe6);
  border-radius: 12px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.wood-ptabs__reviews-summary {
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
}
.wood-ptabs__reviews-summary-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.wood-ptabs__reviews-score {
  font-family: var(--font-heading);
  font-size: 38px;
  font-weight: 700;
  color: var(--primary, #2a2a2a);
  margin: 0;
  line-height: 1;
  display: inline-flex;
  align-items: baseline;
}
.wood-ptabs__reviews-score small {
  font-size: 16px;
  font-weight: 500;
  color: var(--muted, #8a7d6a);
  margin-left: 6px;
}
.wood-ptabs__reviews-meta { font-size: 13px; color: var(--muted, #8a7d6a); margin: 0; }
/* Yorum yaz formu — toggle ile açılır.  Reviews-head ile aynı paspas
   stili paylaşır (warm surface, 12px radius). */
.wood-ptabs__review-form {
  background: var(--surface, #f6efe6);
  border-radius: 12px;
  padding: 22px 24px;
  margin-bottom: 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.wood-ptabs__review-form[hidden] { display: none; }
.wood-ptabs__review-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.wood-ptabs__review-field { display: flex; flex-direction: column; gap: 6px; }
.wood-ptabs__review-label  { font-size: 13px; font-weight: 600; color: var(--primary, #2a2a2a); }
.wood-ptabs__review-label em { color: #d9534f; font-style: normal; font-weight: 700; margin-left: 2px; }
.wood-ptabs__review-input {
  font: inherit;
  padding: 10px 12px;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 8px;
  background: #fff;
  color: var(--primary, #2a2a2a);
  transition: border-color .15s, box-shadow .15s;
}
.wood-ptabs__review-input:focus {
  outline: none;
  border-color: var(--accent, #c79373);
  box-shadow: 0 0 0 3px rgba(199, 147, 115, 0.18);
}
.wood-ptabs__review-textarea { min-height: 110px; resize: vertical; }
.wood-ptabs__review-rating { border: 0; padding: 0; margin: 0; }
.wood-ptabs__review-stars {
  display: inline-flex;
  flex-direction: row-reverse;
  gap: 4px;
  margin-top: 6px;
}
.wood-ptabs__review-stars input { position: absolute; opacity: 0; pointer-events: none; }
.wood-ptabs__review-stars label {
  font-size: 24px;
  color: #d4cab9;
  cursor: pointer;
  transition: color .15s;
}
.wood-ptabs__review-stars label:hover,
.wood-ptabs__review-stars label:hover ~ label,
.wood-ptabs__review-stars input:checked ~ label {
  color: #f5a623;
}
@media (max-width: 600px) {
  .wood-ptabs__review-form-grid { grid-template-columns: 1fr; }
}

.wood-ptabs__reviews-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 22px; }
.wood-ptabs__review { padding-bottom: 18px; border-bottom: 1px dashed var(--border, #e5dccf); }
.wood-ptabs__review:last-child { border-bottom: none; }
.wood-ptabs__review header { display: flex; align-items: center; gap: 14px; margin-bottom: 8px; flex-wrap: wrap; }
.wood-ptabs__review header strong { color: var(--primary, #2a2a2a); font-weight: 700; }
.wood-ptabs__review header time { font-size: 12.5px; color: var(--muted, #8a7d6a); }
.wood-ptabs__review p { margin: 0 !important; color: var(--muted, #8a7d6a); line-height: 1.65; }
.wood-ptabs__review p + p { margin-top: 4px !important; }
.wood-ptabs__review-imgs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.wood-ptabs__review-imgs img { width: 72px; height: 72px; object-fit: cover; border-radius: 4px; border: 1px solid var(--border, #e5dccf); display: block; }
.wood-ptabs__reviews-empty { margin: 8px 0 0; padding: 18px 0; color: var(--muted, #8a7d6a); border-top: 1px dashed var(--border, #e5dccf); }

/* ---------- RELATED carousels ---------- */
.wood-prelated { padding: 48px 0 0; }
.wood-prelated__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  gap: 12px;
}
.wood-prelated__title {
  font-family: var(--font-heading);
  font-size: clamp(20px, 2.2vw, 26px);
  font-weight: 600;
  margin: 0;
  color: var(--primary, #2a2a2a);
  position: relative;
  padding-bottom: 10px;
}
.wood-prelated__title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 56px;
  height: 2px;
  background: var(--accent, #b9442d);
  border-radius: 2px;
}
.wood-prelated__nav { display: inline-flex; gap: 8px; }
.wood-prelated__nav-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  color: var(--primary, #2a2a2a);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}
.wood-prelated__nav-btn:hover {
  background: var(--accent, #b9442d);
  border-color: var(--accent, #b9442d);
  color: #fff;
}

.wood-prelated__rail {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 5 * 22px) / 6);
  gap: 22px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 8px;
  /* Yatay scrollbar gizli — gezinme ok butonları ve kaydırma ile */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.wood-prelated__rail::-webkit-scrollbar { display: none; width: 0; height: 0; }
.wood-prelated__slide { scroll-snap-align: start; }

/* ---------- responsive ---------- */
@media (max-width: 1199px) {
  .wood-product-detail__grid { gap: 36px; }
  .wood-prelated__rail { grid-auto-columns: calc((100% - 3 * 22px) / 4); }
  .wood-ptabs__features { grid-template-columns: 1fr; }
}
@media (max-width: 991px) {
  .wood-product-detail__grid { grid-template-columns: 1fr; gap: 32px; }
  .wood-pinfo__usps { grid-template-columns: 1fr; gap: 14px; }
  .wood-prelated__rail { grid-auto-columns: calc((100% - 2 * 22px) / 3); }
  .wood-ptabs__gallery { grid-template-columns: repeat(2, 1fr); }
  .wood-ptabs__pane { padding: 22px 20px; }
  .wood-ptabs__nav { gap: 18px; }
}

/* =============================================================================
   KATEGORİ — sol sabit filtre sidebar + dikey banner + sağ içerik
   ============================================================================= */

.wood-category__main { padding-bottom: 64px; }
.wood-category__layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 32px;
  align-items: start;
  margin-top: 28px;
}

/* ---- sidebar ---- */
.wood-category__sidebar {
  position: sticky;
  top: 20px;
  align-self: start;
}
.wood-cat-side__head {
  padding: 0 0 16px;
  border-bottom: 1px solid var(--border, #e5dccf);
  margin-bottom: 8px;
}
.wood-cat-side__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 600;
  color: var(--primary, #2a2a2a);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.wood-cat-side__filters > .wood-shop-filter:first-child { padding-top: 14px; }
/* Aktif kategori vurgusu */
.wood-shop-check.is-active .wood-shop-check__box {
  border-color: var(--accent, #b9442d);
}
.wood-shop-check.is-active .wood-shop-check__box::after { transform: scale(1); }
.wood-shop-check.is-active .wood-shop-check__text {
  color: var(--accent, #b9442d);
  font-weight: 600;
}
.wood-shop-check__text {
  text-decoration: none;
}
a.wood-shop-check__text { color: inherit; }
a.wood-shop-check__text:hover { color: var(--accent, #b9442d); }

/* ---- dikey promo banner ---- */
.wood-cat-promo {
  margin-top: 28px;
}
.wood-cat-promo__inner {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  background-size: cover;
  background-position: center center;
  aspect-ratio: 4 / 5;
  display: flex;
  align-items: flex-end;
  isolation: isolate;
}
.wood-cat-promo__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20, 16, 12, .15) 0%, rgba(20, 16, 12, .55) 50%, rgba(20, 16, 12, .82) 100%);
  z-index: 1;
}
.wood-cat-promo__body {
  position: relative;
  z-index: 2;
  padding: 22px 22px 24px;
  color: #fff;
  width: 100%;
}
.wood-cat-promo__pre {
  display: block;
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .8);
  margin-bottom: 8px;
}
.wood-cat-promo__title {
  font-family: var(--font-heading);
  font-size: 28px;
  line-height: 1.05;
  font-weight: 600;
  margin: 0 0 10px;
  text-transform: uppercase;
  letter-spacing: .01em;
}
.wood-cat-promo__lede {
  margin: 0 0 16px;
  font-size: 13.5px;
  line-height: 1.55;
  color: rgba(255, 255, 255, .9);
  max-width: 16ch;
}
.wood-cat-promo__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  background: var(--accent, #b9442d);
  color: #fff;
  border-radius: 50%;
  font-size: 18px;
  text-decoration: none;
  transition: background .2s ease, transform .15s ease;
  box-shadow: 0 6px 14px rgba(0, 0, 0, .25);
}
.wood-cat-promo__cta:hover { background: #9a3624; transform: translateX(2px); }

/* ---- sağ içerik ---- */
.wood-category__content { min-width: 0; }
.wood-cat-toolbar { margin-top: 0; margin-bottom: 22px; }
.wood-cat-toolbar__filter-mobile {
  display: none;
  align-items: center;
  gap: 8px;
  background: var(--accent, #b9442d);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 9px 16px;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
}
.wood-cat-toolbar__filter-mobile i { font-size: 14px; }

.wood-cat-grid {
  grid-template-columns: repeat(4, 1fr);
}

/* ---- mobile drawer behaviour for the sidebar ---- */
@media (max-width: 1199px) {
  .wood-category__layout { grid-template-columns: 240px 1fr; gap: 24px; }
  .wood-cat-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 991px) {
  /* Sidebar becomes a slide-in drawer triggered by toolbar's FİLTRELE button. */
  .wood-category__layout {
    display: block;
  }
  .wood-category__sidebar {
    position: fixed;
    top: 0;
    left: 0;
    right: auto;
    bottom: 0;
    /* `inset` kısayolu bazı mobil tarayıcılarda bottom'u güvenilir uygulamıyor;
       açık top/bottom + dvh ile tam ekran yüksekliği garanti altına alınır. */
    height: 100vh;
    height: 100dvh;
    width: 100vw;
    max-width: 100vw;
    background: #fff;
    z-index: 1001;
    padding: 20px 22px 100px;
    transform: translateX(-100%);
    transition: transform .35s cubic-bezier(.32,.72,.32,1);
    visibility: hidden;
    box-shadow: 8px 0 32px rgba(20, 16, 12, .18);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .wood-category__sidebar.is-open {
    transform: translateX(0);
    visibility: visible;
  }
  body.wood-cat-side-open { overflow: hidden; }
  .wood-cat-toolbar__filter-mobile { display: inline-flex; }
  .wood-cat-grid { grid-template-columns: repeat(2, 1fr); }
}

/* mobile backdrop */
.wood-cat-side-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(20, 16, 12, .55);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
  z-index: 1000;
  backdrop-filter: blur(2px);
}
.wood-cat-side-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 640px) {
  /* Kategori / marka / arama ızgarası telefonda ana sayfadaki gibi 2 sütun. */
  .wood-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
}

@media (max-width: 640px) {

  /* ---------- HERO SLIDER ----------------------------------------------- */
  /* Desktop puts text on the LEFT half of the photo. On a phone the
     photo is full-bleed, so center the caption column. */
  .wood-hero__slide {
    background-position: center center;
  }
  .wood-hero__caption { justify-content: center; }
  .wood-hero__txt {
    text-align: center;
    max-width: 100%;
    margin: 0 auto;
  }
  .wood-hero__sub {
    margin-left: auto;
    margin-right: auto;
  }

  /* ---------- BANNER-MID ------------------------------------------------ */
  /* The single wide banner over a photo: center its inner copy. */
  .wood-banner-mid__link { height: auto; min-height: 220px; }
  .wood-banner-mid__content {
    padding: 28px 22px;
    text-align: center;
    width: 100%;
  }

  /* ---------- BLOG CARDS ------------------------------------------------ */
  /* Each post card stacks meta + title + excerpt + "Devamını oku".
     Center the body so it reads as a balanced column. */
  .wood-post__body {
    text-align: center;
    padding: 12px 4px 0;
  }
  .wood-post__cat,
  .wood-post__title,
  .wood-post__excerpt { text-align: center; }
  .wood-post__more {
    display: inline-flex;
    margin-left: auto;
    margin-right: auto;
  }

  /* ---------- NEWSLETTER ------------------------------------------------ */
  /* Two-column desktop layout already collapses to one column at 768px,
     but the inner content stayed left-aligned. Center it on phones. */
  .wood-newsletter__content {
    max-width: 100%;
    text-align: center;
    margin: 0 auto;
  }
  .wood-newsletter__pre,
  .wood-newsletter__title,
  .wood-newsletter__desc { text-align: center; }
  .wood-newsletter__form {
    margin-left: auto;
    margin-right: auto;
  }
  .wood-newsletter__note {
    justify-content: center;
    text-align: center;
  }

  /* ---------- FOOTER TITLES --------------------------------------------- */
  /* Title accent underline → center it under each heading. */
  .wood-footer__title { text-align: center; }
  .wood-footer__title::after {
    left: 50%;
    transform: translateX(-50%);
  }

  /* ---------- HOT DEALS CARD -------------------------------------------- */
  /* Center every line of text inside each big deal card. */
  .wood-deal__body {
    text-align: center;
    align-items: center;
  }
  .wood-deal__body .wood-product__cat,
  .wood-deal__body .wood-product__name { text-align: center; }
  .wood-deal__body .wood-product__rating,
  .wood-deal__body .wood-product__price { justify-content: center; }

  /* Stok / Satılan labels stay space-between (functional left/right pair),
     but the countdown row + msg should be centered. */
  .wood-deal__count { text-align: center; }
  .wood-deal__count-msg { text-align: center; }
  .wood-deal__count-boxes { justify-content: center; }

  /* ---------- FEATURED PRODUCTS (compact horizontal card) --------------- */
  /* The cards stay horizontal (small thumb on the left, text on the right)
     but the text in the right column should read as a centered block on
     mobile so the row feels balanced rather than left-flush. */
  .wood-products--featured .wood-product { text-align: center; }
  .wood-products--featured .wood-product__body { align-items: center; }
  .wood-products--featured .wood-product__cat,
  .wood-products--featured .wood-product__name { text-align: center; }
  .wood-products--featured .wood-product__rating,
  .wood-products--featured .wood-product__price { justify-content: center; }

  /* ---------- NEWSLETTER PRIVACY NOTE ----------------------------------- */
  /* Default desktop note is `display: flex` with the icon as a separate
     flex item. With multi-line wrapped text the small shield icon ends up
     visually mis-centered next to a tall block. Drop out of flex on phones
     so the icon flows inline with the first line — the standard pattern
     users expect for an inline-start icon. */
  .wood-newsletter__note {
    display: block;
    text-align: center;
  }
  .wood-newsletter__note i {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -1px;
    margin-right: 6px;
  }

  /* ---------- FOOTER BOTTOM ROW ---------------------------------------- */
  /* The canonical rule (line ~2444) sets `justify-content: space-between`
     and is declared AFTER the earlier mobile override at line ~1780, so
     the mobile centering only wins when re-declared here at the end of
     the cascade. Copyright + payment icons stack and center on phones. */
  .wood-footer__bottom-row {
    justify-content: center;
    text-align: center;
    flex-wrap: wrap;
  }
  .wood-footer__copy { width: 100%; }
  .wood-footer__pay {
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
  }

  /* ---------- ABOUT — STORE LOCATOR ------------------------------------- */
  /* Same homepage centering pattern (deals / blog / newsletter): on phones
     the right-column content reads as a centered, balanced block.
     `text-align: center` cascades to inline-level children (pre / title /
     desc / inline-flex CTA button), and explicit `margin: 0 auto` centers
     block-level non-text elements (the small accent rule + the column
     flex info list). The info list's <li>s keep their internal flex row
     (icon on the left, text on the right) but the list itself is centered
     as a block — this matches how we treat the newsletter form. */
  .wood-locator__content {
    text-align: center;
    max-width: 100%;
  }
  .wood-locator__pre,
  .wood-locator__title,
  .wood-locator__desc { text-align: center; }
  .wood-locator__rule { margin-left: auto; margin-right: auto; }
  .wood-locator__info {
    width: max-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
  .wood-locator__info li { text-align: left; }

  /* ---------- ABOUT — TEAM CARD BIO ------------------------------------ */
  .wood-team__bio { text-align: center; }

  /* ---------- PAGE HERO — band variant (about / contact / auth) -------- */
  /* On the about-hero (top placement) and contact-band (bottom placement)
     and auth-band, the right column stacks below the text on mobile.
     Center the title block so it reads as a balanced column, matching
     the rest of the homepage sections (newsletter, blog, hot deals). */
  .wood-page-hero--band .wood-page-hero__text { text-align: center; }
  .wood-page-hero--band .wood-page-hero__pre,
  .wood-page-hero--band .wood-page-hero__title,
  .wood-page-hero--band .wood-page-hero__lede { text-align: center; }
  .wood-page-hero--band .wood-page-hero__lede {
    margin-left: auto;
    margin-right: auto;
  }
  /* Crumbs inside the about-hero (only present on about). Re-center. */
  .wood-page-hero--band .wood-page-hero__crumbs {
    justify-content: center;
  }

  /* ---------- CONTACT FORM — KVKK note icon alignment ------------------ */
  /* Default desktop note is `display: inline-flex` with the icon as a
     separate flex item next to multi-line text — on a phone the wrapped
     text stretches to fill the row, leaving the icon stuck on the far
     left. Same pattern we used for the newsletter note: drop out of
     flex on phones so the icon flows inline with the first line of
     text — the standard pattern users expect for an inline-start icon. */
  .wood-contact-form__note {
    display: block;
    text-align: center;
  }
  .wood-contact-form__note i {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -1px;
    margin-right: 6px;
  }

  /* ---------- SHOP — mobile -------------------------------------------- */
  /* Two-column grid on phones (matches the home page product grids);
     toolbar collapses to a vertical stack with the FILTRELE button in
     its own full-width row so it stays thumb-reachable. */
  .wood-shop-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }

  .wood-shop-toolbar { margin-top: 18px; margin-bottom: 18px; border-radius: 12px; }
  .wood-shop-toolbar__row {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 12px;
  }
  .wood-shop-toolbar__view {
    align-self: center;
  }
  .wood-shop-toolbar__center {
    flex-direction: column;
    gap: 10px;
    width: 100%;
  }
  .wood-shop-toolbar__select { width: 100%; }
  .wood-shop-toolbar__select select { width: 100%; min-width: 0; }
  .wood-shop-toolbar__filter-btn {
    width: 100%;
    justify-content: center;
    padding: 12px 18px;
  }

  .wood-shop-section__bar { justify-content: center; }
  .wood-shop-section__count { text-align: center; }

  .wood-shop-drawer { width: 100vw; max-width: 100vw; }
  .wood-shop-drawer__head { padding: 16px 18px; }
  .wood-shop-drawer__body { padding: 4px 18px 18px; }
  .wood-shop-drawer__foot { padding: 14px 18px; }

  /* ---------- ÜRÜN DETAY — mobile -------------------------------------- */
  .wood-product-detail { padding: 22px 0 18px; }
  .wood-pgallery__thumbs { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .wood-pinfo__title { font-size: 22px; text-align: center; }
  .wood-pinfo__meta-row { grid-template-columns: 120px 1fr; }
  .wood-pinfo__rating { justify-content: center; flex-wrap: wrap; }
  .wood-pinfo__price { justify-content: center; }
  .wood-pinfo__short { text-align: center; }
  .wood-pinfo__buy { flex-direction: row; }
  .wood-pinfo__sub-actions { justify-content: center; }
  .wood-pinfo__usps li { justify-content: flex-start; }
  .wood-pinfo__share { justify-content: center; }
  .wood-pinfo__deal-clock strong { font-size: 18px; }
  .wood-pinfo__tags { text-align: center; }

  .wood-ptabs { padding: 28px 0 8px; }
  .wood-ptabs__nav { gap: 14px; overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start; padding-bottom: 0; }
  .wood-ptabs__nav .wood-tab { white-space: nowrap; padding: 12px 4px; font-size: 13px; }
  .wood-ptabs__pane { padding: 18px 16px; }
  .wood-ptabs__gallery { grid-template-columns: repeat(2, 1fr); gap: 8px; }

  .wood-prelated { padding: 28px 0 0; }
  .wood-prelated__head { flex-direction: row; align-items: center; }
  .wood-prelated__rail { grid-auto-columns: calc((100% - 22px) / 2); gap: 14px; }

  /* ---------- SHOP — active filter strip ------------------------------ */
  /* On phones the "Aktif filtreler" label, chips and "Tümünü Temizle"
     button each take their own row so nothing wraps awkwardly. */
  .wood-shop-active {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 12px 14px;
  }
  .wood-shop-active__list { width: 100%; }
  .wood-shop-active__clear {
    margin-left: 0;
    align-self: flex-start;
  }

  /* List view collapses to single-column card on phones; CTA row stays
     centered with the inline action buttons wrapping on tight screens. */
  .wood-shop-grid.is-list .wood-product {
    grid-template-columns: 1fr;
    gap: 16px;
    text-align: center;
  }
  .wood-shop-grid.is-list .wood-product__media { max-width: 320px; margin: 0 auto; width: 100%; }
  .wood-shop-grid.is-list .wood-product__body { align-items: center; text-align: center; }
  .wood-shop-grid.is-list .wood-product__cta { justify-content: center; }
}

/* Tablet (≤991px) — slightly slimmer image column for list view */
@media (max-width: 991px) and (min-width: 641px) {
  .wood-shop-grid.is-list .wood-product { grid-template-columns: 220px 1fr; gap: 18px; }
  .wood-shop-grid.is-list .wood-product__name { font-size: 18px; }
}

/* =============================================================================
   CART (sepet.php) — table + summary card + coupon row
   ============================================================================= */

.wood-cart-page { padding-bottom: 60px; }

.wood-cart { padding: 36px 0 0; }
.wood-cart__pagetitle { font-size: 28px; font-weight: 500; color: var(--primary); margin: 6px 0 24px; }
/* Mesafeli satış sözleşmesi onayı — özet kartı */
.wood-cart-terms { display: flex; align-items: flex-start; gap: 9px; margin: 14px 0 4px; font-size: 13px; color: var(--muted); line-height: 1.5; cursor: pointer; }
.wood-cart-terms input { flex: 0 0 auto; margin-top: 2px; accent-color: var(--accent); }
.wood-cart-terms a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.wood-cart-terms.is-shake { animation: wood-cart-terms-shake 0.4s; color: #a4392c; }
@keyframes wood-cart-terms-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}
.wood-cart__layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 32px;
  align-items: start;
}
.wood-cart__main { min-width: 0; }

/* ---------------- table ---------------- */
.wood-cart__table-wrap {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
}
.wood-cart__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.wood-cart__table thead {
  background: #fff;
  border-bottom: 1px solid var(--border);
}
.wood-cart__th {
  text-align: left;
  padding: 14px 18px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--muted);
}
.wood-cart__th--num { text-align: center; }
.wood-cart__th--rm { width: 40px; }

.wood-cart__row { border-bottom: 1px solid var(--border); transition: background var(--transition); }
.wood-cart__row:last-child { border-bottom: none; }
.wood-cart__row:hover { background: var(--surface); }

.wood-cart__cell { padding: 18px; vertical-align: middle; }
.wood-cart__cell--num { text-align: center; }
.wood-cart__cell--rm { width: 40px; padding-right: 18px; }

.wood-cart__product {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 14px;
  align-items: center;
  min-width: 280px;
}
.wood-cart__thumb {
  width: 80px;
  height: 80px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  overflow: hidden;
  display: block;
}
.wood-cart__thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center; }

.wood-cart__product-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.wood-cart__product-cat {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent);
}
.wood-cart__product-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--primary);
  line-height: 1.4;
}
.wood-cart__product-name:hover { color: var(--accent); }
.wood-cart__product-sku { font-size: 12px; color: var(--muted); }

.wood-cart__price,
.wood-cart__line-total { font-size: 14px; color: var(--primary); font-weight: 600; }
.wood-cart__line-total { color: var(--primary); }

/* qty stepper */
.wood-cart__qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: #fff;
  height: 38px;
  padding: 0 4px;
}
.wood-cart__qty-btn {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  transition: all var(--transition);
}
.wood-cart__qty-btn:hover { background: var(--surface); color: var(--primary); }
.wood-cart__qty-btn i { font-size: 14px; }
.wood-cart__qty-input {
  width: 38px;
  height: 30px;
  border: none;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--primary);
  background: transparent;
  -moz-appearance: textfield;
}
.wood-cart__qty-input::-webkit-outer-spin-button,
.wood-cart__qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* remove button */
.wood-cart__remove {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--muted);
  transition: all var(--transition);
}
.wood-cart__remove:hover { background: var(--danger); color: #fff; }
.wood-cart__remove i { font-size: 14px; }

/* coupon + update row */
.wood-cart__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 24px;
  flex-wrap: wrap;
}
.wood-cart__coupon {
  display: flex;
  align-items: center;
  gap: 0;
  flex: 0 1 420px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 4px 4px 4px 20px;
  height: 44px;
}
.wood-cart__coupon input {
  flex: 1;
  border: none;
  background: transparent;
  font-size: 13px;
  color: var(--primary);
  height: 36px;
  outline: none;
}
.wood-cart__coupon input::placeholder { color: var(--muted-2); }

.wood-cart__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding: 0 20px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  white-space: nowrap;
  transition: all var(--transition);
}
.wood-cart__btn--ghost {
  background: var(--primary);
  color: #fff;
}
.wood-cart__btn--ghost:hover { background: var(--accent); }
.wood-cart__btn i { font-size: 13px; }

/* ---------------- summary card ---------------- */
.wood-cart__side { position: sticky; top: 24px; }

.wood-cart-summary {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.wood-cart-summary__title {
  margin: 0 0 4px;
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 500;
  color: var(--primary);
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.wood-cart-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  font-size: 14px;
}
.wood-cart-summary__row dt { color: var(--muted); }
.wood-cart-summary__amount { font-weight: 600; color: var(--primary); }

.wood-cart-summary__row--total {
  padding-top: 14px;
  border-top: 1px solid var(--border);
  font-size: 18px;
}
.wood-cart-summary__row--total dt { color: var(--primary); font-weight: 500; }
.wood-cart-summary__row--total .wood-cart-summary__amount {
  font-family: var(--font-heading);
  font-size: 24px;
  color: var(--primary);
}

/* ship radios */
.wood-cart-summary__ship {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 0;
  border-top: 1px solid var(--border);
}
.wood-cart-summary__ship-label {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--muted);
}
.wood-cart-summary__radio {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 13px;
  color: var(--primary);
}
.wood-cart-summary__radio input { position: absolute; opacity: 0; pointer-events: none; }
.wood-cart-summary__radio-mark {
  width: 18px; height: 18px;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: #fff;
  position: relative;
  flex: 0 0 auto;
  transition: all var(--transition);
}
.wood-cart-summary__radio input:checked + .wood-cart-summary__radio-mark {
  border-color: var(--accent);
}
.wood-cart-summary__radio input:checked + .wood-cart-summary__radio-mark::after {
  content: '';
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--accent);
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}
.wood-cart-summary__radio-label strong, .wood-cart-summary__ship-addr strong { font-weight: 500; }
.wood-cart-summary__radio-label .is-free { font-style: normal; color: var(--success); font-weight: 600; }

.wood-cart-summary__ship-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}
.wood-cart-summary__ship-edit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--accent);
  font-weight: 600;
  background: transparent;
  border: none;
}
.wood-cart-summary__ship-edit:hover { text-decoration: underline; }
.wood-cart-summary__ship-edit i { font-size: 13px; }

/* CTA */
.wood-cart-summary__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 46px;
  padding: 0 22px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  transition: all var(--transition);
}
.wood-cart-summary__cta:hover { background: var(--accent); color: #fff; }
.wood-cart-summary__cta i { font-size: 13px; transition: transform var(--transition); }
.wood-cart-summary__cta:hover i { transform: translateX(3px); }
/* Minimum sipariş tutarı altında: CTA kilitli */
.wood-cart-summary__cta.is-locked { background: #c9c3b8; color: #fff; cursor: not-allowed; }
.wood-cart-summary__cta.is-locked:hover { background: #c9c3b8; }
.wood-cart-summary__cta.is-locked:hover i { transform: none; }
.wood-cart-minorder.is-shake { animation: wood-cart-terms-shake 0.4s; }

/* USPs */
.wood-cart-summary__usps {
  list-style: none;
  margin: 8px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wood-cart-summary__usps li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: var(--muted);
}
.wood-cart-summary__usps i { color: var(--accent); font-size: 16px; flex: 0 0 auto; }

/* ---------------- responsive ---------------- */
@media (max-width: 991px) {
  .wood-cart__layout { grid-template-columns: 1fr; gap: 24px; }
  .wood-cart__side { position: static; }
}

@media (max-width: 768px) {
  /* Stack table cells as cards */
  .wood-cart__table thead { display: none; }
  .wood-cart__table, .wood-cart__table tbody, .wood-cart__row { display: block; width: 100%; }
  .wood-cart__row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px 14px;
    padding: 16px;
    border-bottom: 1px solid var(--border);
    position: relative;
  }
  .wood-cart__cell { padding: 0; display: block; }
  .wood-cart__cell--prod { grid-column: 1 / -1; padding-right: 36px; }
  .wood-cart__cell--num { text-align: left; }
  .wood-cart__cell--num::before {
    content: attr(data-label);
    display: inline-block;
    margin-right: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--muted);
  }
  .wood-cart__cell--rm { position: absolute; top: 12px; right: 12px; padding: 0; width: auto; }
  .wood-cart__product { min-width: 0; }
  .wood-cart__qty { height: 34px; }
  .wood-cart__qty-btn { width: 26px; height: 26px; }
  .wood-cart__qty-input { width: 34px; height: 26px; }

  .wood-cart__actions { flex-direction: column; align-items: stretch; }
  .wood-cart__coupon { flex: 1 1 auto; width: 100%; }
  .wood-cart__btn--primary { width: 100%; }
}

@media (max-width: 480px) {
  .wood-cart__row { grid-template-columns: 1fr; }
  .wood-cart__cell--prod { padding-right: 0; }
  .wood-cart__cell--rm { top: auto; bottom: 12px; right: 12px; }
}

/* =============================================================================
   CHECKOUT (odeme.php) — coupon strip + form + summary card
   ============================================================================= */

.wood-checkout-page { padding-bottom: 60px; }

/* ---------------- coupon strip ---------------- */
.wood-checkout-coupon { padding: 28px 0 0; }
.wood-checkout-coupon__bar {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: 8px;
  padding: 14px 20px;
  text-align: left;
  font-size: 14px;
  color: var(--primary);
  cursor: pointer;
  transition: all var(--transition);
}
.wood-checkout-coupon__bar:hover { background: var(--surface-2); }
.wood-checkout-coupon__bar i { font-size: 18px; color: var(--accent); flex: 0 0 auto; }
.wood-checkout-coupon__cta { color: var(--accent); font-weight: 600; }

.wood-checkout-coupon__form {
  margin-top: 14px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 20px;
  display: block;
}
.wood-checkout-coupon__form[hidden] { display: none; }
.wood-checkout-coupon__hint { margin: 0 0 14px; font-size: 13px; color: var(--muted); }
.wood-checkout-coupon__fields {
  display: flex;
  gap: 10px;
  align-items: stretch;
  flex-wrap: wrap;
}
.wood-checkout-coupon__fields input {
  flex: 1 1 220px;
  min-width: 0;
  height: 46px;
  padding: 0 16px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: #fff;
  font-size: 14px;
  outline: none;
  transition: border-color var(--transition);
}
.wood-checkout-coupon__fields input:focus { border-color: var(--accent); }
.wood-checkout-coupon__submit {
  flex: 0 0 auto;
  height: 40px;
  padding: 0 20px;
  background: var(--primary);
  color: #fff;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  transition: background var(--transition);
}
.wood-checkout-coupon__submit:hover { background: var(--accent); }

/* ---------------- main layout ---------------- */
.wood-checkout { padding: 28px 0 0; }
.wood-checkout__layout {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 32px;
  align-items: start;
}
.wood-checkout__main { min-width: 0; }
.wood-checkout__card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 28px 28px 22px;
}
.wood-checkout__h {
  margin: 0 0 22px;
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--primary);
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}
.wood-checkout__h-sub {
  margin: 18px 0 14px;
  font-size: 16px;
  font-weight: 600;
  color: var(--primary);
}

.wood-checkout__grid { display: grid; gap: 16px; }
.wood-checkout__grid--2 { grid-template-columns: 1fr 1fr; }

.wood-checkout__field { margin-bottom: 16px; }
.wood-checkout__grid .wood-checkout__field { margin-bottom: 0; }

.wood-checkout__label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
}
.wood-checkout__label .is-req { color: var(--danger); }
.wood-checkout__label .is-opt { color: var(--muted); font-weight: 400; font-style: italic; }

.wood-checkout__input,
.wood-checkout__select,
.wood-checkout__textarea {
  width: 100%;
  height: 46px;
  padding: 0 16px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: #fff;
  font-size: 14px;
  font-family: inherit;
  color: var(--primary);
  outline: none;
  transition: border-color var(--transition);
}
.wood-checkout__input:focus,
.wood-checkout__select:focus,
.wood-checkout__textarea:focus { border-color: var(--accent); }

.wood-checkout__textarea { height: auto; padding: 12px 16px; line-height: 1.5; resize: vertical; }

.wood-checkout__select-wrap { position: relative; }
.wood-checkout__select-wrap > i {
  position: absolute;
  top: 50%; right: 16px;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 14px;
  color: var(--muted);
}
.wood-checkout__select { appearance: none; -webkit-appearance: none; padding-right: 38px; }

/* checkboxes (custom) */
.wood-checkout__check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  font-size: 14px;
  color: var(--primary);
  cursor: pointer;
  user-select: none;
}
.wood-checkout__check input { position: absolute; opacity: 0; pointer-events: none; }
.wood-checkout__check-mark {
  width: 18px; height: 18px;
  border: 2px solid var(--border-strong);
  border-radius: 4px;
  background: #fff;
  position: relative;
  flex: 0 0 auto;
  transition: all var(--transition);
}
.wood-checkout__check input:checked + .wood-checkout__check-mark {
  background: var(--accent);
  border-color: var(--accent);
}
.wood-checkout__check input:checked + .wood-checkout__check-mark::after {
  content: '';
  position: absolute;
  top: 1px; left: 5px;
  width: 5px; height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.wood-checkout__ship-block {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px dashed var(--border);
}
.wood-checkout__ship-block[hidden] { display: none; }

/* ---------------- right summary ---------------- */
.wood-checkout__side { position: sticky; top: 24px; }

.wood-checkout-summary {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 26px;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.wood-checkout-summary__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--primary);
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.wood-checkout-summary__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.wood-checkout-summary__table thead th {
  text-align: left;
  padding: 0 0 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}
.wood-checkout-summary__table thead th.is-num { text-align: right; }

.wood-checkout-summary__table tbody tr { border-bottom: 1px solid var(--border); }
.wood-checkout-summary__table tbody td {
  padding: 12px 0;
  vertical-align: top;
  color: var(--primary);
}
.wood-checkout-summary__table tbody td.is-num { text-align: right; white-space: nowrap; font-weight: 600; }
.wood-checkout-summary__item-name { color: var(--primary); }
.wood-checkout-summary__item-qty { color: var(--muted); }

.wood-checkout-summary__table tfoot th,
.wood-checkout-summary__table tfoot td {
  padding: 14px 0 0;
  text-align: left;
  font-size: 14px;
  color: var(--primary);
  font-weight: 600;
}
.wood-checkout-summary__table tfoot td.is-num { text-align: right; }
.wood-checkout-summary__table tfoot tr { border-bottom: 1px solid var(--border); }
.wood-checkout-summary__table tfoot tr th,
.wood-checkout-summary__table tfoot tr td { padding-bottom: 14px; }

.wood-checkout-summary__total-row th { font-size: 16px; }
.wood-checkout-summary__total {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  color: var(--primary);
}

/* ship inline radio in tfoot */
.wood-checkout-summary__ship {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-weight: 500;
  color: var(--primary);
}
.wood-checkout-summary__ship input { position: absolute; opacity: 0; pointer-events: none; }
.wood-checkout-summary__ship-mark {
  width: 16px; height: 16px;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: #fff;
  position: relative;
  flex: 0 0 auto;
  transition: all var(--transition);
}
.wood-checkout-summary__ship input:checked + .wood-checkout-summary__ship-mark { border-color: var(--accent); }
.wood-checkout-summary__ship input:checked + .wood-checkout-summary__ship-mark::after {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent);
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}

/* fieldsets — delivery & payment */
.wood-checkout-summary__methods {
  border: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wood-checkout-summary__methods legend {
  display: block;
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--primary);
  padding: 0;
}

.wood-checkout-summary__method {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  color: var(--primary);
  transition: all var(--transition);
}
.wood-checkout-summary__method:hover { border-color: var(--border-strong); }
.wood-checkout-summary__method input { position: absolute; opacity: 0; pointer-events: none; }
.wood-checkout-summary__method-mark {
  width: 16px; height: 16px;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: #fff;
  position: relative;
  flex: 0 0 auto;
  transition: all var(--transition);
}
.wood-checkout-summary__method input:checked + .wood-checkout-summary__method-mark { border-color: var(--accent); }
.wood-checkout-summary__method input:checked + .wood-checkout-summary__method-mark::after {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent);
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}
.wood-checkout-summary__method:has(input:checked) {
  border-color: var(--accent);
  background: rgba(181, 150, 119, 0.06);
}
.wood-checkout-summary__method i { font-size: 18px; color: var(--muted); flex: 0 0 auto; }
.wood-checkout-summary__method:has(input:checked) i { color: var(--accent); }
.wood-checkout-summary__method-label { flex: 1; }

/* Fatura tipi: bireysel / kurumsal */
.wood-checkout__invoice { margin-top: 18px; }
.wood-checkout__invoice-types {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}
.wood-checkout__invoice-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  color: var(--primary);
  transition: all var(--transition);
}
.wood-checkout__invoice-opt:hover { border-color: var(--border-strong); }
.wood-checkout__invoice-opt input { position: absolute; opacity: 0; pointer-events: none; }
.wood-checkout__invoice-mark {
  width: 16px; height: 16px;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  background: #fff;
  position: relative;
  flex: 0 0 auto;
  transition: all var(--transition);
}
.wood-checkout__invoice-opt input:checked + .wood-checkout__invoice-mark { border-color: var(--accent); }
.wood-checkout__invoice-opt input:checked + .wood-checkout__invoice-mark::after {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent);
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
}
.wood-checkout__invoice-opt:has(input:checked) {
  border-color: var(--accent);
  background: rgba(181, 150, 119, 0.06);
}
.wood-checkout__invoice-label { display: inline-flex; align-items: center; gap: 8px; flex: 1; }
.wood-checkout__invoice-label i { font-size: 18px; color: var(--muted); }
.wood-checkout__invoice-opt:has(input:checked) .wood-checkout__invoice-label i { color: var(--accent); }
.wood-checkout__invoice-fields[hidden] { display: none; }
[data-wood-ship-fields][hidden] { display: none !important; }
.wood-checkout-summary__method-tag {
  font-style: normal;
  font-size: 12px;
  color: var(--success);
  font-weight: 600;
}

.wood-checkout-summary__pickup-info,
.wood-checkout-summary__pay-info {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: #e8f4fd;
  border-left: 3px solid #5aa5d8;
  padding: 12px 14px;
  border-radius: 8px;
  margin: 4px 0 8px;
  font-size: 13px;
  color: #2a4d66;
  line-height: 1.5;
}
.wood-checkout-summary__pickup-info[hidden],
.wood-checkout-summary__pay-info[hidden] { display: none; }
.wood-checkout-summary__pickup-info i { font-size: 18px; color: #5aa5d8; flex: 0 0 auto; margin-top: 1px; }
.wood-checkout-summary__pickup-info p,
.wood-checkout-summary__pay-info p { margin: 0; }

/* havale banka detayları */
.wood-checkout-summary__pay-info[data-pay-info="bank"] { flex-direction: column; }
.wood-checkout-summary__bank {
  width: 100%;
  margin-top: 8px;
  background: #fff;
  border: 1px solid #cfe3f2;
  border-radius: 8px;
  padding: 10px 12px;
}
.wood-checkout-summary__bank + .wood-checkout-summary__bank { margin-top: 8px; }
.wood-checkout-summary__bank-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 3px 0;
}
.wood-checkout-summary__bank-row span { color: #6b86a0; }
.wood-checkout-summary__bank-row strong { color: #1f3a4d; text-align: right; }
.wood-checkout-summary__iban { word-break: break-all; letter-spacing: .02em; }

/* privacy + terms */
.wood-checkout-summary__privacy {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid var(--border);
  font-size: 12px;
  color: var(--muted);
  line-height: 1.55;
}
.wood-checkout-summary__privacy i { font-size: 16px; color: var(--accent); flex: 0 0 auto; margin-top: 1px; }
.wood-checkout-summary__privacy a { color: var(--accent); text-decoration: underline; }

.wood-checkout-summary__terms {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  font-size: 13px;
  color: var(--primary);
  line-height: 1.5;
}
.wood-checkout-summary__terms input { position: absolute; opacity: 0; pointer-events: none; }
.wood-checkout-summary__terms-mark {
  width: 18px; height: 18px;
  border: 2px solid var(--border-strong);
  border-radius: 4px;
  background: #fff;
  position: relative;
  flex: 0 0 auto;
  margin-top: 1px;
  transition: all var(--transition);
}
.wood-checkout-summary__terms input:checked + .wood-checkout-summary__terms-mark {
  background: var(--accent);
  border-color: var(--accent);
}
.wood-checkout-summary__terms input:checked + .wood-checkout-summary__terms-mark::after {
  content: '';
  position: absolute;
  top: 1px; left: 5px;
  width: 5px; height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.wood-checkout-summary__terms-label .is-req { color: var(--danger); }
.wood-checkout-summary__terms a { color: var(--accent); text-decoration: underline; }

.wood-checkout-summary__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  padding: 0 22px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  transition: all var(--transition);
}
.wood-checkout-summary__submit:hover { background: var(--accent); }
.wood-checkout-summary__submit i { font-size: 13px; transition: transform var(--transition); }
.wood-checkout-summary__submit:hover i { transform: translateX(3px); }

/* ---------------- responsive ---------------- */
@media (max-width: 1199px) {
  .wood-checkout__layout { grid-template-columns: 1fr 380px; gap: 24px; }
}

@media (max-width: 991px) {
  .wood-checkout__layout { grid-template-columns: 1fr; }
  .wood-checkout__side { position: static; }
}

@media (max-width: 640px) {
  .wood-checkout__card { padding: 22px 18px 18px; }
  .wood-checkout__h { font-size: 19px; }
  .wood-checkout__grid--2 { grid-template-columns: 1fr; }
  .wood-checkout-summary { padding: 22px 18px; }
  .wood-checkout-summary__title { font-size: 19px; }
  .wood-checkout-summary__total { font-size: 22px; }
  .wood-checkout-coupon__bar { font-size: 13px; padding: 12px 16px; }
  .wood-cart-summary { padding: 22px 18px; }
  .wood-cart-summary__title { font-size: 19px; }
}

/* =============================================================================
   AUTH — login alert + demo hint
   ============================================================================= */

.wood-auth__alert {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 14px;
  padding: 12px 14px;
  background: #fdecec;
  border-left: 3px solid var(--danger);
  border-radius: 8px;
  font-size: 13px;
  color: #8a2a2a;
  line-height: 1.5;
}
.wood-auth__alert i { font-size: 18px; color: var(--danger); flex: 0 0 auto; margin-top: 1px; }

.wood-auth__demo-hint {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px dashed var(--border-strong);
  border-radius: 8px;
  font-size: 12px;
  color: var(--muted);
}
.wood-auth__demo-hint strong { color: var(--primary); font-weight: 700; padding: 0 2px; }
.wood-auth__demo-hint i { font-size: 16px; color: var(--accent); flex: 0 0 auto; }

/* =============================================================================
   ACCOUNT (hesap.php) — sidebar + content + sub-pages
   ============================================================================= */

.wood-account-page { padding-bottom: 60px; }

.wood-account { padding: 36px 0 0; }
.wood-account__layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 32px;
  align-items: start;
}

/* ---------------- sidebar ---------------- */
.wood-account-side {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  position: sticky;
  top: 24px;
}

.wood-account-side__user {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 12px;
  align-items: center;
  padding: 18px 18px 16px;
  border-bottom: 1px solid var(--border);
}
.wood-account-side__avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--primary);
  letter-spacing: 0.5px;
}
.wood-account-side__user-body { display: flex; flex-direction: column; min-width: 0; }
.wood-account-side__hello { font-size: 12px; color: var(--muted); }
.wood-account-side__name { font-size: 14px; color: var(--primary); font-weight: 700; }

.wood-account-side__nav { padding: 8px 0; }
.wood-account-side__nav ul { list-style: none; margin: 0; padding: 0; }
.wood-account-side__nav li { margin: 0; }
.wood-account-side__nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  font-size: 14px;
  color: var(--primary);
  border-left: 3px solid transparent;
  transition: all var(--transition);
}
.wood-account-side__nav a:hover { background: var(--surface); color: var(--accent); }
.wood-account-side__nav a i { font-size: 16px; color: var(--muted); flex: 0 0 auto; transition: color var(--transition); }
.wood-account-side__nav a:hover i { color: var(--accent); }

.wood-account-side__nav li.is-active a {
  background: var(--surface);
  color: var(--accent);
  font-weight: 600;
  border-left-color: var(--accent);
}
.wood-account-side__nav li.is-active a i { color: var(--accent); }

.wood-account-side__sep {
  height: 1px;
  background: var(--border);
  margin: 8px 0;
}
.wood-account-side__logout { color: var(--muted) !important; }
.wood-account-side__logout:hover { color: var(--danger) !important; }
.wood-account-side__logout:hover i { color: var(--danger); }

/* ---------------- content ---------------- */
.wood-account__content {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 28px 32px;
  min-width: 0;
}
.wood-account__head {
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.wood-account__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  color: var(--primary);
}

/* ---------------- flash (kaydet sonrası bildirim) -------------------------- */
.wood-account-flash {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 22px;
  padding: 13px 16px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
}
.wood-account-flash i { font-size: 18px; flex-shrink: 0; margin-top: 1px; }
.wood-account-flash--ok  { background: #ecfdf5; border: 1px solid #6ee7b7; color: #065f46; }
.wood-account-flash--ok i { color: #10b981; }
.wood-account-flash--err { background: #fef2f2; border: 1px solid #fca5a5; color: #991b1b; }
.wood-account-flash--err i { color: #ef4444; }

/* ---------------- siparişler listesi -------------------------------------- */
.wood-account-orders { display: flex; flex-direction: column; gap: 16px; }
.wood-account-order {
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
}
.wood-account-order__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px;
  background: var(--wood-card-bg, var(--surface, #f6efe6));
  border-bottom: 1px solid var(--border);
}
.wood-account-order__meta { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.wood-account-order__no { font-weight: 700; color: var(--primary); font-size: 14px; }
.wood-account-order__date { color: var(--muted); font-size: 13px; }
.wood-account-order__status {
  padding: 5px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  background: #f3f4f6;
  color: #374151;
  white-space: nowrap;
}
.wood-account-order__status--pending    { background: #fef3c7; color: #92400e; }
.wood-account-order__status--processing { background: #dbeafe; color: #1e40af; }
.wood-account-order__status--shipped    { background: #e0e7ff; color: #3730a3; }
.wood-account-order__status--delivered,
.wood-account-order__status--completed  { background: #d1fae5; color: #065f46; }
.wood-account-order__status--cancelled,
.wood-account-order__status--refunded   { background: #fee2e2; color: #991b1b; }
.wood-account-order__items { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px; }
.wood-account-order__item { display: flex; align-items: center; gap: 14px; }
.wood-account-order__thumb {
  width: 56px; height: 56px;
  flex-shrink: 0;
  border-radius: 10px;
  overflow: hidden;
  background: var(--wood-card-bg, var(--surface, #f6efe6));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted-2);
  border: 1px solid var(--border);
}
.wood-account-order__thumb img { width: 100%; height: 100%; object-fit: cover; }
.wood-account-order__thumb i { font-size: 24px; }
.wood-account-order__item-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.wood-account-order__item-name { font-size: 14px; font-weight: 600; color: var(--primary); }
.wood-account-order__item-qty { font-size: 13px; color: var(--muted); }
.wood-account-order__item-total { font-size: 14px; font-weight: 700; color: var(--primary); white-space: nowrap; }
.wood-account-order__foot {
  display: flex;
  justify-content: flex-end;
  padding: 14px 18px;
  border-top: 1px solid var(--border);
}
.wood-account-order__total { font-size: 16px; font-weight: 700; color: var(--accent); }
.wood-account-order__total span { font-size: 13px; font-weight: 400; color: var(--muted); margin-right: 6px; }

/* ---------------- sipariş ilerleme hattı (ince çizgi + noktalar) ---------- */
.wood-op { display: flex; padding: 16px 18px 6px; }
.wood-op__step {
  flex: 1; position: relative; min-width: 0;
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  text-align: center;
}
.wood-op__step + .wood-op__step::before {
  content: ''; position: absolute; top: 15px;
  right: calc(50% + 24px); width: calc(100% - 48px); height: 2px;
  border-radius: 2px; background: var(--border, #e8e2d8);
}
.wood-op__step.done::before,
.wood-op__step.current::before { background: #4a7c59; }
.wood-op__dot {
  position: relative; z-index: 1;
  width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 15px;
  background: #fff; color: #b8b0a4;
  border: 1.5px solid var(--border-strong, #d8cfc0);
  transition: all .2s;
}
.wood-op__step.done .wood-op__dot { background: #4a7c59; border-color: #4a7c59; color: #fff; }
.wood-op__step.current .wood-op__dot { border: 2px solid #4a7c59; color: #4a7c59; box-shadow: 0 0 0 5px rgba(74, 124, 89, .13); }
.wood-op__label { font-size: 12px; color: var(--muted, #6b6257); line-height: 1.3; }
.wood-op__step.done .wood-op__label { color: var(--muted, #6b6257); font-weight: 500; }
.wood-op__step.current .wood-op__label { color: var(--primary, #1a1a1a); font-weight: 700; }
.wood-op__date { font-size: 11px; color: var(--muted, #6b6257); margin-top: -4px; }
.wood-op__tracking {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 8px 18px 4px; padding: 10px 12px;
  background: var(--surface, #f7f4ef); border-radius: 8px;
  font-size: 13px; color: var(--muted, #6b6257);
}
.wood-op__tracking > i { color: var(--muted, #6b6257); }
.wood-op__tracking strong { color: var(--primary, #1a1a1a); }
.wood-op__tracking a { margin-left: auto; color: var(--accent, #b59677); font-weight: 600; text-decoration: none; white-space: nowrap; }
.wood-op__tracking a:hover { text-decoration: underline; }
@media (max-width: 576px) {
  .wood-op { padding: 12px 10px 4px; }
  .wood-op__label { font-size: 10px; }
  .wood-op__tracking a { margin-left: 0; }
}

/* ---------------- empty state (orders / wishlist / compare / downloads) ---- */
.wood-account-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 60px 20px;
  gap: 14px;
}
.wood-account-empty__icon {
  width: 84px; height: 84px;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted-2);
}
.wood-account-empty__icon i { font-size: 38px; }
.wood-account-empty__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 700;
  color: var(--primary);
}
.wood-account-empty__text {
  margin: 0;
  max-width: 380px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}
.wood-account-empty__cta {
  margin-top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 22px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  transition: all var(--transition);
}
.wood-account-empty__cta:hover { background: var(--accent); color: #fff; }
.wood-account-empty__cta i { font-size: 13px; transition: transform var(--transition); }
.wood-account-empty__cta:hover i { transform: translateX(3px); }

/* ---------------- dashboard ---------------- */
.wood-account-panel { display: flex; flex-direction: column; gap: 22px; }

/* Hoş geldin kartı — soft surface, avatar + name + meta + logout link */
.wood-account-welcome {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 22px 22px;
  background: linear-gradient(135deg, var(--surface) 0%, #fff 100%);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .03);
}
.wood-account-welcome__avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--primary);
  color: #fff;
  font-family: var(--ff-display, "Cormorant Garamond", serif);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.5px;
}
.wood-account-welcome__body { min-width: 0; }
.wood-account-welcome__hi {
  display: block;
  font-size: 12px;
  color: var(--muted);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.wood-account-welcome__name {
  margin: 0 0 6px;
  font-family: var(--ff-display, "Cormorant Garamond", serif);
  font-size: 24px;
  font-weight: 600;
  color: var(--primary);
  line-height: 1.2;
}
.wood-account-welcome__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.4;
}
.wood-account-welcome__meta i { font-size: 14px; color: var(--muted); flex: 0 0 auto; }
.wood-account-welcome__sep { margin: 0 4px; color: var(--border); }
.wood-account-welcome__logout {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: var(--muted);
  text-decoration: none;
  transition: all .15s ease;
  white-space: nowrap;
}
.wood-account-welcome__logout:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: #fff;
}
.wood-account-welcome__logout i { font-size: 14px; }

@media (max-width: 600px) {
  .wood-account-welcome {
    grid-template-columns: 56px 1fr;
    gap: 14px;
    padding: 18px 16px;
  }
  .wood-account-welcome__avatar { width: 56px; height: 56px; font-size: 19px; }
  .wood-account-welcome__name { font-size: 20px; }
  .wood-account-welcome__logout {
    grid-column: 1 / -1;
    justify-self: stretch;
    justify-content: center;
  }
}

/* Stat şeridi — 4 sütunlu büyük rakamlar */
.wood-account-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wood-account-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 16px 10px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  text-align: center;
}
.wood-account-stat__num {
  font-family: var(--ff-display, "Cormorant Garamond", serif);
  font-size: 28px;
  font-weight: 600;
  color: var(--primary);
  line-height: 1;
}
.wood-account-stat__label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.6px;
}
@media (max-width: 600px) {
  .wood-account-stats { grid-template-columns: repeat(2, 1fr); }
  .wood-account-stat__num { font-size: 24px; }
}

.wood-account-panel__h {
  margin: 4px 0 -4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.wood-account-panel__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 6px;
}
.wood-account-panel__card {
  display: grid;
  grid-template-columns: 44px 1fr;
  grid-template-rows: auto auto;
  column-gap: 14px;
  align-items: center;
  padding: 18px 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  transition: all var(--transition);
}
.wood-account-panel__card:hover {
  border-color: var(--accent);
  background: #fff;
  transform: translateY(-1px);
}
.wood-account-panel__card-icon {
  grid-row: 1 / 3;
  width: 44px; height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 50%;
  color: var(--accent);
}
.wood-account-panel__card-icon i { font-size: 20px; }
.wood-account-panel__card strong {
  grid-column: 2;
  font-size: 14px;
  color: var(--primary);
  font-weight: 700;
}
.wood-account-panel__card-meta {
  grid-column: 2;
  font-size: 12px;
  color: var(--muted);
}

/* ---------------- addresses ---------------- */
.wood-account-addr__intro {
  margin: 0 0 20px;
  color: var(--muted);
  font-size: 14px;
}
.wood-account-addr__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.wood-account-addr__card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 22px 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wood-account-addr__head { margin: 0; }
.wood-account-addr__h {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--primary);
}
.wood-account-addr__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-style: normal;
  font-size: 13px;
  color: var(--primary);
  line-height: 1.55;
}
.wood-account-addr__body strong { color: var(--primary); font-weight: 700; font-size: 14px; }
.wood-account-addr__empty { margin: 0; font-size: 13px; color: var(--muted); }
.wood-account-addr__edit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--accent);
}
.wood-account-addr__edit:hover { color: var(--accent-dark); }
.wood-account-addr__edit i { font-size: 13px; }

/* ---------------- çoklu adres defteri ---------------- */
.wood-account-addr__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.wood-account-addr__toolbar .wood-account-addr__intro { margin: 0; flex: 1 1 280px; }
.wood-account-addr__add {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  border-radius: 10px;
  background: var(--primary);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  transition: background .15s ease;
}
.wood-account-addr__add:hover { background: var(--accent); color: #fff; } /* global a:hover accent rengini ezmesin */
.wood-account-addr__add i { font-size: 15px; }

.wood-account-addr__list .wood-account-addr__card.is-default {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent) inset;
}
.wood-account-addr__h {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.wood-account-addr__badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--surface-2, #f1f1f1);
  color: var(--primary);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
  text-transform: uppercase;
}
.wood-account-addr__badge--default {
  background: var(--accent);
  color: #fff;
}
.wood-account-addr__card-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.wood-account-addr__card-actions .wood-account-addr__edit {
  margin-top: 0;
  align-self: center;
  padding: 4px 6px;
}
.wood-account-addr__inline-form { margin: 0; }
.wood-account-addr__action-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: 0;
  padding: 4px 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: var(--muted);
  transition: color .15s ease;
}
.wood-account-addr__action-btn:hover { color: var(--accent); }
.wood-account-addr__action-btn i { font-size: 13px; }
.wood-account-addr__action-btn--danger:hover { color: #d23b3b; }

.wood-account-addr__empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 48px 20px;
  text-align: center;
  border: 1px dashed var(--border);
  border-radius: 12px;
  color: var(--muted);
}
.wood-account-addr__empty-state i { font-size: 34px; color: var(--accent); }
.wood-account-addr__empty-state p { margin: 0; font-size: 14px; }

.wood-account-addr__default-check { margin-top: 6px; }
.wood-checkout__saved-addr { margin-bottom: 16px; }

/* ---------------- details form ---------------- */
.wood-account-details { display: flex; flex-direction: column; gap: 16px; }

.wood-account-details__grid { display: grid; gap: 16px; }
.wood-account-details__grid--2 { grid-template-columns: 1fr 1fr; }

.wood-account-details__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wood-account-details__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
}
.wood-account-details__label .is-req { color: var(--danger); }
.wood-account-details__label .is-opt { color: var(--muted); font-style: italic; font-weight: 400; }
.wood-account-details__hint { margin: 0; font-size: 12px; color: var(--muted); }

.wood-account-details__input {
  width: 100%;
  height: 46px;
  padding: 0 16px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: #fff;
  font-size: 14px;
  font-family: inherit;
  color: var(--primary);
  outline: none;
  transition: border-color var(--transition);
}
.wood-account-details__input:focus { border-color: var(--accent); }
.wood-account-details__input--lock { background: var(--surface); color: var(--muted); cursor: not-allowed; }

.wood-account-details__pw {
  margin: 14px 0 0;
  padding: 22px 0 4px;
  border: none;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.wood-account-details__pw legend {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 700;
  color: var(--primary);
  padding: 0 0 6px;
}

.wood-account-details__actions { margin-top: 8px; }
.wood-account-details__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 46px;
  padding: 0 26px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  transition: background var(--transition);
}
.wood-account-details__submit:hover { background: var(--accent); }

/* ---------------- responsive ---------------- */
@media (max-width: 991px) {
  .wood-account__layout { grid-template-columns: 240px 1fr; gap: 22px; }
  .wood-account__content { padding: 24px; }
}

@media (max-width: 768px) {
  .wood-account__layout { grid-template-columns: 1fr; }
  .wood-account-side { position: static; }

  .wood-account-side__nav a { padding: 12px 16px; }
  .wood-account__content { padding: 22px 18px; }
  .wood-account__title { font-size: 20px; }
  .wood-account-order__head, .wood-account-order__foot { flex-wrap: wrap; gap: 8px; }
  .wood-account-order__item-total { white-space: normal; }

  .wood-account-panel__grid { grid-template-columns: 1fr; }
  .wood-account-addr__grid  { grid-template-columns: 1fr; }
  .wood-account-details__grid--2 { grid-template-columns: 1fr; }

  .wood-account-empty { padding: 40px 14px; }
  .wood-account-empty__icon { width: 70px; height: 70px; }
  .wood-account-empty__icon i { font-size: 32px; }
  .wood-account-empty__title { font-size: 18px; }
}

/* =============================================================================
   FAVORITES (favoriler.php + hesap?bolum=favoriler) — sepet tablosuyla aynı dil
   ============================================================================= */

.wood-fav-page { padding-bottom: 60px; }
.wood-fav { padding: 36px 0 0; }
.wood-account-fav__intro {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}
.wood-account-fav__intro a { color: var(--accent); text-decoration: underline; }

.wood-fav__table-wrap {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
}
.wood-fav__table { width: 100%; border-collapse: collapse; font-size: 14px; }
.wood-fav__table thead {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.wood-fav__th {
  text-align: left;
  padding: 14px 18px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--muted);
}
.wood-fav__th--num,
.wood-fav__th--stock,
.wood-fav__th--act { text-align: center; }
.wood-fav__th--rm { width: 40px; }

.wood-fav__row { border-bottom: 1px solid var(--border); transition: background var(--transition); }
.wood-fav__row:last-child { border-bottom: none; }
.wood-fav__row:hover { background: var(--surface); }

.wood-fav__cell { padding: 18px; vertical-align: middle; }
.wood-fav__cell--num,
.wood-fav__cell--stock,
.wood-fav__cell--act { text-align: center; }
.wood-fav__cell--rm { width: 40px; padding-right: 18px; }

.wood-fav__product {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 14px;
  align-items: center;
  min-width: 280px;
}
.wood-fav__thumb {
  width: 80px; height: 80px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  overflow: hidden;
  display: block;
}
.wood-fav__thumb img { width: 100%; height: 100%; object-fit: cover; }

.wood-fav__product-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.wood-fav__product-cat {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--accent);
}
.wood-fav__product-name { font-size: 14px; font-weight: 600; color: var(--primary); line-height: 1.4; }
.wood-fav__product-name:hover { color: var(--accent); }
.wood-fav__product-sku { font-size: 12px; color: var(--muted); }

.wood-fav__price { font-size: 14px; font-weight: 700; color: var(--primary); }
.wood-fav__price-old {
  display: inline-block;
  margin-left: 8px;
  font-size: 12px;
  color: var(--muted-2);
  text-decoration: line-through;
  font-weight: 400;
}

.wood-fav__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.4px;
}
.wood-fav__badge--in  { background: #e7f5ec; color: #2e7d4e; }
.wood-fav__badge--out { background: #fdecec; color: #b03131; }

.wood-fav__cart {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 18px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  transition: all var(--transition);
}
.wood-fav__cart:hover { background: var(--accent); color: #fff; }
.wood-fav__cart i { font-size: 13px; }
.wood-fav__cart[disabled] { opacity: 0.45; cursor: not-allowed; }
.wood-fav__cart[disabled]:hover { background: var(--primary); }

.wood-fav__remove {
  width: 30px; height: 30px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--muted);
  transition: all var(--transition);
}
.wood-fav__remove:hover { background: var(--danger); color: #fff; }
.wood-fav__remove i { font-size: 14px; }

.wood-fav__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 18px;
  flex-wrap: wrap;
  gap: 12px;
}
.wood-fav__continue {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--primary);
}
.wood-fav__continue:hover { color: var(--accent); }
.wood-fav__continue i { font-size: 13px; transition: transform var(--transition); }
.wood-fav__continue:hover i { transform: translateX(-3px); }
.wood-fav__count { font-size: 13px; color: var(--muted); }
.wood-fav__empty-msg {
  text-align: center;
  padding: 40px 20px;
  color: var(--muted);
  font-size: 14px;
}

@media (max-width: 768px) {
  .wood-fav__table thead { display: none; }
  .wood-fav__table, .wood-fav__table tbody, .wood-fav__row { display: block; width: 100%; }
  .wood-fav__row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px 14px;
    padding: 16px;
    border-bottom: 1px solid var(--border);
    position: relative;
  }
  .wood-fav__cell { padding: 0; display: block; text-align: left; }
  .wood-fav__cell--prod { grid-column: 1 / -1; padding-right: 36px; }
  .wood-fav__cell--num,
  .wood-fav__cell--stock { text-align: left; }
  .wood-fav__cell--num::before,
  .wood-fav__cell--stock::before {
    content: attr(data-label);
    display: inline-block;
    margin-right: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--muted);
  }
  .wood-fav__cell--act { grid-column: 1 / -1; text-align: left; }
  .wood-fav__cell--rm { position: absolute; top: 12px; right: 12px; padding: 0; width: auto; }
  .wood-fav__cart { width: 100%; justify-content: center; }
  .wood-fav__product { min-width: 0; }
}

/* =============================================================================
   COMPARE (karsilastir.php) — sticky label column + product columns matrix
   ============================================================================= */

.wood-compare-page { padding-bottom: 60px; }

.wood-compare { padding: 36px 0 0; }

.wood-compare__head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.wood-compare__count { margin: 0; font-size: 13px; color: var(--muted); }
.wood-compare__clear {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  background: transparent;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--primary);
  transition: all var(--transition);
}
.wood-compare__clear:hover { background: var(--danger); color: #fff; border-color: var(--danger); }
.wood-compare__clear i { font-size: 13px; }

.wood-compare__scroll {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.wood-compare__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
  table-layout: fixed;
}
.wood-compare__col-label { width: 180px; }
.wood-compare__col-item  { width: 280px; }

.wood-compare__row { border-bottom: 1px solid var(--border); }
.wood-compare__row:last-child { border-bottom: none; }
.wood-compare__row:nth-child(odd of .wood-compare__row) { background: var(--surface); }
.wood-compare__row.wood-compare__row--media,
.wood-compare__row.wood-compare__row--head,
.wood-compare__row.wood-compare__row--close,
.wood-compare__row.wood-compare__row--actions { background: #fff; }

.wood-compare__label {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--surface);
  text-align: left;
  padding: 16px 22px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--muted);
  border-right: 1px solid var(--border);
  vertical-align: middle;
}
.wood-compare__cell {
  padding: 16px 22px;
  vertical-align: middle;
  color: var(--primary);
  border-right: 1px solid var(--border);
}
.wood-compare__cell:last-child { border-right: none; }

.wood-compare__cell--close { padding: 12px 22px; text-align: right; }
.wood-compare__close {
  width: 30px; height: 30px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--muted);
  transition: all var(--transition);
}
.wood-compare__close:hover { background: var(--danger); color: #fff; }
.wood-compare__close i { font-size: 14px; }

.wood-compare__cell--media { padding: 18px 22px; }
.wood-compare__thumb {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  overflow: hidden;
  max-width: 220px;
  margin: 0 auto;
}
.wood-compare__thumb img { width: 100%; height: 100%; object-fit: cover; }

.wood-compare__cell--head { padding: 14px 22px 18px; }
.wood-compare__cat {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 4px;
}
.wood-compare__name {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--primary);
  line-height: 1.4;
  margin-bottom: 8px;
}
.wood-compare__name:hover { color: var(--accent); }
.wood-compare__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.wood-compare__price strong {
  font-family: var(--font-heading);
  font-size: 18px;
  color: var(--primary);
}
.wood-compare__price-old {
  font-size: 12px;
  color: var(--muted-2);
  text-decoration: line-through;
}

.wood-compare__cell--sku { font-family: "JetBrains Mono", "Menlo", monospace; font-size: 12px; color: var(--muted); }
.wood-compare__meta { font-size: 12px; color: var(--muted); margin-left: 6px; }

.wood-compare__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}
.wood-compare__badge--in  { background: #e7f5ec; color: #2e7d4e; }
.wood-compare__badge--out { background: #fdecec; color: #b03131; }

.wood-compare__cell--actions { padding: 16px 22px 20px; }
.wood-compare__cart {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 18px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  transition: all var(--transition);
  margin-right: 8px;
}
.wood-compare__cart:hover { background: var(--accent); color: #fff; }
.wood-compare__cart i { font-size: 13px; }
.wood-compare__cart[disabled] { opacity: 0.45; cursor: not-allowed; }
.wood-compare__cart[disabled]:hover { background: var(--primary); }

.wood-compare__fav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px; height: 38px;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  color: var(--primary);
  transition: all var(--transition);
}
.wood-compare__fav:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
.wood-compare__fav i { font-size: 16px; }

/* Empty state */
.wood-compare-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 80px 20px;
  gap: 14px;
}
.wood-compare-empty__icon {
  width: 84px; height: 84px;
  border: 2px solid var(--border-strong);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted-2);
}
.wood-compare-empty__icon i { font-size: 38px; }
.wood-compare-empty__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 700;
  color: var(--primary);
}
.wood-compare-empty__text {
  margin: 0;
  max-width: 460px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}
.wood-compare-empty__text i { color: var(--accent); margin: 0 2px; }
.wood-compare-empty__cta {
  margin-top: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 22px;
  background: var(--primary);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  transition: all var(--transition);
}
.wood-compare-empty__cta:hover { background: var(--accent); color: #fff; }
.wood-compare-empty__cta i { font-size: 13px; transition: transform var(--transition); }
.wood-compare-empty__cta:hover i { transform: translateX(3px); }

@media (max-width: 768px) {
  .wood-compare__scroll { max-width: 100%; scroll-snap-type: x mandatory; scroll-padding-left: 96px; }
  .wood-compare__table { width: max-content; table-layout: auto; }
  .wood-compare__col-label { width: 88px; }
  .wood-compare__col-item  { width: 72vw; }
  .wood-compare__cell { scroll-snap-align: start; }
  .wood-compare__thumb { width: min(100%, 200px); height: auto; aspect-ratio: 1; }
  .wood-compare__label { padding: 14px 14px; font-size: 11px; }
  .wood-compare__cell  { padding: 14px 16px; font-size: 13px; }
  .wood-compare__name  { font-size: 14px; }
  .wood-compare__price strong { font-size: 16px; }
  .wood-compare-empty { padding: 50px 16px; }
  .wood-compare-empty__icon { width: 70px; height: 70px; }
  .wood-compare-empty__icon i { font-size: 32px; }
  .wood-compare-empty__title { font-size: 20px; }
}

/* ============================================================================
   Toast notifications + address edit form + add-to-cart flash
   ============================================================================ */

.wood-toasts {
  position: fixed;
  right: 20px;
  bottom: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 9999;
  pointer-events: none;
}
.wood-toast {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 240px;
  max-width: 340px;
  padding: 12px 16px;
  background: var(--primary);
  color: #fff;
  border-radius: 10px;
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
  font-size: 13px;
  font-weight: 500;
  transform: translateX(20px);
  opacity: 0;
  transition: transform .25s ease, opacity .25s ease;
}
.wood-toast.is-in { transform: translateX(0); opacity: 1; }
.wood-toast i { font-size: 18px; flex: 0 0 auto; }
.wood-toast--cart { background: var(--primary); }
.wood-toast--fav  { background: var(--accent); }
.wood-toast--cmp  { background: #2c3e50; }
@media (max-width: 600px) {
  .wood-toasts { right: 12px; left: 12px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
  .wood-toast { width: 100%; max-width: none; min-width: 0; align-items: flex-start; line-height: 1.35; }
}

/* Demo form alanı doğrulama hatası — required alanlar boşsa kırmızı çerçeve */
.wood-field-error,
input.wood-field-error,
textarea.wood-field-error,
select.wood-field-error {
  border-color: #d9534f !important;
  box-shadow: 0 0 0 3px rgba(217, 83, 79, 0.15) !important;
}

/* Add-to-cart flash state */
.wood-product__cta-main.is-added,
.wood-product__cart.is-added,
.wood-pinfo__cart.is-added,
.wood-fav__cart.is-added,
.wood-compare__cart.is-added {
  background: #2e7d32 !important;
  color: #fff !important;
  border-color: #2e7d32 !important;
  pointer-events: none;
}
.wood-product__cta-icon.is-added,
.wood-product__act.is-added,
.wood-pinfo__sub-btn.is-added,
.wood-compare__fav.is-added {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}

/* Account address — edit form */
.wood-account-addr__back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 18px;
  font-size: 13px;
  color: var(--muted);
  text-decoration: none;
  font-weight: 500;
  transition: color .15s ease;
}
.wood-account-addr__back:hover { color: var(--primary); }
.wood-account-addr__back i { font-size: 14px; }

.wood-account-addr__edit-head { margin-bottom: 22px; }
.wood-account-addr__edit-h {
  font-family: var(--ff-display, "Cormorant Garamond", serif);
  font-size: 26px;
  font-weight: 600;
  color: var(--primary);
  margin: 0 0 8px;
}
.wood-account-addr__edit-lede {
  font-size: 14px;
  color: var(--muted);
  margin: 0;
  line-height: 1.6;
}

.wood-account-addr__form {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 720px;
}
.wood-account-addr__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}
.wood-account-addr__grid--2 { grid-template-columns: 1fr 1fr; }
@media (max-width: 600px) {
  .wood-account-addr__grid--2 { grid-template-columns: 1fr; }
}

.wood-account-addr__field { display: flex; flex-direction: column; }
.wood-account-addr__label {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  margin-bottom: 8px;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.wood-account-addr__label .is-req { color: var(--accent); margin-left: 2px; }
.wood-account-addr__label .is-opt { color: var(--muted); font-weight: 400; text-transform: none; letter-spacing: 0; }

.wood-account-addr__input {
  width: 100%;
  height: 46px;
  padding: 0 14px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 14px;
  color: var(--primary);
  font-family: inherit;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.wood-account-addr__input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(213, 154, 110, 0.15);
}

.wood-account-addr__select-wrap { position: relative; }
.wood-account-addr__select-wrap select.wood-account-addr__input {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 38px;
  background-color: #fff;
  cursor: pointer;
}
.wood-account-addr__select-wrap > i {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  color: var(--muted);
  pointer-events: none;
}

.wood-account-addr__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 8px;
}
.wood-account-addr__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  padding: 0 22px;
  background: var(--primary);
  color: #fff;
  border: 1px solid var(--primary);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all var(--transition);
}
.wood-account-addr__submit:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.wood-account-addr__cancel {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  text-decoration: none;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  transition: color .15s ease;
}
.wood-account-addr__cancel:hover { color: var(--primary); }

/* ============================================================================
   Brand listing (markalar.php) + Brand detail (marka.php)
   ============================================================================ */

/* ---------------- Brand directory (markalar.php) ---------------- */
.wood-brand-listing { background: #fff; }
.wood-brands-dir { padding: 60px 0 80px; }
@media (max-width: 768px) { .wood-brands-dir { padding: 40px 0 60px; } }

.wood-brands-dir__search {
  position: relative;
  max-width: 460px;
  margin: 0 auto 50px;
}
.wood-brands-dir__search-input {
  width: 100%;
  height: 46px;
  padding: 0 50px 0 22px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 14px;
  color: var(--primary);
  font-family: inherit;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.wood-brands-dir__search-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(213, 154, 110, 0.15);
}
.wood-brands-dir__search-btn {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: transparent;
  border: 0;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color .15s ease;
}
.wood-brands-dir__search-btn:hover { color: var(--accent); }
.wood-brands-dir__search-btn i { font-size: 16px; }

.wood-brands-dir__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 28px 22px;
  margin-bottom: 40px;
}
@media (max-width: 1100px) { .wood-brands-dir__grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 768px)  { .wood-brands-dir__grid { grid-template-columns: repeat(3, 1fr); gap: 20px 14px; } }
@media (max-width: 480px)  { .wood-brands-dir__grid { grid-template-columns: repeat(2, 1fr); } }

.wood-brands-dir__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 22px 14px 18px;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 10px;
  text-decoration: none;
  transition: all var(--transition);
}
.wood-brands-dir__card:hover {
  border-color: var(--border);
  background: var(--surface);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
}
.wood-brands-dir__logo {
  width: 100%;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  filter: grayscale(100%);
  opacity: .65;
  transition: all var(--transition);
}
.wood-brands-dir__logo img {
  max-width: 130px;
  max-height: 50px;
  object-fit: contain;
}
.wood-brands-dir__monogram {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-main, #f5f2ec);
  color: var(--primary, #1a1a1a);
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
}
.wood-brands-dir__card:hover .wood-brands-dir__logo {
  filter: grayscale(0);
  opacity: 1;
}
.wood-brands-dir__name {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary);
  margin-bottom: 4px;
  letter-spacing: 0.3px;
}
.wood-brands-dir__count {
  font-size: 11px;
  color: var(--muted);
  letter-spacing: 0.4px;
  text-transform: uppercase;
}
.wood-brands-dir__card.is-hidden { display: none !important; }

.wood-brands-dir__empty {
  text-align: center;
  padding: 40px 20px;
  margin: 0 0 30px;
  font-size: 14px;
  color: var(--muted);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
}

.wood-brands-dir__alpha {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 4px;
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid var(--border);
}
.wood-brands-dir__alpha-btn {
  min-width: 30px;
  height: 30px;
  padding: 0 8px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--primary);
  cursor: pointer;
  transition: all .15s ease;
  letter-spacing: 0.3px;
}
.wood-brands-dir__alpha-btn:hover:not(:disabled) {
  border-color: var(--primary);
  background: var(--primary);
  color: #fff;
}
.wood-brands-dir__alpha-btn.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.wood-brands-dir__alpha-btn.is-disabled,
.wood-brands-dir__alpha-btn[disabled] {
  color: var(--border);
  background: transparent;
  cursor: not-allowed;
  opacity: .55;
}
.wood-brands-dir__alpha-btn--all {
  margin-left: 6px;
  padding: 0 14px;
  font-size: 11px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

/* ---------------- Brand detail page (marka.php) ---------------- */
.wood-brand-page .wood-page-hero__image {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wood-brand-hero__logo-frame img {
  max-width: 220px !important;
  max-height: 70% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  filter: grayscale(20%);
}

/* Brand sidebar — search input within details panel */
.wood-brand-side__search {
  position: relative;
  margin: 4px 0 6px;
}
.wood-brand-side__search-input {
  width: 100%;
  height: 38px;
  padding: 0 36px 0 14px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 13px;
  color: var(--primary);
  font-family: inherit;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.wood-brand-side__search-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(213, 154, 110, 0.12);
}
.wood-brand-side__search > i {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  color: var(--muted);
  pointer-events: none;
}

.wood-brand-side__list {
  max-height: 360px;
  overflow-y: auto;
  padding-right: 4px;
}
.wood-brand-side__list::-webkit-scrollbar { width: 6px; }
.wood-brand-side__list::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 3px;
}
.wood-brand-side__list li.is-hidden { display: none !important; }

.wood-brand-side__empty {
  margin: 8px 0 0;
  padding: 12px;
  text-align: center;
  font-size: 12px;
  color: var(--muted);
  background: var(--surface);
  border-radius: 6px;
}

/* Sidebar "Tüm markaları gör" link (also reused in shop drawer) */
.wood-shop-filter__more {
  list-style: none !important;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.wood-shop-filter__more-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  transition: color .15s ease;
}
.wood-shop-filter__more-link:hover { color: var(--primary); }
.wood-shop-filter__more-link i { font-size: 13px; transition: transform .15s ease; }
.wood-shop-filter__more-link:hover i { transform: translateX(3px); }

/* ============================================================================
   Toast notifications + address edit form + add-to-cart flash
   ============================================================================ */

/* Toast container */
.wood-toasts {
  position: fixed;
  right: 20px;
  bottom: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 9999;
  pointer-events: none;
}
.wood-toast {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 240px;
  max-width: 340px;
  padding: 12px 16px;
  background: var(--primary);
  color: #fff;
  border-radius: 10px;
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
  font-size: 13px;
  font-weight: 500;
  transform: translateX(20px);
  opacity: 0;
  transition: transform .25s ease, opacity .25s ease;
}
.wood-toast.is-in { transform: translateX(0); opacity: 1; }
.wood-toast i { font-size: 18px; flex: 0 0 auto; }
.wood-toast--cart { background: var(--primary); }
.wood-toast--fav  { background: var(--accent); }
.wood-toast--cmp  { background: #2c3e50; }
@media (max-width: 600px) {
  .wood-toasts { right: 12px; left: 12px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
  .wood-toast { width: 100%; max-width: none; min-width: 0; align-items: flex-start; line-height: 1.35; }
}

/* ====================================================================
   "Yakında" placeholder sayfası — ortalanmış kart, soft surface arkaplan,
   ana sayfa ve iletişim CTA buttonları.
   ==================================================================== */
.wood-soon { background: var(--surface, #f6efe6); padding: 80px 0; }
.wood-soon__card {
  max-width: 640px;
  margin: 0 auto;
  background: #fff;
  border-radius: 16px;
  padding: 56px 48px;
  text-align: center;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.08);
}
.wood-soon__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: var(--surface, #f6efe6);
  color: var(--accent, #c79373);
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.wood-soon__title {
  font-family: var(--font-heading);
  font-size: clamp(28px, 4vw, 38px);
  margin: 0 0 16px;
  color: var(--primary, #2a2a2a);
}
.wood-soon__desc {
  font-size: 15px;
  line-height: 1.7;
  color: var(--muted, #8a7d6a);
  margin: 0 0 32px;
}
.wood-soon__cta {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}
@media (max-width: 600px) {
  .wood-soon { padding: 48px 0; }
  .wood-soon__card { padding: 40px 24px; }
}

/* ---- 404 sayfası — .wood-soon container'ı üzerine kurulu --------------
   Büyük "404" rakam blok'u, kırık bağ ikonu ile aranan URL satırı ve
   sayfa içi arama formu eklendi.  Alt ortak stiller .wood-soon__* zaten
   aynı dosyada tanımlı; burası sadece 404'e özgü override / ek. */
.wood-404__card { padding-top: 24px; }
.wood-404__code {
  display: block;
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: clamp(120px, 18vw, 220px);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--accent, #c79373);
  background: linear-gradient(180deg, var(--accent, #c79373) 0%, rgba(199, 147, 115, 0.35) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin: 0 0 8px;
  user-select: none;
}
.wood-404__badge { background: rgba(213, 76, 76, 0.10); color: #d54c4c; }
.wood-404__path {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  background: var(--surface, #f6efe6);
  border: 1px dashed var(--border, #e8ddcf);
  border-radius: 10px;
  padding: 10px 16px;
  margin: 0 auto 28px;
  font-size: 13px;
  color: var(--muted, #8a7d6a);
}
.wood-404__path code {
  font-family: 'JetBrains Mono', 'Menlo', monospace;
  font-size: 13px;
  color: var(--primary, #2a2a2a);
  background: #fff;
  border-radius: 6px;
  padding: 3px 8px;
  word-break: break-all;
}
.wood-404__path i { font-size: 16px; color: var(--accent, #c79373); }
.wood-404__search {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 480px;
  margin: 32px auto 0;
  padding: 8px 8px 8px 16px;
  background: var(--surface, #f6efe6);
  border: 1px solid var(--border, #e8ddcf);
  border-radius: 999px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.wood-404__search:focus-within {
  border-color: var(--accent, #c79373);
  box-shadow: 0 0 0 3px rgba(199, 147, 115, 0.18);
}
.wood-404__search > i {
  font-size: 18px;
  color: var(--muted, #8a7d6a);
}
.wood-404__search input {
  flex: 1;
  border: 0;
  background: transparent;
  outline: none;
  font-size: 14px;
  color: var(--primary, #2a2a2a);
  min-width: 0;
}
.wood-404__search input::placeholder { color: var(--muted, #8a7d6a); }
.wood-404__search .wood-btn {
  flex-shrink: 0;
  padding: 10px 16px;
  font-size: 13px;
  border-radius: 999px;
}
@media (max-width: 600px) {
  .wood-404__search { flex-direction: column; padding: 12px; border-radius: 16px; }
  .wood-404__search input { width: 100%; padding: 6px 4px; text-align: center; }
  .wood-404__search .wood-btn { width: 100%; justify-content: center; }
}

/* ====================================================================
   Mağaza arama bilgi bandı + boş durum görünümü
   ==================================================================== */
.wood-shop-section__search-info {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  background: var(--surface, #f6efe6);
  border-radius: 10px;
  padding: 14px 18px;
  margin: 0 0 18px;
  font-size: 14px;
  color: var(--primary, #2a2a2a);
}
.wood-shop-section__search-info strong { color: var(--accent, #c79373); }
.wood-shop-section__search-clear {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted, #8a7d6a);
  text-decoration: none;
  transition: color .15s;
}
.wood-shop-section__search-clear:hover { color: var(--accent, #c79373); }
.wood-shop-empty {
  text-align: center;
  padding: 72px 24px;
  background: var(--surface, #f6efe6);
  border-radius: 14px;
}
.wood-shop-empty > i { font-size: 56px; color: var(--accent, #c79373); display: block; margin-bottom: 18px; }
.wood-shop-empty__cta .wood-btn i { font-size: 14px; display: inline-flex; margin: 0; }
.wood-shop-empty__title {
  font-family: var(--font-heading);
  font-size: 24px;
  margin: 0 0 12px;
  color: var(--primary, #2a2a2a);
}
.wood-shop-empty__desc {
  font-size: 14px;
  color: var(--muted, #8a7d6a);
  line-height: 1.7;
  margin: 0 0 24px;
}
.wood-shop-empty__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* ---- /arama (search results) sayfası ----------------------------------
   Hero başlığında sorgu metnini accent renkle vurguluyoruz; toolbar
   üstündeki count satırının sağına "Aramayı temizle" linkini sabitliyoruz.
   Layout zaten kategori sayfasıyla aynı (.wood-category__layout) — bu
   dosyaya sadece search'e özgü mikro dokunuşlar eklendi. */
.wood-search-hero__q {
  color: var(--accent, #c79373);
  font-style: italic;
  white-space: normal;
  word-break: break-word;
}
.wood-search-hero__form {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  max-width: 460px;
  background: #fff;
  border: 1px solid var(--border, #e5dccf);
  border-radius: 10px;
  padding: 6px 6px 6px 14px;
}
.wood-search-hero__form > i {
  font-size: 18px;
  color: var(--muted, #8a7d6a);
  flex-shrink: 0;
}
.wood-search-hero__form input {
  flex: 1 1 auto;
  min-width: 0;
  border: none;
  background: transparent;
  font-size: 14px;
  color: var(--primary, #2a2a2a);
  outline: none;
  -webkit-appearance: none;
}
.wood-search-hero__form input::-webkit-search-cancel-button { -webkit-appearance: none; }
.wood-search-hero__form button {
  flex-shrink: 0;
  border: none;
  border-radius: 8px;
  background: var(--accent, #b9442d);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 9px 18px;
  cursor: pointer;
  transition: opacity .2s ease;
}
.wood-search-hero__form button:hover { opacity: .88; }
@media (max-width: 767px) {
  .wood-search-hero__form { margin-left: auto; margin-right: auto; }
}
.wood-search-results .wood-shop-section__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.wood-search-results__clear {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted, #8a7d6a);
  text-decoration: none;
  transition: color .15s ease;
}
.wood-search-results__clear i { font-size: 16px; }
.wood-search-results__clear:hover { color: var(--accent, #c79373); }

/* ---- 404 sayfası ------------------------------------------------------
   Tema diline uygun "sayfa bulunamadı" ekranı.  Watermark "404" rakamı
   arka planda dekoratif element olarak büyük + soluk durur; ön planda
   pre-title + Playfair başlık + açıklama + arama kutusu + CTA + sık
   ziyaret edilen sayfa linkleri yer alır.  http_response_code(404) PHP
   tarafında set edilir; bu CSS yalnızca görsel sunum içindir. */
.wood-404 {
  background: var(--surface, #f6efe6);
  padding: 80px 0 100px;
  position: relative;
  overflow: hidden;
}
.wood-404__hero {
  position: relative;
}
.wood-404__bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -52%);
  font-family: var(--font-heading);
  font-weight: 900;
  font-size: clamp(220px, 38vw, 460px);
  line-height: .85;
  color: var(--accent, #c79373);
  opacity: .07;
  letter-spacing: -.04em;
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.wood-404__inner {
  position: relative;
  z-index: 1;
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
}
.wood-404__pre {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--accent, #c79373);
  background: #fff;
  padding: 10px 18px;
  border-radius: 999px;
  margin-bottom: 24px;
  box-shadow: 0 6px 20px rgba(0,0,0,.05);
}
.wood-404__pre i { font-size: 16px; }
.wood-404__title {
  font-family: var(--font-heading);
  font-size: clamp(34px, 5vw, 52px);
  font-weight: 700;
  line-height: 1.15;
  color: var(--primary, #2a2a2a);
  margin: 0 0 18px;
}
.wood-404__desc {
  font-size: 15px;
  line-height: 1.75;
  color: var(--muted, #8a7d6a);
  margin: 0 auto 32px;
  max-width: 540px;
}
.wood-404__form {
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid var(--border, #e8ddcf);
  border-radius: 12px;
  padding: 6px 6px 6px 18px;
  max-width: 520px;
  margin: 0 auto 28px;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
  transition: border-color .2s ease, box-shadow .2s ease;
}
.wood-404__form:focus-within {
  border-color: var(--accent, #c79373);
  box-shadow: 0 8px 24px rgba(199, 147, 115, .18);
}
.wood-404__form > i {
  font-size: 18px;
  color: var(--muted, #8a7d6a);
  margin-right: 10px;
}
.wood-404__form input {
  flex: 1;
  border: 0;
  background: transparent;
  font-size: 14px;
  color: var(--primary, #2a2a2a);
  padding: 12px 4px;
  outline: none;
}
.wood-404__form input::placeholder { color: var(--muted, #8a7d6a); }
.wood-404__form button {
  border: 0;
  background: var(--primary, #2a2a2a);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  padding: 12px 22px;
  border-radius: 8px;
  cursor: pointer;
  transition: background .15s ease;
}
.wood-404__form button:hover { background: var(--accent, #c79373); }

.wood-404__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0 0 44px;
}

.wood-404__links {
  border-top: 1px solid var(--border, #e8ddcf);
  padding-top: 28px;
}
.wood-404__links-label {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--muted, #8a7d6a);
  margin-bottom: 16px;
}
.wood-404__links ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 14px;
}
.wood-404__links li { margin: 0; }
.wood-404__links a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  font-weight: 500;
  color: var(--primary, #2a2a2a);
  text-decoration: none;
  padding: 8px 14px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--border, #e8ddcf);
  transition: color .15s ease, border-color .15s ease, transform .15s ease;
}
.wood-404__links a i {
  font-size: 14px;
  color: var(--accent, #c79373);
  transition: transform .2s ease;
}
.wood-404__links a:hover {
  color: var(--accent, #c79373);
  border-color: var(--accent, #c79373);
  transform: translateY(-1px);
}
.wood-404__links a:hover i { transform: rotate(45deg); }

.wood-404__report {
  margin: 32px 0 0;
  font-size: 13px;
  color: var(--muted, #8a7d6a);
}
.wood-404__report a {
  color: var(--accent, #c79373);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}
.wood-404__report a:hover { color: var(--primary, #2a2a2a); }

@media (max-width: 640px) {
  .wood-404 { padding: 56px 0 72px; }
  .wood-404__form { padding: 4px 4px 4px 14px; }
  .wood-404__form button { padding: 10px 16px; font-size: 12px; }
  .wood-404__cta { gap: 10px; }
  .wood-404__cta .wood-btn { flex: 1 1 auto; min-width: 0; }
}

/* ---- woodConfirm — özel onay modalı -----------------------------------
   Native window.confirm() yerine kullanılır (örn. karşılaştırmayı temizle).
   Tam ekran yarı saydam backdrop + ortalanmış kart + ikon + iki buton.
   .is-open class'ı eklendiğinde fade + scale animasyonu ile açılır.
   Body'ye <html overflow:hidden> ile scroll lock; ESC / backdrop / Vazgeç
   ile kapanır, accept butonu odaklı açılır (Enter ile direkt onay). */
.wood-confirm {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease, visibility .22s ease;
}
.wood-confirm.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.wood-confirm__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 16, 12, .55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  cursor: pointer;
}
.wood-confirm__card {
  position: relative;
  width: 100%;
  max-width: 420px;
  background: #fff;
  border-radius: 18px;
  padding: 36px 32px 28px;
  text-align: center;
  box-shadow: 0 28px 60px rgba(0, 0, 0, .28);
  transform: translateY(8px) scale(.96);
  transition: transform .26s cubic-bezier(.2, .8, .2, 1);
}
.wood-confirm.is-open .wood-confirm__card {
  transform: translateY(0) scale(1);
}
.wood-confirm__close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  border: 0;
  background: transparent;
  border-radius: 8px;
  color: var(--muted, #8a7d6a);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, color .15s ease;
}
.wood-confirm__close:hover {
  background: var(--surface, #f6efe6);
  color: var(--primary, #2a2a2a);
}
.wood-confirm__close i { font-size: 18px; }
.wood-confirm__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  margin: 0 auto 18px;
  background: rgba(199, 147, 115, .12);
  color: var(--accent, #c79373);
}
.wood-confirm__icon i { font-size: 30px; }
.wood-confirm--danger .wood-confirm__icon {
  background: rgba(213, 76, 76, .12);
  color: #d54c4c;
}
.wood-confirm--neutral .wood-confirm__icon {
  background: var(--surface, #f6efe6);
  color: var(--primary, #2a2a2a);
}
.wood-confirm__title {
  font-family: var(--font-heading);
  font-size: 22px;
  line-height: 1.3;
  color: var(--primary, #2a2a2a);
  margin: 0 0 10px;
}
.wood-confirm__msg {
  font-size: 14px;
  line-height: 1.65;
  color: var(--muted, #8a7d6a);
  margin: 0 0 24px;
}
.wood-confirm__actions {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}
.wood-confirm__btn {
  flex: 1 1 0;
  min-width: 130px;
  padding: 12px 18px;
  border: 0;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .02em;
  cursor: pointer;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.wood-confirm__btn--cancel {
  background: var(--surface, #f6efe6);
  color: var(--primary, #2a2a2a);
  border: 1px solid var(--border, #e8ddcf);
}
.wood-confirm__btn--cancel:hover {
  background: #fff;
  border-color: var(--accent, #c79373);
  color: var(--accent, #c79373);
}
.wood-confirm__btn--accept {
  background: var(--accent, #c79373);
  color: #fff;
}
.wood-confirm__btn--accept:hover {
  background: var(--primary, #2a2a2a);
}
.wood-confirm--danger .wood-confirm__btn--accept {
  background: #d54c4c;
}
.wood-confirm--danger .wood-confirm__btn--accept:hover {
  background: #b33b3b;
}
.wood-confirm__btn:focus-visible {
  outline: 2px solid var(--accent, #c79373);
  outline-offset: 2px;
}
@media (max-width: 480px) {
  .wood-confirm__card { padding: 30px 22px 22px; border-radius: 14px; }
  .wood-confirm__title { font-size: 19px; }
  .wood-confirm__icon { width: 56px; height: 56px; }
  .wood-confirm__icon i { font-size: 26px; }
  .wood-confirm__actions { flex-direction: column-reverse; }
  .wood-confirm__btn { width: 100%; }
}

/* ======================================================================
   Metin Rengi (global color_text → --text-primary)
   İçerik metni / başlık / ürün adı gibi okunan metinleri global "Metin
   Rengi" ayarına bağlar. Buton, nav, ikon, fiyat, form ve banner gibi
   marka/UI öğeleri --primary (Ana Renk) ve kendi ayarlarında kalır.
   Varsayılanda her iki renk de #1a1a1a olduğu için görsel değişiklik yok.
   ====================================================================== */
.wood-product__title,
.wood-product__name,
.wood-product__name a,
.wood-cat-card__title,
.wood-post__title,
.wood-recent__title,
.wood-blog-card__title a,
.wood-blog-side__title,
.wood-prelated__title,
.wood-pinfo__title,
.wood-blog-detail__lead,
.wood-blog-detail__body,
.wood-blog-detail__body p,
.wood-blog-detail__body h2,
.wood-blog-detail__body h3,
.wood-blog-detail__body ul,
.wood-blog-detail__body ol,
.wood-blog-detail__author-name,
.wood-cart__product-name,
.wood-cart-summary__title,
.wood-checkout-summary__title,
.wood-checkout-summary__item-name,
.wood-fav__product-name,
.wood-account-side__name,
.wood-account-welcome__name,
.wood-account__title,
.wood-account-empty__title,
.wood-compare__name,
.wood-compare-empty__title,
.wood-brands-dir__name,
.wood-mv__title,
.wood-reasons__title,
.wood-locator__title,
.wood-team__name,
.wood-contact-card__title,
.wood-cat-promo__title,
.wood-cat-promo__lede,
.wood-cat-side__title,
.wood-newsletter__title,
.wood-shop-empty__title,
.wood-soon__title,
.wood-404__title,
.wood-confirm__title {
  color: var(--text-primary);
}
.wood-products--featured .wood-product__name,
.wood-products--featured .wood-product__name a,
.wood-shop-grid.is-list .wood-product__name,
.wood-shop-drawer__title,
.wood-shop-filter__title {
  color: var(--text-primary);
}
.wood-ptabs__lead { color: var(--text-primary) !important; }

/* === Filtre listesi: 7+ ögede scrollbar + Kategori/Marka arama === */
.wood-shop-filter__head-tools{display:inline-flex;align-items:center;gap:10px;}
.wood-shop-filter__search-ic{display:inline-flex;align-items:center;justify-content:center;background:none;border:0;padding:0;margin:0;cursor:pointer;line-height:1;font-size:15px;color:var(--muted,#8a7d6a);}
.wood-shop-filter__search-ic:hover,.wood-shop-filter__search-ic.is-active{color:var(--accent,#b9442d);}
.wood-shop-filter__search{margin:8px 0 12px;}
.wood-shop-filter__search[hidden]{display:none;}
.wood-shop-filter__search-input{width:100%;border:1px solid var(--border,#e5dccf);border-radius:8px;padding:8px 11px;font:inherit;font-size:13px;line-height:1.3;background:#fff;color:var(--primary,#2a2a2a);}
.wood-shop-filter__search-input::placeholder{color:var(--muted,#8a7d6a);}
.wood-shop-filter__search-input:focus{outline:none;border-color:var(--accent,#b9442d);box-shadow:none;}
/* Chromium'da scrollbar-width tanımlıysa ::-webkit-scrollbar kuralları yok sayılır ve
   "thin" ~8px çıkar; bu yüzden webkit'te piksel bazlı ince bar, yalnız Firefox'ta thin. */
.wood-shop-filter__list{max-height:314px;overflow-y:auto;padding-right:6px;}
.wood-shop-filter__list::-webkit-scrollbar{width:3px;}
.wood-shop-filter__list::-webkit-scrollbar-track{background:transparent;}
.wood-shop-filter__list::-webkit-scrollbar-thumb{background:#cdbfa9;border-radius:3px;}
@supports not selector(::-webkit-scrollbar){
  .wood-shop-filter__list{scrollbar-width:thin;scrollbar-color:#cdbfa9 transparent;}
}

/* Ürün kartı border'ı her zaman tema sınırı rengini kullansın (currentColor
   sızıntısını engelle) — liste görünümüne geçişte kenarlık flash'i olmasın. */
.wood-shop-grid .wood-product{border-color:var(--border,#ebebeb);}

/* ======================================================================
   Online satışa kapalı (purchase_disabled) — WhatsApp linki + uyarı
   Sepete ekle butonları yerine WhatsApp yeşili "WhatsApp'tan Sor".
   ====================================================================== */
.wood-pinfo__cart--wa,
.wood-product__cta-main--wa,
.wood-product__cart--wa,
.wood-fav__cart--wa,
.wood-compare__cart--wa {
  background: #25D366 !important;
  color: #fff !important;
  border-color: #25D366 !important;
}
.wood-pinfo__cart--wa:hover,
.wood-product__cta-main--wa:hover,
.wood-product__cart--wa:hover,
.wood-fav__cart--wa:hover,
.wood-compare__cart--wa:hover {
  background: #1ebe5d !important;
  color: #fff !important;
  filter: none;
}
.wood-product__act--wa {
  background: transparent;
  color: #25D366;
}
.wood-product__act--wa i { font-size: 17px; }
.wood-product__act--wa:hover { background: #25D366; color: #fff; }

/* PDP: kapalı durumda dikey yerleşim + uyarı kutusu */
.wood-pinfo__buy--disabled {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}
.wood-pinfo__pd-notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  color: #92400e;
  background: #fffbeb;
  border: 1px solid #fcd34d;
  border-radius: 10px;
}
.wood-pinfo__pd-notice i { color: #f59e0b; font-size: 16px; flex-shrink: 0; margin-top: 1px; }

/* =============================================================================
   CMS SAYFASI (page.php — panel > Sayfalar içeriği)
   ============================================================================= */
.wood-cms { padding: 20px 0 72px; }
.wood-cms__prose {
  max-width: 780px;
  margin: 0 auto;
  font-size: 15px;
  line-height: 1.85;
  color: var(--primary, #3d3529);
}

/* Kategori/marka üst-alt içerik alanları — prose'un dar/ortalı kalıbını
   listeleme kolonuna yayar (panelden TinyMCE ile girilir). */
.wood-cat-content.wood-cms__prose { max-width: none; margin: 0 0 22px; font-size: 14px; }
.wood-cat-content--bottom.wood-cms__prose { margin: 28px 0 0; padding-top: 20px; border-top: 1px solid var(--border, #e5decf); }
.wood-cms__prose > :first-child { margin-top: 0; }
.wood-cms__prose h2 { font-size: 22px; font-weight: 600; color: var(--primary, #3d3529); margin: 42px 0 14px; }
.wood-cms__prose h3 { font-size: 18px; font-weight: 600; color: var(--primary, #3d3529); margin: 32px 0 12px; }
.wood-cms__prose h4 { font-size: 15.5px; font-weight: 600; color: var(--primary, #3d3529); margin: 26px 0 10px; }
.wood-cms__prose p { margin: 0 0 16px; }
.wood-cms__prose a { color: var(--accent, #b5895a); text-decoration: underline; text-underline-offset: 3px; }
.wood-cms__prose ul, .wood-cms__prose ol { margin: 0 0 18px; padding-left: 22px; }
.wood-cms__prose li { margin-bottom: 8px; }
.wood-cms__prose ul li::marker { color: var(--accent, #b5895a); }
.wood-cms__prose img { max-width: 100%; height: auto; border-radius: 12px; margin: 22px 0; }
.wood-cms__prose blockquote {
  margin: 24px 0;
  padding: 6px 0 6px 20px;
  border-left: 3px solid var(--accent, #b5895a);
  color: var(--muted, #8a7d6a);
  font-style: italic;
}
.wood-cms__prose strong { color: var(--primary, #3d3529); }
.wood-cms__updated {
  max-width: 780px;
  margin: 42px auto 0;
  padding-top: 18px;
  border-top: 1px solid var(--line, #e8e2d8);
  font-size: 12.5px;
  color: var(--muted, #8a7d6a);
}
.wood-cms__notfound { text-align: center; padding: 40px 0; color: var(--muted, #8a7d6a); }
.wood-cms__home-btn {
  display: inline-block;
  margin-top: 18px;
  padding: 13px 30px;
  background: var(--accent, #b5895a);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  border-radius: 999px;
  text-decoration: none;
}
.wood-cms__home-btn:hover { filter: brightness(0.94); }
@media (max-width: 640px) {
  .wood-cms { padding: 10px 0 52px; }
  .wood-cms__prose { font-size: 14.5px; }
}