/**
 * Taraazik component styles.
 * همهٔ رنگ‌ها و اندازه‌ها از توکن‌های theme.json — هیچ مقدار برند hard-code نیست.
 * فقط خواص منطقی CSS؛ موبایل‌اول با min-width.
 */

/* ---------- پایه ---------- */

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* padding کناری کانتینر: ۱۶px موبایل → ۲۴px از ۶۴۰px به بالا (بخش ۵) */
:root {
	--wp--style--root--padding-right: var(--wp--preset--spacing--40);
	--wp--style--root--padding-left: var(--wp--preset--spacing--40);
}

@media (min-width: 640px) {
	:root {
		--wp--style--root--padding-right: var(--wp--preset--spacing--50);
		--wp--style--root--padding-left: var(--wp--preset--spacing--50);
	}
}

/* فوکوس همهٔ عناصر تعاملی (بخش ۶) */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--mint);
	outline-offset: 2px;
}

.taraazik-dark :where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
	outline-color: var(--wp--preset--color--mint-200);
}

/* لینک پرش به محتوا (خروجی خودکار وردپرس) */
.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--navy);
	border-radius: var(--wp--custom--radius--md);
	box-shadow: var(--wp--custom--shadow--lg);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--50);
	z-index: 100000;
}

/* اعداد جدولی برای مبلغ و آمار */
.taraazik-nums {
	font-variant-numeric: tabular-nums;
}

/* شناسه‌های LTR داخل متن فارسی */
bdi[dir="ltr"] {
	unicode-bidi: isolate;
}

/* آیکون‌های جهت‌دار در RTL آینه شوند */
[dir="rtl"] .icon-dir {
	transform: scaleX(-1);
}

/* عرض متن بدنهٔ نوشته‌ها */
.wp-block-post-content > p {
	max-inline-size: 65ch;
}

/* موشن (بخش ۵) */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
	}
}

/* ---------- سکشن ---------- */

.taraazik-section {
	padding-block: var(--wp--preset--spacing--80);
}

@media (min-width: 1024px) {
	.taraazik-section {
		padding-block: var(--wp--preset--spacing--90);
	}
}

/* ---------- هدر ---------- */

.taraazik-header {
	position: sticky;
	inset-block-start: 0;
	z-index: 1000;
	background: var(--wp--preset--color--white);
	border-block-end: 1px solid var(--wp--preset--color--slate-200);
}

.taraazik-header__inner {
	min-block-size: var(--wp--custom--header--heightMobile);
}

@media (min-width: 768px) {
	.taraazik-header__inner {
		min-block-size: var(--wp--custom--header--height);
	}
}

.taraazik-header__logo {
	display: inline-flex;
	align-items: center;
}

.taraazik-header__logo svg {
	block-size: 40px;
	inline-size: auto;
}

@media (min-width: 768px) {
	.taraazik-header__logo svg {
		block-size: 48px;
	}
}

.taraazik-header__nav a {
	color: var(--wp--preset--color--navy);
	font-weight: 500;
	text-decoration: none;
}

.taraazik-header__nav a:hover,
.taraazik-header__nav .current-menu-item > a {
	color: var(--wp--preset--color--mint-800);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-decoration-color: var(--wp--preset--color--mint);
	text-underline-offset: 8px;
}

/* دکمه‌های هدر در موبایل جمع‌وجور */
@media (max-width: 767px) {
	.taraazik-header__actions .is-style-ghost {
		display: none;
	}
}

/* ---------- دکمه‌ها (بخش ۶) ---------- */

.wp-block-button__link,
.wp-element-button {
	min-block-size: var(--wp--custom--control--height);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color var(--wp--custom--motion--base) var(--wp--custom--motion--ease),
		color var(--wp--custom--motion--base) var(--wp--custom--motion--ease),
		border-color var(--wp--custom--motion--base) var(--wp--custom--motion--ease);
}

.wp-block-button__link:disabled,
.wp-element-button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* accent — CTA اصلی: زمینه mint، متن فقط navy */
.is-style-accent .wp-block-button__link,
.taraazik-btn-accent {
	background-color: var(--wp--preset--color--mint);
	color: var(--wp--preset--color--navy);
}

.is-style-accent .wp-block-button__link:hover,
.taraazik-btn-accent:hover {
	background-color: var(--wp--preset--color--mint-600);
	color: var(--wp--preset--color--navy);
}

/* secondary */
.is-style-secondary .wp-block-button__link,
.taraazik-btn-secondary {
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--navy);
	border: 1.5px solid var(--wp--preset--color--navy);
}

