/* از قالب products_search_by_option_in_cats.tpl.html (بلوک <style> درون‌خطی) به فایل جدا آمد تا کش شود -- مرحله‌ی ۱۱٫۴، ۱۴۰۵/۰۷/۱۵ */
/* Style for the dropdown trigger */
	#price-dropdown-toggle {
		cursor: pointer;
		position: relative;
	}
	#price-dropdown-toggle .fa-chevron-down {
		transition: transform 0.3s ease;
		position: absolute;
		left: 20px;
		right: auto;
		top: 50%;
		transform: translateY(-50%);
		font-size: 14px;
		color: #bbb;
		padding-right: 5px;
		padding-left: 0;
	}
	/* فلش ساده (angle) برای دکمهٔ قیمت */
	#price-dropdown-toggle .fa-chevron-down::before { content: "\f107"; }
	#price-dropdown-toggle .fa-chevron-up::before { content: "\f106"; }
	#price-dropdown-toggle .fa-chevron-up {
		display: none; /* Start hidden */
		transition: transform 0.3s ease;
		position: absolute;
		left: 20px;
		right: auto;
		top: 50%;
		transform: translateY(-50%);
		font-size: 14px;
		color: #bbb;
		padding-right: 5px;
		padding-left: 0;
	}
	#price-dropdown-toggle[aria-expanded="true"] .fa-chevron-down {
		/* Use display none/block instead of rotate for simplicity if only swapping */
		display: none;
		/* OR keep rotate if you prefer that animation */
		/* transform: translateY(-50%) rotate(180deg); */
	}
	#price-dropdown-toggle[aria-expanded="true"] .fa-chevron-up {
		display: inline-block;
	}

	/* Container for the hidden content */
	.price-dropdown-content {
		/* display: none; handled by JS */
		padding: 15px; /* Add more padding */
		margin-top: 5px;
		background-color: #fff;
		position: relative;
		z-index: 10;
		direction: rtl; /* Ensure RTL */
		text-align: right; /* Ensure text-align right */
		border-radius: 6px; /* Added radius */
	}

	/* Style for each input row */
	.price-input-row-sh2 {
		margin-bottom: 5px; /* Reduced margin between input group and words */
	}
	.price-input-row-sh2:last-of-type {
		margin-bottom: 0; /* No margin for the last input row */
	}

	/* NEW: Style for price-in-words */
	.price-in-words {
		font-size: 11px;
		color: #009e96;
		margin-top: 2px; /* Small space above */
		margin-bottom: 10px; /* Space below words before next element */
		min-height: 15px; /* Ensure space even if empty */
		text-align: center; /* Center the text */
		direction: rtl; /* Ensure RTL for word display */
	}

	/* Styling for the 3-part input group (RTL) */
	.price-dropdown-content .input-group {
		direction: ltr; /* Keep LTR for Bootstrap addon order */
		width: 100%;
	}
	.price-dropdown-content .input-group .form-control {
		text-align: right; /* Align text inside input right */
		/* Remove default radius adjusted by addons */
		border-radius: 0;
		/* Original borders for inputs */
		border-bottom: 1px solid #eef2f2 !important;
		border-left: 0px !important;
		border-top: 1px solid #eef2f2 !important; /* Keep top border */
		border-right: 0 !important;
	}

	/* Styling for 'Az'/'Ta' addon (Right side in RTL) */
	.price-dropdown-content .input-group-addon.price-label-addon-sh2 {
		border-right: 1px solid #ccc; /* Standard border */
		border-left: none; /* Remove inner border */
		border-radius: 0 10px 10px 0; /* Round outer right corners */
		min-width: 40px; /* Ensure minimum width */
		text-align: center;
		background-color: #ffffff;
		border-bottom: 1px solid #eef2f2;
		border-left: 0px;
		border-top: 1px solid #eef2f2;
		border-right: 1px solid #eef2f2;
		font-size: 11px;
	}

	/* Styling for 'Toman' addon (Left side in RTL) */
	.price-dropdown-content .input-group-addon.price-unit-addon-sh2 {
		border-left: 1px solid #ccc; /* Standard border */
		border-right: none; /* Remove inner border */
		border-radius: 10px 0 0 10px; /* Round outer left corners */
		min-width: 55px; /* Ensure minimum width */
		text-align: center;
		background-color: #ffffff;
		border-bottom: 1px solid #eef2f2;
		border-left: 1px solid #eef2f2;
		border-top: 1px solid #eef2f2;
		border-right: 0px;
		font-size: 11px;
	}

	/* NEW: Slider Styles */
	.price-range-slider-container {
		padding: 15px 5px 5px 5px; /* Add some padding around slider */
		margin-bottom: 10px; /* Space below slider */
	}
	#price-range-slider {
		direction: ltr; /* Slider must be LTR for correct handle movement */
	}
	.ui-slider {
		position: relative;
		text-align: left;
		background: #e9e9e9;
		border-radius: 3px;
		height: 6px;
	}
	.ui-slider .ui-slider-handle {
		position: absolute;
		z-index: 2;
		width: 23px;
		height: 23px;
		cursor: default;
		border-radius: 50%;
		background: #00d7cc; /* Or your theme color */
		border: 1px solid #00d7cc;
		top: 50%;
		transform: translateY(-50%);
		margin-left: -8px; /* Half width */
		outline: none;
	}
	.ui-slider .ui-slider-range {
		position: absolute;
		z-index: 1;
		font-size: .7em;
		display: block;
		border: 0;
		background-position: 0 0;
		background: #00d7cc; /* Or your theme color */
		border-radius: 3px;
		height: 100%;
	}


	/* Apply button row */
	.price-apply-button-row-sh2 {
		margin-top: 15px; /* Space above button */
		text-align: center; /* Center button */
	}

	/* Apply button style */
	.price-apply-button-row-sh2 .btn {
		display: inline-block; /* Needed for text-align */
		/* Your specific styles */
		width: 30% !important;
		background-color: #00d7cc !important;
		border-color: #00d7cc !important;
		border-radius: 10px !important;
	}

	/* Input number alignment */
	.price-dropdown-content input[type=text].price-filter-input { -moz-appearance: textfield; }
	.price-dropdown-content input[type=text].price-filter-input::-webkit-outer-spin-button,
	.price-dropdown-content input[type=text].price-filter-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

	/* ستون فیلتر دقیقاً به اندازه‌ی کارت ۳۰۰px + پدینگ ۵px (۲.۵+۲.۵) = ۳۰۵px،
	   تا هیچ فضای خالی‌ای کنار فیلتر نماند و فاصله‌ی فیلتر تا گرید محصولات
	   دقیقاً ۵px شود (فقط دسکتاپ ≥۹۹۲px). */
	@media (min-width: 992px) {
		aside.col-md-3.right-col { width: 305px !important; }
		.col-md-9.center-col { width: calc(100% - 305px) !important; }
	}

	/* Shrink the filter module's white card to 300px so it hugs the filter
	   (no leftover whitespace inside the background container) */
	.products_search_by_option_in_cats.mod {
		width: 300px;
		max-width: 100%;          /* never overflow on narrow screens */
		float: right;             /* sit at the sidebar's right edge (RTL) */
	}
	/* Filter fills the now-300px card */
	.products-filters-sh2 {
		width: 100%;
		border: 1px solid #ededed;   /* کادر باریک دورتادور فیلترینگ */
		border-radius: 8px;
	}

	/* Other Filter Styles — FLAT list (no boxed buttons, just thin dividers) */
	.products-filters-sh2 .filter-item-sh2 { padding: 0 !important; }
	.products-filters-sh2 .slide-select-sh2 > span {
    cursor: pointer; 
    position: relative; 
    display: flex; 
    align-items: center; 
    justify-content: flex-start; 
    height: 45px; 
    box-sizing: border-box;
    border: 0; 
    border-radius: 0;
    padding: 0 20px !important; 
    margin-bottom: 0;   
    font-weight: bold; 
    color: #333; 
    background: transparent;
    transition: color .2s ease;
}

