/* =========================================================
   ابزارک قیمت روز خودرو (ستون کناری همه‌ی صفحه‌ها)
   ========================================================= */

.khodro-sidebar .widget.khodro-pb,
.khodro-pb {
	padding: 0;
	overflow: hidden;
	position: relative;
}

/* ---------- سربرگ ---------- */
.khodro-pb-head {
	position: relative;
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 15px 16px;
	color: #fff;
	background: linear-gradient(135deg, var(--khodro-primary), color-mix(in srgb, var(--khodro-primary) 50%, #ff9a5a));
	overflow: hidden;
	isolation: isolate;
}
.khodro-pb-head::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(115deg, transparent 32%, rgba(255,255,255,.28) 48%, transparent 64%);
	background-size: 230% 100%;
	animation: khodro-pb-shine 5s ease-in-out infinite;
	pointer-events: none;
}
@keyframes khodro-pb-shine {
	0%   { background-position: 140% 0; }
	55%, 100% { background-position: -70% 0; }
}
.khodro-pb-ico {
	flex: 0 0 auto;
	width: 36px; height: 36px;
	display: grid; place-items: center;
	border-radius: 12px;
	background: rgba(255,255,255,.2);
	box-shadow: 0 0 0 1px rgba(255,255,255,.22) inset;
}
.khodro-pb-ico .khodro-icon { width: 19px; height: 19px; }
.khodro-pb-head-text { min-width: 0; flex: 1 1 auto; }
.khodro-pb-title {
	margin: 0;
	font-size: 15.5px;
	font-weight: 800;
	line-height: 1.5;
	color: #fff;
	padding: 0;
	border: 0;
}
.khodro-pb-title::before, .khodro-pb-title::after { display: none; }
.khodro-pb-sub {
	display: flex; align-items: center; gap: 6px;
	font-size: 11.5px;
	opacity: .92;
	line-height: 1.4;
}
.khodro-pb-live {
	display: inline-block;
	width: 7px; height: 7px;
	border-radius: 50%;
	background: #4ade80;
	animation: khodro-pb-pulse 1.9s ease-out infinite;
}
@keyframes khodro-pb-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(74,222,128,.65); }
	80%, 100% { box-shadow: 0 0 0 8px rgba(74,222,128,0); }
}
.khodro-pb-unit {
	flex: 0 0 auto;
	font-size: 11px;
	font-weight: 700;
	padding: 3px 9px;
	border-radius: 99px;
	background: rgba(255,255,255,.2);
	white-space: nowrap;
}

/* ---------- ابزارهای بالای لیست ---------- */
.khodro-pb-tools {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 14px 4px;
}
.khodro-pb-tools:empty { display: none; }
.khodro-pb-seg {
	flex: 0 0 auto;
	display: inline-flex;
	padding: 3px;
	border-radius: 99px;
	background: color-mix(in srgb, var(--khodro-text) 9%, transparent);
}
.khodro-pb-seg button {
	border: 0;
	background: transparent;
	color: var(--khodro-muted);
	font-size: 12px;
	font-weight: 700;
	padding: 4px 12px;
	border-radius: 99px;
	line-height: 1.6;
	transition: background .2s ease, color .2s ease;
}
.khodro-pb-seg button.is-on {
	background: var(--khodro-primary);
	color: #fff;
	box-shadow: 0 4px 12px -4px color-mix(in srgb, var(--khodro-primary) 70%, transparent);
}
.khodro-pb-q {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
	font: inherit;
	font-size: 12.5px;
	line-height: 1.6;
	color: var(--khodro-text);
	background: color-mix(in srgb, var(--khodro-text) 6%, transparent);
	border: 1px solid var(--khodro-border);
	border-radius: 99px;
	padding: 4px 13px;
	outline: none;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.khodro-pb-q::placeholder { color: var(--khodro-muted); }
.khodro-pb-q:focus {
	border-color: var(--khodro-primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--khodro-primary) 22%, transparent);
}

/* ---------- لیست ---------- */
.khodro-pb-list {
	list-style: none;
	margin: 0;
	padding: 6px 8px 4px;
}
.khodro-pb.is-open .khodro-pb-list,
.khodro-pb.is-searching .khodro-pb-list {
	max-height: 440px;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
}
.khodro-pb-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas: "name name" "meta price" "spark price";
	align-items: center;
	gap: 2px 10px;
	padding: 9px 8px;
	border-radius: 12px;
	border-bottom: 1px dashed color-mix(in srgb, var(--khodro-text) 10%, transparent);
	transition: background .2s ease;
	animation: khodro-pb-in .45s ease both;
	animation-delay: calc(var(--i, 0) * 35ms);
}
.khodro-pb-row:last-child { border-bottom-color: transparent; }
.khodro-pb-row:hover { background: color-mix(in srgb, var(--khodro-text) 6%, transparent); }
@keyframes khodro-pb-in {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: none; }
}
.khodro-pb:not(.is-open):not(.is-searching) .khodro-pb-row.is-extra { display: none; }
/* ورق‌خوردن خودکار: صفحه‌های لیست */
.khodro-pb.is-paged:not(.is-open):not(.is-searching) .khodro-pb-row.is-off { display: none; }
.khodro-pb-list { perspective: 900px; }
.khodro-pb.is-paged .khodro-pb-list {
	transform-origin: 50% 0;
	transition: transform .32s ease, opacity .32s ease;
}
.khodro-pb.is-paged .khodro-pb-list.is-flip-out { transform: rotateX(-14deg) translateY(-10px); opacity: 0; }
.khodro-pb-dots {
	display: flex; justify-content: center; align-items: center; gap: 6px;
	padding: 4px 14px 2px;
}
.khodro-pb-dots button {
	width: 7px; height: 7px; padding: 0; border: 0; border-radius: 99px;
	background: color-mix(in srgb, var(--khodro-text) 22%, transparent);
	transition: width .3s ease, background .3s ease;
}
.khodro-pb-dots button.is-on { width: 22px; background: var(--khodro-primary); }
.khodro-pb.is-open .khodro-pb-dots, .khodro-pb.is-searching .khodro-pb-dots { display: none; }
.khodro-pb-row.is-hide { display: none !important; }

