/* =========================================================================
   Teslakala — سایدبار فیلترها V3
   طرح: Figma 13335:26485 (جمع‌شده) + 13219:14365 (بازشده) + 13220:12544/12473
   دامنه: فقط .tk-archive-v2  (صفحه‌ی برند .tk-brand-v2 استایل خودش را دارد)
   بعد از product-cat-v2.css لود می‌شود؛ هرجا آنجا !important بوده اینجا هم لازم است.

   ⚠️ مارک‌آپ را افزونه‌ی WOOF می‌سازد و JS قالب (product-cat-v2.js) برچسب‌های
      سه فیلترِ تاگل‌دار را بازنویسی می‌کند — پس فقط CSS، بدون تغییر ساختار.
   ========================================================================= */

.tk-archive-v2 .tk_shop_aside,
.tk-archive-v2 .tk_shop_filter,
.tk-archive-v2 .widget.widget-woof * {
  box-sizing: border-box;
}

/* ---------------------------------------------------------------- پوسته --- */
/* ⚠️ overflow اینجا نگذار: .tooltip_text (ارسال فوری / تحویل حضوری) عرض ۲۵۰px
   دارد و با right:220px عمداً از لبه‌ی چپ بیرون می‌زند — کلیپ می‌شود. */
.tk-archive-v2 .widget.widget-woof {
  padding: 0 0 16px;
  background: #FFFFFF;
  border: 1px solid #E4E9E9;
  border-radius: 0;
}

.tk-archive-v2 .woof.woof_sid.woof_sid_widget { margin-top: 0; }
.tk-archive-v2 .widget.widget-woof .woof_edit_view { display: none; }

/* ------------------------------------------------- تیتر «فیلترها» (بسته) --- */
.tk-archive-v2 #woof_widget-3 .sideboxtitle {
  display: flex;
  flex-direction: row; /* RTL → متن راست، آیکن چپ */
  align-items: center;
  justify-content: flex-start; /* RTL → گروهِ آیکن+متن به راست می‌چسبد */
  gap: 8px;
  height: 60px;
  margin: 0;
  padding: 16px 16px 16px 8px; /* RTL: راست ۱۶ / چپ ۸ */
  border-bottom: 1px solid #E4E9E9;
  font-family: 'Estedad-FD';
  font-weight: 700;
  font-size: 16px;
  line-height: 1.4;
  color: #060707;
  text-align: right;
}

/* طرح: آیکن tune سمت راست و چسبیده به متن → در RTL یعنی ::before (فرزند اول).
   قاعده‌ی قدیمی همین ::before را با list.svg پر می‌کرد؛ فقط تصویرش عوض می‌شود. */
.tk-archive-v2 #woof_widget-3 .sideboxtitle::before {
  content: "";
  display: block !important;
  flex: 0 0 auto;
  order: -1;
  width: 16.3px;
  height: 16.3px;
  padding: 3.85px;
  margin: 0;
  background: url("../../icon/bv2-tune.svg") center / 20px 20px no-repeat;
}

/* ::after فقط در حالت باز (ضربدرِ بستن) معنا دارد، ::before فقط در حالت بسته */
.tk-archive-v2 #woof_widget-3 .sideboxtitle:not(.active)::after { display: none; }
.tk-archive-v2 #woof_widget-3 .sideboxtitle.active::before { display: none !important; }

/* ------------------------------------------------ ردیف فیلتر (۵۶px، بسته) --- */
.tk-archive-v2 .widget.widget-woof .woof_container {
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  box-shadow: none !important;
}

.tk-archive-v2 .widget.widget-woof .woof_container_inner { padding: 0; }

.tk-archive-v2 .widget.widget-woof .woof_container_inner > h4 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  height: 56px;
  margin: 0 !important;
  padding: 16px 20px 16px 12px !important; /* RTL: راست ۲۰ / چپ ۱۲ */
  border: 0 !important;
  border-bottom: 1px solid #F5F6F6 !important;
  background: transparent;
  font-family: 'Estedad-FD' !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  color: #060707 !important;
  text-align: right;
  cursor: pointer;
}