.is-style-secondary .wp-block-button__link:hover,
.taraazik-btn-secondary:hover {
	background-color: var(--wp--preset--color--navy-50);
	color: var(--wp--preset--color--navy);
}

/* ghost */
.is-style-ghost .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--mint-800);
}

.is-style-ghost .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--mint-50);
	color: var(--wp--preset--color--mint-800);
}

/* ---------- فرم‌ها (ورودی افزونه‌ها و ووکامرس هم همین را می‌گیرند) ---------- */

input:where([type="text"], [type="email"], [type="url"], [type="tel"], [type="number"], [type="password"], [type="search"]),
textarea,
select {
	block-size: var(--wp--custom--control--height);
	padding-inline: var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--preset--color--slate-300);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--navy);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--body);
}

textarea {
	block-size: auto;
	min-block-size: calc(var(--wp--custom--control--height) * 2);
	padding-block: var(--wp--preset--spacing--30);
}

input::placeholder,
textarea::placeholder {
	color: var(--wp--preset--color--slate-400);
}

input:where([type="text"], [type="email"], [type="url"], [type="tel"], [type="number"], [type="password"], [type="search"]):focus,
textarea:focus,
select:focus {
	border-color: var(--wp--preset--color--navy);
	box-shadow: var(--wp--custom--control--focusRing);
	outline: none;
}

/* فیلدهای ذاتاً LTR */
input:where([type="email"], [type="url"], [type="tel"], [type="number"]) {
	direction: ltr;
	text-align: start;
}

/* ---------- کارت (بخش ۶) ---------- */

.taraazik-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: var(--wp--custom--radius--lg);
	padding: var(--wp--preset--spacing--50);
	box-shadow: var(--wp--custom--shadow--sm);
	transition: box-shadow var(--wp--custom--motion--base) var(--wp--custom--motion--ease),
		border-color var(--wp--custom--motion--base) var(--wp--custom--motion--ease);
}

.taraazik-card:hover {
	box-shadow: var(--wp--custom--shadow--md);
	border-color: var(--wp--preset--color--slate-300);
}

/* گرید ویژگی‌ها: ۱ → ۲ → ۳ ستون (بخش ۵) */
.taraazik-grid-3 {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--50);
	margin-block-start: var(--wp--preset--spacing--70);
}

@media (min-width: 640px) {
	.taraazik-grid-3 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.taraazik-grid-3 {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* کارت ویژگی */
.taraazik-icon-tile {
	inline-size: 48px;
	block-size: 48px;
	display: grid;
	place-items: center;
	background: var(--wp--preset--color--mint-50);
	color: var(--wp--preset--color--navy);
	border-radius: var(--wp--custom--radius--md);
}

.taraazik-icon {
	inline-size: 24px;
	block-size: 24px;
}

.taraazik-feature h3 {
	font-size: var(--wp--preset--font-size--h3);
	margin-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20);
}

.taraazik-feature p {
	color: var(--wp--preset--color--slate-600);
	margin-block: 0;
}

/* ---------- بج / چیپ (بخش ۶) ---------- */

.taraazik-badge {
	display: inline-block;
	border-radius: var(--wp--custom--radius--full);
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 500;
	line-height: 1.6;
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30);
	margin-block: 0;
}

.taraazik-badge--mint {
	background: var(--wp--preset--color--mint-50);
	color: var(--wp--preset--color--mint-800);
}

.taraazik-badge--navy {
	background: var(--wp--preset--color--navy-50);
	color: var(--wp--preset--color--navy);
}

.taraazik-badge--neutral {
	background: var(--wp--preset--color--slate-100);
	color: var(--wp--preset--color--slate-700);
}

/* ---------- هیرو ---------- */

.taraazik-hero .taraazik-mark-text {
	background: none;
	color: var(--wp--preset--color--mint-800);
}

.taraazik-hero__panel {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: var(--wp--custom--radius--xl);
	box-shadow: var(--wp--custom--shadow--lg);
	padding: var(--wp--preset--spacing--50);
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

.taraazik-hero__stat {
	display: grid;
	gap: var(--wp--preset--spacing--20);
	justify-items: start;
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: var(--wp--custom--radius--lg);
	padding: var(--wp--preset--spacing--40);
}

.taraazik-hero__stat-label {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--slate-500);
}

.taraazik-hero__stat-value {
	font-size: var(--wp--preset--font-size--h3);
	font-weight: 800;
	color: var(--wp--preset--color--navy);
	line-height: 1.4;
}

/* ---------- سکشن تیره (بخش ۶) ---------- */

.taraazik-dark {
	color: var(--wp--preset--color--white);
}

.taraazik-dark a {
	color: var(--wp--preset--color--mint);
}