.khodro-pb-main { display: contents; }
.khodro-pb-name {
	grid-area: name;
	display: block;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.7;
	color: var(--khodro-text);
	/* نام کامل نمایش داده می‌شود و در صورت طولانی بودن در چند خط می‌شکند */
	white-space: normal;
	overflow-wrap: anywhere;
}
a.khodro-pb-name:hover, .khodro-pb-name a:hover { color: var(--khodro-primary); }
.khodro-pb-meta {
	grid-area: meta;
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 1px;
	min-height: 18px;
	font-size: 11px;
	color: var(--khodro-muted);
	white-space: nowrap;
}
.khodro-pb-meta small { font-size: 11px; }
.khodro-pb-chg {
	font-weight: 800;
	font-size: 10.5px;
	line-height: 1.7;
	padding: 0 7px;
	border-radius: 99px;
	color: var(--khodro-muted);
	background: color-mix(in srgb, var(--khodro-text) 9%, transparent);
}
.khodro-pb-row.is-up   .khodro-pb-chg { color: var(--kc-bad, #f87171); background: color-mix(in srgb, var(--kc-bad, #f87171) 15%, transparent); }
.khodro-pb-row.is-down .khodro-pb-chg { color: var(--kc-ok, #34d399);  background: color-mix(in srgb, var(--kc-ok, #34d399) 15%, transparent); }

.khodro-pb-spark { grid-area: spark; justify-self: start; width: 54px; height: 16px; color: var(--khodro-muted); opacity: .85; }
.khodro-pb-spark.is-none { display: none; }
.khodro-pb-row.is-up   .khodro-pb-spark { color: var(--kc-bad, #f87171); }
.khodro-pb-row.is-down .khodro-pb-spark { color: var(--kc-ok, #34d399); }

.khodro-pb-price {
	grid-area: price;
	align-self: center;
	text-align: end;
	font-size: 14.5px;
	font-weight: 800;
	line-height: 1.4;
	font-variant-numeric: tabular-nums;
	color: var(--kc-digit, #ffb224);
	white-space: nowrap;
}
.khodro-pb-price b { font-weight: inherit; }

/* سوییچ بازار / کارخانه */
.khodro-pb[data-mode="m"] .khodro-pb-pf,
.khodro-pb[data-mode="m"] .khodro-pb-sf,
.khodro-pb[data-mode="f"] .khodro-pb-pm,
.khodro-pb[data-mode="f"] .khodro-pb-sm { display: none; }

.khodro-pb-none {
	margin: 4px 14px 10px;
	font-size: 12.5px;
	color: var(--khodro-muted);
	text-align: center;
}

/* ---------- دکمه‌ی نمایش همه و پا ---------- */
.khodro-pb-more {
	display: block;
	width: calc(100% - 28px);
	margin: 6px 14px 4px;
	padding: 7px 12px;
	font: inherit;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--khodro-primary);
	background: color-mix(in srgb, var(--khodro-primary) 11%, transparent);
	border: 1px solid color-mix(in srgb, var(--khodro-primary) 26%, transparent);
	border-radius: 12px;
	transition: background .2s ease;
}
.khodro-pb-more:hover { background: color-mix(in srgb, var(--khodro-primary) 20%, transparent); }
.khodro-pb.is-searching .khodro-pb-more { display: none; }

.khodro-pb-foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 14px;
	padding: 10px 16px 14px;
	font-size: 11px;
	color: var(--khodro-muted);
}
.khodro-pb-foot span { flex: 1 1 100%; }
.khodro-pb-foot a { font-weight: 700; color: var(--khodro-primary); }
.khodro-pb-foot a:hover { text-decoration: underline; }

/* پیام راهنما (فقط مدیر) */
.khodro-pb-hint { padding: 16px; }
.khodro-pb-hint .khodro-pb-title { color: var(--khodro-text); margin-bottom: 6px; }
.khodro-pb-hint p { margin: 0; font-size: 13px; color: var(--khodro-muted); }
.khodro-pb-hint a { color: var(--khodro-primary); font-weight: 700; }

/* ---------- صفحه‌های تمام‌عرض (ابزارها و خودروها): ستون کناری فقط برای ابزارک ---------- */
.khodro-sidebar.is-pb-only { align-self: start; }
@media (min-width: 1100px) {
	body.kc-full.kc-has-pb .khodro-layout { display: grid; }
	.khodro-sidebar.is-pb-only { position: sticky; top: 86px; }
}

/* ---------- واکنش‌گرا ---------- */
@media (max-width: 860px) {
	.khodro-pb-list { padding-inline: 6px; }
}
@media (prefers-reduced-motion: reduce) {
	.khodro-pb-head::after, .khodro-pb-live, .khodro-pb-row { animation: none; }
	.khodro-pb.is-paged .khodro-pb-list { transition: none; }
}
