/* ==========================================================================
   IKM — پوسته ظاهری روی وودمارت
   --------------------------------------------------------------------------
   هدف: یکسان‌سازی کامل ظاهر وودمارت با دموی تأییدشده.
   ترتیب این فایل مطابق لایه‌های صفحه است:
     ۱. متغیرهای وودمارت      ۶. فرم‌ها و جست‌وجو
     ۲. لایه‌های اصلی صفحه     ۷. ویجت‌ها و سایدبار
     ۳. هدر و نوار بالایی      ۸. کارت‌ها و محتوا
     ۴. عنوان صفحه            ۹. فوتر
     ۵. دکمه‌ها               ۱۰. ووکامرس
   هیچ رنگی هارد‌کد نشده — همه از tokens.css می‌آید.
   ========================================================================== */


/* ==========================================================================
   ۱) متغیرهای وودمارت → توکن‌های ما
   ========================================================================== */

:root,
html,
body,
.woodmart-theme {
  --wd-primary-color: var(--ikm-accent);
  --wd-alternative-color: var(--ikm-steel);

  --wd-text-color: var(--ikm-tx-mute);
  --wd-title-color: var(--ikm-tx);
  --wd-entities-title-color: var(--ikm-tx);
  --wd-entities-title-color-hover: var(--ikm-accent);
  --wd-widget-title-color: var(--ikm-tx);

  --wd-link-color: var(--ikm-tx);
  --wd-link-color-hover: var(--ikm-accent);

  --wd-main-bgcolor: var(--ikm-bg);
  --wd-bg-color: var(--ikm-bg);
  --wd-border-color: var(--ikm-line-c);
  --wd-brd-color: var(--ikm-line-c);

  --wd-form-brd-color: var(--ikm-line-c);
  --wd-form-color: var(--ikm-tx);
  --wd-form-bg: var(--ikm-bg-2);
  --wd-form-placeholder-color: var(--ikm-tx-faint);

  --wd-text-font: var(--ikm-font);
  --wd-title-font: var(--ikm-font);
  --wd-alternative-font: var(--ikm-font);
  --wd-widget-title-font: var(--ikm-font);
  --wd-entities-title-font: var(--ikm-font);
  --wd-header-el-font: var(--ikm-font);

  --wd-text-font-weight: 400;
  --wd-title-font-weight: 800;

  --btn-default-bgcolor: var(--ikm-accent);
  --btn-default-color: var(--ikm-accent-ink);
  --btn-accented-bgcolor: var(--ikm-accent);
  --btn-accented-color: var(--ikm-accent-ink);
}


/* ==========================================================================
   ۲) لایه‌های اصلی صفحه
   وودمارت محتوا را داخل چند لایه تودرتو با پس‌زمینه سفید می‌گذارد.
   این لایه‌ها باید شفاف شوند تا شبکه بلوپرینت بدنه دیده شود.
   ========================================================================== */

html body {
  background-color: var(--ikm-bg) !important;
  color: var(--ikm-tx) !important;
  font-family: var(--ikm-font) !important;
  background-image:
    linear-gradient(var(--ikm-grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--ikm-grid-line) 1px, transparent 1px) !important;
  background-size: var(--ikm-grid-size) var(--ikm-grid-size) !important;
  background-repeat: repeat !important;
  background-attachment: fixed !important;
}

@media (max-width: 1024px) {
  html body { background-attachment: scroll !important; }
}

html body .website-wrapper,
html body .main-page-wrapper,
html body .site-content,
html body .content-layout-wrapper,
html body .wd-content-layout,
html body .content-area,
html body #main,
html body .container,
html body .row {
  background-color: transparent !important;
}


/* ==========================================================================
   ۳) هدر و نوار بالایی
   ========================================================================== */

html body .whb-header,
html body .whb-main-header {
  background-color: transparent;
}

html body .whb-general-header,
html body .whb-header-bottom {
  background-color: var(--ikm-bg-header) !important;
  border-color: var(--ikm-line-c) !important;
  backdrop-filter: blur(10px);
}

/* نوار بالایی سبز پیش‌فرض وودمارت */
html body .whb-top-bar {
  background-color: var(--ikm-bg-3) !important;
  border-bottom: 1px solid var(--ikm-line-c) !important;
  color: var(--ikm-tx-mute);
}
html body .whb-top-bar .wd-header-text,
html body .whb-top-bar a,
html body .whb-top-bar span {
  color: var(--ikm-tx-mute);
  font-size: .78rem;
}
html body .whb-top-bar a:hover { color: var(--ikm-accent); }

html body .wd-tools-element,
html body .wd-header-nav a,
html body .whb-column a {
  color: var(--ikm-tx);
  font-family: var(--ikm-font);
}
html body .wd-tools-element:hover,
html body .wd-header-nav a:hover { color: var(--ikm-accent); }