/* chevron_backward — با margin-left:auto به لبه‌ی چپ چسبانده می‌شود */
.tk-archive-v2 .widget.widget-woof .woof_container_inner > h4::after {
  content: "";
  position: static;
  flex: 0 0 auto;
  order: 9;
  width: 24px;
  height: 24px;
  margin: 0;
  margin-inline-start: auto; /* RTL → chevron به لبه‌ی چپ می‌چسبد */
  transform: none; /* قاعده‌ی قدیمی rotate(90deg) داشت */
  background: url("../../icon/left_arrow.svg") center / 20px 20px no-repeat;
}

/* margin-bottom: 70px فقط برای جا بازکردن زیرِ فوترِ fixed در حالت باز است */
.tk-archive-v2 .widget.widget-woof:not(.active) .woof_redraw_zone { margin-bottom: 0; }

.tk-archive-v2 .widget.widget-woof .woof_container_inner > h4:hover {
  background: #F5F6F6;
}

/* نقطه‌ی «این فیلتر فعال است» — طرح: دایره‌ی ۸px قرمز، چسبیده به متن */
.tk-archive-v2 .widget.widget-woof .active_filter_dot,
.tk-archive-v2 .widget.widget-woof .pending_filter_dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin: 0;
  border-radius: 999px;
  background: #ED1C24;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
}

/* --------------------------------------------- ردیف‌های تاگل‌دار (۵۶px) --- */
.tk-archive-v2 .widget.widget-woof .woof_meta_checkbox_container.woof_container_checkbox_final_product_fast_shipping,
.tk-archive-v2 .widget.widget-woof .woof_meta_checkbox_container.woof_container_checkbox_in_person_delivery,
.tk-archive-v2 .widget.widget-woof .woof_checkbox_instock_container.woof_container_stock {
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #F5F6F6;
}

.tk-archive-v2 .widget.widget-woof .woof_meta_checkbox_container.woof_container_checkbox_final_product_fast_shipping:hover,
.tk-archive-v2 .widget.widget-woof .woof_meta_checkbox_container.woof_container_checkbox_in_person_delivery:hover,
.tk-archive-v2 .widget.widget-woof .woof_checkbox_instock_container.woof_container_stock:hover {
  background: #F5F6F6;
}

.tk-archive-v2 .widget.widget-woof .woof_container_checkbox_final_product_fast_shipping > .woof_container_inner,
.tk-archive-v2 .widget.widget-woof .woof_container_checkbox_in_person_delivery > .woof_container_inner,
.tk-archive-v2 .widget.widget-woof .woof_container_stock > .woof_container_inner {
  position: relative;
  display: flex;
  align-items: center;
  height: 56px;
  padding: 16px 20px 16px 12px;
  font-size: 0; /*  های داخل مارک‌آپِ WOOF را خنثی می‌کند */
}

/* <br> پایانیِ WOOF ارتفاع اضافه می‌سازد */
.tk-archive-v2 .widget.widget-woof .woof_container_checkbox_final_product_fast_shipping > .woof_container_inner br,
.tk-archive-v2 .widget.widget-woof .woof_container_checkbox_in_person_delivery > .woof_container_inner br,
.tk-archive-v2 .widget.widget-woof .woof_container_stock > .woof_container_inner br { display: none; }

.tk-archive-v2 .widget.widget-woof .woof_container_checkbox_final_product_fast_shipping > .woof_container_inner > label,
.tk-archive-v2 .widget.widget-woof .woof_container_checkbox_in_person_delivery > .woof_container_inner > label,
.tk-archive-v2 .widget.widget-woof .woof_container_stock > .woof_container_inner > label {
  position: static !important;
  display: flex !important;
  flex-direction: row; /* RTL → متن راست، تاگل چپ */
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible;
  font-family: 'Estedad-FD' !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  line-height: 1.4 !important;
  color: #060707 !important;
  cursor: pointer;
}

.tk-archive-v2 .widget.widget-woof .woof_container_inner > label > span {
  display: inline-flex;
  align-items: center;
  gap: 0;
}

/* تاگل — طرح: ریلِ ۳۲×۱۶، دستگیره‌ی ۸ (Figma toggle_off 31.5×16.5) */
.tk-archive-v2 .widget.widget-woof .toggle-switch {
  position: relative !important; /* ::before با absolute به همین باید تکیه کند */
  flex: 0 0 auto;
  top: auto;
  left: auto;
  width: 32px;
  height: 16px;
  border-radius: 999px;
  background: #CCD5D3;
  transition: background .15s ease;
}

