/*
 * EcoLift – basic functional styles.
 * Neutral, minimal, scoped to .ecolift-* classes. Override freely.
 * Colours/spacing are CSS variables on .ecolift, .ecolift-selector and .ecolift-single.
 */
.ecolift,
.ecolift-selector,
.ecolift-single {
	--ecolift-text: #1f2933;
	--ecolift-muted: #616e7c;
	--ecolift-border: #d3d9df;
	--ecolift-bg-soft: #f5f7f9;
	--ecolift-accent: #1f4e79;
	--ecolift-accent-contrast: #fff;
	--ecolift-radius: 4px;
	--ecolift-gap: 1rem;
	color: var(--ecolift-text);
}

.ecolift *,
.ecolift-selector *,
.ecolift-single * { box-sizing: border-box; }

.ecolift-wrap { max-width: 1200px; margin: 0 auto; padding: 1.5rem 1rem; }

/* ---------- Buttons ---------- */
.ecolift-button {
	display: inline-block;
	padding: .6rem 1.1rem;
	border: 1px solid var(--ecolift-accent);
	border-radius: var(--ecolift-radius);
	background: var(--ecolift-accent);
	color: var(--ecolift-accent-contrast);
	font-size: .95rem;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}
.ecolift-button:hover,
.ecolift-button:focus { opacity: .9; color: var(--ecolift-accent-contrast); }
.ecolift-button--secondary { background: transparent; color: var(--ecolift-accent); }
.ecolift-button--secondary:hover,
.ecolift-button--secondary:focus { background: var(--ecolift-bg-soft); color: var(--ecolift-accent); opacity: 1; }

/* ---------- Form controls (Shop filters + Selector) ---------- */
.ecolift-filters,
.ecolift-selector__form {
	padding: var(--ecolift-gap);
	margin-bottom: 1.5rem;
	background: var(--ecolift-bg-soft);
	border: 1px solid var(--ecolift-border);
	border-radius: var(--ecolift-radius);
}
.ecolift-filters__grid,
.ecolift-selector__fields {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: .75rem var(--ecolift-gap);
}
.ecolift-field__label { display: block; margin-bottom: .25rem; font-size: .85rem; font-weight: 600; }
.ecolift-input,
.ecolift-select {
	width: 100%;
	padding: .5rem .6rem;
	border: 1px solid var(--ecolift-border);
	border-radius: var(--ecolift-radius);
	background: #fff;
	color: var(--ecolift-text);
	font-size: .95rem;
}
.ecolift-filters__actions,
.ecolift-selector__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: var(--ecolift-gap); }

/* ---------- Results ---------- */
.ecolift-count { margin: 0 0 1rem; color: var(--ecolift-muted); font-size: .9rem; min-height: 1.3em; }
.ecolift-empty { padding: 1rem; background: var(--ecolift-bg-soft); border-radius: var(--ecolift-radius); }
.ecolift-selector.is-loading .ecolift-selector__results { opacity: .5; }

.ecolift-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: var(--ecolift-gap);
	margin: 0 0 1.5rem;
	padding: 0;
	list-style: none;
}
.ecolift-grid__item { margin: 0; }

/* ---------- Product card (Shop only) ---------- */
.ecolift-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	border: 1px solid var(--ecolift-border);
	border-radius: var(--ecolift-radius);
	background: #fff;
	overflow: hidden;
}
.ecolift-card__media { display: block; aspect-ratio: 4 / 3; background: var(--ecolift-bg-soft); }
.ecolift-card__media img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ecolift-card__placeholder { display: block; width: 100%; height: 100%; }
.ecolift-card__body { display: flex; flex-direction: column; flex: 1; gap: .4rem; padding: .9rem; }
.ecolift-card__terms { margin: 0; font-size: .75rem; text-transform: uppercase; letter-spacing: .03em; color: var(--ecolift-muted); }
.ecolift-card__title { margin: 0; font-size: 1.05rem; line-height: 1.3; }
.ecolift-card__title a { color: inherit; text-decoration: none; }
.ecolift-card__title a:hover { text-decoration: underline; }
.ecolift-card__code { margin: 0; font-size: .85rem; color: var(--ecolift-muted); }
.ecolift-card .ecolift-button { margin-top: auto; }

.ecolift-grid--list { grid-template-columns: 1fr; }
@media (min-width: 700px) {
	.ecolift-card--selector { flex-direction: row; }
	.ecolift-card--selector .ecolift-card__media { flex: 0 0 220px; aspect-ratio: auto; }
	.ecolift-card--selector .ecolift-button { align-self: flex-start; margin-top: .5rem; }
}

