/* Anzeige-Einstellungen: Merkliste-Knopf und Dark-Mode-Handarbeit.
 * Die automatische Farbumstellung steht in fi-dark.css (tools/build-dark.py). */

/* ---------- Merkliste in der Artikelleiste ---------- */
.fi-art-bar-mark.is-on { color: #e6197a; }
.fi-art-bar-mark.is-on path { fill: currentColor; }

/* ---------- Dark Mode: was sich nicht aus Farben ableiten lässt ---------- */
html.fi-dark, html.fi-dark body { background: #121212; }
html.fi-dark img:not([src$=".svg"]) { color-scheme: light; }
html.fi-dark ::selection { background: rgba(230, 25, 122, .45); color: #fff; }
html.fi-dark input, html.fi-dark textarea, html.fi-dark select { background: #1e1f1f; color: #fff; border-color: #363636; }
html.fi-dark .pf-seg { background: #1e1f1f; }
html.fi-dark .pf-seg button + button:not(.is-on) { box-shadow: -1px 0 0 #363636; }
html.fi-dark .pf-sheet-in { background: #1e1f1f; }
html.fi-dark .pf-confirm { background: #363636; }
/* Weiße Knöpfe/Punkte auf farbigen Flächen bleiben weiß */
html.fi-dark .fi-tri-cta-btn { background: #fff; }
html.fi-dark .fi-tri-cta-btn:hover { background: #fdeef5; }
html.fi-dark .fi-tri-cta li::before { background: #fff; }
html.fi-dark .fi-skip { background: #fff; color: #121212; }
/* Logo wie in der App im Dark Mode weiß (Buchstaben ausgespart) */
html.fi-dark .fi-apphead-logo img,
html.fi-dark .fi-logo img,
html.fi-dark .qz-head-logo,
html.fi-dark .fi-footer-logo img,
html.fi-dark .fi-art-bar-logo img { content: url("logo/fcbinside-logo-white.svg"); }

/* Fanzone & Wettbewerbe wie die App im Dark Mode */
html.fi-dark .fz-mark { background: #fff; }                                   /* Logo-Kästchen bleibt weiß */
html.fi-dark .fz-seasons a.is-on { background: #fff; color: #121212 !important; } /* aktive Saison weiß */
html.fi-dark .fz-seasons { border-color: rgba(255, 255, 255, .75); }
html.fi-dark .fz-seasons a + a { border-left-color: rgba(255, 255, 255, .75); }
html.fi-dark .fz-tile, html.fi-dark .fz-comp { background: #1e1f1f; }           /* Kacheln heller als die Fläche */
html.fi-dark .fz-tile:active { background: #262728; }
/* Champions-League-Logo ist dunkelblau – auf dunklem Grund weiß wie in der App */
html.fi-dark .fz-comp-logo img[src$="/leagues/2.png"] { filter: brightness(0) invert(1); }

/* ---------- Eckig statt rund (überall) ---------- */
.google-cta-banner, .google-cta-inner, .google-cta-btn, .google-cta-icon { border-radius: 0 !important; }
.jwplayer video, .jwplayer .jw-wrapper, .jwplayer .jw-media, .jwplayer .jw-preview,
.jwplayer .jw-float-bar, .jw-flag-floating .jw-wrapper { border-radius: 0 !important; }
/* Schwebendes Video (OneFootball): dunkle Leiste mit weißem Schließen-Kreuz statt weißer Fläche */
.jw-flag-floating .jw-float-bar { background: #121212 !important; }
.jw-flag-floating .jw-float-bar .jw-icon, .jw-flag-floating .jw-float-bar svg { color: #fff !important; fill: #fff !important; }

/* ---------- Google-Kasten im Dark Mode: klarer Kontrast ---------- */
html.fi-dark .fi-art-body .google-cta-banner { background: transparent; }
html.fi-dark .fi-art-body .google-cta-inner { background: #1e1f1f; border: 0; border-left: 3px solid #e6197a; }
html.fi-dark .fi-art-body .google-cta-icon { background: #fff; }
html.fi-dark .fi-art-body .google-cta-text, html.fi-dark .fi-art-body .google-cta-text strong { color: #fff; }
html.fi-dark .fi-art-body a.google-cta-btn { background: #e6197a; color: #fff !important; }

/* ---------- Kommentarleiste: Text nicht am Rand kleben ---------- */
html.fi-dark .fcbk-bar-row input, html.fi-dark .fcbk-bar-row textarea { padding-left: 12px; padding-right: 12px; }
/* Schriftgrößen-Feld im Artikel */
html.fi-dark .fi-art-fs { border-color: #2c2d2e; background: #1e1f1f; box-shadow: 0 8px 24px rgba(0,0,0,.5); }
html.fi-dark .fi-art-fs button { border-color: #3a3b3c; background: #1e1f1f; color: #fff; }
html.fi-dark .fi-art-fs-dots i { background: #4a4b4c; }
html.fi-dark .fi-art-fs-dots i.is-on { background: #e6197a; }
html.fi-dark .fi-art-bar-fs[aria-expanded="true"] { color: #e6197a; }
/* Fanzone-Wettbewerb (Computer): Karten wie Kacheln */
html.fi-dark .fz-d-card, html.fi-dark .fz-d-table.is-long thead th { background: #1e1f1f; }
html.fi-dark .fz-d-plan-list a[href]:hover, html.fi-dark .fz-d-more:hover { background: #262728; }
/* Fanzone-Wettbewerbskopf am Computer: dunkel statt weiß, aktive Saison weiß */
@media (min-width: 1024px) {
	html.fi-dark body.fi-fzpage .fz-cbanner { background: #121212 !important; border-bottom-color: #2c2d2e; }
	html.fi-dark body.fi-fzpage .fz-seasons { border-color: #3a3b3c; }
	html.fi-dark body.fi-fzpage .fz-seasons a.is-on { background: #fff; color: #121212 !important; }
	html.fi-dark body.fi-fzpage .fz-seasons a + a { border-left-color: #3a3b3c; }
}
/* Squad Builder: aktiver Positionsfilter weiß */
html.fi-dark .sq-filter button.is-on { border-color: #fff; background: #fff; color: #121212 !important; }
/* Umfragen: dunkle Knöpfe/Kästen werden im Dunkelmodus weiß (sonst weiß auf weiß) */
html.fi-dark .po-bar-next, html.fi-dark .po-submit { background: #fff; color: #121212 !important; }
html.fi-dark .po-cta { background: #1e1f1f; border: 1px solid #2c2d2e; color: #fff !important; }
html.fi-dark .po-cta-text b { color: #fff; }
/* Noten (Computer): Podium im Dunkelmodus */
html.fi-dark .nh-podium { border-color: #2c2d2e; background: linear-gradient(#1e1f1f, #2a1622); }
html.fi-dark .nh-pod .nh-av { border-color: #1e1f1f; }
html.fi-dark .nh-pod.is-2 .nh-pod-step, html.fi-dark .nh-pod.is-3 .nh-pod-step { background: #3a3b3e; }
/* Noten (Computer): Statistik-Panel und Community-Note im Dunkelmodus */
html.fi-dark .nh-bstats { background: #1e1f1f; }
html.fi-dark .nh-bst u, html.fi-dark .nh-bstats.is-away .nh-bst em { background: #6b6e75; }
html.fi-dark .nh-bstats.is-away .nh-bst u { background: #e6197a; }
html.fi-dark .nh-bstats .nh-bst p b { color: #fff; }
html.fi-dark .nh-bstats.is-away .nh-bst p b:first-child, html.fi-dark .nh-bstats:not(.is-away) .nh-bst p b:last-child { color: #a9acb2; }
html.fi-dark .nh-grow.is-wide .nh-gchip.is-com { background: rgba(230, 25, 122, .2); color: #ff6fae; }
/* Quiz (Computer): Podium im Dunkelmodus */
html.fi-dark .qz-podium { border-color: #2c2d2e; background: linear-gradient(#1e1f1f, #2a1622); }
html.fi-dark .qz-pod-av { border-color: #1e1f1f; }
html.fi-dark .qz-pod.is-2 .qz-pod-step, html.fi-dark .qz-pod.is-3 .qz-pod-step, html.fi-dark .qz-pod:not(.is-1) .qz-pod-av { background: #3a3b3e; }
html.fi-dark body.fi-art-page .fi-art-bar-comments b { border-color: #121212; color: #fff; }
/* Über uns: Mitmach-Karte im Dunkelmodus */
html.fi-dark .ab-join { background: rgba(230, 25, 122, .1); }
html.fi-dark .ab-join .ab-av { background: #1e1f1f; }
/* Über uns: bewusst dunkle Flächen bleiben dunkel (nicht umkehren) */
html.fi-dark .ab-hero { background: #0c0c0f; }
html.fi-dark .ab-app, html.fi-dark .ab-tile.is-feed, html.fi-dark .ab-lead-card { background: #1e1f1f; }
html.fi-dark .ab-hero h1, html.fi-dark .ab-app h2, html.fi-dark .ab-tile.is-feed, html.fi-dark .ab-lead-card, html.fi-dark .ab-lead-t b, html.fi-dark .ab-lead-t em, html.fi-dark .ab-btn { color: #fff !important; }
html.fi-dark .ab-app p:not(.ab-kicker), html.fi-dark .ab-tile.is-feed small, html.fi-dark .ab-lead-t .ab-bio, html.fi-dark .ab-lead { color: rgba(255, 255, 255, .75); }
html.fi-dark .ab-btn.is-line { border-color: #3a3b3e; }
html.fi-dark .ab-btn.is-dark { border-color: #fff; background: #fff; color: #121212 !important; }
html.fi-dark .ab-tile.is-videos { background: linear-gradient(135deg, #1b1c20, #2c2d33); color: #fff !important; }
html.fi-dark .ab-tile.is-videos small { color: rgba(255, 255, 255, .7); }
/* Kontakt */
html.fi-dark .ct-main { background: #121314; }
html.fi-dark .ct-card { background: #161718; box-shadow: none; }
html.fi-dark .ct-social a { border-color: #34363c; background: #161718; color: #fff !important; }
html.fi-dark .ct-imp { color: #fff !important; }
html.fi-dark .ct-bubbles li { background: #fff; color: #121212; }
html.fi-dark .ct-bubbles li:nth-child(2) { background: #e6197a; color: #fff; }
/* Netiquette */
html.fi-dark .rl-rule { background: #1a1b1d; }
html.fi-dark .rl-cta { background: #1e1f21; }
html.fi-dark .rl-cta span { color: rgba(255, 255, 255, .7); }
html.fi-dark .rl-toc a span { background: #121212; }
html.fi-dark .rl-toc a.is-on span { background: #e6197a; }
/* Impressum */
html.fi-dark .lg-addr { background: #1a1b1d; }
html.fi-dark .lg-addr b, html.fi-dark .lg-row dd { color: #fff; }
html.fi-dark .lg-addr span { color: rgba(255, 255, 255, .78); }
html.fi-dark .lg-sub { color: #fff; }
html.fi-dark .lg-sec ul, html.fi-dark .lg-sec ol { color: rgba(255, 255, 255, .85); }
html.fi-dark .lg-cl { background: rgba(230, 25, 122, .16); }
/* Podcast */
html.fi-dark .pc { --ink: #f2f2f4; --mu: #a4a8b3; --ln: #34363c; }
html.fi-dark .pc-today { background: #161718; }
html.fi-dark .pc-day, html.fi-dark .pc-week, html.fi-dark .pc-card, html.fi-dark .pc-ct, html.fi-dark .pc-search { background: #1e1f21; }
html.fi-dark .pc-topics li, html.fi-dark .pc-hero-d, html.fi-dark .pc-about-t { color: rgba(255, 255, 255, .82); }
html.fi-dark .pc-topics li::before { background: #f2f2f4; color: #121212; }
html.fi-dark .pc-ask-in, html.fi-dark .pc-bar { background: #0a0a0b; }
html.fi-dark .pc-more:hover { color: #121212; }
html.fi-dark .pc-day-f .pc-plat { color: #fff !important; }
html.fi-dark .pc-fmt { background: #1e1f21; }
html.fi-dark .pc-fmt-c > p:not(.pc-fmt-tag) { color: rgba(255, 255, 255, .82); }
html.fi-dark .pc-day-f .pc-plat, html.fi-dark .pc-fmt-f .pc-plat { background: #2a2b2e; color: #fff !important; }
/* Gerade beliebt */
html.fi-dark .fi-trend { background: transparent; }
html.fi-dark .fi-trend-h h2, html.fi-dark .fi-trend-track a, html.fi-dark .fi-trend-nav button { color: #fff; }
html.fi-dark .fi-trend-nav button { background: #1e1f21; border-color: #34363c; }
html.fi-dark .fi-trend-dots i { background: #3a3b40; }
html.fi-dark .fi-trend-dots i.is-on { background: #e6197a; }
html.fi-dark .fi-trend-sub { background: rgba(230, 25, 122, .16); }
/* Bildnachweis bleibt im Bild dunkel mit weißer Schrift */
html.fi-dark .fi-art-hero .fi-credit, html.fi-dark .fi-art-body figure.wp-caption > figcaption[data-credit] { background: rgba(12, 12, 15, .62); color: #fff; }
html.fi-dark .fi-more-head { color: #fff; }
html.fi-dark .fi-more-btn { background: transparent; color: #ff4f9a; border-color: #e6197a; }
html.fi-dark .fi-more-btn:hover { background: #e6197a; color: #fff; }
/* Profil (PC) */
html.fi-dark .pf-me { background: linear-gradient(180deg, rgba(230, 25, 122, .12), transparent 70%); }
html.fi-dark .pf-group { background: transparent; }
html.fi-dark .pf-av { border-color: #1e1f21; }
/* Transferzentrale im Dunkelmodus */
html.fi-dark .tr { --ink: #f2f2f4; --mu: #a4a8b3; --ln: #2f3034; --soft: #1e1f21; }
html.fi-dark .tr-card, html.fi-dark .tr-more, html.fi-dark .tr-seg button { background: #161718; }
html.fi-dark .tr-seg button.is-on { background: #f2f2f4; color: #121212; }
html.fi-dark .tr-kpi .is-pos { color: #4ade80; }
html.fi-dark .tr-ph.is-empty::after { background: #3a3b40; }

/* „Mehr FC Bayern News“ im Artikel: Titel magenta – im Dark Mode heller beim Drüberfahren */
html.fi-dark .fi-art-body .related-sec .entry-title a:hover { color: #ff5c95; }
/* Shop: Produktbilder haben weißen Rand (Store) – Bildfläche und Kennzeichen bleiben wie im hellen Modus */
html.fi-dark .fis-img { background: #fff; border-color: #fff; }
html.fi-dark .fis-tags i { background: #121212; color: #fff; }
html.fi-dark .fis-tags i.is-off { background: #e6197a; }
/* Shop-Seite (fi-shop.css wird nicht automatisch umgerechnet – Verläufe und Kacheln bleiben in Markenfarben) */
html.fi-dark .sh-sec { background: #121212; }
html.fi-dark .sh-spotsec { background: #0b0b0d; }
html.fi-dark .sh-spot, html.fi-dark .sh-spot-media { background: #1c1c20; color: #fff !important; box-shadow: none; }
html.fi-dark .sh-spot-kick { background: #fff; color: #121212; }
html.fi-dark .sh-spot:hover .sh-spot-btn { background: #fff; color: #121212; }
html.fi-dark .sh-spot-thumbs button.is-on, html.fi-dark .sh-qv-thumbs button.is-on { border-color: #fff; }
html.fi-dark .sh-h2 { color: #fff; }
html.fi-dark .sh-sub { color: #a0a3ab; }
html.fi-dark .sh-cat:not(.is-sale) { background: radial-gradient(90% 140% at 100% 0%, rgba(230, 25, 122, .55), transparent 60%), #1c1c20; }
html.fi-dark .sh-sort select, html.fi-dark .sh-chips button { border-color: #36363c; background: #1c1c20; color: #fff; }
html.fi-dark .sh-chips button:hover { border-color: #fff; }
html.fi-dark .sh-chips button.is-on { border-color: #fff; background: #fff; color: #121212; }
html.fi-dark .sh-chips button.is-on small { color: #e6197a; }
html.fi-dark .sh .fis-card .fis-cta { background: #fff; color: #121212; }
html.fi-dark .sh-note { border-color: #2a2a2e; }
html.fi-dark .sh-note b { color: #c4c6cc; }
html.fi-dark .sh-empty { background: #1c1c20; }
html.fi-dark .sh-spot-body h2, html.fi-dark .sh-spot-price strong:not(.is-sale) { color: #fff; }
html.fi-dark .sh-qv-box { background: #1c1c20; color: #fff; }
html.fi-dark .sh-qv-info h2 { color: #fff; }
html.fi-dark .sh-qv-go:hover { background: #fff; color: #121212 !important; }
html.fi-dark .sh-qv-tags i:not(.is-off) { background: #fff; color: #121212; }
/* Shop dunkel: Reihen im Magenta-Band – kein Magenta auf Magenta, Grau → Weiß-transparent */
html.fi-dark .sh-rail .sh-sub { color: rgba(255, 255, 255, .82); }
html.fi-dark .sh-rail .fis-body small, html.fi-dark .sh-rail .fis-price s { color: rgba(255, 255, 255, .72); }
html.fi-dark .sh-rail .fis-price strong, html.fi-dark .sh-rail .fis-price.is-sale strong { color: #fff; }
html.fi-dark .sh-rail .fis-tags i.is-off { background: #121212; color: #fff; }
html.fi-dark .sh-nav, html.fi-dark .sh-zoom { background: rgba(255, 255, 255, .95); color: #121212; }
html.fi-dark .sh-nav:hover, html.fi-dark .sh-zoom:hover { background: #121212; color: #fff; }
html.fi-dark .sh-arrow { background: #fff; color: #9a1350; }
html.fi-dark .sh-arrow:hover { background: #121212; color: #fff; }
html.fi-dark .sh-dots i { background: rgba(18, 18, 18, .2); }
html.fi-dark .sh-dots i.is-on { background: #121212; }
html.fi-dark .sh-qv-x { background: #fff; color: #121212; }
html.fi-dark .sh-qv-x:hover { background: #121212; color: #fff; }
/* Links im Text: Magenta statt Rot (auch im dunklen Modus) */
html.fi-dark .fi-content a:not(.google-cta-btn), html.fi-dark .fi-art-body a:not(.google-cta-btn) { color: #f0388f; }
html.fi-dark .fi-content a:not(.google-cta-btn):hover, html.fi-dark .fi-art-body a:not(.google-cta-btn):hover { color: #ff5c95; }
html.fi-dark .fi-art-body .related-sec .entry-title a { color: #fff; }
html.fi-dark .fi-art-body .related-sec .entry-title a:hover { color: #ff5c95; }