/**
 * Paripoorn Product Heading widget.
 * Uses theme design tokens (--pp-*) where possible so it inherits the
 * active Paripoorn Settings brand colors/fonts automatically; explicit
 * Elementor style controls (see ProductHeading.php) override these
 * per-instance via inline selectors injected by Elementor itself.
 */

.pp-ph {
	max-width: 620px;
}

.pp-ph__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 14px;
}

.pp-ph__eyebrow-icon {
	display: inline-flex;
	flex-shrink: 0;
}

.pp-ph__eyebrow-icon svg {
	fill: #D89B32;
}

.pp-ph__eyebrow-text {
	font-family: var(--pp-font-body, "Manrope", sans-serif);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #6B6B6B;
}

/* These fields accept Elementor dynamic tags, and WooCommerce's
   Product Categories/Terms tag returns linked terms — so any <a> inside
   inherits the surrounding type rather than the browser's default link
   styling, and only picks up the accent colour on hover. */
.pp-ph__eyebrow-text a,
.pp-ph__heading a,
.pp-ph__description a {
	color: inherit;
	text-decoration: none;
}

.pp-ph__eyebrow-text a:hover,
.pp-ph__heading a:hover,
.pp-ph__description a:hover {
	color: var(--pp-primary, #F20D16);
}

.pp-ph__heading {
	font-family: var(--pp-font-heading, "Libre Caslon Text", serif);
	font-weight: 400;
	font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem);
	line-height: 1.15;
	color: var(--pp-heading, #222222);
	margin: 0 0 18px;
}

.pp-ph__description {
	font-family: var(--pp-font-body, "Manrope", sans-serif);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	color: #6B6B6B;
	margin: 0 0 20px;
}

.pp-ph__rating {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.pp-ph__stars {
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.pp-ph__star svg {
	fill: #D89B32;
}

.pp-ph__star--empty svg {
	fill: #E5DCC8;
}

.pp-ph__score {
	font-family: var(--pp-font-body, "Manrope", sans-serif);
	font-size: 15px;
	font-weight: 700;
	color: var(--pp-heading, #222222);
}

.pp-ph__count {
	font-family: var(--pp-font-body, "Manrope", sans-serif);
	font-size: 14px;
	font-weight: 400;
	color: #8A8A8A;
}
