/*
 * Dotazioni della camera: shortcode [dotazioni_camera] e widget Elementor.
 * I colori e i caratteri arrivano dal tema (currentColor, font ereditato).
 */
.fa-amenities {
	--fa-amenities-gap: 0.5rem 2rem;
	--fa-amenities-border: color-mix(in srgb, currentColor 18%, transparent);
	width: 100%;
}

.fa-amenities__group + .fa-amenities__group {
	margin-top: 2rem;
}

.fa-amenities__title {
	margin: 0 0 0.75rem;
	font-size: 1.1em;
}

.fa-amenities__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fa-amenities-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Elenco: voci separate da una barra, come una riga di testo. */
.fa-amenities--list .fa-amenities__list {
	justify-content: center;
	gap: 0.25rem 0;
}

.fa-amenities--list .fa-amenities__item:not(:last-child)::after {
	content: '|';
	margin-inline: 0.6em;
	opacity: 0.4;
}

.fa-amenities--list.fa-amenities--grouped .fa-amenities__list {
	justify-content: flex-start;
}

/* Icone: una colonna per dotazione, divise da un filetto. */
.fa-amenities--icons .fa-amenities__list {
	justify-content: center;
	gap: 0;
}

.fa-amenities--icons .fa-amenities__item {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	min-width: 108px;
	padding: 0.5rem 1.25rem;
	border-right: 1px solid var(--fa-amenities-border);
	text-align: center;
	text-wrap: balance;
}

.fa-amenities--icons .fa-amenities__item:first-child {
	border-left: 1px solid var(--fa-amenities-border);
}

.fa-amenities__icon {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	height: clamp(2rem, 2.5vw, 5rem);
}

.fa-amenities__icon img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

@media (max-width: 1024px) {
	.fa-amenities--icons .fa-amenities__item {
		flex: 1 1 25%;
		padding: 0.875rem;
	}
}

@media (max-width: 767px) {
	.fa-amenities--icons .fa-amenities__item {
		flex: 1 1 33.333%;
		gap: 0.75rem;
		padding: 0.75rem;
		border: 0;
	}

	.fa-amenities--grouped .fa-amenities__list {
		flex-direction: column;
	}

	.fa-amenities--list.fa-amenities--grouped .fa-amenities__item::after {
		content: none;
	}
}
