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

.pp-pi {
	background: var(--pp-bg-soft, #FBF4E3);
	border-radius: var(--pp-radius-md, 16px);
	padding: var(--pp-space-8, 32px);
}

.pp-pi__title {
	font-family: var(--pp-font-heading, "Libre Caslon Text", serif);
	font-weight: 400;
	font-size: var(--pp-fs-h4, 1.5rem);
	color: var(--pp-heading, #222222);
	margin: 0 0 16px;
}

.pp-pi__body {
	font-family: var(--pp-font-body, "Manrope", sans-serif);
	font-size: 15px;
	line-height: 1.75;
	color: var(--pp-text, #555555);
}

.pp-pi__body > *:first-child {
	margin-top: 0;
}

.pp-pi__body > *:last-child {
	margin-bottom: 0;
}

.pp-pi__body a {
	color: var(--pp-primary, #F20D16);
}

.pp-pi__body ul,
.pp-pi__body ol {
	margin: 0 0 1em;
	padding-left: 1.25em;
}

.pp-pi__body li {
	margin-bottom: 0.4em;
}

.pp-pi__body strong,
.pp-pi__body b {
	color: var(--pp-heading, #222222);
	font-weight: 600;
}

/* Elementor editor only — never shown on the frontend (the widget
   returns early with no markup at all outside edit mode). */
.pp-pi__notice {
	padding: 20px;
	background: #FFF4E5;
	border: 1px dashed #E0B75C;
	border-radius: 8px;
	font-family: var(--pp-font-body, "Manrope", sans-serif);
	font-size: 13px;
	color: #6B5B2E;
}