/* حالت فعال. بدونِ این، قاعده‌ی «فقط کالاهای موجود» در product-cat-v2.css
   (`.woof_checkbox_instock:checked+label .toggle-switch` = 0,3,0) به قاعده‌ی
   پایه‌ی بالا (0,4,0) می‌بازد و خاکستری می‌ماند؛ دو تاگل دیگر چون با سلکتورِ id
   نوشته شده‌اند (1,2,0) برنده می‌شوند. اینجا هر سه یک‌جا پوشش داده می‌شوند. */
.tk-archive-v2 .widget.widget-woof input:checked + label .toggle-switch {
  background: #060707;
}

.tk-archive-v2 .widget.widget-woof .toggle-switch::before {
  top: 4px;
  left: 4px;
  width: 8px;
  height: 8px;
  transition: left .15s ease, right .15s ease;
}

.tk-archive-v2 .widget.widget-woof input:checked + label .toggle-switch::before {
  left: auto;
  right: 4px;
}

/* آیکن‌های کنار برچسب (کامیون / فروشگاه) و تولتیپ */
.tk-archive-v2 .widget.widget-woof .woof_container_inner > label img {
  width: 20px;
  height: 20px;
  margin-right: 8px !important;
  vertical-align: middle;
}

.tk-archive-v2 .widget.widget-woof .woof_container_inner > label .tooltip_img {
  width: 16px;
  height: 16px;
  opacity: .55;
}

/* =========================================================================
   حالت باز — «مودال فیلترها» (Figma 13219:14365)
   ========================================================================= */
/* بدون این، درایور زیر هدرِ fixed سایت می‌ماند (توضیح بالای فایل patch) */
.tk-archive-v2 .tk_archive_container_side:has(.widget.widget-woof.active) {
  position: static;
  z-index: auto;
}

.tk-archive-v2 .widget.widget-woof.active {
  width: 345px;
  max-width: calc(100% - 36px);
  height: 100%;
  top: 0;
  right: 0;
  padding: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #FFFFFF;
  border: 0;
  border-left: 1px solid #E4E9E9;
  border-radius: 0;
}

.tk-archive-v2 .widget.widget-woof.active::-webkit-scrollbar { width: 8px; }
.tk-archive-v2 .widget.widget-woof.active::-webkit-scrollbar-track { background: transparent; }
.tk-archive-v2 .widget.widget-woof.active::-webkit-scrollbar-thumb {
  background: #7E928F;
  border-radius: 999px;
}

/* ---- هدر: عنوان راست، دکمه‌ی بستنِ گرد چپ ---- */
.tk-archive-v2 #woof_widget-3 .sideboxtitle.active {
  position: sticky;
  top: 0;
  z-index: 5;
  justify-content: space-between; /* عنوان راست، ضربدر لبه‌ی چپ */
  gap: 16px;
  height: auto;
  min-height: 64px;
  margin: 0;
  padding: 6px 24px 6px 16px; /* RTL: راست ۲۴ / چپ ۱۶ */
  border-bottom: 1px solid #E4E9E9;
  font-weight: 500;
  font-size: 18px;
}

.tk-archive-v2 #woof_widget-3 .sideboxtitle.active::after {
  content: "";
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  margin: 0;
  border-radius: 999px;
  background: url("../../icon/x.svg") center / 24px 24px no-repeat;
  transition: background-color .15s ease;
}

.tk-archive-v2 #woof_widget-3 .sideboxtitle.active:hover::after {
  background-color: #F5F6F6;
}

/* ---- بدنه ---- */
.tk-archive-v2 .widget.widget-woof.active .woof_redraw_zone {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px 16px;
  margin: 0 0 64px;
}

.tk-archive-v2 .widget.widget-woof.active .woof_container {
  display: flex;
  flex-direction: column;
}

/* عنوان گروه — بدون کادر و بدون chevron */
.tk-archive-v2 .widget.widget-woof.active .woof_container_inner > h4 {
  height: auto;
  padding: 0 16px 0 0 !important;
  margin: 0 0 12px !important;
  border-bottom: 0 !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  cursor: default;
}