/* شمارنده سبد خرید */
html body .wd-tools-count,
html body .wd-cart-number {
  background-color: var(--ikm-accent) !important;
  color: var(--ikm-accent-ink) !important;
  font-family: var(--ikm-mono);
  font-weight: 700;
}


/* ==========================================================================
   ۴) عنوان صفحه (نوار مشکی «Blog»)
   ========================================================================== */

html body .page-title,
html body .title-size-default,
html body .wd-page-title {
  background-color: var(--ikm-bg-2) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--ikm-line-c);
  padding-block: 34px;
}

html body .page-title .entry-title,
html body .page-title h1,
html body .wd-page-title h1 {
  color: var(--ikm-tx) !important;
  font-family: var(--ikm-font);
  font-weight: 800;
  font-size: 1.7rem;
  text-shadow: none;
}

/* مسیر راهنما */
html body .wd-breadcrumbs,
html body .woocommerce-breadcrumb,
html body .breadcrumbs {
  color: var(--ikm-tx-faint) !important;
  font-size: .78rem;
}
html body .wd-breadcrumbs a,
html body .woocommerce-breadcrumb a { color: var(--ikm-tx-faint) !important; }
html body .wd-breadcrumbs a:hover,
html body .woocommerce-breadcrumb a:hover { color: var(--ikm-accent) !important; }


/* ==========================================================================
   ۵) دکمه‌ها — همه حالت‌ها
   ========================================================================== */

html body .btn,
html body .button,
html body button.button,
html body a.button,
html body input[type="submit"],
html body button[type="submit"],
html body .searchsubmit,
html body .search-form button,
html body .widget_search button,
html body .wd-search-form button,
html body .single_add_to_cart_button,
html body .wd-buy-now-btn,
html body .added_to_cart,
html body .wp-block-search__button,
html body .btn-color-primary,
html body .btn-style-default {
  background-color: var(--ikm-accent) !important;
  background-image: none !important;
  color: var(--ikm-accent-ink) !important;
  border-color: var(--ikm-accent) !important;
  border-radius: var(--ikm-r-btn) !important;
  font-family: var(--ikm-font) !important;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  transition: filter .15s ease;
}

html body .btn:hover,
html body .button:hover,
html body button.button:hover,
html body a.button:hover,
html body input[type="submit"]:hover,
html body button[type="submit"]:hover,
html body .searchsubmit:hover,
html body .search-form button:hover,
html body .widget_search button:hover,
html body .wd-search-form button:hover,
html body .single_add_to_cart_button:hover,
html body .wd-buy-now-btn:hover,
html body .wp-block-search__button:hover {
  background-color: var(--ikm-accent) !important;
  color: var(--ikm-accent-ink) !important;
  filter: brightness(1.08);
}

/* دکمه‌های ثانویه با حاشیه */
html body .btn-style-bordered,
html body .btn-color-default {
  background-color: var(--ikm-bg-2) !important;
  color: var(--ikm-tx) !important;
  border: 1px solid var(--ikm-line-c) !important;
}
html body .btn-style-bordered:hover,
html body .btn-color-default:hover {
  border-color: var(--ikm-accent) !important;
  color: var(--ikm-accent) !important;
}


/* ==========================================================================
   ۶) فرم‌ها و جست‌وجو
   ========================================================================== */

html body input[type="text"],
html body input[type="email"],
html body input[type="tel"],
html body input[type="url"],
html body input[type="search"],
html body input[type="password"],
html body input[type="number"],
html body textarea,
html body select,
html body .wd-search-form input {
  background-color: var(--ikm-bg-2) !important;
  border: 1px solid var(--ikm-line-c) !important;
  color: var(--ikm-tx) !important;
  font-family: var(--ikm-font) !important;
  border-radius: var(--ikm-r-btn) !important;
  box-shadow: none !important;
}

html body input:focus,
html body textarea:focus,
html body select:focus {
  border-color: var(--ikm-accent) !important;
  outline: none;
}

html body ::placeholder { color: var(--ikm-tx-faint); opacity: 1; }

html body .wd-search-full-screen,
html body .wd-search-dropdown {
  background-color: var(--ikm-bg-2) !important;
  border-color: var(--ikm-line-c) !important;
}


/* ==========================================================================
   ۷) ویجت‌ها و سایدبار
   ========================================================================== */

html body .wd-widget,
html body .widget,
html body .wd-sidebar .widget {
  background-color: var(--ikm-bg-2);
  border: 1px solid var(--ikm-line-c);
  border-radius: var(--ikm-r-card);
  padding: 18px;
  margin-bottom: 16px;
  color: var(--ikm-tx-mute);
}

html body .widget-title,
html body .wd-widget-title,
html body .widgettitle {
  color: var(--ikm-tx) !important;
  font-family: var(--ikm-font) !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  border-color: var(--ikm-line-c) !important;
}

html body .widget ul li,
html body .wd-widget ul li {
  border-color: var(--ikm-line-c) !important;
  color: var(--ikm-tx-mute);
}
html body .widget ul li a { color: var(--ikm-tx-mute); }
html body .widget ul li a:hover { color: var(--ikm-accent); }


