/*
 * Finder, Fassung 2 (0.40.0, Optik 0.41.0): die Aufteilung mit statischem Bild und die
 * Gestalt „app" — nach dem Vorbild „Wohnfinder 360" vermessen (2026-09-16, computed
 * styles): Panel 450 px weiß, Karten 392 × 100 in #f3f2f2 mit 7 px Radius und 8 px
 * Abstand, Preis 22 px/600, Beschreibung 12 px, Angaben 14 px in #475569, Statusquadrat
 * 11 px mit 2 px Radius, „Filtern" als dunkle Pille (#1e293b, 18 px Radius, 33 px hoch),
 * Werkzeuge in Pillen (#f3f2f2, 50 px hoch, 25 px Radius; Mitte Zoom, rechts Vollbild), Bühne mit demselben Bild als
 * `blur(8px)`-Hintergrund. Schrift bleibt die des Themes — Poppins liefern wir nicht.
 *
 * Eigene Datei, weil die Aufteilung des ersten Finders in `idco-re-sequence.css` steht
 * und die nur mit einer Bildfolge lädt (Regel 7). Nur `idco-re-*`-Klassen und
 * `--idco-re-*`-Properties (Regel 2); jede Farbe hat eine Property, die das Projekt-CSS
 * übersteuern kann.
 *
 * Die Liste scrollt seit 0.42.9 in sich (Bildhöhe, sichtbarer Balken). Der Sanft-Scroller
 * von ic-core bricht jedes Radereignis am Wurzelelement ab (Lehre aus 0.20.0) — deshalb
 * scrollt `idco-re-app.js` den Bereich beim Rad selbst und gibt an den Enden an die Seite
 * ab. Ohne Skript bleibt der Balken ziehbar und die Tastatur geht.
 */

.idco-re-finder--static,
.idco-re-finder--app {
	--idco-re-panel: 450px;
	--idco-re-hoehe: min(90vh, 1000px);
	--idco-re-app-stage: #1d1f22;
	--idco-re-app-accent: #1e293b;
	--idco-re-app-accent-fg: #fff;
	--idco-re-app-card: #f3f2f2;
	--idco-re-app-card-hover: #ececec;
	--idco-re-app-text: #1e293b;
	--idco-re-app-muted: #475569;
	--idco-re-app-panel: #fff;
	position: relative;
}