.tk-archive-v2 .widget.widget-woof.active .woof_container_inner > h4:hover { background: transparent; }
.tk-archive-v2 .widget.widget-woof.active .woof_container_inner > h4::after { display: none; }

/* کادر خاکستریِ گزینه‌ها
   ⚠️ display اینجا ست نمی‌شود: jQuery .show()/.hide() آن را inline می‌نویسد و
   inline از هر قاعده‌ی غیر-!important قوی‌تر است؛ !important هم .hide() را می‌شکند. */
.tk-archive-v2 .widget.widget-woof.active .woof_block_html_items {
  padding: 8px 12px 16px;
  background: #F5F6F6;
  border: 0;
  border-radius: 4px;
}

/* تک‌ستونی طبق طرح. overflow:hidden لازم است — checkheight() در
   product-cat-v2.js برای «مشاهده بیشتر» روی همین <ul> height:96px می‌گذارد. */
.tk-archive-v2 .widget.widget-woof.active .woof_list.woof_list_checkbox {
  display: block;
  width: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.tk-archive-v2 .widget.widget-woof.active .woof_list.woof_list_checkbox > li {
  display: flex;
  align-items: center;
  min-width: 0;
  width: 100%;
  margin: 0 !important;
  padding: 2px 4px !important;
  line-height: 1.4;
  white-space: normal;
}

.tk-archive-v2 .widget.widget-woof.active .woof_list.woof_list_checkbox .woof_childs_list {
  width: 100%;
  padding: 0 20px 0 0;
  list-style: none;
}

.tk-archive-v2 .widget.widget-woof.active .woof_list label,
.tk-archive-v2 .widget.widget-woof.active .woof_checkbox_label {
  display: flex !important;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-family: 'Estedad-FD';
  font-weight: 400 !important;
  font-size: 14px !important;
  line-height: 1.4;
  color: #060707;
  cursor: pointer;
}

.tk-archive-v2 .widget.widget-woof.active .woof_checkbox_count {
  flex: 0 0 auto;
  font-size: 12px;
  color: #7E928F;
}

/* چک‌باکس: ظاهرش از قبل در product-cat-v2.css:1750 مطابق طرح است
   (مربع، بدون گردی، خطِ #060707، :checked مشکی با تیکِ سفید) — دست نمی‌زنیم.
   فقط فاصله‌ی ۸px تا برچسب طبق طرح. */
.tk-archive-v2 .widget.widget-woof.active .woof_list input[type="checkbox"] {
  flex: 0 0 auto;
  margin: 0 0 0 8px;
  cursor: pointer;
}

/* ---- «مشاهده بیشتر» ---- */
.tk-archive-v2 .widget.widget-woof.active .showmore {
  display: inline-flex;
  flex-direction: row; /* RTL → متن راست، chevron چپ */
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 120px;
  height: 40px;
  margin: 8px 0 0;
  padding: 8px 12px 8px 8px; /* RTL: راست ۱۲ / چپ ۸ */
  background: #E4E9E9;
  border-radius: 2px;
  font-family: 'Estedad-FD';
  font-weight: 500;
  font-size: 14px;
  line-height: 1.4;
  color: #060707;
  cursor: pointer;
}

.tk-archive-v2 .widget.widget-woof.active .showmore:hover { background: #CCD5D3; }

.tk-archive-v2 .widget.widget-woof.active .showmore img {
  width: 20px !important;
  height: 20px;
  vertical-align: middle;
}

/* ---- فوتر ثابت ---- */
.tk-archive-v2 .widget.widget-woof.active ~ .woof_submit_search_form_container,
.tk-archive-v2 .woof_submit_search_form_container {
  right: 0;
  bottom: 0;
  left: auto;
  width: 345px;
  max-width: calc(100% - 36px);
  margin: 0;
  padding: 12px 16px;
  background: #FFFFFF;
  border-top: 1px solid #E4E9E9;
  text-align: initial;
}

.tk-archive-v2 .widget.widget-woof.active .woof_submit_search_form_container {
  display: flex !important;
  flex-direction: row; /* RTL → «حذف فیلترها» راست، «نمایش نتایج» چپ */
  align-items: center;
  gap: 16px;
}

.tk-archive-v2 button.button.woof_submit_search_form {
  flex: 1 1 auto;
  order: 2;
  width: auto !important;
  min-width: 0;
  max-width: none !important;
  height: 40px !important;
  margin: 0;
  padding: 8px 24px !important;
  background: #FF9900 !important;
  border-radius: 2px !important;
  font-family: 'Estedad-FD' !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: #060707 !important;
}

.tk-archive-v2 button.button.woof_submit_search_form:hover {
  background: #FFBD1B !important;
}

.tk-archive-v2 button.button.woof_reset_search_form {
  flex: 0 0 auto;
  order: 1;
  min-width: 96px;
  width: auto;
  height: 40px;
  margin: 0;
  padding: 8px 16px;
  background: transparent;
  border-radius: 2px;
  font-family: 'Estedad-FD';
  font-weight: 500;
  font-size: 14px;
  line-height: 1.4;
  color: #060707;
}

.tk-archive-v2 button.button.woof_reset_search_form:hover { background: #F5F6F6; }
.tk-archive-v2 button.button.woof_reset_search_form:disabled { color: #CCD5D3 !important; background: transparent; }

/* در حالت باز، سه فیلترِ تاگل‌دار مخفی‌اند (قاعده‌ی موجود) — حاشیه‌شان هم نباید بماند */
.tk-archive-v2 .widget.widget-woof.active .woof_meta_checkbox_container,
.tk-archive-v2 .widget.widget-woof.active .woof_checkbox_instock_container { border-bottom: 0; }

/* --------------------------------------------------------------- موبایل --- */
@media only screen and (max-width: 767px) {
  .tk-archive-v2 .widget.widget-woof.active,
  .tk-archive-v2 .woof_submit_search_form_container {
    width: 100%;
    max-width: 100%;
  }
}

/* =========================================================================
   تطبیق دقیق با طرح موبایل — Figma 14409:15870
   ------------------------------------------------------------------------
   اعداد مستقیم از فریمِ Mobile گرفته شده‌اند. مقادیرِ Figma در دستگاهِ LTR
   نوشته شده‌اند (pl/pr)، اینجا به فیزیکیِ RTL برگردانده شده: pr-24 => راست ۲۴،
   pl-16 => چپ ۱۶. فقط موبایل؛ درawer دسکتاپ دست‌نخورده می‌ماند.
   ========================================================================= */
@media only screen and (max-width: 767px) {

  /* ---- هدر: عنوان 16/500، ضربدرِ ۱۴px داخل کادرِ ۵۲ ---- */
  .tk-archive-v2 #woof_widget-3 .sideboxtitle.active {
    font-size: 16px;
  }

  .tk-archive-v2 #woof_widget-3 .sideboxtitle.active::after {
    background-size: 14px 14px;
  }

  /* ---- ردیفِ گروه (۵۶px) ---- */
  .tk-archive-v2 .widget.widget-woof .woof_container_inner > h4 {
    padding: 16px 24px 16px 16px !important;
    font-size: 14px !important;
  }

  /* ---- ردیف‌های تاگل‌دار ---- */
  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_final_product_fast_shipping > .woof_container_inner,
  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_in_person_delivery > .woof_container_inner,
  .tk-archive-v2 .widget.widget-woof .woof_container_stock > .woof_container_inner {
    padding: 16px 24px 16px 16px;
  }

  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_final_product_fast_shipping > .woof_container_inner > label,
  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_in_person_delivery > .woof_container_inner > label,
  .tk-archive-v2 .widget.widget-woof .woof_container_stock > .woof_container_inner > label {
    font-size: 14px !important;
  }

  /* ---- بدنه‌ی حالتِ باز: بدون کادر خاکستری، پدینگِ ۱۶/۲۴/۱۶/۳۲ ---- */
  .tk-archive-v2 .widget.widget-woof.active .woof_redraw_zone {
    gap: 0;
    padding: 16px 24px 16px 32px;
  }

  .tk-archive-v2 .widget.widget-woof.active .woof_block_html_items {
    padding: 0;
    background: transparent;
    border-radius: 0;
  }

  /* ---- آیتمِ چک‌باکس — کامپوننتِ Figma «Check-box»، نسخه‌ی موبایل ----
     تفاوتش با دسکتاپ فقط دو چیز است: ارتفاع ۴۰ و padding 6px 4px.
     (۴۰ − ۶×۲ = ۲۸ = ارتفاعِ Frame 430)
     min-height به‌جای height: در موبایل li ها white-space: normal دارند و
     نامِ بلندِ ترم‌ها می‌شکند؛ با ارتفاعِ ثابت متن از کادر بیرون می‌زد. */
  .tk-archive-v2 .widget.widget-woof.active .woof_list.woof_list_checkbox > li {
    box-sizing: border-box;
    gap: 8px;
    min-height: 40px;
    padding: 6px 4px !important;
    border-radius: 4px;
  }

  /* اسلاتِ آیکن ۲۸ = مربعِ ۱۹.۸۳ + مارجینِ افقی ۴.۰۹
     (مارجینِ منفیِ inline ی WOOF روی .woof_checkbox_term هم همین‌جا خنثی می‌شود) */
  .tk-archive-v2 .widget.widget-woof.active input.woof_checkbox_term {
    flex: 0 0 19.83px;
    margin: 0 4.09px !important;
    background: transparent;
  }

  /* بدون این، سلکتورِ بالا (specificity بیشتر) حالتِ تیک‌خورده را هم شفاف می‌کرد */
  .tk-archive-v2 .widget.widget-woof.active input.woof_checkbox_term:checked {
    background: #060707;
  }

  .tk-archive-v2 .widget.widget-woof.active .woof_list.woof_list_checkbox > li > label {
    margin: 0;
    padding: 0;
    font-family: 'Estedad-FD';
    font-weight: 400;
    font-size: 14px !important;
    line-height: 1.4;
    color: #060707;
    text-align: right;
  }

  /* ---- فوتر: بالا ۱۲ / پایین ۱۶ ---- */
  .tk-archive-v2 .woof_submit_search_form_container {
    padding: 12px 16px 16px;
  }
}


/* =========================================================================
   مودال فیلترِ موبایل — تکمیلِ تطبیق با Figma 14409:15870
   ========================================================================= */
@media only screen and (max-width: 767px) {

  /* ---- هدرِ حالتِ لیست: آیکنِ tune نداریم، ضربدر داریم ---- */
  .tk-archive-v2 #woof_widget-3 .sideboxtitle::before {
    display: none !important;
  }

  .tk-archive-v2 #woof_widget-3 .sideboxtitle {
    justify-content: space-between;
    height: auto;
    min-height: 64px;
    padding: 6px 24px 6px 16px;
    font-weight: 500;
    font-size: 16px;
  }

  .tk-archive-v2 #woof_widget-3 .sideboxtitle.popup_active::after {
    content: "";
    display: block;
    flex: 0 0 auto;
    width: 52px;
    height: 52px;
    margin: 0;
    border-radius: 999px;
    /* گلیفِ داخلِ x.svg فقط ۱۱.۳۰۷ از ویوباکسِ ۲۴ است؛ برای گلیفِ ۱۴px طرح
       باید خودِ فایل در 24 × 14/11.307 = 29.7px رندر شود. */
    background: url("../../icon/x.svg") center / 29.7px 29.7px no-repeat;
  }

  /* ---- هدرِ حالتِ بازشده: دکمه‌های واقعی جای شبه‌المان ---- */
  .tk-archive-v2 #woof_widget-3 .sideboxtitle.active::after {
    display: none;
  }

  .tk-archive-v2 #woof_widget-3 .sideboxtitle.active {
    gap: 0;
  }

  .tk-archive-v2 .sideboxtitle .tk_v2_fh_back,
  .tk-archive-v2 .sideboxtitle .tk_v2_fh_close {
    flex: 0 0 auto;
    width: 52px;
    height: 52px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 999px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
  }

  /* گلیفِ rightarrow.svg در اندازه‌ی طبیعیِ ۲۴px برابرِ ۱۸.۲×۱۲.۵۵ می‌شود —
     دقیقاً همان اندازه‌ی east در طرح. */
  .tk-archive-v2 .sideboxtitle .tk_v2_fh_back {
    background-image: url("../../icon/rightarrow.svg");
    background-size: 24px 24px;
  }

  .tk-archive-v2 .sideboxtitle .tk_v2_fh_close {
    background-image: url("../../icon/x.svg");
    background-size: 29.7px 29.7px;
  }

  .tk-archive-v2 .sideboxtitle .tk_v2_fh_title {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-width: 0;
    padding: 0 16px;
    overflow: hidden;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.4;
    color: #060707;
    text-align: right;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  /* ---- تاگل‌ها: هر سه دقیقاً روی لبه‌ی چپ، هم‌تراز با chevronها ----
     چیدمانِ داخلیِ لیبل در سه ردیف فرق دارد (آیکن/تولتیپ)، پس به‌جای تکیه بر
     space-between، تاگل به لبه پین می‌شود. ردیف از قبل position:relative است. */
  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_final_product_fast_shipping .toggle-switch,
  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_in_person_delivery .toggle-switch,
  .tk-archive-v2 .widget.widget-woof .woof_container_stock .toggle-switch {
    position: absolute !important;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
  }

  /* ---- فوتر: در حالتِ لیست هم باید flex باشد، وگرنه «نمایش نتایج» کش نمی‌آید
     (قاعده‌ی flex فقط پشتِ .active بود و حالتِ لیست .active ندارد) ---- */
  .tk-archive-v2 .woof_submit_search_form_container {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    gap: 16px;
  }

  /* طرح: «حذف فیلترها» مشکی است نه قرمز */
  .tk-archive-v2 .woof_submit_search_form_container button.button.woof_reset_search_form {
    position: static !important;
    width: auto;
    height: 40px;
    color: #060707;
    font-size: 14px;
  }
}

