/* ==========================================================================
   pacht.de Pachtbörse – pb-plugin.css
   Ergänzungen zu pb.css (das unverändert aus dem Prototyp stammt). Nur neue Modifier und
   Plugin-spezifische Hilfsklassen; keine Änderung bestehender Regeln.
   ========================================================================== */

/* Eingebettetes Icon-Sprite */
.pb-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* Echte Fotos in Platzhalter-Flächen (Karte, Galerie, Teaser, Dateiliste) */
.pb-photo--bild { padding: 0; gap: 0; background-image: none; }
.pb-photo--bild img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pb-gallery__thumb .pb-photo--bild, .pb-file__thumb .pb-photo--bild, .pb-teaser__img .pb-photo--bild, .pb-listing-row__thumb .pb-photo--bild { min-height: 0; }
/* In Karten füllt das Foto die Bildfläche im Format aus pb.css (Inserate 4:3, Ratgeber 16:9) und wird zugeschnitten;
   im Fluss würde ein höheres Bild (Hochformat, 4:3 in der Ratgeber-Karte) die Fläche und damit die Karte vergrößern. */
.pb-card__media > .pb-photo--bild { position: absolute; inset: 0; min-height: 0; }
/* Gesuch-Karten ohne farbigen Balken links (pb.css: 4 px teal); Unterscheidung über das Etikett „Gesuch“ */
.pb-card--gesuch { border-left: 1px solid var(--pb-border); }
/* Buttons in Hinweisboxen behalten ihre Schriftfarbe (pb.css färbt mit .pb-alert a alle Links in der Textfarbe der Box) */
.pb-alert .pb-btn--primary, .pb-alert .pb-btn--primary:hover, .pb-alert .pb-btn--buy, .pb-alert .pb-btn--buy:hover, .pb-alert .pb-btn--danger-solid, .pb-alert .pb-btn--danger-solid:hover { color: #fff; }
.pb-alert .pb-btn--secondary, .pb-alert .pb-btn--ghost, .pb-alert .pb-btn--inverted { color: var(--pb-text); }
/* Kartenfuß (Kategorie, Datum) unten bündig, wenn die Karte im Raster gestreckt wird; pb.css setzt dafür margin-top: auto,
   das im Grid des Kartenkörpers nicht greift */
.pb-card__body { display: flex; flex-direction: column; }
/* Raster, in dem alle Karten gleich hoch sind, auch über mehrere Reihen (Suchergebnisse) */
@media (min-width: 600px) { .pb-grid--gleich { grid-auto-rows: 1fr; } }
/* Leerzustand: das große graue Symbol gilt nur fürs Motiv, nicht für Symbole in Buttons (sonst graues, zu großes Plus) */
.pb-empty .pb-btn .pb-icon { width: 20px; height: 20px; color: currentColor; stroke-width: 2; }

/* Fremde Themes (z. B. Flatsome): Börsen-Rahmen, falls das Theme kein pacht-boerse unterstützt */
.pb-fremdtheme { background: var(--pb-bg); }

/* Button während einer Anfrage */
.pb-btn[aria-busy="true"] { opacity: 0.7; cursor: progress; }

/* WordPress-Admin-Leiste: Sticky-Elemente nicht darunter */
@media (min-width: 900px) {
  .admin-bar .pb-sticky { top: calc(16px + 32px); }
}

/* --------------------------------------------------------------------------
   Schmale Bildschirme (bis 420 px). Im Prototyp laufen einige Seiten auf 375 px seitlich über
   (angemeldeter Kopf, Sitzungstabelle, Bestellübersicht, Foto-Upload, Rechnung). pb.css bleibt
   unverändert; diese Regeln lassen Grid-Kinder schrumpfen und machen Kopf und Rechnung kompakter.
   -------------------------------------------------------------------------- */
.pb-stack > *, .pb-form > *, .pb-fieldset > *, .pb-layout > *, .pb-files > *, .pb-dropzone > * { min-width: 0; }
.pb-dropzone__text, .pb-dropzone__hint { overflow-wrap: anywhere; }
/* Lange Wörter und Adressen ohne Leerzeichen (Links in Beschreibungen, E-Mail-Adressen) brechen um, statt über die Spalte zu laufen. */
.pb-prose, .pb-detail__title, .pb-card__title, .pb-provider, .pb-listing-row__title { overflow-wrap: anywhere; }
.pb-header .pb-nav__toggle { flex-shrink: 0; }

@media (max-width: 420px) {
  .pb-header__inner { gap: var(--pb-space-2); }
  .pb-header__actions { gap: 4px; }
  .pb-header__actions > .pb-btn:not(.pb-btn--icon) { padding-inline: 12px; }
  /* „Mein Konto“ mit Zähler: Zähler als Punkt am Symbol statt daneben */
  .pb-header__actions > .pb-btn:has(> .pb-badge--count) { position: relative; padding-inline: 10px; }
  .pb-header__actions > .pb-btn > .pb-badge--count { position: absolute; top: 3px; right: 1px; min-width: 18px; padding: 0 5px; font-size: 0.6875rem; line-height: 16px; }
  .pb-invoice { padding: 16px; overflow-x: auto; } /* sechs Betragsspalten: Tabelle scrollt im Beleg, nicht die Seite */
  .pb-invoice__head { flex-wrap: wrap; }
  .pb-invoice__items th, .pb-invoice__items td { padding: 6px 4px; }
  .pb-invoice__items thead th, .pb-invoice__items tfoot td { white-space: normal; letter-spacing: 0; }
}

/* --------------------------------------------------------------------------
   Suchdialog der Lupe im Kopf (templates/partials/suche-dialog.php, pb.js): oben statt mittig, Treffer scrollen
   -------------------------------------------------------------------------- */
/* Suchfeld mit Lupe (Suchdialog, Ergebnisseite): ein Rahmen, Fokusring direkt am Rand statt mit Abstand */
.pb-suchfeld { position: relative; flex: 1 1 auto; min-width: 0; }
.pb-suchfeld > .pb-icon { position: absolute; left: 14px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--pb-text-muted); pointer-events: none; }
.pb-suchfeld > .pb-input { min-height: 48px; padding-left: 44px; }
.pb-suchfeld > .pb-input:focus-visible { outline: 2px solid var(--pb-focus); outline-offset: 0; border-color: var(--pb-focus); }
.pb-suchzeile { display: flex; gap: var(--pb-space-2); }
.pb-suchzeile > .pb-btn { flex-shrink: 0; min-height: 48px; }
.pb-suche[open] { margin-top: min(12vh, 96px); }
/* Unter 600 px blendet pb.css die Lupe im Kopf aus: dann steht „Suchen“ oben im Menü */
@media (min-width: 600px) { .pb-nav__item--suche { display: none; } }
.pb-suche__treffer { display: grid; gap: var(--pb-space-4); max-height: min(55vh, 480px); overflow-y: auto; margin: 0 -8px; padding: 0 8px 2px; }
.pb-suche form[aria-busy="true"] .pb-suche__treffer { opacity: 0.6; }
.pb-suche__kopf { display: flex; justify-content: space-between; gap: var(--pb-space-2); margin-bottom: 4px; font-size: var(--pb-fs-xs); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--pb-text-muted); }
.pb-suche__liste { display: grid; margin: 0; padding: 0; list-style: none; }
.pb-suche__link { display: grid; gap: 2px; padding: 8px 10px; border-radius: var(--pb-radius); color: var(--pb-text); text-decoration: none; }
.pb-suche__link:hover, .pb-suche__link:focus-visible { background: var(--pb-bg-muted); }
.pb-suche__link:hover .pb-suche__titel { color: var(--pb-primary-text); }
.pb-suche__titel { font-weight: 600; line-height: 1.35; }
.pb-suche__meta { font-size: var(--pb-fs-sm); color: var(--pb-text-muted); }
.pb-suche__mehr { padding: 4px 10px 0; font-size: var(--pb-fs-sm); }
.pb-suche__alle { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.pb-suche__alle .pb-icon { width: 16px; height: 16px; }
.pb-suche__leer { color: var(--pb-text-muted); }

/* Fremdinserate (Import von Kleinanzeigen.de): Etikett der Quelle, Symbol statt Initialen, Link zum Original */
.pb-badge--quelle { background: var(--pb-warm-100); border: 1px solid var(--pb-warm-300); color: var(--pb-warm-800); }
.pb-provider__avatar > .pb-icon { width: 22px; height: 22px; }
.pb-provider__quelle { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; font-weight: 600; color: var(--pb-primary-text); }
.pb-provider__quelle .pb-icon { width: 14px; height: 14px; }

/* Ankerseiten: Links zu Stadt- und Bundesland-Seiten (Kategorie-, Regionen- und Stadtseiten), Link in der Metazeile */
.pb-regionen__titel { margin: var(--pb-space-4) 0 var(--pb-space-3); font-size: var(--pb-fs-sm); font-weight: 600; color: var(--pb-text-muted); }
.pb-linklist--spalten { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px 24px; }
.pb-linklist__n { color: var(--pb-text-subtle); font-weight: 400; }
.pb-detail__meta a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.pb-detail__meta a:hover { color: var(--pb-primary-text); }