/* ==========================================================================
   لیست قیمت پایپ مارکت — استایل سمت کاربر
   متغیرها با fallback نوشته شده‌اند تا افزونه روی هر قالبی هم درست کار کند.
   ========================================================================== */

.pmp {
	--pmp-primary: var(--pm-primary, #0d84b4);
	--pmp-primary-hover: var(--pm-primary-hover, #0a6d96);
	--pmp-primary-soft: var(--pm-primary-soft, #e2f3fb);
	--pmp-accent: var(--pm-accent, #f5822b);
	--pmp-accent-hover: var(--pm-accent-hover, #e0701b);
	--pmp-success: var(--pm-success, #14a06e);
	--pmp-success-soft: var(--pm-success-soft, #e6f7f1);
	--pmp-danger: var(--pm-danger, #d94848);
	--pmp-danger-soft: var(--pm-danger-soft, #fdeded);
	--pmp-warning: var(--pm-warning, #d9a441);
	--pmp-warning-soft: var(--pm-warning-soft, #fdf6e7);
	--pmp-text: var(--pm-text, #22303f);
	--pmp-text-2: var(--pm-text-2, #4a5b6d);
	--pmp-muted: var(--pm-muted, #7a8b9c);
	--pmp-border: var(--pm-border, #e2ebf2);
	--pmp-surface: var(--pm-surface, #f7fafc);
	--pmp-surface-2: var(--pm-surface-2, #eef5fa);
	--pmp-r: var(--pm-r, 12px);
	--pmp-r-sm: var(--pm-r-sm, 8px);
	--pmp-r-lg: var(--pm-r-lg, 18px);
	--pmp-font: var(--pm-font, 'Vazirmatn', 'IRANSans', Tahoma, sans-serif);

	direction: rtl;
	text-align: right;
	font-family: var(--pmp-font);
	color: var(--pmp-text);
	font-size: 14.5px;
	line-height: 1.9;
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

.pmp *,
.pmp *::before,
.pmp *::after {
	box-sizing: border-box;
}

.pmp .pmp-num {
	font-variant-numeric: tabular-nums;
	font-feature-settings: 'tnum';
}

/*
 * قواعد display در ادامه، بر [hidden] مرورگر غلبه می‌کنند؛ بنابراین پنهان‌سازی
 * باید صریح اعلام شود تا دکمه پاک‌کردن، ردیف خالی و پیام «نتیجه‌ای نیست»
 * تا زمان لازم دیده نشوند.
 */
.pmp [hidden],
.pmp-modal[hidden] {
	display: none !important;
}

/* --------------------------------------------------------------------------
   لنگرهای پرش بین گروه‌ها
   -------------------------------------------------------------------------- */
.pmp-anchors {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px;
	padding: 12px;
	background: var(--pmp-surface);
	border: 1px solid var(--pmp-border);
	border-radius: var(--pmp-r);
}

.pmp-anchor {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 14px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--pmp-text-2);
	background: #fff;
	border: 1px solid var(--pmp-border);
	border-radius: 100px;
	text-decoration: none;
	transition: background .2s, color .2s, border-color .2s, transform .2s;
}

.pmp-anchor:hover,
.pmp-anchor.is-active {
	background: var(--pmp-primary-soft);
	border-color: var(--pmp-primary);
	color: var(--pmp-primary);
	transform: translateY(-1px);
	text-decoration: none;
}

.pmp-anchor em {
	font-style: normal;
	font-size: 11.5px;
	padding: 1px 8px;
	background: var(--pmp-surface-2);
	border-radius: 100px;
	color: var(--pmp-muted);
}

.pmp-anchor:hover em,
.pmp-anchor.is-active em {
	background: #fff;
	color: var(--pmp-primary);
}

/* --------------------------------------------------------------------------
   نوار ابزار (جست‌وجو / مرتب‌سازی)
   -------------------------------------------------------------------------- */
.pmp-toolbar {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
	flex-wrap: wrap;
}

.pmp-toolbar__search {
	position: relative;
	display: flex;
	align-items: center;
	flex: 1;
	min-width: 240px;
}

.pmp-toolbar__search > svg {
	position: absolute;
	inset-inline-start: 14px;
	color: var(--pmp-muted);
	pointer-events: none;
}

.pmp .pmp-search {
	width: 100%;
	padding: 12px 42px 12px 42px;
	font-family: inherit;
	font-size: 14px;
	color: var(--pmp-text);
	background: #fff;
	border: 1px solid var(--pmp-border);
	border-radius: var(--pmp-r);
	transition: border-color .2s, box-shadow .2s;
	-webkit-appearance: none;
	appearance: none;
}

.pmp .pmp-search:focus {
	outline: none;
	border-color: var(--pmp-primary);
	box-shadow: 0 0 0 3px var(--pmp-primary-soft);
}

.pmp-search__clear {
	position: absolute;
	inset-inline-end: 10px;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	padding: 0;
	background: var(--pmp-surface-2);
	border: 0;
	border-radius: 50%;
	color: var(--pmp-text-2);
	cursor: pointer;
}

.pmp-search__clear:hover { background: var(--pmp-border); }

.pmp-toolbar__sort {
	display: flex;
	align-items: center;
	gap: 8px;
}

.pmp .pmp-sort {
	padding: 12px 14px;
	font-family: inherit;
	font-size: 13.5px;
	color: var(--pmp-text);
	background: #fff;
	border: 1px solid var(--pmp-border);
	border-radius: var(--pmp-r);
	cursor: pointer;
}

.pmp .pmp-sort:focus {
	outline: none;
	border-color: var(--pmp-primary);
}

.pmp-print {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 12px 15px;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--pmp-text-2);
	background: #fff;
	border: 1px solid var(--pmp-border);
	border-radius: var(--pmp-r);
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}

.pmp-print:hover {
	background: var(--pmp-primary-soft);
	border-color: var(--pmp-primary);
	color: var(--pmp-primary);
}

/* --------------------------------------------------------------------------
   گروه (هر جدول)
   -------------------------------------------------------------------------- */
.pmp-group {
	margin-bottom: 30px;
	background: #fff;
	border: 1px solid var(--pmp-border);
	border-radius: var(--pmp-r-lg);
	overflow: hidden;
	scroll-margin-top: 100px;
}

.pmp-group.is-hidden { display: none; }

.pmp-group__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	padding: 16px 20px;
	background: linear-gradient(180deg, var(--pmp-primary-soft), #fff);
	border-bottom: 1px solid var(--pmp-border);
}

.pmp .pmp-group__title {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	color: var(--pmp-text);
	line-height: 1.6;
}

.pmp-group__unit {
	display: block;
	font-size: 12.5px;
	color: var(--pmp-text-2);
	margin-top: 2px;
}

.pmp-updated {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 13px;
	font-size: 12.5px;
	color: var(--pmp-text-2);
	background: #fff;
	border: 1px solid var(--pmp-border);
	border-radius: 100px;
	white-space: nowrap;
}

.pmp-updated svg { color: var(--pmp-primary); }

.pmp-updated b {
	font-weight: 700;
	color: var(--pmp-text);
}

/* --------------------------------------------------------------------------
   جدول
   -------------------------------------------------------------------------- */
.pmp-table-wrap {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: var(--pmp-border) transparent;
}

.pmp .pmp-table {
	width: 100%;
	min-width: 680px;
	border-collapse: collapse;
	margin: 0;
	font-size: 14px;
	background: #fff;
}

.pmp .pmp-table th,
.pmp .pmp-table td {
	padding: 13px 16px;
	text-align: right;
	border: 0;
	border-bottom: 1px solid var(--pmp-border);
	vertical-align: middle;
}

.pmp .pmp-table thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	font-size: 13px;
	font-weight: 700;
	color: var(--pmp-text-2);
	background: var(--pmp-surface-2);
	white-space: nowrap;
}

.pmp .pmp-table tbody tr {
	transition: background .18s;
}

.pmp .pmp-table tbody tr:hover {
	background: var(--pmp-surface);
}

.pmp .pmp-table tbody tr:last-child td { border-bottom: 0; }

.pmp-row.is-filtered { display: none; }

/* ستون عنوان */
.pmp-th-title { width: 34%; }

.pmp-title {
	font-weight: 600;
	color: var(--pmp-text);
	line-height: 1.75;
}

.pmp-stock {
	display: inline-block;
	margin-inline-start: 8px;
	padding: 2px 9px;
	font-size: 11px;
	font-weight: 600;
	border-radius: 100px;
	vertical-align: middle;
}

.pmp-stock--call { background: var(--pmp-warning-soft); color: #a8781f; }
.pmp-stock--order { background: var(--pmp-primary-soft); color: var(--pmp-primary); }
.pmp-stock--out { background: var(--pmp-danger-soft); color: var(--pmp-danger); }

/* ستون قیمت */
.pmp-td-price { white-space: nowrap; }

.pmp-price {
	display: inline-flex;
	align-items: baseline;
	gap: 5px;
}

.pmp-price b {
	font-size: 15.5px;
	font-weight: 700;
	color: var(--pmp-primary);
}

.pmp-price i {
	font-style: normal;
	font-size: 11.5px;
	color: var(--pmp-muted);
}

.pmp-price--call {
	font-size: 13.5px;
	font-weight: 600;
	color: var(--pmp-accent);
}

.pmp-change {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	margin-inline-start: 8px;
	padding: 2px 7px;
	font-size: 11px;
	font-weight: 700;
	border-radius: 100px;
	vertical-align: middle;
}

.pmp-change--up { background: var(--pmp-danger-soft); color: var(--pmp-danger); }
.pmp-change--down { background: var(--pmp-success-soft); color: var(--pmp-success); }

/* ستون‌های وزن و توضیحات */
.pmp-td-weight,
.pmp-td-note {
	font-size: 13px;
	color: var(--pmp-text-2);
}

.pmp-th-weight,
.pmp-td-weight { width: 10%; white-space: nowrap; }

.pmp-th-note,
.pmp-td-note { width: 20%; }

/* ستون نمودار */
.pmp-th-chart,
.pmp-td-chart { width: 92px; text-align: center; }

.pmp-td-chart { text-align: center; }

.pmp-chart-btn {
	display: inline-grid;
	place-items: center;
	padding: 4px 6px;
	background: var(--pmp-surface);
	border: 1px solid var(--pmp-border);
	border-radius: var(--pmp-r-sm);
	cursor: pointer;
	transition: background .2s, border-color .2s, transform .2s;
}

.pmp-chart-btn:hover {
	background: #fff;
	border-color: var(--pmp-primary);
	transform: translateY(-1px);
}

.pmp-spark { display: block; }

.pmp-chart-empty { color: var(--pmp-muted); }

/* ستون خرید */
.pmp-th-buy,
.pmp-td-buy { width: 130px; }

.pmp .pmp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 9px 12px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	color: #fff;
	background: var(--pmp-primary);
	border: 1px solid transparent;
	border-radius: var(--pmp-r-sm);
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background .2s, transform .2s, box-shadow .2s;
}

.pmp .pmp-btn:hover {
	background: var(--pmp-primary-hover);
	color: #fff;
	transform: translateY(-1px);
	text-decoration: none;
}

.pmp .pmp-btn--call {
	background: var(--pmp-accent);
}

.pmp .pmp-btn--call:hover { background: var(--pmp-accent-hover); }

.pmp .pmp-btn--wa { background: #25d366; }
.pmp .pmp-btn--wa:hover { background: #1eb457; }

.pmp .pmp-btn--view {
	background: #fff;
	color: var(--pmp-primary);
	border-color: var(--pmp-border);
}

.pmp .pmp-btn--view:hover {
	background: var(--pmp-primary-soft);
	color: var(--pmp-primary);
	border-color: var(--pmp-primary);
}

.pmp .pmp-btn--disabled {
	background: var(--pmp-surface-2);
	color: var(--pmp-muted);
	cursor: default;
	transform: none;
}

/* یادداشت زیر جدول */
.pmp-note {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	padding: 13px 20px;
	font-size: 12.8px;
	color: var(--pmp-text-2);
	background: var(--pmp-surface);
	border-top: 1px solid var(--pmp-border);
	line-height: 1.9;
}

.pmp-note svg {
	flex-shrink: 0;
	margin-top: 4px;
	color: var(--pmp-primary);
}

.pmp-empty-search {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 40px 20px;
	color: var(--pmp-text-2);
	background: var(--pmp-surface);
	border: 1px dashed var(--pmp-border);
	border-radius: var(--pmp-r-lg);
}

/* --------------------------------------------------------------------------
   پنجره نمودار
   -------------------------------------------------------------------------- */
.pmp-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: grid;
	place-items: center;
	padding: 20px;
	direction: rtl;
	font-family: var(--pm-font, 'Vazirmatn', Tahoma, sans-serif);
}

.pmp-modal[hidden] { display: none; }

.pmp-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(34, 48, 63, .38);
	backdrop-filter: blur(2px);
}

.pmp-modal__box {
	position: relative;
	width: min(100%, 560px);
	max-height: 88vh;
	overflow-y: auto;
	background: #fff;
	border-radius: var(--pm-r-lg, 18px);
	box-shadow: 0 20px 60px rgba(34, 48, 63, .2);
	animation: pmp-in .22s ease;
}

@keyframes pmp-in {
	from { opacity: 0; transform: translateY(14px) scale(.98); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

.pmp-modal__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 20px;
	border-bottom: 1px solid var(--pm-border, #e2ebf2);
	background: var(--pm-surface, #f7fafc);
	border-radius: var(--pm-r-lg, 18px) var(--pm-r-lg, 18px) 0 0;
	position: sticky;
	top: 0;
	z-index: 2;
}

.pmp-modal__head h4 {
	margin: 0;
	font-size: 15.5px;
	font-weight: 700;
	color: var(--pm-text, #22303f);
	line-height: 1.7;
}

.pmp-modal__close {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	flex-shrink: 0;
	background: #fff;
	border: 1px solid var(--pm-border, #e2ebf2);
	border-radius: 50%;
	color: var(--pm-text-2, #4a5b6d);
	cursor: pointer;
	transition: background .2s, color .2s;
}

.pmp-modal__close:hover {
	background: var(--pm-danger-soft, #fdeded);
	color: var(--pm-danger, #d94848);
}

.pmp-modal__body { padding: 20px; }

/* نمودار بزرگ */
.pmp-chart {
	width: 100%;
	height: auto;
	overflow: visible;
}

.pmp-chart-legend {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--pm-border, #e2ebf2);
	font-size: 13px;
	color: var(--pm-text-2, #4a5b6d);
}

.pmp-chart-legend b {
	display: block;
	font-size: 15px;
	color: var(--pm-text, #22303f);
}

.pmp-chart-table {
	width: 100%;
	margin-top: 16px;
	border-collapse: collapse;
	font-size: 13px;
}

.pmp-chart-table th,
.pmp-chart-table td {
	padding: 9px 12px;
	text-align: right;
	border-bottom: 1px solid var(--pm-border, #e2ebf2);
}

.pmp-chart-table th {
	background: var(--pm-surface-2, #eef5fa);
	font-weight: 600;
	color: var(--pm-text-2, #4a5b6d);
}

/* --------------------------------------------------------------------------
   ریسپانسیو — تبدیل جدول به کارت در موبایل
   -------------------------------------------------------------------------- */
@media (max-width: 782px) {
	.pmp-table-wrap { overflow: visible; }

	.pmp .pmp-table,
	.pmp .pmp-table tbody,
	.pmp .pmp-table tr,
	.pmp .pmp-table td {
		display: block;
		width: 100%;
		min-width: 0;
	}

	.pmp .pmp-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
	}

	.pmp .pmp-table tbody tr {
		width: auto;
		max-width: 100%;
		margin: 12px 0;
		padding: 6px 0;
		background: #fff;
		border: 1px solid var(--pmp-border);
		border-radius: var(--pmp-r);
	}

	.pmp .pmp-table tbody tr:hover { background: #fff; }

	.pmp .pmp-table td {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 9px 14px;
		border-bottom: 1px dashed var(--pmp-border);
		text-align: left;
	}

	.pmp .pmp-table td:last-child { border-bottom: 0; }

	/* برچسب ستون در سمت راست */
	.pmp .pmp-table td::before {
		content: attr(data-label);
		font-size: 12.5px;
		font-weight: 600;
		color: var(--pmp-muted);
		flex-shrink: 0;
	}

	/* عنوان محصول تمام‌عرض و بدون برچسب */
	.pmp .pmp-table td.pmp-td-title {
		display: block;
		text-align: right;
		padding-block: 12px;
		background: var(--pmp-surface);
		border-radius: var(--pmp-r) var(--pmp-r) 0 0;
	}

	.pmp .pmp-table td.pmp-td-title::before { display: none; }

	.pmp .pmp-table td.pmp-td-buy { padding-block: 12px; }

	.pmp .pmp-table td.pmp-td-buy::before { display: none; }

	.pmp .pmp-btn { width: 100%; padding-block: 11px; }

	.pmp-row-empty td { text-align: center !important; }
	.pmp-row-empty td::before { display: none; }

	.pmp-group__head { padding: 14px 16px; }
	.pmp-anchors { padding: 10px; }
	.pmp-anchor { padding: 7px 12px; font-size: 12.5px; }

	.pmp-toolbar__sort { width: 100%; }
	.pmp .pmp-sort { flex: 1; }
}

@media (max-width: 480px) {
	.pmp-updated { font-size: 11.5px; padding: 5px 10px; }
	.pmp-modal { padding: 12px; }
	.pmp-modal__body { padding: 14px; }
}

/* --------------------------------------------------------------------------
   چاپ
   -------------------------------------------------------------------------- */
@media print {
	.pmp-toolbar,
	.pmp-anchors,
	.pmp-td-buy,
	.pmp-th-buy,
	.pmp-td-chart,
	.pmp-th-chart,
	.pmp-modal {
		display: none !important;
	}

	.pmp-group {
		break-inside: avoid;
		border-color: #999;
	}

	.pmp .pmp-table thead th {
		position: static;
		background: #eee !important;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}
}

@media (prefers-reduced-motion: reduce) {
	.pmp *,
	.pmp-modal * {
		animation-duration: .001ms !important;
		transition-duration: .001ms !important;
	}
}