/* ==========================================================================
   ۸) کارت‌ها و محتوا
   ========================================================================== */

html body article.post,
html body .wd-post,
html body .blog-post-loop,
html body .post-single-page,
html body .comment-body,
html body .wd-product {
  background-color: var(--ikm-bg-2) !important;
  border: 1px solid var(--ikm-line-c) !important;
  border-radius: var(--ikm-r-card) !important;
  box-shadow: none !important;
}

html body .post-title,
html body .entry-title,
html body .wd-entities-title {
  color: var(--ikm-tx) !important;
  font-family: var(--ikm-font) !important;
}
html body .post-title a:hover,
html body .wd-entities-title a:hover { color: var(--ikm-accent) !important; }

html body .post-category-label,
html body .wd-post-cat a {
  background-color: var(--ikm-accent) !important;
  color: var(--ikm-accent-ink) !important;
  border-radius: 2px !important;
  font-family: var(--ikm-font);
  font-size: .7rem;
}

html body .wd-post-meta,
html body .post-meta,
html body .entry-meta {
  color: var(--ikm-tx-faint) !important;
  font-size: .78rem;
}

html body .page-numbers,
html body .wd-pagination a,
html body .wd-pagination span {
  background-color: var(--ikm-bg-2) !important;
  border: 1px solid var(--ikm-line-c) !important;
  color: var(--ikm-tx-mute) !important;
  border-radius: var(--ikm-r-btn) !important;
  font-family: var(--ikm-mono) !important;
}
html body .page-numbers.current,
html body .wd-pagination .current {
  background-color: var(--ikm-accent) !important;
  border-color: var(--ikm-accent) !important;
  color: var(--ikm-accent-ink) !important;
}

html body table,
html body table th,
html body table td {
  border-color: var(--ikm-line-c) !important;
  color: var(--ikm-tx-mute);
}
html body table th { color: var(--ikm-tx); background-color: var(--ikm-bg-3); }

html body hr { border-color: var(--ikm-line-c); }


/* ==========================================================================
   ۹) فوتر
   ========================================================================== */

html body .footer-container,
html body .wd-footer,
html body .copyrights-wrapper {
  background-color: var(--ikm-bg-2) !important;
  border-top: 1px solid var(--ikm-line-c) !important;
  color: var(--ikm-tx-mute) !important;
}

html body .footer-container a,
html body .copyrights-wrapper a { color: var(--ikm-tx-faint) !important; }
html body .footer-container a:hover,
html body .copyrights-wrapper a:hover { color: var(--ikm-accent) !important; }


/* ==========================================================================
   ۱۰) ووکامرس
   ========================================================================== */

html body .woocommerce-message,
html body .woocommerce-info,
html body .woocommerce-error,
html body .wd-notice {
  background-color: var(--ikm-bg-2) !important;
  border: 1px solid var(--ikm-line-c) !important;
  border-radius: var(--ikm-r-card) !important;
  color: var(--ikm-tx) !important;
}
html body .woocommerce-message { border-right: 3px solid var(--ikm-ok) !important; }
html body .woocommerce-info    { border-right: 3px solid var(--ikm-steel) !important; }
html body .woocommerce-error   { border-right: 3px solid var(--ikm-danger) !important; }

html body .price,
html body .woocommerce-Price-amount,
html body .sku,
html body .wd-product-price {
  font-family: var(--ikm-mono) !important;
}
html body .price ins,
html body .price > .amount { color: var(--ikm-tx) !important; font-weight: 700; }
html body .price del { color: var(--ikm-tx-faint) !important; }

/* ==========================================================================
   نسخه ۳.۴.۳۳ — دکمه شناور سایدبار وودمارت خاموش شد

   بعد از خاموش کردن «Mobile bottom navbar» در تنظیمات قالب مادر،
   وودمارت همان دکمه سایدبار را به شکل شناور وسط لبه صفحه نشان داد.
   کلاسش از DevTools گرفته شد:
   `div.wd-sidebar-opener.wd-action-btn.wd-style-icon.wd-burger-icon`

   کلیک روی آن هیچ کاری نمی‌کرد، چون سایدباری که قرار بود باز کند در
   قالب ما وجود ندارد. صفحه دسته فیلتر خودش را دارد
   (`.ikm-archive__filter-btn`)، پس این دکمه از هر نظر اضافه بود.

   ⚠️ در تنظیمات قالب مادر گزینه‌ای برای خاموش کردنش پیدا نشد؛ برای
   همین اینجا بسته شد. اگر روزی وودمارت نام کلاس را عوض کند، این
   قاعده بی‌اثر می‌شود و دکمه برمی‌گردد — آن موقع کلاس تازه را از
   DevTools بگیر و همین‌جا اضافه کن.
   ========================================================================== */

html body .wd-sidebar-opener,
html body .wd-sticky-sidebar-opener {
  display: none !important;
}