/* ==========================================================================
   KM Product Reassurance Icons
   ========================================================================== */

:root {
	--reassurance-icon-max-height: 90px;
	--reassurance-icon-gap: 16px;
	--reassurance-icon-align: center;
}

.km-reassurance-icons {
	display: flex !important;
	align-items: center !important;
	justify-content: var(--icon-align, var(--reassurance-icon-align)) !important;
	gap: var(--icon-gap, var(--reassurance-icon-gap)) !important;
	flex-wrap: wrap !important;
	padding: 16px 0 !important;
	margin: 0 !important;
}

/* Version statique (défauts) */
.km-reassurance-icons--static {
	--icon-max-height: 90px;
	--icon-gap: 16px;
	--icon-align: center;
}

.km-reassurance-icons__icon {
	display: block !important;
	width: auto !important;
	height: auto !important;
	max-width: none !important;
	max-height: var(--icon-max-height, var(--reassurance-icon-max-height)) !important;
	min-width: 0 !important;
	min-height: 0 !important;
	object-fit: contain !important;
	flex-shrink: 0 !important;
	opacity: 0.85 !important;
	transition: opacity 0.2s ease, transform 0.2s ease !important;
}

.km-reassurance-icons__icon:hover {
	opacity: 1 !important;
	transform: scale(1.05) !important;
}

/* Responsive */

/* Tablette (1024px et moins) */
@media (max-width: 1024px) {
	:root {
		--reassurance-icon-max-height: 70px;
	}

	.km-reassurance-icons--static {
		--icon-max-height: 70px;
	}
}

/* Mobile landscape (768px et moins) */
@media (max-width: 768px) {
	:root {
		--reassurance-icon-max-height: 60px;
	}

	.km-reassurance-icons {
		gap: 12px !important;
	}

	.km-reassurance-icons--static {
		--icon-max-height: 60px;
	}
}

/* Mobile portrait (480px et moins) */
@media (max-width: 480px) {
	:root {
		--reassurance-icon-max-height: 50px;
	}

	.km-reassurance-icons {
		gap: 10px !important;
	}

	.km-reassurance-icons--static {
		--icon-max-height: 50px;
	}
}
