/**
 * Shared Benaa Store presentation foundations.
 * Use logical properties so the same rules support RTL and LTR.
 */

.benaa-container {
	inline-size: min(100% - 2rem, var(--benaa-content-width));
	margin-inline: auto;
}

.benaa-section {
	padding-block: clamp(2.5rem, 5vw, 5rem);
}

.benaa-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--benaa-space-2);
	min-block-size: 44px;
	padding-block: 0.75rem;
	padding-inline: 1.25rem;
	border-radius: var(--benaa-radius-sm);
	background: var(--benaa-color-primary);
	color: #fff;
	text-decoration: none;
}

.benaa-button:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--benaa-color-secondary) 70%, #fff);
	outline-offset: 3px;
}

@media (max-width: 767px) {
	.benaa-container {
		inline-size: min(100% - 1.25rem, var(--benaa-content-width));
	}
}