/* ---------- Spec lists & tables ---------- */
.ecolift-specs { margin: 0; font-size: .875rem; }
.ecolift-specs__row { display: flex; justify-content: space-between; gap: .75rem; padding: .2rem 0; border-bottom: 1px dotted var(--ecolift-border); }
.ecolift-specs dt { color: var(--ecolift-muted); }
.ecolift-specs dd { margin: 0; text-align: right; }

.ecolift-table-wrap { overflow-x: auto; margin: 0 0 1rem; }
.ecolift-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.ecolift-table th,
.ecolift-table td { padding: .55rem .75rem; border: 1px solid var(--ecolift-border); text-align: left; vertical-align: top; }
.ecolift-table th { width: 40%; background: var(--ecolift-bg-soft); font-weight: 600; }

/* ---------- Pagination ---------- */
.ecolift-pagination { margin: 1.5rem 0; }
.ecolift-pagination ul,
.ecolift-pagination__list { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; padding: 0; list-style: none; }
.ecolift-pagination .page-numbers,
.ecolift-page {
	display: inline-block;
	min-width: 2.25rem;
	padding: .4rem .7rem;
	border: 1px solid var(--ecolift-border);
	border-radius: var(--ecolift-radius);
	background: #fff;
	color: var(--ecolift-text);
	font-size: .9rem;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}
.ecolift-pagination .page-numbers.current,
.ecolift-page.is-current { background: var(--ecolift-accent); border-color: var(--ecolift-accent); color: var(--ecolift-accent-contrast); cursor: default; }
.ecolift-pagination__gap { padding: .4rem .3rem; color: var(--ecolift-muted); }

/* ---------- Shop header ---------- */
.ecolift-shop__title { margin: 0 0 1rem; }

/* ---------- Single pump (normal + technical) ---------- */
.ecolift-single__header { display: grid; grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 1.5rem; }
@media (min-width: 800px) { .ecolift-single__header { grid-template-columns: 1fr 1fr; } }
.ecolift-single__image { padding: 1rem; border: 1px solid var(--ecolift-border); border-radius: var(--ecolift-radius); text-align: center; }
.ecolift-single__image img { max-width: 100%; height: auto; }
.ecolift-single__title { margin: 0 0 .25rem; }
.ecolift-single__code { margin: 0 0 .75rem; color: var(--ecolift-muted); }
.ecolift-single__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.ecolift-meta { margin: 0 0 .5rem; font-size: .9rem; }

.ecolift-gallery { display: flex; flex-wrap: wrap; gap: .5rem; margin: .75rem 0 0; padding: 0; list-style: none; }
.ecolift-gallery img { display: block; width: 72px; height: 72px; object-fit: cover; border: 1px solid var(--ecolift-border); border-radius: var(--ecolift-radius); }

.ecolift-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .75rem; padding: 0; list-style: none; }
.ecolift-chip { display: inline-block; padding: .15rem .6rem; border: 1px solid var(--ecolift-border); border-radius: 999px; font-size: .8rem; color: var(--ecolift-text); text-decoration: none; }
.ecolift-chip:hover { background: var(--ecolift-bg-soft); }

.ecolift-anchors { margin-bottom: 1.5rem; border-bottom: 1px solid var(--ecolift-border); }
.ecolift-anchors ul { display: flex; flex-wrap: wrap; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.ecolift-anchors a { display: block; padding: .5rem 0; color: var(--ecolift-accent); text-decoration: none; font-size: .95rem; }
.ecolift-anchors a:hover { text-decoration: underline; }

.ecolift-section { margin-bottom: 2rem; scroll-margin-top: 5rem; }
.ecolift-section__title { margin: 0 0 .75rem; font-size: 1.35rem; }
.ecolift-subtitle { margin: 1rem 0 .5rem; font-size: 1.05rem; }
.ecolift-figure { margin: 0 0 1rem; }
.ecolift-figure img { max-width: 100%; height: auto; }
.ecolift-prose :first-child { margin-top: 0; }

/* ---------- Documents & certifications ---------- */
.ecolift-docs { margin: 0; padding: 0; list-style: none; }
.ecolift-docs__item { margin: 0 0 .5rem; }
.ecolift-doc { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem .9rem; border: 1px solid var(--ecolift-border); border-radius: var(--ecolift-radius); color: var(--ecolift-text); text-decoration: none; }
.ecolift-doc:hover { background: var(--ecolift-bg-soft); }
.ecolift-doc__meta { color: var(--ecolift-muted); font-size: .85rem; white-space: nowrap; }

.ecolift-certs { display: flex; flex-wrap: wrap; gap: var(--ecolift-gap); margin: 0; padding: 0; list-style: none; }
.ecolift-certs__item { display: flex; flex-direction: column; align-items: center; gap: .25rem; min-width: 110px; text-align: center; }
.ecolift-certs__logo img { display: block; max-width: 90px; height: auto; }
.ecolift-certs__name { font-weight: 600; font-size: .9rem; }
.ecolift-certs__note { font-size: .8rem; color: var(--ecolift-muted); }

/* =========================================================================
 * Pump Selector — Section 1: Products (Pump Type tabs + Pump Family buttons)
 * ========================================================================= */
.ecolift-selector__section-title { margin: 0 0 .6rem; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ecolift-muted); }
.ecolift-selector__products,
.ecolift-selector__filters,
.ecolift-selector__selection {
	padding: var(--ecolift-gap);
	margin-bottom: 1rem;
	background: var(--ecolift-bg-soft);
	border: 1px solid var(--ecolift-border);
	border-radius: var(--ecolift-radius);
}

