/* Marktplatz (marktplatz.php) – Ergänzungen zu atoms.css; zusammengeführt aus Suche, Gebrauchtmarkt und Themen. */

/* Das Filterformular umschließt Bühne, Filterspalte und Ergebnisse, erzeugt aber keine eigene Box. */
.eb-mp { display: contents; }

/* Suchfeld ohne Browser-Schmuck */
.eb-mp-suche { -webkit-appearance: none; appearance: none; }
.eb-mp-suche::-webkit-search-cancel-button,
.eb-mp-suche::-webkit-search-decoration { -webkit-appearance: none; appearance: none; }

/* Während neue Treffer geladen werden */
[data-eb-teil="ergebnisse"], [data-eb-teil="unten"] { transition: opacity .15s; }
.eb-mp-laedt [data-eb-teil="ergebnisse"], .eb-mp-laedt [data-eb-teil="unten"] { opacity: .5; }

/* Listenansicht (Briefing Runde 2, Punkt 8): Filterspalte links, breite Inseratskarten rechts (parts/b-listen-karte.php). */
.eb-mp-raster { grid-template-columns: 272px minmax(0, 1fr); gap: 32px; }
.eb-mp-auf, .eb-mp-filterknopf { display: none; }
.p-7-10 { padding: 7px 10px; }
.eb-lk { grid-template-columns: 300px minmax(0, 1fr) auto; }
.eb-lk-bild { min-height: 210px; }
.eb-lk-text { padding: 18px 8px 18px 22px; }
.eb-lk-preis { padding: 16px 18px 18px 8px; min-width: 168px; }
.eb-lk-fakten { grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px 16px; }
.eb-lk-breit { grid-column: span 2; }
.eb-lk:hover .eb-lk-titel { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* Schmalere Fenster: Preis unter den Text, Bild über beide Zeilen */
@media (max-width: 1099.98px) {
	.eb-mp-raster { grid-template-columns: 240px minmax(0, 1fr); gap: 24px; }
	.eb-lk { grid-template-columns: 240px minmax(0, 1fr); }
	.eb-lk-bild { grid-row: span 2; }
	.eb-lk-text { padding: 16px 18px 8px; }
	.eb-lk-preis { flex-direction: row-reverse; justify-content: space-between; align-items: flex-end; padding: 0 18px 16px; min-width: 0; }
	.eb-lk-preis .eb-lk-betrag { align-items: flex-start; margin-top: 0; }
}

/* Tablet und Handy: Filter über der Liste, einklappbar (ohne JavaScript über das Kästchen) */
@media (max-width: 899.98px) {
	.eb-mp-raster { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.eb-mp-auf { display: block; }
	.eb-mp-filterknopf { display: flex; }
	.eb-mp-filterliste { display: none; padding: 4px 0 8px; }
	.eb-mp-auf:checked ~ .eb-mp-filterliste { display: flex; }
	.eb-mp-auf:focus-visible + .eb-mp-filterknopf { outline: 2px solid #141414; outline-offset: 2px; }
}

/* Handy (unter 640 px): Reiter zum Wischen; Inseratskarten einspaltig – Bild oben, Text darunter. */
@media (max-width: 639.98px) {
	.eb-mp-krumen { align-items: center; }
	.eb-mp-krumen a { padding: 12px 0; }
	.eb-mp-reiter { margin: 0 -16px; padding: 0 16px 2px 20px; }
	.eb-mp-seiten a { min-height: 44px; }
	.eb-mp-kategorien a { min-height: 44px; }
	.eb-lk { grid-template-columns: minmax(0, 1fr); }
	.eb-lk-bild { grid-row: auto; min-height: 0; aspect-ratio: 16 / 10; }
	.eb-lk-text { padding: 14px 16px 6px; gap: 10px; }
	.eb-lk-titel { font-size: 22px; }
	.eb-lk-fakten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.eb-lk-preis { padding: 0 16px 16px; }
	/* Landingpage-Teile (aus themen.css) */
	.eb-th-kacheln > a > span:last-child { flex-direction: column; gap: 2px; padding: 10px 12px; }
	.eb-th-kacheln > a > span:last-child > span:first-child { font-size: 15px; }
	.eb-th-haendler { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
	.eb-th-haendler > span:last-child { display: none; }
	.eb-th-faq { gap: 20px; }
	.eb-th-chip { min-height: 44px; }
	.eb-th-hub { padding-bottom: 48px; }
}

/* Einzelklassen, die im Prototyp nicht vorkommen (nicht in atoms.css) */
.bd-1-solid-white { border: 1px solid #fff; }
.gtc-repeat-auto-fill-minmax-220-1fr { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.minw-44 { min-width: 44px; }
.p-56-clamp-16-4vw-32-0 { padding: 56px clamp(16px, 4vw, 32px) 0; }
.p-8-14 { padding: 8px 14px; }

/* SEO-Text der Kategorie (Backend, Kern\Kategorien) */
.eb-th-text h2 { margin: 0; font-size: clamp(28px, 2.6vw, 40px); line-height: 0.95; font-weight: 900; font-style: italic; text-transform: uppercase; }
.eb-th-text h3 { margin: 6px 0 0; font-size: 22px; font-weight: 900; font-style: italic; text-transform: uppercase; }
.eb-th-text p, .eb-th-text ul, .eb-th-text ol { margin: 0; font-size: 17px; line-height: 1.6; color: #3c3c3a; }
.eb-th-text a { font-weight: 700; color: #141414; }
.maxw-220 { max-width: 220px; }

/* SEO-Text der Kategorie- und Zielgruppenseiten: Listen und Tabellen (übernommene Texte der alten Kategorieseiten,
   Korrektur 11) – Tabellen wie im Magazin, auf dem Handy waagrecht scrollbar. */
.eb-th-text ul, .eb-th-text ol { padding-left: 1.3em; display: flex; flex-direction: column; gap: 6px; }
.eb-th-text .eb-tabelle { margin: 4px 0; max-width: 100%; overflow-x: auto; border: 1px solid #e2e2df; border-radius: 10px; -webkit-overflow-scrolling: touch; }
.eb-th-text table { width: 100%; min-width: 440px; border-collapse: collapse; }
.eb-th-text th { padding: 12px 16px; background: #141414; color: #fff; font-size: 12px; font-weight: 800; font-style: italic; text-transform: uppercase; text-align: left; }
.eb-th-text td { padding: 14px 16px; border-top: 1px solid #e2e2df; font-size: 15px; line-height: 1.5; vertical-align: top; color: #3c3c3a; }
.eb-th-text td:first-child { font-weight: 800; color: #141414; }
.eb-th-text p, .eb-th-text li, .eb-th-text td { -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
/* Ab Tablet darf eine Tabelle über die Textbreite (70ch) hinaus die ganze Inhaltsbreite nutzen. */
@media (min-width: 900px) {
	.eb-th-text .eb-tabelle { width: min(1256px, calc(100vw - 2 * clamp(16px, 4vw, 32px))); max-width: none; }
}