.products-filters-sh2 .slide-select-sh2 > span::after {
    content: "";
    position: absolute;
    bottom: 0;
    
    /* Perfect centering logic */
    left: 50%;
    transform: translateX(-50%);
    
    width: 60%; /* Increased from 50% to 60% */
    border-bottom: 1px solid #eee;
}
	.products-filters-sh2 .slide-select-sh2 > span:hover { color: #00b3aa; }
	.products-filters-sh2 .slide-select-sh2 > span i.fa { position: absolute !important; left: 20px !important; right: auto !important; top: 50%; transform: translateY(-50%); transition: transform 0.3s ease; color: #bbb; font-size: 14px; }
	.products-filters-sh2 .slide-select-sh2 > span i.fa-chevron-up { transform: translateY(-50%) rotate(180deg); }
	/* فلش ساده (angle) به‌جای chevron — بدون نیاز به تغییر JS، فقط گلیف عوض می‌شود */
	.products-filters-sh2 .slide-select-sh2 > span i.fa-chevron-down::before,
	.products-filters-sh2 .slide-select-sh2 > span i.fa-chevron-up::before { content: "\f107" !important; }
	/* حذف خط جداکنندهٔ آخرین ردیف تا کنار خط کادر دو خط دیده نشود.
	   دو فرزند آخرِ کانتینر، .clearfix و دکمهٔ موبایل هستند، پس آخرین آیتمِ فیلتر = سومین فرزند از آخر */
	.products-filters-sh2 > .filter-item-sh2:nth-last-child(3) .slide-select-sh2 > span { border-bottom: 0 !important; }
	/* فیلترِ گزینه‌ای/وضعیت: به‌جای دراپ‌داونِ شناور، آکاردئونیِ inline باز می‌شود
	   (خودِ منو کش می‌آید و گزینه‌ها داخل یک فضای مشخصِ scrollable نشان داده می‌شوند) */
	.products-filters-sh2 .filter-opt-list-sh2 { display: none; border: 0; border-bottom: 1px solid #eee; padding: 10px 20px; margin-top: 0px; background-color: #fafafa00; border-radius: 0; position: static; width: 100%; box-sizing: border-box; max-height: 360px; overflow-y: auto; box-shadow: inset 0 2px 4px rgba(0,0,0,0.04); }
	.products-filters-sh2 .filter-opt-list-sh2 ul { list-style: none; padding: 0; margin: 0; }
	.products-filters-sh2 .filter-opt-list-sh2 li {
		display: flex; align-items: center; justify-content: flex-start;
		direction: rtl; text-align: right; 
		
		/* Increased padding slightly to give items a comfortable 15% more breathing room */
		padding: 5px 20px; 
		
		margin: 0 !important; 
		box-sizing: border-box;
	}
	.products-filters-sh2 .filter-opt-list-sh2 li label {
    cursor: pointer; display: inline-block; vertical-align: middle;
    font-size: 13px; color: #555; font-weight: normal;
    width: 100%; text-align: right;
    margin: 0 0 0 0 !important;
    line-height: 1.2; 
}
	.products-filters-sh2 .filter-opt-list-sh2 li input[type="checkbox"],
	.products-filters-sh2 .filter-opt-list-sh2 li input[type="radio"] {
    margin: 0 0 0 0 !important;
    padding: 0 !important;
}

	/* Active Filter Tag Styles (From your Original) */
	.products-filters-sh2 .active-filters-sh2 { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 5px; min-height: 10px; }
	/* وقتی هیچ تگ فیلتری فعال نیست، فضای خالی اضافه بین گزینه‌ها نگیرد */
	.products-filters-sh2 .active-filters-sh2:empty { display: none; margin: 0; min-height: 0; }
	.products-filters-sh2 .active-filter-sh2 { display: inline-flex; align-items: center; background-color: #e9e9e9; border: 1px solid #ddd; padding: 3px 8px; font-size: 12px; white-space: nowrap; width: 95%; }
	.products-filters-sh2 .active-filter-sh2 span { margin-left: 5px; }
	.products-filters-sh2 .active-filter-sh2 i.fa-close { cursor: pointer; font-size: 11px; color: #777; padding: 2px; }
	.products-filters-sh2 .active-filter-sh2 i.fa-close:hover { color: #d9534f; }

	/* یکدست‌کردن سایز فونت همهٔ بخش‌های فیلتر روی 1.5rem
	   (با !important چون بعضی سایزها به‌صورت inline داخل HTML تعریف شده‌اند) */
	.products-filters-sh2 .slide-select-sh2 > span,
	#price-dropdown-toggle.filter-title-sh2,
	.products-filters-sh2 .filter-opt-list-sh2 li,
	.products-filters-sh2 .filter-opt-list-sh2 li label,
	.products-filters-sh2 .filter-search-box-sh2,
	.products-filters-sh2 .filter-search-empty-sh2,
	.products-filters-sh2 .active-filter-sh2 {
		font-size: 11px !important;
	}

	/* Tag Removal Animation (From your Original) */
	.hide-Afilter-sh2 { transition: all 0.3s ease-out !important; opacity: 0 !important; transform: scale(0.8) !important; min-height: 0 !important; height: 0 !important; padding: 0 !important; margin: 0 !important; border-width: 0 !important; overflow: hidden !important; }

	/* Scrollbar styles (From your Original) */
	.price-scroll-container::-webkit-scrollbar { height: 8px; }
	.price-scroll-container::-webkit-scrollbar-thumb { background: #ccc; border-radius: 4px; }
	.price-scroll-container::-webkit-scrollbar-track { background: #f1f1f1; }

	/* --- RE-ADDED CSS for Loading Overlay Animation --- */
	@keyframes zoomInFade { from { opacity: 0; transform: scale(0.8); } to { opacity: 1; transform: scale(1); } }
	@keyframes zoomOutFade { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.8); } }
	.fade_zoom_animation { animation: zoomInFade 0.5s forwards; }
	.fade_zoomout_animation { animation: zoomOutFade 0.5s forwards; }

	/* --- NEW: جستجوی زیرپارامتر داخل هر فیلتر --- */
	/* وقتی باکس سرچ هست، padding بالای لیست را صفر می‌کنیم تا شکافی بالای باکس نماند */
	.products-filters-sh2 .filter-opt-list-sh2.has-search-sh2 { padding-top: 0; }
	.products-filters-sh2 .filter-opt-list-sh2 .filter-search-box-sh2 {
		position: -webkit-sticky; position: sticky; top: 0; z-index: 5;
		width: 100%; display: block; box-sizing: border-box; 
		
		/* 1. Use clean inner padding instead of a massive box shadow hack */
		padding: 5px 20px; 
		margin: 0px 0px 5px 0px; 
		
		border: 0; border-bottom: 1px solid #ddd; border-radius: 0px; font-size: 13px; outline: none;
		
		/* 2. Give it a solid background color so content behind it stays hidden while scrolling */
		background: #ffffff; 
		direction: rtl; text-align: right;
		
		box-shadow: none; 
	}
	.products-filters-sh2 .filter-opt-list-sh2 .filter-search-box-sh2:focus { border-color: #00d7cc; box-shadow: 0 0 0 20px #ffffff00, 0 7px 6px -4px rgba(0,0,0,0.10); }
	.products-filters-sh2 .filter-opt-list-sh2 .filter-search-empty-sh2 { font-size: 12px; color: #999; text-align: center; padding: 6px 0; display: none; }

	/* --- NEW: دکمه «اعمال فیلتر» مخصوص موبایل --- */
	.filter-mobile-apply-wrap-sh2 { display: none; }
	.apply-filters-mobile-sh2 {
		width: 50%; display: block; margin: 0 auto;
		background-color: #00d7cc; color: #fff; border: none;
		border-radius: 10px; padding: 12px; font-size: 15px; font-weight: bold;
		cursor: pointer; box-shadow: 0 -2px 8px rgba(0,0,0,0.08);
	}
	.apply-filters-mobile-sh2:active { opacity: 0.85; }
	@media (max-width: 991px) {
		.filter-mobile-apply-wrap-sh2 {
			display: block; position: -webkit-sticky; position: sticky; bottom: 0; z-index: 50;
			padding: 10px 0; margin-top: 10px;
			background: linear-gradient(to top, #fff 65%, rgba(255,255,255,0));
		}

		/* ===== رفعِ به‌هم‌ریختگیِ فیلتر در محدودهٔ بینابین (تبلت/موبایلِ لنداسکیپ) =====
		   زیر ۹۹۲px ساید‌بار (col-md-3) تمام‌عرض و استک می‌شود و کشوی موبایل هم
		   فعال نیست؛ پس فیلتر باید inline ولی تک‌ستونی و تمام‌عرض رندر شود.
		   (در ≤۷۶۷px اگر دکمهٔ فیلتر باشد، کشوی موبایل با ویژگیِ خاص‌تر اولویت می‌گیرد) */
		.products_search_by_option_in_cats.mod {
			width: 100% !important;   /* لغو عرض ثابت ۳۰۰px */
			float: none !important;
			max-width: 100%;
		}
		.products-filters-sh2 .filter-item-sh2 {
			width: 100% !important;   /* لغو col-xs-3 (۲۵٪) تا چهارتا-چهارتا نشوند */
			float: none !important;
			clear: both;
		}
		/* لیستِ بازشده هم تمام‌عرضِ تک‌ستونی بماند */
		.products-filters-sh2 .filter-opt-list-sh2 ul { width: 100%; }
	}

	/* ===================================================================== */
	/* === NEW: کشوی فیلتر موبایل (Mobile Filter Drawer) — طراحی مدرن ====== */
	/* ===================================================================== */
	/* وقتی فیلتر به کشو منتقل شد، کارت ماژول «جستجوی پیشرفته» در ساید‌بار مخفی شود */
	.filter-box-hidden-sh2 { display: none !important; }
	/* مرحله‌ی ۱۳٫۱ (۱۴۰۵/۰۷/۱۵): همان کار، بی‌انتظار برای JS. از وقتی اسکریپت‌ها defer شدند (۱۱٫۶)
	   کشو پس از اولین رنگ‌آمیزی ساخته می‌شد و در گوشی کل فهرست فیلتر لحظه‌ای بالای صفحه می‌آمد
	   (فیلم Lighthouse: ۱٫۵ ثانیه) و H1 و تصاویر نامزد LCP نمی‌شدند. 767 = MOBILE_BP در bpr-cat-filter.js. */
	@media (max-width: 767px) { .products_search_by_option_in_cats { display: none !important; } }

	.filter-drawer-overlay-sh2 {
		position: fixed; inset: 0; background: rgba(0,0,0,.45);
		opacity: 0; visibility: hidden; transition: opacity .25s ease;
		z-index: 100000;
	}
	.filter-drawer-overlay-sh2.is-open { opacity: 1; visibility: visible; }

	.filter-drawer-sh2 {
		position: fixed; top: 0; right: 0; height: 100%;
		width: 100%; max-width: 100%; background: #fff;
		z-index: 100001; direction: rtl;
		display: flex; flex-direction: column;
		transform: translateX(100%);
		transition: transform .28s cubic-bezier(.4,0,.2,1);
		box-shadow: -6px 0 28px rgba(0,0,0,.18);
		will-change: transform;
	}
	.filter-drawer-sh2.is-open { transform: translateX(0); }

	.filter-drawer-head-sh2 {
		display: flex; align-items: center; justify-content: space-between;
		padding: 14px 16px; border-bottom: 1px solid #eee; flex-shrink: 0;
		background: #fff;
	}
	.filter-drawer-title-sh2 {
		font-family: byekan; font-size: 17px; font-weight: bold; color: #222;
		display: inline-flex; align-items: center; gap: 8px;
	}
	.filter-drawer-title-sh2 .fa { color: #00b3aa; font-size: 16px; }
	.filter-drawer-close-sh2 {
		background: #f3f3f3; border: none; width: 34px; height: 34px; border-radius: 50%;
		font-size: 16px; color: #555; cursor: pointer;
		display: flex; align-items: center; justify-content: center; flex-shrink: 0;
	}
	.filter-drawer-close-sh2:active { background: #e7e7e7; }

	.filter-drawer-body-sh2 {
		flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch;
		padding: 12px 14px 0;
	}
	body.filter-drawer-locked-sh2 { overflow: hidden; }

	/* --- داخل کشو: تک‌ستونی + فونت یک سایز بزرگ‌تر + ظاهر مدرن --- */
	.filter-drawer-body-sh2 .products-filters-sh2 .filter-item-sh2 {
		width: 100% !important; float: none !important; clear: both;
		padding: 0 0 12px 0 !important; margin-bottom: 0;
	}
	.filter-drawer-body-sh2 .slide-select-sh2 > span,
	.filter-drawer-body-sh2 #price-dropdown-toggle {
		font-size: 16px !important;        /* یک سایز بزرگ‌تر */
		padding: 14px 14px !important;
		border: 1px solid #e3e3e3 !important;
		border-radius: 10px !important;
		background: #fafafa;
		font-family: byekan;
	}
	/* لیست هر فیلتر داخل کشو به‌صورت آکاردئونی (inline) باز شود، نه شناور روی بقیه */
	.filter-drawer-body-sh2 .filter-opt-list-sh2 {
		position: static !important; width: 100% !important; left: auto !important;
		box-shadow: none; margin-top: -1px; border-top: none;
		border-radius: 0 0 10px 10px; max-height: 416px;
	}
	.filter-drawer-body-sh2 .filter-opt-list-sh2 li { margin-bottom: 8px; }
	.filter-drawer-body-sh2 .filter-opt-list-sh2 li label {
		font-size: 16px;                   /* آیتم‌های داخل هر فیلتر، ۱ سایز بزرگ‌تر */
		line-height: 1.9; color: #333;
	}
	.filter-drawer-body-sh2 .filter-opt-list-sh2 li input[type=checkbox] {
		width: 18px; height: 18px; vertical-align: middle;
	}
	.filter-drawer-body-sh2 .filter-search-box-sh2 { font-size: 15px; padding: 9px 12px; }
	.filter-drawer-body-sh2 .active-filter-sh2 { font-size: 14px; }
	/* دکمه «اعمال فیلتر» همیشه ته کشو دیده شود */
	.filter-drawer-body-sh2 .filter-mobile-apply-wrap-sh2 {
		display: block; position: -webkit-sticky; position: sticky; bottom: 0; z-index: 50;
		padding: 12px 0; margin-top: 6px;
		background: linear-gradient(to top, #fff 70%, rgba(255,255,255,0));
	}
	.filter-drawer-body-sh2 .apply-filters-mobile-sh2 {
		width: 100%; font-size: 16px; padding: 14px;
	}
/* مرحله‌ی ۱۱٫۲ (۱۴۰۵/۰۷/۱۵): سبک درون‌خطی هر گزینه‌ی فیلتر (~۴۵۰ بایت × ۳۰۰ گزینه) به این کلاس‌ها آمد.
   !important تا مثل style درون‌خطی بر قاعده‌های دیگر غلبه کند؛ getComputedStyle هر ۸۹۹ عنصر پیش و پس یکسان بود. */
.bf-sp{direction:rtl!important;text-align:right!important;font-size:15px!important}
.bf-ul{list-style:none!important;padding:0!important;margin:0!important;direction:rtl!important;text-align:right!important}
.bf-li{direction:rtl!important;text-align:right!important;list-style:none!important;margin-bottom:8px!important;font-size:16px!important}
.bf-in{margin-left:7px!important;margin-right:0!important;vertical-align:middle!important;width:16px!important;height:16px!important}
.bf-lb{font-size:16px!important;font-weight:bold!important;margin-right:0!important;cursor:pointer!important;display:inline-block!important;vertical-align:middle!important}
/* ستون فیلتر دسکتاپ همراه اسکرول (۱۴۰۵/۰۷/۱۵، درخواست کاربر). sticky با overflow-x: hidden روی .container
   کار نمی‌کرد (هر overflow جز visible نگهدارنده‌ی اسکرول می‌سازد)؛ clip همان بریدن افقی است بی نگهدارنده‌ی اسکرول.
   فقط صفحه‌هایی که جعبه‌ی فیلتر دارند و فقط از 992px (زیر آن ستون تمام‌عرض است و گوشی کشو دارد).
   ستون از 15px بالای صفحه می‌ماند و با پایان ردیف محصولات (پیش از فوتر) بالا می‌رود؛ اگر از ارتفاع صفحه
   بلندتر شد خودش اسکرول می‌خورد. مرورگر بی‌پشتیبانی clip همان رفتار قبلی را دارد. */
@media (min-width: 992px) {
	.container:has(.products_search_by_option_in_cats) { overflow-x: clip; }
	aside.right-col:has(.products_search_by_option_in_cats) {
		position: sticky;
		top: 15px;
		max-height: calc(100vh - 30px);
		overflow-x: hidden; /* .row داخلش با margin منفی ۱۵px پهن‌تر است → نوار اسکرول افقی می‌آمد (کاربر) */
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
		/* نوار اسکرول سمت راست (درخواست کاربر): ستون ltr، محتوایش دوباره rtl. رنگ روشن؛ Lighthouse کنتراست
		   فقط متن را می‌سنجد، نه نوار اسکرول. */
		direction: ltr;
		scrollbar-color: #c9ced6 transparent;
	}
	aside.right-col:has(.products_search_by_option_in_cats) > * { direction: rtl; }
	/* Safari/مرورگرهای بی scrollbar-color */
	aside.right-col:has(.products_search_by_option_in_cats)::-webkit-scrollbar { width: 8px; }
	aside.right-col:has(.products_search_by_option_in_cats)::-webkit-scrollbar-track { background: transparent; }
	aside.right-col:has(.products_search_by_option_in_cats)::-webkit-scrollbar-thumb { background: #c9ced6; border-radius: 8px; }
}