.ecolift-groups__tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .9rem; }
.ecolift-groups__tab {
	padding: .45rem .9rem;
	border: 1px solid var(--ecolift-border);
	border-radius: 999px;
	background: #fff;
	color: var(--ecolift-text);
	font-size: .85rem;
	cursor: pointer;
}
.ecolift-groups__tab.is-active { background: var(--ecolift-accent); border-color: var(--ecolift-accent); color: var(--ecolift-accent-contrast); }

.ecolift-groups__panel { display: none; }
.ecolift-groups__panel.is-active { display: block; }
.ecolift-groups__families { display: flex; flex-wrap: wrap; gap: .5rem; }
.ecolift-family-btn {
	padding: .5rem 1rem;
	border: 1px solid var(--ecolift-border);
	border-radius: var(--ecolift-radius);
	background: #fff;
	color: var(--ecolift-text);
	font-size: .9rem;
	cursor: pointer;
}
.ecolift-family-btn.is-active { background: var(--ecolift-accent); border-color: var(--ecolift-accent); color: var(--ecolift-accent-contrast); }
.ecolift-groups__empty { margin: 0; color: var(--ecolift-muted); font-size: .9rem; }

/* ---------- Filters: toggle checkboxes ---------- */
.ecolift-field--toggle { display: flex; align-items: flex-end; }
.ecolift-field__checkbox { display: flex; align-items: center; gap: .4rem; font-size: .9rem; cursor: pointer; }

/* ---------- Selection hint ---------- */
.ecolift-selector__hint { margin: .75rem 0 0; font-size: .8rem; color: var(--ecolift-muted); }

/* =========================================================================
 * Pump Selector — results TABLE (replaces the card grid there)
 * ========================================================================= */
.ecolift-results-wrap { overflow-x: auto; margin: 0 0 1rem; border: 1px solid var(--ecolift-border); border-radius: var(--ecolift-radius); }
.ecolift-results { width: 100%; min-width: 960px; border-collapse: collapse; font-size: .85rem; }
.ecolift-results th,
.ecolift-results td { padding: .55rem .7rem; border-bottom: 1px solid var(--ecolift-border); text-align: left; white-space: nowrap; }
.ecolift-results thead th { background: var(--ecolift-bg-soft); font-weight: 600; position: sticky; top: 0; }
.ecolift-results tbody tr:hover { background: var(--ecolift-bg-soft); }
.ecolift-results .ecolift-button { white-space: nowrap; padding: .4rem .8rem; font-size: .85rem; }

@media (max-width: 700px) {
	.ecolift-results-wrap { border: none; }
	.ecolift-results { min-width: 0; white-space: normal; }
	.ecolift-results thead { display: none; }
	.ecolift-results tbody tr {
		display: block;
		margin-bottom: .75rem;
		border: 1px solid var(--ecolift-border);
		border-radius: var(--ecolift-radius);
		overflow: hidden;
	}
	.ecolift-results td {
		display: flex;
		justify-content: space-between;
		gap: .75rem;
		border-bottom: 1px dotted var(--ecolift-border);
	}
	.ecolift-results td::before {
		content: attr(data-label);
		font-weight: 600;
		color: var(--ecolift-muted);
		margin-right: .75rem;
	}
	.ecolift-results td:last-child { border-bottom: 0; justify-content: flex-end; }
}

/* =========================================================================
 * Technical product page — tabs
 * ========================================================================= */
.ecolift-tabs__nav { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: 1.25rem; border-bottom: 1px solid var(--ecolift-border); }
.ecolift-tabs__tab {
	padding: .65rem 1.1rem;
	border: 1px solid var(--ecolift-border);
	border-bottom: none;
	border-radius: var(--ecolift-radius) var(--ecolift-radius) 0 0;
	background: var(--ecolift-bg-soft);
	color: var(--ecolift-text);
	font-size: .9rem;
	cursor: pointer;
	margin-bottom: -1px;
}
.ecolift-tabs__tab.is-active { background: #fff; border-color: var(--ecolift-border); border-bottom: 1px solid #fff; color: var(--ecolift-accent); font-weight: 600; }
.ecolift-tabs__panel { display: none; }
.ecolift-tabs__panel.is-active { display: block; }