/**
 * استایل‌های اختصاصی قالب BajiStyle
 *
 * این فایل شامل استایل‌هایی است که به‌دلیل ماهیتشان (فونت‌فیس،
 * استایل‌دهی به خروجی‌های هسته‌ای ووکامرس/وردپرس که کلاس Tailwind
 * روی آن‌ها قابل‌اعمال نیست، انیمیشن‌های keyframe پیچیده و موارد
 * خاص RTL) در فایل tailwind.css جای نمی‌گیرند و باید به‌صورت CSS
 * خام نوشته شوند. این فایل بعد از tailwind.css بارگذاری می‌شود
 * (به functions.php مراجعه کنید) تا در صورت تداخل، اولویت بالاتری داشته باشد.
 *
 * @package BajiStyle
 * @since 1.0.0
 */

/* -----------------------------------------------------------------------
 * فونت وزیرمتن (Vazirmatn)
 * توجه: تعریف @font-face فونت در فایل مستقل
 * assets/fonts/vazirmatn/vazirmatn.css قرار دارد و با handle جداگانه
 * 'bajistyle-vazirmatn-font' در functions.php بارگذاری می‌شود تا
 * جایگزینی آینده فونت ساده‌تر باشد.
 * -------------------------------------------------------------------- */

/* -----------------------------------------------------------------------
 * هدر شفاف با تغییر پس‌زمینه هنگام اسکرول
 * -------------------------------------------------------------------- */
.baji-header {
	background-color: transparent;
	color: #ffffff;
}

.baji-header.baji-header-scrolled,
.baji-header[data-scrolled='true'] {
	background-color: #ffffff;
	color: #111111;
	box-shadow: 0 2px 20px rgba(17, 17, 17, 0.06);
}

/* در صفحاتی غیر از صفحه اصلی، هدر از ابتدا پس‌زمینه روشن دارد چون
   معمولاً تصویر هیرو تمام‌صفحه پشت آن قرار ندارد. */
body:not(.home) .baji-header {
	background-color: #ffffff;
	color: #111111;
	box-shadow: 0 2px 20px rgba(17, 17, 17, 0.06);
}

/* -----------------------------------------------------------------------
 * استایل ستاره‌های رتبه‌بندی (bajistyle_star_rating)
 * -------------------------------------------------------------------- */
.baji-star-rating {
	font-size: 0.95rem;
	letter-spacing: 1px;
	direction: ltr;
	unicode-bidi: bidi-override;
}

/* -----------------------------------------------------------------------
 * استایل خروجی پیش‌فرض ووکامرس برای فیلدهای فرم (که از طریق
 * woocommerce_form_field رندر می‌شوند و کلاس Tailwind مستقیم ندارند)
 * -------------------------------------------------------------------- */
.woocommerce-form-row,
.form-row {
	margin-bottom: 1rem;
}

.woocommerce-form-row label,
.form-row label {
	display: block;
	font-size: 0.8125rem;
	margin-bottom: 0.4rem;
	color: #4b5563;
}

.woocommerce-form-row .required,
.form-row .required {
	color: #c9a227;
	text-decoration: none;
}

.woocommerce-input-wrapper input[type='text'],
.woocommerce-input-wrapper input[type='email'],
.woocommerce-input-wrapper input[type='tel'],
.woocommerce-input-wrapper input[type='password'],
.woocommerce-input-wrapper textarea,
.woocommerce-input-wrapper select,
.baji-form-fields input[type='text'],
.baji-form-fields input[type='email'],
.baji-form-fields input[type='tel'],
.baji-form-fields input[type='password'],
.baji-form-fields textarea,
.baji-form-fields select {
	width: 100%;
	border: 1px solid #d1d5db;
	padding: 0.7rem 1rem;
	font-size: 0.875rem;
	background-color: #ffffff;
	transition: border-color 0.2s ease;
}

.woocommerce-input-wrapper input:focus,
.woocommerce-input-wrapper textarea:focus,
.woocommerce-input-wrapper select:focus,
.baji-form-fields input:focus,
.baji-form-fields textarea:focus,
.baji-form-fields select:focus {
	outline: none;
	border-color: #c9a227;
}

/* -----------------------------------------------------------------------
 * نوار قیمت با خط خورده (قیمت قبل از تخفیف)
 * -------------------------------------------------------------------- */
