/* PeeweePaw — bloc « avantages » (widgets Feature du thème Primrose, ex. Qualité & originalité / À votre écoute / Livraison) en 3 cartes sur fond vert clair. */
:root {
	--pwpf-bg: #f2f6ef;
	--pwpf-green-bg: #edf2ea;
	--pwpf-green: #3f4d38;
	--pwpf-line: #e1e9dc;
	--pwpf-text: #555;
	--pwpf-icon-bg: #fbe1d3;
	--pwpf-icon: #b0603f;
}

/* Ligne SiteOrigin qui contient les widgets Feature : fond vert clair */
.panel-row-style:has(> .panel-grid-cell > .widget_primrose-sow-feature) {
	background-color: var(--pwpf-bg) !important;
	padding-top: 40px !important;
	padding-bottom: 40px !important;
}

/* Cartes de même hauteur */
.panel-row-style:has(> .panel-grid-cell > .widget_primrose-sow-feature) {
	align-items: stretch !important; /* SiteOrigin aligne en haut : les cartes n'auraient pas la même hauteur */
}

.panel-grid-cell:has(> .widget_primrose-sow-feature) {
	display: flex;
}

.panel-grid-cell > .widget_primrose-sow-feature {
	flex: 1 1 auto;
	display: flex;
}

.widget_primrose-sow-feature > div,
.widget_primrose-sow-feature .primrose-sow-feature {
	flex: 1 1 auto;
	width: 100%;
}

/* La carte */
.widget_primrose-sow-feature .primrose-sow-feature {
	box-sizing: border-box;
	height: 100%;
	padding: 26px 26px 24px;
	border: 1px solid var(--pwpf-line);
	border-radius: 16px;
	background: #fff;
	text-align: left;
	/* Icône et titre côte à côte sur la 1re ligne, texte en dessous sur toute la largeur */
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	align-content: start;
	column-gap: 12px;
}

/* Icône dans un petit rond orange clair */
.widget_primrose-sow-feature .primrose-sow-feature-icon {
	float: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	border-radius: 50%;
	background: var(--pwpf-icon-bg);
}

.widget_primrose-sow-feature .primrose-sow-feature-icon [data-sow-icon] {
	font-size: 19px !important;
	line-height: 1;
	color: var(--pwpf-icon) !important;
}

/* Titre : même police que les titres du pied de page, à droite de l'icône */
.widget_primrose-sow-feature .primrose-sow-feature-heading {
	margin: 0;
	padding: 0;
	font-family: Montserrat, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: .88px;
	text-transform: uppercase;
	color: var(--pwpf-green) !important;
}

.widget_primrose-sow-feature .primrose-sow-feature-description {
	grid-column: 1 / -1;
	padding-top: 14px !important;
}

/* Texte : aligné à gauche (le justifié crée des trous), plus aéré */
.widget_primrose-sow-feature .primrose-sow-feature-description,
.widget_primrose-sow-feature .primrose-sow-feature-description > div {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
	color: var(--pwpf-text);
	text-align: left !important;
}

.widget_primrose-sow-feature .primrose-sow-feature-description strong,
.widget_primrose-sow-feature .primrose-sow-feature-description b {
	color: var(--pwpf-green);
}

/* Le soulignement posé dans le texte devient un surlignage vert doux, plus lisible */
.widget_primrose-sow-feature .primrose-sow-feature-description u {
	text-decoration: none;
	background: linear-gradient(transparent 55%, var(--pwpf-green-bg) 55%);
}

/* Téléphone : cartes l'une sous l'autre, espacées */
@media screen and (max-width: 780px) {
	.panel-row-style:has(> .panel-grid-cell > .widget_primrose-sow-feature) {
		padding-top: 24px !important;
		padding-bottom: 24px !important;
	}

	.panel-grid-cell:has(> .widget_primrose-sow-feature) {
		margin-bottom: 14px !important;
	}

	.panel-grid-cell:has(> .widget_primrose-sow-feature):last-child {
		margin-bottom: 0 !important;
	}

	.widget_primrose-sow-feature .primrose-sow-feature {
		padding: 20px;
	}
}

/* Titres : bandeau vert clair fin sur toute la largeur de la page (comme la barre de menu), titre dans une pastille blanche.
   Concerne : les titres de section de l'accueil (widget Heading), le titre de chaque page (sauf quand il est masqué, ex. Accueil, Contact)
   et le titre de la boutique, des catégories et de la recherche (entouré par pwpm.js d'un .pwpm-title-band).
   Le fond est prolongé jusqu'aux bords par une ombre pleine découpée : aucun défilement horizontal. */
.so-widget-primrose-sow-heading,
body.page .entry-header:not(.screen-reader-text):has(> h1.entry-title),
.pwpm-title-band {
	box-sizing: border-box;
	padding: 9px 20px !important;
	background: var(--pwpf-bg);
	box-shadow: 0 0 0 100vmax var(--pwpf-bg);
	clip-path: inset(0 -100vmax);
	text-align: center;
}

.so-widget-primrose-sow-heading .primrose-sow-heading,
body.page .entry-header:not(.screen-reader-text) > h1.entry-title,
.pwpm-title-band .page-title {
	display: inline-block;
	margin: 0 !important;
	padding: 7px 20px !important;
	border: 1px solid var(--pwpf-line);
	border-radius: 999px;
	background: #fff;
	font-family: Montserrat, sans-serif !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	letter-spacing: .88px !important;
	text-transform: uppercase;
	color: var(--pwpf-green) !important;
}

/* Moins d'écart entre le bandeau et ce qui suit (SiteOrigin met 40 px sous chaque bloc) */
.so-panel:has(> .so-widget-primrose-sow-heading) {
	margin-bottom: 14px !important;
}

body.page .entry-header:not(.screen-reader-text):has(> h1.entry-title),
.pwpm-title-band {
	margin: 0 0 24px !important;
}

/* Le petit trait sous le titre n'a plus lieu d'être */
.so-widget-primrose-sow-heading .primrose-sow-heading::after,
body.page .entry-header:not(.screen-reader-text)::after,
.pwpm-title-band .page-title::after {
	display: none !important;
}

/* Boutique : la description qui suit le titre n'a plus besoin d'être remontée */
.woocommerce .pwpm-title-band + .page-description,
.woocommerce .pwpm-title-band + .term-description {
	margin-top: 0;
}