/* Telefon: Bild oben, Panel darunter in natürlicher Höhe (Spec E7). */
.idco-re-finder--app {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.idco-re-finder--app .idco-re-finder__view {
	order: -1;
	position: relative;
}

@media (min-width: 960px) {
	.idco-re-finder--static,
	.idco-re-finder--app {
		display: flex;
		flex-direction: row;
		align-items: stretch;
		gap: 24px;
	}
	.idco-re-finder--static.idco-re-finder--links {
		flex-direction: row-reverse;
	}
	.idco-re-finder--app .idco-re-finder__view {
		order: 0;
	}
	.idco-re-finder--static .idco-re-finder__view,
	.idco-re-finder--app .idco-re-finder__view {
		flex: 1 1 auto;
		min-width: 0;
		height: var(--idco-re-hoehe);
	}
	.idco-re-finder--static .idco-re-finder__view {
		position: sticky;
		top: var(--idco-re-sticky-top, 20px);
		align-self: flex-start;
	}
	.idco-re-finder--static .idco-re-finder__panel,
	.idco-re-finder--app .idco-re-finder__panel {
		flex: 0 0 var(--idco-re-panel);
		min-width: 0;
	}
	/* Die Liste scrollt in sich, in Bildhöhe, mit sichtbarem Balken — nur wenn sie länger
	   ist als das Bild (Wunsch 2026-09-16: „damit die Leute wissen, dass es mehr gibt").
	   Das Rad darin macht `idco-re-app.js` selbst gangbar (ic-core-Scroller). */
	.idco-re-finder--app .idco-re-finder__panel {
		display: flex;
		flex-direction: column;
		height: var(--idco-re-hoehe);
	}
	.idco-re-finder--app .idco-re-finder__scroll {
		flex: 1 1 auto;
		min-height: 0;
		overflow-y: auto;
		overscroll-behavior: contain;
		padding-right: 10px;
	}
	/* Der Balken soll IMMER zu sehen sein, nicht nur beim Scrollen: die `::-webkit-`-Regeln
	   zwingen Chrome und Safari zum klassischen Balken statt des flüchtigen von macOS —
	   aber nur, solange KEIN `scrollbar-width` daneben steht (Chrome ignoriert die
	   Pseudoelemente dann). Firefox bekommt die Standardeigenschaften über @supports. */
	@supports not selector(::-webkit-scrollbar) {
		.idco-re-finder--app .idco-re-finder__scroll {
			scrollbar-width: thin;
			scrollbar-color: var(--idco-re-app-scrollbar, rgba(0, 0, 0, .3)) transparent;
		}
	}
	.idco-re-finder--app .idco-re-finder__scroll::-webkit-scrollbar {
		width: 6px;
	}
	.idco-re-finder--app .idco-re-finder__scroll::-webkit-scrollbar-thumb {
		border-radius: 3px;
		background: var(--idco-re-app-scrollbar, rgba(0, 0, 0, .3));
	}
	.idco-re-finder--app .idco-re-finder__scroll::-webkit-scrollbar-track {
		border-radius: 3px;
		background: var(--idco-re-app-track, rgba(0, 0, 0, .06));
	}
	
	/* Das Bild füllt die Höhe, ganz zu sehen (Spec E7). Der Platzhalter des
	   Seitenverhältnisses entfällt: die Höhe kommt vom Rahmen. */
	.idco-re-finder--static .idco-re-map,
	.idco-re-finder--app .idco-re-map {
		display: flex;
		flex-direction: column;
		height: 100%;
	}
	.idco-re-finder--static .idco-re-map__stage,
	.idco-re-finder--app .idco-re-map__stage {
		flex: 1 1 auto;
		min-height: 0;
	}
	.idco-re-finder--static .idco-re-map__stage::before,
	.idco-re-finder--app .idco-re-map__stage::before {
		display: none;
	}
	/* Die Hausknöpfe liegen IM Bild, oben links, im Glas-Look (Wunsch 2026-09-17). */
	.idco-re-finder--app .idco-re-map {
		position: relative;
	}
	.idco-re-finder--app .idco-re-map__houses {
		position: absolute;
		top: 16px;
		left: 16px;
		z-index: 2;
		max-width: calc(100% - 120px);
		margin: 0;
		gap: 8px;
	}
}

/* --- Bühne: Blur, Zoom, Ziehen ------------------------------------------------------ */

.idco-re-finder--static .idco-re-map__stage,
.idco-re-finder--app .idco-re-map__stage {
	background: var(--idco-re-app-stage);
	border-radius: var(--idco-re-app-radius, 0);
	touch-action: none;
	user-select: none;
}
.idco-re-map__stage.is-zoomed {
	cursor: grab;
}
.idco-re-map__stage.is-dragging {
	cursor: grabbing;
}
/* Dasselbe Bild, weich und formatfüllend; leicht überstehend, damit die weichen Ränder
   nicht als heller Saum im Rahmen liegen. */
.idco-re-map__blur {
	position: absolute;
	inset: -16px;
	background-size: cover;
	background-position: 50% 50%;
	filter: blur(8px);
	pointer-events: none;
}
.idco-re-map__zoom {
	position: absolute;
	inset: 0;
	transform-origin: 0 0;
	will-change: transform;
}
/* Kein Geisterbild beim Ziehen — Safari kennt dafür nur diese Eigenschaft. */
.idco-re-map__zoom img,
.idco-re-map__zoom svg {
	-webkit-user-drag: none;
	user-select: none;
}
.idco-re-map__stage.is-dragging .idco-re-map__zoom {
	transition: none;
}
/* Die Flächen im Finder: dünne, helle Linie statt der 1,6 px dunklen der Bildkarte —
   auf dem Luftbild wirkte die schwer (Sichtung 2026-09-16). `vector-effect:
   non-scaling-stroke` aus idco-re.css hält sie beim Zoom auf einem Bildpunkt. */
.idco-re-finder--app .idco-re-map__area,
.idco-re-finder--static .idco-re-map__area {
	stroke: var(--idco-re-app-area, #fff);
	stroke-width: var(--idco-re-app-area-width, 1.5);
	/* Dunkler Saum um die helle Linie: auf hellen Dächern war sie sonst weg (Rückmeldung
	   Concept Bau 2026-09-21, „Kontrast müsste höher sein"). */
	filter: drop-shadow(0 0 1.5px rgba(0, 0, 0, .85));
}
/* Überfahren, gewählt, Gleichlauf (Spec E8): kräftige Füllung, dicke Linie. */
.idco-re-finder--app .idco-re-map__area:hover,
.idco-re-finder--static .idco-re-map__area:hover,
.idco-re-finder--app .idco-re-map__area--building.is-active,
.idco-re-finder--static .idco-re-map__area--building.is-active,
.idco-re-map__area.is-highlight {
	/* .5 → .24 (0.42.37): dieselbe Deckung wie die gestrichelten Auskunftsflächen — die
	   halbe Deckung legte einen milchigen Film über das Haus (Rückmeldung 2026-09-22). */
	fill-opacity: var(--idco-re-app-area-fill, .24);
	stroke: #fff;
	stroke-width: 3;
}
/* Auskunftsflächen (0.42.32): Beschriftung ohne Ziel — gestrichelt, kein Zeiger, leichter
   Schleier, beim Überfahren etwas mehr. */
.idco-re-map__area.idco-re-map__area--info {
	cursor: default;
	stroke-dasharray: 6 4;
	fill-opacity: .12;
}
/* Haus oder Bauabschnitt ohne Wohnung im Verkauf (0.42.42): gestrichelt wie die
   Auskunftsflächen, aber weiter ein Verweis mit Hinweiskarte. */
.idco-re-map__area.idco-re-map__area--pending {
	stroke-dasharray: 6 4;
	fill-opacity: .12;
}
.idco-re-finder--app .idco-re-map__area--info:hover,
.idco-re-finder--static .idco-re-map__area--info:hover,
.idco-re-finder--app .idco-re-map__area--pending:hover,
.idco-re-finder--static .idco-re-map__area--pending:hover {
	fill-opacity: .24;
	stroke-width: 2;
}
/* Die Hinweiskarte neben der Fläche — Maße der Vorbild-Karte. */
.idco-re-map__info {
	position: absolute;
	z-index: 3;
	min-width: 200px;
	max-width: 260px;
	padding: 10px 14px 12px;
	border-radius: 6px;
	background: var(--idco-re-app-card);
	color: var(--idco-re-app-text);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
	pointer-events: none;
	font-size: .875rem;
	line-height: 1.4;
}
.idco-re-map__info > strong {
	display: block;
	font-size: 1.125rem;
	font-weight: 600;
}
.idco-re-map__info > span {
	display: block;
	color: var(--idco-re-app-muted);
}

/* Glas-Look der Hausknöpfe: durchscheinend, weichgezeichneter Hintergrund, feiner
   heller Rand. Eigene Klassen mit zwei Gliedern, damit sie gegen `.uk-button-default`
   des Themes gewinnen (joseph: grün mit weißer Schrift). */
.idco-re-finder--app .idco-re-map__houses .idco-re-map__house {
	padding: 0 14px;
	border: 1px solid rgba(255, 255, 255, .55);
	border-radius: 17px;
	line-height: 32px;
	background: var(--idco-re-app-glass, rgba(255, 255, 255, .55));
	-webkit-backdrop-filter: blur(14px) saturate(1.4);
	backdrop-filter: blur(14px) saturate(1.4);
	color: var(--idco-re-app-text);
	box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
	font-size: .8125rem;
	text-transform: none;
	letter-spacing: normal;
}
.idco-re-finder--app .idco-re-map__houses .idco-re-map__house:hover {
	background: var(--idco-re-app-glass-hover, rgba(255, 255, 255, .75));
	color: var(--idco-re-app-text);
}
.idco-re-finder--app .idco-re-map__houses .idco-re-map__house.is-active {
	border-color: transparent;
	background: var(--idco-re-app-accent);
	color: var(--idco-re-app-accent-fg);
}
.idco-re-finder--app .idco-re-map__houses .idco-re-map__count {
	opacity: .65;
}

/* --- Werkzeuge: zwei Pillen in der Bühne — Zoom unten rechts, Vollbild oben rechts ---- */

.idco-re-finder__tools {
	position: absolute;
	right: 24px;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 4px;
	height: 50px;
	padding: 0 10px;
	border-radius: 25px;
	background: var(--idco-re-app-card);
	color: var(--idco-re-app-text);
	box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
}
.idco-re-finder__tools--zoom {
	bottom: 24px;
}
.idco-re-finder__tools--status {
	top: 16px;
}
/* Eigene Regel mit zwei Klassen (tests/test-button-css.php): Rand und Grund zurück,
   unabhängig vom Knopfstil des Themes (joseph: grün mit weißer Schrift). */
.idco-re-finder__tools .idco-re-finder__tool {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 20px;
	background: transparent;
	color: var(--idco-re-app-text);
	cursor: pointer;
}
.idco-re-finder__tools .idco-re-finder__tool:hover {
	background: rgba(0, 0, 0, .06);
}
/* --- Panel ------------------------------------------------------------------------ */

.idco-re-finder--app .idco-re-finder__head {
	padding-bottom: 20px;
}
.idco-re-finder--app .idco-re-finder__title {
	font-size: 2.1875rem;
	font-weight: 700;
	line-height: 1;
}

/* „Filtern" und das Sortierfeld in EINER Reihe, die Felder darunter im Aufklapper.
   Der Knopf ist das <summary> und muss im <details> bleiben — deshalb steht er absolut
   oben links mit fester Breite, und die Reihe daneben lässt ihm den Platz.
   Als PADDING, nicht als Rand: das Projekt-CSS von joseph setzt `.idco-re-filter > div`
   auf `margin: 0` (gemessen 2026-09-14), und die Reihe ist so ein Kind. */
.idco-re-filter--app {
	position: relative;
}
.idco-re-filter--app .idco-re-filter__bar {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	min-height: 33px;
	padding: 0 0 8px var(--idco-re-filter-toggle, 128px);
}
.idco-re-filter--app .idco-re-filter__sort {
	flex: 0 1 auto;
	margin: 0;
}
/* Das Sortierfeld ist im Vorbild nackter Text mit Pfeil — kein Rahmen, kein Grund. Es
   trägt bewusst KEIN `uk-select` (joseph: `.uk-select { border: 1px solid !important }`),
   deshalb steht hier alles selbst: Aussehen zurück, eigener Pfeil als Datenbild. */
.idco-re-filter--app .idco-re-filter__select {
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	max-width: 100%;
	height: 33px;
	padding: 0 28px 0 8px;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: transparent url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%231e293b' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") no-repeat right 2px center;
	color: var(--idco-re-app-text);
	font: inherit;
	font-size: .875rem;
	line-height: 33px;
	text-align: right;
	text-align-last: right;
	cursor: pointer;
}
.idco-re-filter--app .idco-re-filter__select:focus-visible {
	outline: 2px solid var(--idco-re-app-accent);
	outline-offset: 2px;
}
/* Das Sortier-Overlay (0.42.14): ein Textknopf mit Pfeil, darunter eine eigene Liste —
   kein natives Auswahlfeld mehr, sobald das Skript da ist (das Feld bleibt im Formular
   und trägt den Wert). Zwei Glieder je Regel: tests/test-button-css.php. */
.idco-re-filter--app .idco-re-filter__sort {
	position: relative;
}
.idco-re-filter--app .idco-re-filter__sortbtn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 33px;
	padding: 0 4px 0 8px;
	margin: 0 2px 0 0;
	border: 0;
	border-radius: 17px;
	background: transparent;
	color: var(--idco-re-app-text);
	font: inherit;
	font-size: .875rem;
	cursor: pointer;
}
.idco-re-filter--app .idco-re-filter__sortbtn:hover,
.idco-re-filter--app .idco-re-filter__sortbtn[aria-expanded="true"] {
	background: var(--idco-re-app-card);
}
.idco-re-filter--app .idco-re-filter__sortmenu {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	z-index: 5;
	min-width: 230px;
	padding: 6px;
	border-radius: 12px;
	background: var(--idco-re-app-panel);
	box-shadow: 0 8px 30px rgba(0, 0, 0, .18), 0 0 0 1px rgba(0, 0, 0, .06);
}
.idco-re-filter--app .idco-re-filter__sortopt {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 9px 12px;
	margin: 0;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: var(--idco-re-app-text);
	font: inherit;
	font-size: .875rem;
	text-align: left;
	cursor: pointer;
}
.idco-re-filter--app .idco-re-filter__sortopt:hover {
	background: var(--idco-re-app-card);
}
.idco-re-filter--app .idco-re-filter__sortopt[aria-selected="true"] {
	font-weight: 600;
}
.idco-re-filter--app .idco-re-filter__sortopt[aria-selected="true"]::after {
	content: "✓";
	margin-left: 12px;
	font-size: .75rem;
}

/* „Anzeigen (n)" unter den Feldern: dunkle Pille mit Haken, wie im Vorbild. */
.idco-re-filter--app .idco-re-filter__done {
	padding: 12px 0 4px;
}
.idco-re-filter--app .idco-re-filter__show {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 40px;
	padding: 0 18px 0 14px;
	margin: 0;
	border: 0;
	border-radius: 20px;
	background: var(--idco-re-app-accent);
	color: var(--idco-re-app-accent-fg);
	font: inherit;
	font-size: .9375rem;
	font-weight: 500;
	cursor: pointer;
}
.idco-re-filter--app .idco-re-filter__more > summary {
	position: absolute;
	top: 0;
	left: 0;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: calc(var(--idco-re-filter-toggle, 128px) - 10px);
	height: 33px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 18px;
	background: var(--idco-re-app-accent);
	color: var(--idco-re-app-accent-fg);
	font-size: .9375rem;
	line-height: 33px;
	text-transform: none;
	letter-spacing: normal;
	list-style: none;
	cursor: pointer;
}
.idco-re-filter--app .idco-re-filter__more > summary::-webkit-details-marker {
	display: none;
}
.idco-re-filter--app .idco-re-filter__more[open] > summary {
	filter: brightness(1.2);
}
.idco-re-filter--app .idco-re-filter__more[open] > summary + * {
	margin-top: 8px;
}
/* Das Raster der Felder trägt UIkits negativen Außenabstand (-10 px), und das Projekt-CSS
   von joseph nimmt den Feldern den linken Innenabstand — die Felder ragten aus dem
   Scrollbereich heraus und wurden links abgeschnitten (gemessen 2026-09-17: x = 45 bei
   Panel 55). Der Aufklapper gleicht das aus — 10 px als Vorgabe ohne Skript, den echten
   Abstand des Themes liest `idco-re-app.js` ab (aitest 15 px, joseph 10 px). */
.idco-re-filter--app .idco-re-filter__more {
	padding-left: 10px;
}

/* --- Karten mit dem Preis voran (Spec E3) — Maße des Vorbilds ---------------------- */

.idco-re-finder--app .idco-re-card--price-first {
	position: relative;
	min-height: 100px;
	border: 0;
	border-radius: 7px;
	box-shadow: none;
	background: var(--idco-re-app-card);
	color: var(--idco-re-app-text);
	cursor: pointer;
	transition: background-color .12s ease;
}
.idco-re-finder--app .idco-re-card--price-first:hover {
	background: var(--idco-re-app-card-hover);
}
/* Gleichlauf (Spec E8): die Karten des überfahrenen Hauses. Nur die Hintergrundfarbe
   (#f3f2f2 → #ececec) war kaum zu sehen (Rückmeldung 2026-09-18) — jetzt dazu ein Ring
   in der Akzentfarbe, innen gezeichnet, damit sich kein Maß ändert. */
.idco-re-finder--app .idco-re-card--price-first.is-highlight {
	background: var(--idco-re-app-card-hover);
	box-shadow: inset 0 0 0 2px var(--idco-re-app-highlight, var(--idco-re-app-accent));
}
.idco-re-finder--app .idco-re-card--price-first > div {
	padding: 11px 14px 12px;
}
.idco-re-card__price {
	margin: 0;
	font-size: 1.375rem;
	font-weight: 600;
	line-height: 1.5;
	color: var(--idco-re-app-text);
}
.idco-re-finder--app .idco-re-card--price-first .idco-re-card__title {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 10px;
	margin: 0;
	font-size: .75rem;
	font-weight: 400;
	line-height: 1.5;
	color: var(--idco-re-app-text);
}
.idco-re-card__label {
	opacity: 1;
}
.idco-re-card__status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
/* Das Quadrat trägt die Statusfarbe (`.idco-re-status--*` aus idco-re.css); im
   Bildfolgen-Panel würde dieselbe Klasse zum schwebenden Punkt — hier nicht. */
.idco-re-finder--app .idco-re-finder__panel .idco-re-card .idco-re-card__dot {
	position: static;
	display: inline-block;
	width: 11px;
	height: 11px;
	padding: 0;
	margin: 0;
	border-radius: 2px;
	text-indent: 0;
}
.idco-re-card__line {
	margin: 2px 0 0;
	font-size: .875rem;
	line-height: 1.5;
	color: var(--idco-re-app-muted);
	opacity: 1;
}
/* Lupe, Brief, Download unten rechts — wo im Vorbild „Merken" steht. */
.idco-re-finder--app .idco-re-card--price-first .idco-re-actions__list {
	position: absolute;
	right: 14px;
	bottom: 12px;
	gap: 12px;
}
/* Die Symbole in der Textfarbe der Karte: joseph färbt `.uk-icon-link` weiß (für seine
   dunklen Abschnitte), und auf der hellen Karte waren Lupe und Brief unsichtbar. */
.idco-re-finder--app .idco-re-card--price-first .idco-re-actions__list > a {
	color: var(--idco-re-app-muted);
}
.idco-re-finder--app .idco-re-card--price-first .idco-re-actions__list > a:hover {
	color: var(--idco-re-app-text);
}

/* --- Vollbild ------------------------------------------------------------------------ */

.idco-re-finder--app.is-fullscreen {
	--idco-re-hoehe: 100vh;
	height: 100vh;
	gap: 0;
	background: var(--idco-re-app-panel);
}
.idco-re-finder--app.is-fullscreen .idco-re-finder__view {
	position: relative;
	top: 0;
}
.idco-re-finder--app.is-fullscreen .idco-re-finder__panel {
	/* Im Vollbild gibt es keine Seite, die scrollt — hier darf das Panel selbst. */
	box-sizing: border-box;
	height: 100vh;
	overflow-y: auto;
	padding: 16px 24px 0;
	background: var(--idco-re-app-panel);
}

@media (max-width: 959px) {
	.idco-re-finder__tools {
		bottom: 12px;
		height: 40px;
	}
	.idco-re-finder__tools {
		right: 12px;
	}
	.idco-re-finder__tools--zoom {
		bottom: 12px;
	}
	.idco-re-finder__tools--status {
		top: 12px;
	}
	.idco-re-finder--app .idco-re-map__houses {
		top: 12px;
		left: 12px;
		max-width: calc(100% - 80px);
	}
}

/* --- Etagenpläne (0.43.0): weitere Ebenen derselben Bühne ----------------------------
   Ein Plan liegt über der ganzen Bühne; ist einer sichtbar, tritt die Übersicht zurück
   (`is-plan` an der Bühne). Der Wechsel blendet kurz über — die Animation startet von
   selbst, sobald eine Ebene aus `display: none` kommt. */
.idco-re-map__layer {
	position: absolute;
	inset: 0;
}
/* Im Planmodus beginnt der Plan UNTER den Knopfreihen, die auf dem Bild liegen — sonst
   verdeckten sie die obere Wohnungsreihe (Sichtung THE ONE 2026-10-06). Den Abstand misst
   `idco-re-floors.js`; ohne Skript bleibt er 0. Dahinter eine ruhige Fläche statt der
   unscharfen Bildkopie. */
.idco-re-finder--app .idco-re-map__stage.is-plan .idco-re-map__layer {
	top: var(--idco-re-plan-top, 0px);
	/* Telefon: Platz für die Zoom-Leiste unten (0.43.5), ebenfalls gemessen. */
	bottom: var(--idco-re-plan-bottom, 0px);
}
.idco-re-finder--app .idco-re-map__stage.is-plan {
	background: var(--idco-re-app-plan-bg, #fff);
}
.idco-re-map__layer[hidden],
.idco-re-map__stage.is-plan > .idco-re-map__zoom,
.idco-re-map__stage.is-plan > .idco-re-map__blur {
	display: none;
}
.idco-re-map__layer:not([hidden]),
.idco-re-map__stage[data-idco-re-layers]:not(.is-plan) > .idco-re-map__zoom {
	animation: idco-re-ebene .3s ease-out;
}
@keyframes idco-re-ebene {
	from { opacity: 0; }
	to { opacity: 1; }
}
/* Wohnungen auf dem Plan: immer sichtbar in ihrer Statusfarbe, beim Überfahren kräftiger. */
.idco-re-map__layer .idco-re-map__area--unit {
	fill: var(--idco-re-status-available, #3d8b5a);
	fill-opacity: var(--idco-re-app-unit-fill, .32);
}
.idco-re-map__layer .idco-re-map__area--reserved {
	fill: var(--idco-re-status-reserved, #c8a415);
}
.idco-re-map__layer .idco-re-map__area--sold {
	fill: var(--idco-re-status-sold, #b2413f);
}
.idco-re-map__layer .idco-re-map__area--unit:hover,
.idco-re-map__layer .idco-re-map__area--unit.is-highlight,
.idco-re-map__layer a:focus-visible > .idco-re-map__area--unit {
	fill-opacity: var(--idco-re-app-unit-fill-hover, .6);
}
/* --- Bühne nach Projekteinstellung (0.43.4) ------------------------------------------
   `stage_bg: transparent`: nichts hinter dem Bild — der Himmel eines Freistellers zeigt den
   Seitenhintergrund. Auch im Planmodus. */
.idco-re-finder--app.idco-re-finder--bg-transparent .idco-re-map__stage,
.idco-re-finder--app.idco-re-finder--bg-transparent .idco-re-map__stage.is-plan {
	background: transparent;
}
/* `stage_fit: contain` auf dem Desktop: die Bühne folgt dem Seitenverhältnis des Bildes
   (der Platzhalter `::before` aus idco-re.css gilt wieder), statt eine feste Höhe zu haben —
   keine leeren Ränder, kein Anfangszoom (idco-re-app.js). Im Vollbild wieder die volle
   Höhe. Auf dem Telefon gilt das Seitenverhältnis ohnehin. */
@media (min-width: 960px) {
	.idco-re-finder--app.idco-re-finder--fit-contain .idco-re-finder__view {
		align-self: flex-start;
		height: auto;
	}
	.idco-re-finder--app.idco-re-finder--fit-contain .idco-re-map {
		height: auto;
	}
	.idco-re-finder--app.idco-re-finder--fit-contain .idco-re-map__stage {
		flex: none;
	}
	.idco-re-finder--app.idco-re-finder--fit-contain .idco-re-map__stage::before {
		display: block;
	}
	.idco-re-finder--app.idco-re-finder--fit-contain.is-fullscreen .idco-re-finder__view {
		align-self: stretch;
		height: 100vh;
	}
	.idco-re-finder--app.idco-re-finder--fit-contain.is-fullscreen .idco-re-map {
		height: 100%;
	}
	.idco-re-finder--app.idco-re-finder--fit-contain.is-fullscreen .idco-re-map__stage {
		flex: 1 1 auto;
	}
	.idco-re-finder--app.idco-re-finder--fit-contain.is-fullscreen .idco-re-map__stage::before {
		display: none;
	}
}

/* Häuser- und Geschossreihe zugleich: die zweite unter der ersten. */
@media (min-width: 960px) {
	.idco-re-finder--app .idco-re-map__houses + .idco-re-map__floors {
		top: 60px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.idco-re-finder--app .idco-re-card--price-first {
		transition: none;
	}
	.idco-re-map__layer:not([hidden]),
	.idco-re-map__stage[data-idco-re-layers]:not(.is-plan) > .idco-re-map__zoom {
		animation: none;
	}
}