.baji-price del {
	color: #9ca3af;
	margin-left: 0.5rem;
	font-size: 0.85em;
}

.baji-price ins {
	text-decoration: none;
	color: #111111;
	font-weight: 500;
}

.baji-price-on-sale ins {
	color: #c9a227;
}

/* -----------------------------------------------------------------------
 * اسکرول‌بار سفارشی برای پنل‌های کشویی (سبد خرید، جستجو)
 * -------------------------------------------------------------------- */
.baji-cart-panel-content::-webkit-scrollbar {
	width: 4px;
}

.baji-cart-panel-content::-webkit-scrollbar-track {
	background: transparent;
}

.baji-cart-panel-content::-webkit-scrollbar-thumb {
	background-color: #c9a227;
	border-radius: 999px;
}

/* -----------------------------------------------------------------------
 * گالری تصاویر محصول (ووکامرس flexslider + zoom)
 * هسته ووکامرس کلاس‌های .woocommerce-product-gallery را تولید می‌کند؛
 * این بخش آن‌ها را با هویت بصری قالب هماهنگ می‌کند.
 * -------------------------------------------------------------------- */
.woocommerce-product-gallery {
	position: relative;
}

.woocommerce-product-gallery__image {
	background-color: #f8f5ef;
}

.woocommerce-product-gallery__image img {
	width: 100%;
	height: auto;
	display: block;
}

.flex-control-thumbs {
	display: flex;
	gap: 0.75rem;
	margin-top: 1rem;
	list-style: none;
	padding: 0;
}

.flex-control-thumbs li {
	width: 72px;
}

.flex-control-thumbs img {
	cursor: pointer;
	opacity: 0.6;
	transition: opacity 0.2s ease;
	border: 1px solid transparent;
}

.flex-control-thumbs img:hover,
.flex-control-thumbs img.flex-active {
	opacity: 1;
	border-color: #c9a227;
}

/* -----------------------------------------------------------------------
 * تب‌های محصول (توضیحات/مشخصات/نظرات) - خروجی هسته ووکامرس
 * -------------------------------------------------------------------- */
.woocommerce-tabs ul.tabs {
	display: flex;
	gap: 2rem;
	list-style: none;
	padding: 0;
	margin: 0 0 2rem;
	border-bottom: 1px solid #e5e7eb;
}

.woocommerce-tabs ul.tabs li {
	padding-bottom: 0.75rem;
	font-size: 0.875rem;
	letter-spacing: 0.05em;
}

.woocommerce-tabs ul.tabs li a {
	color: #6b7280;
	text-decoration: none;
}

.woocommerce-tabs ul.tabs li.active {
	border-bottom: 2px solid #c9a227;
}

.woocommerce-tabs ul.tabs li.active a {
	color: #111111;
}

.woocommerce-tabs .panel {
	font-size: 0.9rem;
	line-height: 1.9;
	color: #4b5563;
}

/* -----------------------------------------------------------------------
 * انتخاب ویژگی محصول (سایز/رنگ) - دکمه‌های Layered Nav
 * -------------------------------------------------------------------- */
.baji-filter-group .wc-layered-nav-rating,
.baji-filter-group .product-categories,
.baji-filter-group ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.baji-filter-group ul li {
	margin-bottom: 0.6rem;
	font-size: 0.875rem;
	color: #4b5563;
}

.baji-filter-group ul li a {
	text-decoration: none;
	transition: color 0.2s ease;
}

.baji-filter-group ul li a:hover {
	color: #c9a227;
}

/* -----------------------------------------------------------------------
 * پشتیبانی از تراز تصاویر Gutenberg در محتوای صفحات/نوشته‌ها
 * -------------------------------------------------------------------- */
.alignwide {
	margin-right: calc(25% - 25vw);
	margin-left: calc(25% - 25vw);
	max-width: 1000px;
}

.alignfull {
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	max-width: 100vw;
}

.aligncenter {
	margin-right: auto;
	margin-left: auto;
	display: block;
}

/* -----------------------------------------------------------------------
 * چاپ (Print) - مخفی‌سازی عناصر غیرضروری قالب هنگام چاپ
 * -------------------------------------------------------------------- */
@media print {
	.baji-header,
	.baji-footer,
	.baji-cart-panel,
	.baji-mobile-menu,
	.baji-search-panel {
		display: none !important;
	}
}