/* ===================== freeagents.php ("fap-" prefix) =====================
   Moved out of freeagents.php's inline <style> block 2026-08-11 (continuing the page-by-page
   cleanup, see css/dyne.css's own header for the project). All static, no PHP-variable
   interpolation, so this is a clean 1:1 move.

   .gmform-msg-error/.gmform-msg-success stayed here (page-local) rather than merging into
   css/dyne.css's shared .gmform-login-box — these two have quietly diverged into different
   variants across the ~17 pages that define them (this page's margin is 0 0 6px, trade.php's own
   copy is 0 0 10px, older un-redesigned pages use a plain color+font-size version) — see
   css/trade.css's header for the same finding. freeagents.php doesn't define .gmform-login-box
   at all (doesn't need it), unlike trade.php.

   .fap-pill (+ color variants) is NOT the same rule as roster.php's .rh-pill or playerlist.php's
   .plp-pill even though the color VALUES match — those are separate class names by design (see
   docs/design-system.md's "per-page prefix, reused suffix names" pattern), not accidental
   duplication like rh-pill was, so left alone rather than force-merged into one shared class. */

#content .gmform-msg-error { color: #b00000 !important; text-shadow: none !important; font-size: 13px; background-color: #ffffff; padding: 6px 10px; border-radius: 4px; margin: 0 0 6px; width: fit-content; }
#content .gmform-msg-success { color: #1a7a1a !important; text-shadow: none !important; font-size: 13px; background-color: #ffffff; padding: 6px 10px; border-radius: 4px; margin: 0 0 6px; width: fit-content; }

