/* BP Benefits Bar widget styles
 *
 * Horizontal rounded dark-green benefits bar with five evenly
 * distributed items. Each item: circular outlined icon + two-
 * line uppercase label. Premium, clean agricultural aesthetic.
 * All rules live under .bp-benefits to stay isolated.
 * Logical properties keep LTR/RTL aligned.
 */

.bp-benefits {
	--bp-benefits-bg:          var(--bp-primary, #374F37);
	--bp-benefits-fg:          #FFFFFF;
	--bp-benefits-olive:       #B8B25A;
	--bp-benefits-radius:      20px;
	--bp-benefits-pad-block:   18px;
	--bp-benefits-pad-inline:  24px;
	--bp-benefits-gap:         16px;
	--bp-benefits-icon-size:   24px;
	--bp-benefits-icon-circle: 52px;
	--bp-benefits-shadow:      0 6px 18px rgba(31, 42, 31, 0.10);
	--bp-benefits-font:        var(--bp-font-body, 'Manrope', system-ui, sans-serif);

	background: var(--bp-benefits-bg);
	color: var(--bp-benefits-fg);
	border-radius: var(--bp-benefits-radius);
	box-shadow: var(--bp-benefits-shadow);
	padding-block: var(--bp-benefits-pad-block);
	padding-inline: var(--bp-benefits-pad-inline);
	font-family: var(--bp-benefits-font);
}

.bp-benefits__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--bp-benefits-gap);
}

.bp-benefits__item {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1 1 0;
	min-inline-size: 0;
}

.bp-benefits__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	inline-size: var(--bp-benefits-icon-circle);
	block-size: var(--bp-benefits-icon-circle);
	border-radius: 50%;
	border: 1.5px solid var(--bp-benefits-olive);
	color: var(--bp-benefits-olive);
	flex: 0 0 auto;
	line-height: 1;
}

.bp-benefits__icon i,
.bp-benefits__icon svg {
	font-size: var(--bp-benefits-icon-size);
	width: var(--bp-benefits-icon-size);
	height: var(--bp-benefits-icon-size);
	fill: currentColor;
}

.bp-benefits__label {
	display: inline-flex;
	flex-direction: column;
	line-height: 1.15;
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	min-inline-size: 0;
}

.bp-benefits__label-line {
	display: block;
}

/* ---- Tablet ---- */
@media (max-width: 1024px) {
	.bp-benefits {
		--bp-benefits-pad-block:  16px;
		--bp-benefits-pad-inline: 18px;
		--bp-benefits-gap:        10px;
		--bp-benefits-icon-circle: 44px;
		--bp-benefits-icon-size:   20px;
	}
	.bp-benefits__label {
		font-size: 11px;
		letter-spacing: 0.06em;
	}
	.bp-benefits__item {
		gap: 8px;
	}
}

/* ---- Mobile: 2-column grid, fifth item spans full row ---- */
@media (max-width: 720px) {
	.bp-benefits__list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		justify-items: start;
		gap: 18px 16px;
	}
	.bp-benefits[data-bp-benefits-count="5"] .bp-benefits__item:nth-child(5) {
		grid-column: 1 / -1;
		justify-self: center;
	}
	.bp-benefits__item {
		flex: 0 0 auto;
	}
}

@media (max-width: 420px) {
	.bp-benefits {
		--bp-benefits-icon-circle: 40px;
		--bp-benefits-icon-size:   18px;
	}
	.bp-benefits__label {
		font-size: 10px;
		letter-spacing: 0.05em;
	}
}