.taraazik-dark a:hover {
	color: var(--wp--preset--color--mint-200);
}

/* ---------- آمار ---------- */

.taraazik-stats {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--wp--preset--spacing--60);
	text-align: center;
}

@media (min-width: 1024px) {
	.taraazik-stats {
		grid-template-columns: repeat(4, 1fr);
	}
}

.taraazik-stats__value {
	display: block;
	font-size: var(--wp--preset--font-size--h1);
	font-weight: 800;
	color: var(--wp--preset--color--mint);
	line-height: 1.3;
}

.taraazik-stats__label {
	color: var(--wp--preset--color--slate-300);
}

/* ---------- قیمت‌گذاری (بخش ۶) ---------- */

.taraazik-price-card {
	position: relative;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: var(--wp--custom--radius--xl);
	padding: var(--wp--preset--spacing--60);
	box-shadow: var(--wp--custom--shadow--sm);
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--40);
}

.taraazik-price-card--featured {
	border: 1.5px solid var(--wp--preset--color--mint);
	box-shadow: var(--wp--custom--shadow--md);
}

.taraazik-price-card__flag {
	position: absolute;
	inset-block-start: calc(-1 * var(--wp--preset--spacing--30));
	inset-inline-start: var(--wp--preset--spacing--50);
}

.taraazik-price-card h3 {
	margin-block: 0;
}

.taraazik-price-card__desc {
	color: var(--wp--preset--color--slate-600);
	margin-block: 0;
}

.taraazik-price-card__price {
	margin-block: 0;
}

.taraazik-price-card__price strong {
	display: block;
	font-size: var(--wp--preset--font-size--h1);
	font-weight: 800;
	color: var(--wp--preset--color--navy);
	line-height: 1.3;
}

.taraazik-price-card__unit {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--slate-500);
}

.taraazik-checklist {
	list-style: none;
	padding: 0;
	margin-block: 0;
	display: grid;
	gap: var(--wp--preset--spacing--30);
	flex-grow: 1;
}

.taraazik-checklist li {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--20);
}

.taraazik-checklist .taraazik-icon--check {
	color: var(--wp--preset--color--mint-800);
	flex-shrink: 0;
	margin-block-start: var(--wp--preset--spacing--10);
	inline-size: 20px;
	block-size: 20px;
}

/* لیست تیک‌دار به‌عنوان استایل بلوک */
.is-style-check {
	list-style: none;
	padding-inline-start: 0;
}

.is-style-check li {
	position: relative;
	padding-inline-start: var(--wp--preset--spacing--60);
}

.is-style-check li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: 0.45em;
	inline-size: 20px;
	block-size: 20px;
	border-radius: var(--wp--custom--radius--full);
	background-color: var(--wp--preset--color--mint-50);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007A4D' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E");
	background-size: 12px;
	background-position: center;
	background-repeat: no-repeat;
}

/* ---------- نقل‌قول مشتری ---------- */

.taraazik-quote {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--40);
}

.taraazik-quote blockquote {
	margin: 0;
	border: 0;
	padding: 0;
	color: var(--wp--preset--color--slate-700);
	flex-grow: 1;
}

.taraazik-quote figcaption {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
}

.taraazik-quote__avatar {
	inline-size: 48px;
	block-size: 48px;
	display: grid;
	place-items: center;
	border-radius: var(--wp--custom--radius--full);
	background: var(--wp--preset--color--navy-50);
	color: var(--wp--preset--color--navy);
	font-weight: 700;
}

.taraazik-quote__meta {
	display: grid;
}

.taraazik-quote__meta span {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--slate-500);
}

/* ---------- پرسش‌های پرتکرار ---------- */

.taraazik-faq {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	margin-block-start: var(--wp--preset--spacing--70);
}

.taraazik-faq__item {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: var(--wp--custom--radius--lg);
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
}

.taraazik-faq__item summary {
	cursor: pointer;
	font-weight: 700;
	color: var(--wp--preset--color--navy);
	min-block-size: 44px;
	display: flex;
	align-items: center;
}

.taraazik-faq__item p {
	color: var(--wp--preset--color--slate-600);
	margin-block: var(--wp--preset--spacing--30) 0;
	max-inline-size: 65ch;
}

/* ---------- کارت پست وبلاگ (بخش ۶) ---------- */

.taraazik-post-grid {
	margin-block-start: var(--wp--preset--spacing--70);
	gap: var(--wp--preset--spacing--50);
}

.taraazik-post-card__media img {
	border-radius: var(--wp--custom--radius--lg);
}

.taraazik-post-card__cat a {
	display: inline-block;
	border-radius: var(--wp--custom--radius--full);
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 500;
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--mint-50);
	color: var(--wp--preset--color--mint-800);
	text-decoration: none;
}