/* ===================== Redesign 2026-08-08 ===================== */
.fap-page { max-width: 1360px; margin: 0 auto; background: #ffffff; }
/* Free Agents/Upcoming Free Agents-Tabs (+ Auktionen-Button) sitzen seit 2026-08-08 direkt
   in der Hauptnav-Leiste, in derselben Zeile wie das Hamburger-Icon (User-Wunsch: "GENAU wie
   bei roster.php"), aber horizontal auf Hoehe des Seiteninhalts (.fap-content) statt direkt
   am Hamburger-Icon - anders als roster.php (das komplett ausserhalb von
   .layoutBoundary/#content liegt und darum ohnehin am Hamburger-Icon ausgerichtet ist), steckt
   .fap-page HIER in der gemeinsamen #content.content/.layoutBoundary-Huelle, deren
   Breite/Padding aus dem extern gehosteten Stylesheet kommt (siehe CSS-Architektur-Notiz) und
   sich nicht per fester CSS-Formel nachbilden laesst. .fap-navtabs (flex:1 1 auto, teilt sich
   die Zeile mit dem Hamburger-Icon statt sie ueber volle Breite zu belegen) bekommt daher per
   JS (siehe <script> weiter unten) links/rechts genau so viel Padding verpasst, dass die Tabs
   exakt ueber der linken/rechten Kante von .fap-content landen - identisches Prinzip wie
   syncMainNavHeaderHeight() in nav.php. */
.fap-navtabs { display: flex; align-items: center; flex: 1 1 auto; flex-wrap: wrap; box-sizing: border-box; position: relative; }
.fap-navtab.active { background-color: #1a2733; font-weight: 700; }
/* Mobile (< 768px, gleicher Breakpoint wie nav.php's Hamburger-Umschaltung) zeigt "Current FA"/
   "Upcoming FA"/"FA Auktionen" statt der vollen Labels, um Platz in der Nav-Zeile zu sparen
   (User-Wunsch 2026-08-22, Auktionen-Kurzform + kleinere Buttons ergaenzt 2026-08-23) - Desktop
   bleibt beim vollen Text. Die Buttons selbst erben sonst .mainnav-link-item's Desktop-Padding/
   -Margin (16px/16px Padding, 32px margin-right, siehe nav.php's --dl-space-space-* Variablen),
   was auf Mobile - wo die Tabs bewusst ungepolstert direkt neben dem Hamburger-Icon sitzen statt
   die volle Breite zu bekommen (s.o.) - fuer 3 Tabs nie in eine Zeile passt; daher hier deutlich
   kompaktere Werte, nur fuer Mobile. */
.fap-navtab-short { display: none; }
@media (max-width: 767px) {
	.fap-navtab-full { display: none; }
	.fap-navtab-short { display: inline; }
	.fap-navtab { padding: 2px 4px; margin-right: 2px; font-size: 9px; }
	.fap-live-badge { margin-left: 2px; padding: 1px 2px; font-size: 7px; }
	/* .ntf-badge-wrap/img (Team-Logo-Badge rechts) und .mainnav-hamburger-btn (Hamburger-Icon)
	   sind nav.php-globale Klassen, hier trotzdem verkleinert, damit Hamburger-Icon + die 3 Tabs +
	   Badge zusammen in einer Zeile bleiben (User-Wunsch 2026-08-23, mehrfach nachgeschaerft) -
	   nur hier ueberschrieben, weil css/freeagents.css ausschliesslich auf freeagents.php laedt,
	   andere Seiten mit .mainnav-page-local bleiben von dieser Verkleinerung unberuehrt. */
	.ntf-badge-wrap { padding-right: 2px; }
	.ntf-badge-wrap img { width: 20px; height: 20px; }
	.mainnav-hamburger-btn { padding: 4px 6px; font-size: 14px; }
}
/* Auktions-Button sitzt seit 2026-08-10 (User-Wunsch) direkt neben "Upcoming Free Agents"
   statt rechtsbuendig. Die Uhrzeit-Anzeige selbst ist seit 2026-09-12 (User-Wunsch: "zentriert")
   ueber position:absolute in der Mitte von #fapNavTabs verankert (siehe Media-Query weiter unten) -
   das margin-left:12px hier (siehe Kommentar bei .fap-view-toggle) ist nur noch der Mobile-Fallback
   unterhalb 768px, wo die Zeile ohnehin umbricht und eine absolute Mittenposition unpassend waere. */
.fap-navclock { font-weight: 700; font-variant-numeric: tabular-nums; color: #fff; white-space: nowrap; }
/* "Auktionen laufen gerade" (User-Wunsch 2026-08-10, $fa_auctions_running) bzw. "starten gleich"
   (User-Wunsch 2026-08-23, $fa_auctions_starting_soon, ab 15min vor Signing-Day-Beginn) - kraeftige
   Rot-Faerbung + dezenter Puls, damit ein GM den Button auch beim beilaeufigen Ueberfliegen
   der Nav-Leiste nicht uebersieht. Der "LIVE"-Badge selbst bleibt aber an $fa_auctions_running
   gebunden (freeagents.php) - im Vorfenster laeuft noch nichts, nur die Optik warnt schon vor. */
.fap-navtab-auctions-live { background-color: #b23b30 !important; animation: fapAuctionsLivePulse 1.6s ease-in-out infinite; }
.fap-navtab-auctions-live:hover { background-color: #96322a !important; }
.fap-live-badge { display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 8px; background: #fff; color: #b23b30; font-size: 9px; font-weight: 800; letter-spacing: .04em; vertical-align: middle; animation: fapLiveBlink 1.4s ease-in-out infinite; }
@keyframes fapAuctionsLivePulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(178, 59, 48, .6); } 50% { box-shadow: 0 0 0 5px rgba(178, 59, 48, 0); } }
@keyframes fapLiveBlink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

.fap-content { padding: 16px 20px 26px; box-sizing: border-box; }

.fap-filters { background: #f4f6f8; border: 1px solid #dde1e6; border-radius: 6px; padding: 14px 16px; margin-bottom: 14px; display: flex; flex-direction: column; gap: 12px; }
.fap-filter-row1 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fap-search { flex: 1 1 200px; min-width: 160px; padding: 7px 10px; border-radius: 5px; border: 1px solid #ccd3da; font-size: 12.5px; color: #1b2733; font-family: inherit; }
.fap-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 16px; background: #eef1f4; border: 1px solid #ccd3da; color: #1b2733; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; user-select: none; }
.fap-chip input { margin: 0; }
.fap-chip:has(input:checked) { background: #2c3e50; color: #fff; border-color: #2c3e50; }
.fap-adv-toggle { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 1px solid #ccd3da; color: #1b2733; font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 16px; cursor: pointer; font-family: inherit; }

/* "Eigene Beteiligung"-Chip mit angehaengtem Fuehrend/Ueberboten-Dropdown (User-Wunsch
   2026-08-21) - Dropdown ist nur eingeblendet, solange die Checkbox angehakt ist, rein per
   :has() geloest (wie schon .fap-chip:has(input:checked) oben). */
.fap-chip-split { display: inline-flex; align-items: stretch; border-radius: 16px; overflow: hidden; border: 1px solid #ccd3da; background: #eef1f4; }
.fap-chip-split .fap-chip { border: none; border-radius: 0; }
.fap-chip-split:has(input:checked) { border-color: #2c3e50; }
.fap-chip-split .fap-chip-sub { display: none; align-items: center; border-left: 1px solid #ccd3da; }
.fap-chip-split:has(input:checked) .fap-chip-sub { display: flex; }
.fap-chip-sub select { appearance: none; -webkit-appearance: none; border: none; background: transparent; font-family: inherit; font-size: 12px; font-weight: 600; color: #1b2733; padding: 6px 22px 6px 10px; cursor: pointer; }
.fap-chip-sub { position: relative; }
.fap-chip-sub::after { content: ""; position: absolute; right: 9px; top: 50%; width: 6px; height: 6px; border-right: 1.6px solid #66707c; border-bottom: 1.6px solid #66707c; transform: translateY(-65%) rotate(45deg); pointer-events: none; }
.fap-adv-toggle svg { transition: transform .15s ease; }
.fap-adv-toggle.open svg { transform: rotate(180deg); }

.fap-adv-panel { padding-top: 10px; border-top: 1px dashed #ccd3da; margin-top: 2px; }
/* #fap-normal-filters/#fap-ratings-filters (User-Wunsch 2026-09-07, "Filter strikt getrennt je
   Ansicht") - die urspruengliche Grid-Regel sass direkt auf .fap-adv-panel; jetzt auf den inneren
   Normal-Wrapper verschoben, da .fap-adv-panel jetzt zwei alternative Kind-Bloecke statt flacher
   .fap-field-Kinder umschliesst (die Ratings-Filter brauchen ihr eigenes .fap-fgrid-Layout, siehe
   unten - kein gemeinsames 4-Spalten-Raster fuer beide). #fap-shared-filters (Position, User-Wunsch
   2026-09-08 - unabhaengig von der Ansicht sichtbar, siehe playerlist.css's identischer Kommentar)
   teilt sich dieselbe Grid-Regel wie #fap-normal-filters. */
#fap-normal-filters, #fap-shared-filters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 16px; }
#fap-shared-filters { padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px dashed #e2e4e7; }
@media (max-width: 980px) { #fap-normal-filters, #fap-shared-filters { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { #fap-normal-filters, #fap-shared-filters { grid-template-columns: 1fr; } }
.fap-field label { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: #66707c; font-weight: 700; margin-bottom: 4px; }
.fap-select { font-family: inherit; font-size: 12px; padding: 6px 8px; border-radius: 5px; border: 1px solid #ccd3da; background: #fff; color: #1b2733; width: 100%; box-sizing: border-box; }
.fap-range { display: flex; align-items: center; gap: 6px; }
.fap-range input { width: 100%; font-family: inherit; font-size: 12px; padding: 6px 8px; border-radius: 5px; border: 1px solid #ccd3da; color: #1b2733; font-variant-numeric: tabular-nums; box-sizing: border-box; }
.fap-range span { color: #66707c; font-size: 11px; }
.fap-pos-group { display: flex; gap: 4px; flex-wrap: wrap; }
.fap-pos-group .fap-chip { padding: 5px 10px; border-radius: 4px; }
.fap-adv-actions { display: flex; gap: 8px; padding-top: 10px; margin-top: 10px; border-top: 1px dashed #ccd3da; }

/* Ratings-Filter (User-Wunsch 2026-09-07): 1:1 dieselbe Struktur wie playerratings.php's
   .plr-panel-search/.plr-fgroup/.plr-fgrid/.plr-checks, unter fap-Praefix. .fap-fgrid nutzt Flex
   statt des 4-Spalten-Grids von #fap-normal-filters, da hier bis zu 53 Felder pro Gruppe (Badges)
   flexibel umbrechen sollen statt in feste Spalten gezwungen zu werden - identisch zu playerratings.php. */
.fap-panel-search { margin-bottom: 12px; }
.fap-panel-search input { width: 100%; max-width: 320px; padding: 7px 10px; border: 1px solid #ccd3da; border-radius: 5px; font-size: 12px; font-family: inherit; background: #fff; }
.fap-fgroup { margin-bottom: 14px; }
.fap-fgroup:last-of-type { margin-bottom: 0; }
.fap-fgroup-title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #66707c; margin: 0 0 8px; padding-bottom: 5px; border-bottom: 1px dashed #ccd3da; }
.fap-fgrid { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.fap-fgrid .fap-field { display: flex; flex-direction: column; gap: 3px; min-width: 120px; }
.fap-checks { display: flex; gap: 8px; flex-wrap: wrap; }
.fap-checks .fap-chip { padding: 4px 10px; font-size: 11px; }
@media (max-width: 767px) { .fap-fgrid { gap: 8px; } }
.fap-btn { font-family: inherit; font-size: 12px; font-weight: 600; padding: 7px 14px; border-radius: 5px; cursor: pointer; border: 1px solid #2c3e50; text-decoration: none; display: inline-block; }
.fap-btn.ghost { background: transparent; color: #2c3e50; }
.fap-btn.ghost:hover { background: #eef1f4; }

/* max-height + overflow-y:auto (User-Wunsch 2026-08-17: Kopfzeile soll beim Runterscrollen
   sichtbar bleiben) statt eines rein page-weiten position:sticky auf <thead th> - CSS-Spec-
   Grund: sobald overflow-x auf einem Element nicht "visible" ist, wird der computed Wert von
   overflow-y automatisch ebenfalls "auto" (CSS Overflow Module, "aligned" overflow-x/-y-Regel),
   .fap-table-scroll war also durch sein eigenes overflow-x:auto schon immer sein eigener
   Scroll-Container - ein sticky thead darin haette sich NIE auf das Scrollen der Gesamtseite
   bezogen, sondern nur auf das (nie stattfindende, da ungebundene Hoehe) interne Scrollen dieser
   Box, also komplett wirkungslos geblieben. explizite max-height macht diesen ohnehin schon
   bestehenden Scroll-Container real nutzbar statt eines Bugs. */
.fap-table-scroll { overflow-x: auto; overflow-y: auto; max-height: calc(100vh - 260px); min-height: 200px; }
table.fap-table { width: 100%; border-collapse: collapse; font-size: 12px; min-width: 1080px; }
.fap-table thead th { position: sticky; top: 0; z-index: 3; background: #2c3e50; color: #fff; font-weight: 700; text-align: center; padding: 8px 6px; white-space: nowrap; box-shadow: 0 2px 3px rgba(0,0,0,0.15); }
.fap-table thead th.left { text-align: left; padding-left: 12px; }
.fap-table thead th.sorted { background: #1a2733; }
.fap-table thead th a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 3px; }
.fap-table tbody td { padding: 6px; text-align: center; border-bottom: 1px solid #e2e4e7; vertical-align: middle; }
.fap-table tbody td.left { text-align: left; padding-left: 12px; }
/* Die 3 .fap-row-break-Marker-Zellen (PHP: data-break="a"/"b"/"c") sind reine Mobile-
   Zeilenumbruch-Helfer (siehe @media max-width:720px weiter unten) und sollten auf Desktop
   unsichtbar UND aus dem Spaltenraster raus sein - die display:none-Regel dafuer stand aber
   bisher NUR innerhalb dieser @media-Query. Auf Desktop erschienen sie dadurch als 3 echte,
   ungelabelte Extra-Spalten VOR der Gebot-/Watchlist-Spalte, wodurch deren th/td-Zaehlung
   auseinanderlief: die "Gebot"-Kopfzeile stand ueber einer leeren Break-Zelle, der eigentliche
   Gebots-/Claim-Button und der Watchlist-Button landeten dadurch je 2-3 Spalten weiter rechts
   als ihre Kopfzeilen - Ursache sowohl fuer den "Gebot ist leer"-Eindruck als auch den
   Watchlist-Button-Rand-Bug vom 2026-08-17. display:none() gehoert daher hierher (Basis-
   Regel), die @media-Query weiter unten schaltet es fuer die ausgeklappte Mobile-Karte per
   !important wieder an. */
.fap-table td.fap-row-break { display: none; }
.fap-table tbody tr:nth-child(odd) { background: #fff; }
.fap-table tbody tr:nth-child(even) { background: #f5f6f8; }
.fap-table tbody tr:hover { background: #eaf1f8; }
.fap-table td.sticky-col, .fap-table th.sticky-col { position: sticky; left: 0; z-index: 1; background: inherit; box-shadow: 2px 0 4px rgba(0,0,0,0.06); }
.fap-table thead th.sticky-col { background: #2c3e50; z-index: 4; }
.fap-table thead th.sticky-col.sorted { background: #1a2733; }
/* Watchlist-Auge (letzte Spalte) war bei genuegend Spalten (Gebot-Zelle allein schon
   min-width:260px) rechts ausserhalb des sichtbaren .fap-table-scroll-Bereichs, ohne dass
   der noetige horizontale Scrollbalken auffiel (User-Bericht 2026-08-17: Button "rechts
   ausserhalb der Inhaltsbox verschwunden", nur der Rand war noch zu sehen). Gleiches
   Sticky-Prinzip wie die linke Spielername-Spalte (.sticky-col), nur rechtsbuendig -
   der Button bleibt so beim horizontalen Scrollen immer erreichbar statt Scroll-Distanz
   vorauszusetzen. */
.fap-table td.sticky-col-right, .fap-table th.sticky-col-right { position: sticky; right: 0; z-index: 1; background: inherit; box-shadow: -2px 0 4px rgba(0,0,0,0.06); }
.fap-table thead th.sticky-col-right { background: #2c3e50; z-index: 4; }
.fap-player-cell { display: flex; align-items: center; gap: 8px; }
.fap-playerpic { width: 32px; height: 32px; border-radius: 4px; object-fit: cover; flex-shrink: 0; }
.fap-name-link { color: #2c3e50; font-weight: 600; text-decoration: underline; }
.fap-muted { color: #a9b0b8; }
.fap-empty { text-align: center; padding: 30px; color: #66707c; font-size: 14px; }

/* ===================== Ratings-Ansicht (Umschalter, User-Wunsch 2026-09-07) =====================
   Zweite Ansicht neben der normalen FA-Tabelle: dieselben Zeilen/Filter, aber die 2K-Ratings-
   Spalten (Attributes/Badges/Hot Zones) statt der FA-spezifischen Spalten, wie auf
   playerratings.php. Umschalter selbst ist .fap-seg (css/dyne.css, "richtiger Switch wie z.B.
   capspace.php" - User-Korrektur 2026-09-07, ersetzt die anfaengliche dunkle .fap-navtab-Optik, die
   optisch mit der Nav-Leiste verschmolz) INNERHALB von #fapNavTabs, rechtsbuendig per
   margin-left:auto - .fap-navclock folgt direkt danach mit einem kleinen Abstand (Mobile-Fallback,
   siehe Kommentar dort - ab 768px wird die Uhr per Media-Query stattdessen absolut zentriert). */
.fap-view-toggle { margin-left: auto; }
.fap-navclock { margin-left: 12px; }
/* Zentrierte Uhrzeit ab Desktop-Breite (User-Wunsch 2026-09-12): #fapNavTabs deckt (position:relative
   s.o.) dieselbe volle Breite ab wie die dunkle Nav-Leiste selbst (kein max-width wie bei
   roster.php/standings.php, siehe design-system.md), und die schmalere, zentrierte Seiteninhalts-
   Spalte darunter (.fap-page, max-width:1360px, margin:0 auto) teilt sich denselben Mittelpunkt mit
   dieser vollen Breite - links:50% traf darum unabhaengig vom fapSyncNavTabsPadding()-Padding (das
   nur die TABS/den Umschalter an den Content-Kanten ausrichtet) exakt die Bildschirmmitte. Unter
   768px (wo die Zeile umbricht, s.o.) bleibt die kompakte Inline-Position von oben bestehen. */
@media (min-width: 768px) {
	.fap-navclock { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin-left: 0; }
}

.fap-group-toggles { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0 0; }
.fap-group-chip { border: 1px solid #ccd3da; background: #fff; color: #66707c; border-radius: 9px; padding: 6px 12px; font-size: 11.5px; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; letter-spacing: .02em; cursor: pointer; user-select: none; }
.fap-group-chip.active { background: #2c3e50; border-color: #2c3e50; color: #fff; }
.fap-group-chip .n { opacity: .7; font-weight: 500; margin-left: 3px; }

/* Spielervergleich (User-Wunsch 2026-09-07): eigener Akzentton statt Navy (Gruppen-Chips) - siehe
   playerratings.php's .plr-compare-toggle, identische Werte. */
.fap-compare-toggle { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #0f7a72; background: #fff; color: #0f7a72; border-radius: 16px; padding: 6px 12px 6px 10px; font-size: 11.5px; font-weight: 700; font-family: inherit; cursor: pointer; }
.fap-compare-toggle.active { background: #0f7a72; color: #fff; }
.fap-compare-toggle:hover { filter: brightness(0.97); }

/* Checkbox-Spalte fuer den Spielervergleich - identisches Prinzip wie playerratings.php's
   .plr-chk-col (siehe dessen ausfuehrlicher Kommentar): immer im Markup, per Default unsichtbar,
   #fap-results.fap-compare-mode zeigt sie (ueberlebt jeden Ajax-Fetch, da nur .innerHTML getauscht
   wird). Nur in der Ratings-Tabelle vorhanden - Vergleich ist ein Ratings-Feature. */
.fap-table th.fap-chk-col, .fap-table td.fap-chk-col { display: none; width: 34px; padding: 6px 4px; text-align: center; position: sticky; left: 0; z-index: 1; }
#fap-results.fap-compare-mode .fap-table th.fap-chk-col, #fap-results.fap-compare-mode .fap-table td.fap-chk-col { display: table-cell; }
.fap-table thead th.fap-chk-col { background: #2c3e50; z-index: 4; }
.fap-rowchk { width: 15px; height: 15px; accent-color: #0f7a72; cursor: pointer; }
#fap-results.fap-compare-mode .fap-table th.sticky-col,
#fap-results.fap-compare-mode .fap-table td.sticky-col { left: 34px; }
#fap-results.fap-compare-mode .fap-table th.fap-ovr-col,
#fap-results.fap-compare-mode .fap-table td.fap-ovr-col { left: calc(34px + var(--fap-player-w, 190px)); }
/* Auf der TR selbst (nicht per-td) gesetzt, wie diese Seite ihr Zebra-Muster schon handhabt
   (tr:nth-child(odd/even) { background }, nicht per-td) - sticky Spalten haben bereits
   background:inherit und zeigen es dadurch korrekt durch, transparente <td>s ebenso. Muss NACH den
   Zebra-Regeln stehen, um bei gleicher Spezifitaet per Kaskaden-Reihenfolge zu gewinnen. */
.fap-table tbody tr.is-checked { background: #e3f5f3; }

/* Ratings-Zeile braucht Team/Pos direkt unter dem Namen (kein eigenes Pos-Spalte dort, anders als
   die normale Ansicht) - eigene kleine Meta-Zeile analog zu playerratings.css's .plr-player-meta. */
.fap-player-meta { display: flex; flex-direction: column; line-height: 1.25; overflow: hidden; }
/* Spielername darf NIE umbrechen (User-Wunsch 2026-09-08: "die Spielerzeile soll breit genug sein"
   statt den Namen umzubrechen) - ohne dieses white-space:nowrap laesst die automatische Tabellen-
   Breitenberechnung die Namensspalte als "am ehesten kompressibel" schrumpfen, sobald die Summe
   aller Spaltenbreiten (v.a. in der spaltenreichen Ratings-Ansicht) den verfuegbaren Platz
   uebersteigt - lange Namen wie "Giannis Antetokounmpo" brachen dann mitten im Wort um. nowrap
   erzwingt stattdessen, dass die Spalte auf ihre volle Namensbreite besteht (das Scroll-Wrapper-
   overflow-x:auto erledigt den Rest); Klasse gilt gleichermassen fuer den verlinkten Namen
   (.fap-name-link) und den unverlinkten <span>-Fallback fuer Spieler ohne playerID. */
.fap-name-link, .fap-player-cell > span, .fap-player-meta > span { white-space: nowrap; }
.fap-player-sub { display: flex; align-items: center; gap: 5px; margin-top: 1px; }
.fap-pos-tag { font-size: 10px; color: #66707c; font-weight: 600; }

/* OVR als zweite fixierte Spalte in der Ratings-Ansicht, direkt nach der (bereits stickyen)
   Spieler-Spalte - identisches Prinzip wie playerratings.php (siehe dessen ausfuehrlicher CSS-
   Kommentar): --fap-player-w kommt per JS aus der tatsaechlich gerenderten Spieler-Spaltenbreite
   (per Font/Inhalt variabel), 190px nur als Fallback bis das erste Mal gemessen wurde. */
.fap-table th.fap-ovr-col, .fap-table td.fap-ovr-col { position: sticky; left: var(--fap-player-w, 190px); z-index: 1; background: inherit; box-shadow: 2px 0 4px rgba(0,0,0,0.06); font-variant-numeric: tabular-nums; }
.fap-table thead th.fap-ovr-col { background: #2c3e50; z-index: 4; }

/* .fap-pill (base + all variants): merged into css/dyne.css with .plp-pill (byte-identical,
   "shared, merged 2026-08-22"), see that file for the full ruleset and comment. */

.fap-bid-cell { min-width: 260px; white-space: nowrap; }
.fap-bid-row { display: flex; align-items: center; gap: 7px; }
.fap-bid-row + .fap-bid-row { margin-top: 3px; }
/* .fap-bid-lead: hosts the team-chip(s) + amount now (User-Wunsch 2026-09-09, vorher reiner Text
   "TEAM (x.x/y)") - switched to inline-flex so the fixed-width .fap-bid-teampill chip and the
   amount text align cleanly; dropped the old overflow/ellipsis/max-width (were sized for a plain
   text string, would otherwise clip the chip on a tie of 2+ teams). Mobile already resets
   max-width/white-space below (.fap-cards), untouched. */
.fap-bid-lead { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; font-size: 11.5px; color: #1b2733; cursor: default; }
.fap-bid-amount { font-size: 11.5px; font-weight: 700; color: #1b2733; }
.fap-bid-tie-sep { font-size: 11.5px; color: #8b95a1; }
.fap-btn-bid { display: inline-block; background: #2c3e50; color: #fff; font-size: 10.5px; font-weight: 600; padding: 5px 11px; border-radius: 4px; text-decoration: none; border: none; font-family: inherit; cursor: pointer; white-space: nowrap; flex-shrink: 0; }
.fap-btn-bid.secondary { background: transparent; color: #2c3e50; border: 1px solid #2c3e50; }
.fap-claim-count { font-size: 10.5px; color: #66707c; }
/* Kompakte Fristzeile unter dem Gebots-/Claim-Button (User-Wunsch 2026-08-08) - bewusst
   winzig (9px, line-height 1) gehalten, damit sie in den bestehenden Freiraum der Zeile
   passt (die Zeilenhoehe wird durch das 32px-Spielerfoto in der ersten Spalte vorgegeben,
   das reguläre Gebots-/Claim-Zeile allein nicht ausfuellt) statt die Zeile sichtbar hoeher
   zu machen. */
.fap-bid-deadline { font-size: 9px; line-height: 1; color: #8b95a1; margin-top: 2px; white-space: nowrap; }

.fap-watch-btn { width: 26px; height: 26px; border-radius: 50%; border: 1px solid #ccd3da; background: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; color: #66707c; padding: 0; }
.fap-watch-btn.active { background: #fff6da; border-color: #e8c96b; color: #a8790a; }
.fap-watch-btn:hover { filter: brightness(0.97); }

/* Gebots-Zustand-Faerbung (User-Wunsch 2026-08-08): hellgruen/"max"-gruen wenn das
   eigene Team fuehrt, hellrot/"max"-rot wenn ein fremdes Team fuehrt ("max" =
   Gebotsdecke erreicht, siehe fa_row_bid_class() weiter oben). Desktop faerbt NUR die
   Gebots-Zelle (@media min-width:721px, Gegenstueck zum 720px-Kartenlayout-Breakpoint),
   Mobile faerbt die gesamte Karte (siehe @media max-width:720px weiter unten). */
@media (min-width: 721px) {
	tr.fap-row-bidown td.fap-bid-cell { background: #e8f8ec; }
	tr.fap-row-bidforeign td.fap-bid-cell { background: #fdeceb; }
	/* "Max" (Gebotsdecke erreicht) bekommt einen kraeftigeren, aber weiterhin blassen
	   Farbton statt der urspruenglich vollgesaettigten dunkelgruen/dunkelrot-Faerbung
	   (User-Wunsch 2026-08-19: zu kraeftig). Deutlich genug abgesetzt von hellgruen/
	   hellrot, aber blass genug, dass die normale dunkle Standard-Textfarbe (statt weiss)
	   weiterhin gut lesbar bleibt - keine Text-/Rahmenfarben-Overrides mehr noetig. */
	tr.fap-row-bidown-max td.fap-bid-cell { background: #b6e6c3; }
	tr.fap-row-bidforeign-max td.fap-bid-cell { background: #f6bcb3; }
}

.fap-full-text { display: inline; }
.fap-mobile-text { display: none; }
@media (max-width: 479px) {
	.fap-full-text { display: none; }
	.fap-mobile-text { display: inline; }
}

/* ===================== Redesign 2026-08-08 (Nachtrag): Mobile Kartenlayout =====================
   Horizontales Scrollen einer 13+-spaltigen Tabelle ist auf schmalen Screens unbrauchbar
   (User-Feedback: nur Spielername + eine Spalte sichtbar, Gebot-Spalte praktisch nicht
   erreichbar) - unterhalb 720px wird die Tabelle stattdessen zu gestapelten, einklappbaren
   Karten umgebaut: kollabiert zeigt jede Karte nur Bild+Name+OVR in einer Zeile (User-
   Wunsch: "sehr sperrig", noch kompakter), ein Klick auf die Karte (ausserhalb von Links/
   Buttons) blendet die restlichen Felder inkl. Gebot/Watchlist ein (.fap-expanded-Klasse,
   siehe JS ganz unten). Sortier-Buttons in der (jetzt versteckten) Kopfzeile werden durch
   das Sortieren-Dropdown in der Filterleiste ersetzt (siehe .fap-sort-select weiter oben). */
.fap-sort-select { display: none; width: auto; flex: 0 0 auto; }
@media (max-width: 720px) {
	.fap-sort-select { display: inline-flex; }
	/* Sticky-Header/gebundene Hoehe (Desktop-Basisregel oben) ist fuers Mobile-Kartenlayout
	   irrelevant (thead ohnehin ausgeblendet) und wuerde sonst eine ungewollte zweite,
	   interne Scrollbox um die Karten legen statt normal mit der Seite zu scrollen. Nur fuer die
	   "Normal"-Ansicht (.fap-cards) - die Ratings-Ansicht (User-Wunsch 2026-09-08: "will nicht den
	   Kartenstil sondern einen Tabellenstil haben") bekommt auf Mobile keine .fap-cards-Klasse und
	   faellt dadurch komplett auf die normalen Desktop-Tabellenregeln oben zurueck (horizontal
	   scrollbare echte Tabelle mit fixierten Spieler-/OVR-Spalten statt Karten). */
	.fap-table-scroll:has(.fap-cards) { overflow-x: visible; overflow-y: visible; max-height: none; }
	table.fap-table.fap-cards, table.fap-table.fap-cards tbody, table.fap-table.fap-cards tr { display: block; width: 100%; min-width: 0; }
	.fap-table.fap-cards thead { display: none; }
	/* !important noetig: die Desktop-Grundregeln (.fap-table tbody td, .fap-table tbody
	   td.left, .fap-table tbody tr:nth-child(...)) sind spezifischer als einfache
	   .fap-table td/tr-Selektoren und wuerden sonst padding/text-align/Streifenfarbe
	   der Tabellenansicht durchdruecken (Bug 2026-08-08: fuehrte zu einer zu hohen,
	   umgebrochenen Kartenzeile). */
	.fap-table.fap-cards tbody tr {
		display: flex !important; flex-wrap: wrap; align-items: center; gap: 5px 7px;
		background: #fff !important; border: 1px solid #e2e4e7; border-radius: 8px;
		padding: 10px 46px 10px 12px; margin-bottom: 8px; cursor: pointer; position: relative;
	}
	.fap-table.fap-cards tbody tr:hover { background: #fff !important; }
	/* Gebots-Zustand-Faerbung auf Mobile faerbt die GESAMTE Karte statt nur einer Zelle
	   (User-Wunsch 2026-08-08) - hoehere Spezifitaet+Reihenfolge noetig, um die generische
	   weisse tr-Hintergrundregel + deren :hover-Variante (oben) zu schlagen. "Max" ist ein
	   kraeftigerer, aber weiterhin blasser Farbton statt der urspruenglich vollgesaettigten
	   dunkelgruen/dunkelrot-Faerbung (User-Wunsch 2026-08-19: zu kraeftig) - blass genug,
	   dass die normale dunkle Standard-Textfarbe ueberall lesbar bleibt, keine
	   Text-Overrides mehr noetig. */
	.fap-table.fap-cards tbody tr.fap-row-bidown, .fap-table.fap-cards tbody tr.fap-row-bidown:hover { background: #e8f8ec !important; }
	.fap-table.fap-cards tbody tr.fap-row-bidforeign, .fap-table.fap-cards tbody tr.fap-row-bidforeign:hover { background: #fdeceb !important; }
	.fap-table.fap-cards tbody tr.fap-row-bidown-max, .fap-table.fap-cards tbody tr.fap-row-bidown-max:hover { background: #b6e6c3 !important; }
	.fap-table.fap-cards tbody tr.fap-row-bidforeign-max, .fap-table.fap-cards tbody tr.fap-row-bidforeign-max:hover { background: #f6bcb3 !important; }
	.fap-table.fap-cards td {
		display: none; align-items: center; padding: 0 !important; border: none !important;
		text-align: left !important; position: static !important; box-shadow: none; background: transparent;
		font-size: 12.5px; vertical-align: middle;
	}
	/* Kollabiert IMMER sichtbar: Spieler-Zelle + OVR, sonst nichts. Spieler-Zelle nimmt
	   IMMER die volle Zeile ein (flex-basis:100%) statt mit spaeter erscheinenden
	   Feldern um Platz zu konkurrieren - sonst wuerde sie beim Ausklappen (viele neue
	   Flex-Geschwister auf derselben Zeile) auf ~0 Breite zusammengedrueckt und der Name
	   verschwand (Bug 2026-08-08). OVR + Auf-/Zuklapp-Pfeil sind deshalb absolut oben
	   rechts positioniert, komplett ausserhalb des Flex-Umbruchs - neue (ausgeklappte)
	   Felder landen dadurch automatisch auf einer neuen Zeile darunter. */
	.fap-table.fap-cards td.sticky-col { display: inline-flex; min-width: 0; flex: 1 1 100%; }
	.fap-table.fap-cards td.sticky-col .fap-playerpic { width: 40px; height: 40px; flex: 0 0 auto; }
	.fap-table.fap-cards td.sticky-col .fap-player-cell { gap: 10px; min-width: 0; flex: 1 1 0%; }
	.fap-table.fap-cards td.sticky-col .fap-name-link, .fap-table.fap-cards td.sticky-col span { font-size: 12.5px !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex: 1 1 0%; display: inline-block; }
	/* top+height statt "top:10px" allein: zentriert OVR vertikal auf Hoehe der 40px
	   hohen Spielerzeile (Bild), egal ob die Karte kollabiert oder ausgeklappt (und damit
	   insgesamt viel hoeher) ist - vorher sass OVR oben an der Kante der Namensbox statt
	   mittig (User-Feedback 2026-08-08). */
	.fap-table.fap-cards td[data-label="OVR"] {
		display: inline-flex !important; align-items: center; justify-content: center;
		position: absolute !important; top: 10px; right: 26px; height: 40px;
		font-size: 12.5px !important; font-weight: 700; color: #2c3e50;
	}
	.fap-table.fap-cards td[data-label="OVR"]::before { content: none !important; }
	/* Auf-/Zuklapp-Pfeil, absolut positioniert (siehe Kommentar oben). Groesser+dunkler als
	   urspruenglich (User-Feedback 2026-09-10: "zu unauffaellig") - Navy statt Blassgrau,
	   19px statt 13px, dreht sich per Transform um 180 Grad statt Zeichen zu wechseln
	   (identisches Muster zu .fap-adv-toggle svg weiter oben in dieser Datei). */
	.fap-table.fap-cards tbody tr::after {
		content: "\25BE"; position: absolute; top: 10px; right: 10px; font-size: 19px;
		font-weight: 700; color: #2c3e50; line-height: 1; transition: transform .15s ease;
	}
	.fap-table.fap-cards tbody tr.fap-expanded::after { transform: rotate(180deg); }
	/* Ausgeklappt: alle Felder inkl. Gebot/Watchlist sichtbar. */
	.fap-table.fap-cards tbody tr.fap-expanded td { display: inline-flex; }
	.fap-table.fap-cards td[data-label]::before { content: attr(data-label) ": "; font-size: 9.5px; text-transform: uppercase; letter-spacing: .03em; color: #a9b0b8; font-weight: 700; margin-right: 3px; }

	/* Feste Zeilenaufteilung der ausgeklappten Felder (User-Wunsch 2026-08-08):
	   Zeile 1 Pos/Gehalt/Team/J.i.T., Zeile 2 Alter/Größe/Gewicht, Zeile 3 (nur wenn
	   vorhanden) Birds/Optionen/Trade, Zeile 4 Gebot/Watchlist. "order" bestimmt die
	   visuelle Reihenfolge unabhaengig von der DOM-/Spaltenreihenfolge; die drei
	   unsichtbaren .fap-row-break-Zellen (siehe PHP) erzwingen per flex-basis:100% einen
	   Zeilenumbruch an fester Stelle, unabhaengig von der tatsaechlichen Inhaltsbreite -
	   "order" allein erzwingt KEINEN Umbruch, nur die Reihenfolge (Bug 2026-08-08: Gebot
	   rutschte ohne eigenen Break-Marker in Zeile 3, wenn dort noch Platz frei war). */
	.fap-table.fap-cards td[data-label="Pos"] { order: 1; }
	.fap-table.fap-cards td[data-label="Gehalt"] { order: 2; }
	.fap-table.fap-cards td[data-label="Team"] { order: 3; }
	.fap-table.fap-cards td[data-label="J.i.T."] { order: 4; }
	.fap-table.fap-cards td.fap-row-break[data-break="a"] { order: 5; }
	.fap-table.fap-cards td[data-label="Alter"] { order: 6; }
	.fap-table.fap-cards td[data-label="Größe"] { order: 7; }
	.fap-table.fap-cards td[data-label="Gewicht"] { order: 8; }
	.fap-table.fap-cards td.fap-row-break[data-break="b"] { order: 9; }
	/* Kompaktere Schrift fuer diese 7 Detailfelder, damit je 4 bzw. 3 pro Zeile passen
	   (User-Wunsch: feste 3-Zeilen-Aufteilung, kein Umbruch innerhalb einer Gruppe). */
	.fap-table.fap-cards td[data-label="Pos"], .fap-table.fap-cards td[data-label="Gehalt"],
	.fap-table.fap-cards td[data-label="Team"], .fap-table.fap-cards td[data-label="J.i.T."],
	.fap-table.fap-cards td[data-label="Alter"], .fap-table.fap-cards td[data-label="Größe"], .fap-table.fap-cards td[data-label="Gewicht"] {
		font-size: 11px !important;
	}
	.fap-table.fap-cards td[data-label="Pos"]::before, .fap-table.fap-cards td[data-label="Gehalt"]::before,
	.fap-table.fap-cards td[data-label="Team"]::before, .fap-table.fap-cards td[data-label="J.i.T."]::before,
	.fap-table.fap-cards td[data-label="Alter"]::before, .fap-table.fap-cards td[data-label="Größe"]::before, .fap-table.fap-cards td[data-label="Gewicht"]::before {
		font-size: 8.5px; margin-right: 2px;
	}
	.fap-table.fap-cards td[data-label="Birds"] { order: 10; }
	.fap-table.fap-cards td[data-label="Optionen"] { order: 11; }
	.fap-table.fap-cards td[data-label="Trade"] { order: 12; }
	.fap-table.fap-cards td.fap-row-break[data-break="c"] { order: 15; }
	.fap-table.fap-cards tbody tr.fap-expanded td.fap-bid-cell { order: 20; }
	.fap-table.fap-cards tbody tr.fap-expanded td:has(.fap-watch-btn) { order: 21; }

	.fap-table.fap-cards tbody tr.fap-expanded td.fap-row-break {
		display: block !important; flex-basis: 100%; width: 0; height: 0;
		padding: 0 !important; margin: 0; border: none !important;
	}

	/* Birds/Optionen/Trade: keine "Label: "-Vorsilbe (nur die farbige Box), und die
	   ganze Zelle komplett ausgeblendet, wenn der Spieler dort nichts hat (erkennbar am
	   fap-muted-Platzhalter aus fa_pill_label()) - Zeile 3 verschwindet dadurch von
	   selbst vollstaendig, wenn alle drei leer sind. */
	.fap-table.fap-cards td[data-label="Birds"]::before,
	.fap-table.fap-cards td[data-label="Optionen"]::before,
	.fap-table.fap-cards td[data-label="Trade"]::before { content: none !important; }
	.fap-table.fap-cards tbody tr.fap-expanded td[data-label="Birds"]:has(.fap-muted),
	.fap-table.fap-cards tbody tr.fap-expanded td[data-label="Optionen"]:has(.fap-muted),
	.fap-table.fap-cards tbody tr.fap-expanded td[data-label="Trade"]:has(.fap-muted) { display: none !important; }

	/* Value entfaellt auf Mobile komplett (User-Wunsch 2026-08-08, nicht Teil der
	   gewuenschten 3 Zeilen). */
	.fap-table.fap-cards td[data-label="Value"] { display: none !important; }
	/* Gebot-Zelle und Watchlist-Auge auf DERSELBEN Zeile (User-Wunsch 2026-08-08) statt
	   Watchlist als eigene volle Zeile darunter - beide bekommen denselben oberen
	   Rand/Abstand (border-top/margin-top/padding-top) UND align-self:flex-start, damit
	   die Trennlinie durchgehend wirkt, auch wenn die Gebot-Zelle durch mehrzeiligen
	   Inhalt (Claim + Gebot) hoeher wird als der Watchlist-Button. */
	.fap-table.fap-cards tbody tr.fap-expanded td.fap-bid-cell { display: flex; flex-direction: column; align-items: flex-start; align-self: flex-start; flex: 1 1 auto; margin-top: 6px; padding: 8px 0 0 !important; border-top: 1px dashed #e2e4e7; white-space: normal; min-width: 0; }
	.fap-table.fap-cards td.fap-bid-cell .fap-bid-row { flex-wrap: wrap; }
	.fap-table.fap-cards td.fap-bid-cell .fap-bid-lead { max-width: none; white-space: normal; }
	.fap-table.fap-cards tbody tr.fap-expanded td:has(.fap-watch-btn) { display: inline-flex !important; flex: 0 0 auto; align-self: flex-start; margin-top: 6px; margin-left: auto; padding-top: 8px !important; border-top: 1px dashed #e2e4e7; }
}