/* Wartungs- und Wechselintervalle: ausschließlich auf direkt zugeordneten Osmoseanlagen geladen. */
.woocommerce-Tabs-panel--description .theme-change-intervals {
	--theme-change-intervals-edge: clamp(1.2rem, 2.5vw, 2.25rem);

	position: relative;
	max-inline-size: 37rem;
	margin: 2.5rem calc(var(--theme-change-intervals-edge) * -1) calc(var(--theme-change-intervals-edge) * -1) auto;
	padding: clamp(1.25rem, 3vw, 1.75rem);
	border-block-start: 1px solid rgb(16 35 62 / 12%);
	border-inline-start: 1px solid rgb(16 35 62 / 12%);
	border-start-start-radius: var(--theme-radius);
	background: linear-gradient(135deg, #f0f6fc 0%, #ffffff 72%);
}

.woocommerce-Tabs-panel--description .theme-change-intervals__heading {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	margin: 0 0 1.1rem;
	color: var(--theme-color-blue-dark);
	font-family: var(--theme-font-heading);
	font-size: clamp(1.2rem, 2vw, 1.45rem);
	font-weight: 700;
	line-height: 1.3;
}

/* Info-Icon als Kreis mit "i" */
.woocommerce-Tabs-panel--description .theme-change-intervals__info-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.35rem;
	height: 1.35rem;
	border-radius: 50%;
	background: var(--theme-color-blue-dark);
	color: #fff;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: .8rem;
	font-weight: 700;
	line-height: 1;
}

.woocommerce-Tabs-panel--description .theme-change-intervals__info-icon::after {
	content: "i";
}

.woocommerce-Tabs-panel--description .theme-change-intervals__list {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-Tabs-panel--description .theme-change-intervals__item {
	display: flex;
	align-items: center;
	gap: .8rem;
	min-inline-size: 0;
	margin: 0;
	padding: .3rem 0;
}

.woocommerce-Tabs-panel--description .theme-change-intervals__item + .theme-change-intervals__item {
	border-inline-start: 1px solid rgb(0 57 115 / 13%);
	padding-inline-start: 1rem;
}

/* Sprite: zwei Motive nebeneinander, jeweils 350 × 350 px in der 700p-Datei. */
.woocommerce-Tabs-panel--description .theme-change-intervals__symbol {
	flex: 0 0 auto;
	width: clamp(3.75rem, 8vw, 4.6rem);
	aspect-ratio: 1;
	background-image: image-set(
		url("../media/Filterwechsel-Membranewechsel-Icons-240p.webp") type("image/webp") 1x,
		url("../media/Filterwechsel-Membranewechsel-Icons-400p.webp") type("image/webp") 2x,
		url("../media/Filterwechsel-Membranewechsel-Icons-700p.webp") type("image/webp") 3x
	);
	background-repeat: no-repeat;
	background-size: 200% 100%;
	background-position: 0 center;
}

.woocommerce-Tabs-panel--description .theme-change-intervals__item--membrane .theme-change-intervals__symbol {
	background-position: 100% center;
}

.woocommerce-Tabs-panel--description .theme-change-intervals__content {
	display: grid;
	gap: .15rem;
	min-inline-size: 0;
}

.woocommerce-Tabs-panel--description .theme-change-intervals__label {
	color: var(--theme-color-ink);
	font-family: var(--theme-font-heading);
	font-size: .95rem;
	font-weight: 700;
	line-height: 1.25;
}

.woocommerce-Tabs-panel--description .theme-change-intervals__value {
	color: var(--theme-color-muted);
	font-size: var(--theme-text-small);
	line-height: 1.35;
}

@media (max-width: 39.9375rem) {
	.woocommerce-Tabs-panel--description .theme-change-intervals {
		max-inline-size: none;
		margin: 2rem calc(var(--theme-change-intervals-edge) * -1) calc(var(--theme-change-intervals-edge) * -1);
		border-start-start-radius: 0;
	}

	.woocommerce-Tabs-panel--description .theme-change-intervals__heading {
		justify-content: center;
		gap: .5rem;
		text-align: center;
	}

	.woocommerce-Tabs-panel--description .theme-change-intervals__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0;
	}

	.woocommerce-Tabs-panel--description .theme-change-intervals__item {
		flex-direction: column;
		justify-content: flex-start;
		gap: .55rem;
		padding: .3rem .5rem;
		text-align: center;
	}

	.woocommerce-Tabs-panel--description .theme-change-intervals__item + .theme-change-intervals__item {
		border-block-start: 0;
		border-inline-start: 1px solid rgb(0 57 115 / 13%);
		padding: .3rem .5rem;
	}

	.woocommerce-Tabs-panel--description .theme-change-intervals__content {
		justify-items: center;
	}

	.woocommerce-Tabs-panel--description .theme-change-intervals__label {
		font-size: .9rem;
	}
}