.taraazik-post-card__title a {
	color: var(--wp--preset--color--navy);
	text-decoration: none;
}

.taraazik-post-card__title a:hover {
	color: var(--wp--preset--color--mint-800);
}

.taraazik-post-card__excerpt {
	color: var(--wp--preset--color--slate-600);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ---------- قاب تصویر/اسکرین‌شات ---------- */

.taraazik-frame img {
	border-radius: var(--wp--custom--radius--xl);
	box-shadow: var(--wp--custom--shadow--lg);
}

/* ---------- فوتر ---------- */

.taraazik-footer {
	padding-block: var(--wp--preset--spacing--80) var(--wp--preset--spacing--50);
}

.taraazik-footer__logo img {
	max-inline-size: 266px;
	block-size: auto;
}

.taraazik-footer__links {
	list-style: none;
	padding-inline-start: 0;
	display: grid;
	gap: var(--wp--preset--spacing--30);
}

.taraazik-footer__links a {
	color: var(--wp--preset--color--slate-300);
	text-decoration: none;
}

.taraazik-footer__links a:hover {
	color: var(--wp--preset--color--mint);
}

.taraazik-footer__bottom {
	border-block-start: 1px solid var(--wp--preset--color--navy-800);
	margin-block-start: var(--wp--preset--spacing--60);
	padding-block-start: var(--wp--preset--spacing--50);
}

.taraazik-footer__bottom a {
	color: var(--wp--preset--color--slate-400);
}

.taraazik-footer__bottom a:hover {
	color: var(--wp--preset--color--mint);
}

/* ---------- تماس ---------- */

.taraazik-contact__title {
	font-size: var(--wp--preset--font-size--h3);
	margin-block: 0 var(--wp--preset--spacing--40);
}

.taraazik-contact-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: var(--wp--preset--spacing--40);
}

.taraazik-contact-list li {
	display: grid;
	gap: var(--wp--preset--spacing--10);
}

.taraazik-contact-list__label {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--wp--preset--color--slate-700);
}

/* ---------- متای نوشته ---------- */

.taraazik-post-meta {
	color: var(--wp--preset--color--slate-500);
}

.taraazik-post-nav {
	margin-block: var(--wp--preset--spacing--60);
	padding-block-start: var(--wp--preset--spacing--50);
	border-block-start: 1px solid var(--wp--preset--color--slate-200);
}

/* ---------- Alert / Toast (بخش ۶) ---------- */

.taraazik-alert {
	border-radius: var(--wp--custom--radius--md);
	border: 1px solid;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	color: var(--wp--preset--color--slate-700);
}

.taraazik-alert--success {
	background: var(--wp--preset--color--mint-50);
	border-color: var(--wp--preset--color--success);
}

.taraazik-alert--warning {
	background: var(--wp--preset--color--warning-50);
	border-color: var(--wp--preset--color--warning);
}

.taraazik-alert--error {
	background: var(--wp--preset--color--error-50);
	border-color: var(--wp--preset--color--error);
}

.taraazik-alert--info {
	background: var(--wp--preset--color--navy-100);
	border-color: var(--wp--preset--color--info);
}

/* ---------- ووکامرس ---------- */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.wc-block-components-button {
	background-color: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--white);
	border-radius: var(--wp--custom--radius--md);
	font-weight: 700;
	min-block-size: var(--wp--custom--control--height);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.wc-block-components-button:hover {
	background-color: var(--wp--preset--color--navy-800);
	color: var(--wp--preset--color--white);
}

.woocommerce span.onsale,
.wc-block-components-product-sale-badge {
	background: var(--wp--preset--color--mint-50);
	color: var(--wp--preset--color--mint-800);
	border-radius: var(--wp--custom--radius--full);
	font-weight: 500;
}

.woocommerce div.product p.price,
.woocommerce ul.products li.product .price,
.wc-block-components-product-price {
	color: var(--wp--preset--color--navy);
	font-variant-numeric: tabular-nums;
}

.woocommerce-message,
.wc-block-components-notice-banner.is-success {
	border-color: var(--wp--preset--color--success);
	background: var(--wp--preset--color--mint-50);
}

.woocommerce-error,
.wc-block-components-notice-banner.is-error {
	border-color: var(--wp--preset--color--error);
	background: var(--wp--preset--color--error-50);
}

.woocommerce ul.products li.product,
.wc-block-grid__product {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: var(--wp--custom--radius--lg);
	padding: var(--wp--preset--spacing--50);
	box-shadow: var(--wp--custom--shadow--sm);
}