/* =========================================================================
   مودال فیلترِ موبایل — رفعِ تداخل‌ها با قواعدِ !important در product-cat-v2.css
   ========================================================================= */
@media only screen and (max-width: 767px) {

  /* ---- هدر: 16/500 (قاعده‌ی پایه 700 است) ---- */
  .tk-archive-v2 #woof_widget-3 .sideboxtitle,
  .tk-archive-v2 #woof_widget-3 .sideboxtitle.active {
    font-weight: 500 !important;
    font-size: 16px !important;
  }

  /* ---- تاگل‌ها هم‌تراز روی ۱۶px ----
     product-cat-v2.css در همین بریک‌پوینت برای «موجودی» left:8px و برای دو
     تای دیگر left:24px می‌گذارد، هر دو !important. */
  .tk-archive-v2 .widget.widget-woof .woof_checkbox_instock_container .toggle-switch,
  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_in_person_delivery .toggle-switch,
  .tk-archive-v2 .widget.widget-woof .woof_container_checkbox_final_product_fast_shipping .toggle-switch {
    left: 16px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  /* ---- حالتِ بازشده: فقط گروهِ انتخاب‌شده ----
     filters-v3 خودش بالاتر روی همه‌ی .woof_container در حالت active
     display:flex می‌گذارد (0,4,0) و قاعده‌ی «بقیه مخفی» (0,3,0) را می‌شکند. */
  .tk-archive-v2 .widget.widget-woof.active .woof_container {
    display: none !important;
  }

  .tk-archive-v2 .widget.widget-woof.active .woof_container.active {
    display: flex !important;
  }

  /* عنوانِ گروه به هدر منتقل شده، پس داخل بدنه تکرار نشود */
  .tk-archive-v2 .widget.widget-woof.active .woof_container.active > .woof_container_inner > h4 {
    display: none !important;
  }

  /* ---- بدنه: پدینگِ طرح، بدون اسکرولِ داخلی ----
     product-cat-v2.css روی ul.woof_list ارتفاعِ ثابتِ calc(100vh - 230px) و
     overflow:scroll می‌گذارد؛ طرح اسکرولِ داخلی ندارد. */
  .tk-archive-v2 .widget.widget-woof.active .woof_redraw_zone {
    gap: 0;
    padding: 16px 24px 16px 32px;
    margin: 0 0 68px;
  }

  .tk-archive-v2 .widget.widget-woof.active ul.woof_list {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* ---- ردیفِ چک‌باکس: طرح خطِ جداکننده ندارد ---- */
  .tk-archive-v2 .widget.widget-woof.active .woof_list.woof_list_checkbox > li {
    border-bottom: 0 !important;
  }

  /* ---- «حذف فیلترها» مشکی است نه قرمز ---- */
  .tk-archive-v2 .woof_submit_search_form_container button.button.woof_reset_search_form {
    color: #060707 !important;
  }
}

/* =========================================================================
   فوترِ مودالِ موبایل — Figma: ارتفاع ۶۸ (12/16/16)، gap ۱۶،
   «نمایش نتایج» flex-grow:1 و «حذف فیلترها» min-width ۹۶
   ------------------------------------------------------------------------
   product-cat-v2.css در همین بریک‌پوینت به کانتینر
   `width: calc(100% - 32px) !important; right: 0 !important` می‌دهد، یعنی کل
   فوتر ۳۲px از لبه‌ی چپ عقب می‌افتد و دکمه‌ی نارنجی تا لبه کش نمی‌آید.
   ========================================================================= */
@media only screen and (max-width: 767px) {

  .tk-archive-v2 .woof_submit_search_form_container {
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 16px 16px !important;
    gap: 16px;
    align-items: center;
  }

  .tk-archive-v2 button.button.woof_submit_search_form {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 40px !important;
    padding: 8px 24px !important;
    border-radius: 2px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
  }

  .tk-archive-v2 button.button.woof_reset_search_form {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 96px !important;
    height: 40px !important;
    padding: 8px 16px !important;
    border-radius: 2px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
  }
}


/* =========================================================================
   آیتمِ چک‌باکسِ سایدبارِ دسکتاپ — طبق کامپوننتِ Figma «Check-box»
   ------------------------------------------------------------------------
   نگاشتِ دامپِ Figma به DOM ی WOOF (<li> > <input> + <label>):
     Check-box  104×32، padding 2px 4px، radius 4     → روی <li>
     Frame 430  ردیف، gap 8، ارتفاع 28                → همان <li> (بدون رَپر)
     Icons      اسلاتِ 28×28                          → margin افقیِ 4.09 روی input
     check_box_outline_blank  inset 14.58٪ از 28      → 19.83px (همان مقدارِ فعلی)
     برچسب      Estedad-FD 400 / 14px / 140٪ / #060707
   مودالِ موبایل بیرونِ این مدیا-کوئری است و دست‌نخورده می‌ماند.

   ⚠️ استایلِ inline ی WOOF این‌ها را می‌دهد و باید شکست بخورند:
        .woof_list li { padding: 0 !important }
        .woof_list label { font-size: 13px }
        .woof_checkbox_term { margin-top: -10px }
   ========================================================================= */
@media only screen and (min-width: 768px) {

  .tk-archive-v2 .widget.widget-woof .woof_list.woof_list_checkbox > li {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    height: 32px;
    padding: 2px 4px !important;
    border-radius: 4px;
    line-height: normal;
  }

  /* مربعِ رسم‌شده همان ۱۹.۸۳ می‌ماند؛ مارجینِ افقی اسلاتِ ۲۸ را می‌سازد
     (و mارجینِ منفیِ inline ی WOOF را هم خنثی می‌کند) */
  .tk-archive-v2 .widget.widget-woof input.woof_checkbox_term {
    flex: 0 0 19.83px;
    margin: 0 4.09px !important;
    background: transparent;
  }

  /* بدون این، سلکتورِ بالا (specificity بیشتر) حالتِ تیک‌خورده را هم شفاف می‌کرد */
  .tk-archive-v2 .widget.widget-woof input.woof_checkbox_term:checked {
    background: #060707;
  }

  .tk-archive-v2 .widget.widget-woof .woof_list.woof_list_checkbox > li > label {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    font-family: 'Estedad-FD';
    font-weight: 400;
    font-size: 14px !important;
    line-height: 1.4;
    color: #060707;
    text-align: right;
  }

  /* هاورِ آیتم — Fill: Gray/100 (radius را خودِ li دارد) */
  .tk-archive-v2 .widget.widget-woof .woof_list.woof_list_checkbox > li:hover {
    background: #F5F6F6;
  }
}