/* fan.club Dark-Theme Override für den gespiegelten apps-Bereich.
   Lädt nach dem Next.js-CSS und überschreibt dessen helle Komponenten.
   Selektoren per [class*="Modul_name__"] -> hash-unabhängig. */
@import url("/fanclub/fonts/fonts.css");

:root{
  --fc-bg:#0A0B0E; --fc-bg2:#0E1014; --fc-surface:#131519; --fc-surface2:#181B21;
  --fc-line:rgba(255,255,255,.09); --fc-line2:rgba(255,255,255,.16);
  --fc-text:#F3F4F6; --fc-muted:#9097A1; --fc-muted2:#6B7280;
  --fc-accent:#F5A623; --fc-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---- Base ---- */
html,body{background:var(--fc-bg)!important;color:var(--fc-text)!important;
  font-family:"Hanken Grotesk",-apple-system,sans-serif!important;}
body{position:relative}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(900px 600px at 80% -10%,rgba(245,166,35,.10),transparent 60%),
             radial-gradient(700px 500px at 5% 10%,rgba(60,80,140,.10),transparent 60%);}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,[class*="SectionTitle_sectionTitle__"],[class*="DetailHero_detailHero__name"],
[class*="DetailHero_detailHero__title"]{font-family:"Bricolage Grotesque",sans-serif!important;
  letter-spacing:-.02em;color:var(--fc-text)!important}

/* ---- Nav ---- */
[class*="Nav_nav__"]{background:rgba(10,11,14,.72)!important;backdrop-filter:blur(16px);
  border-bottom:1px solid var(--fc-line)!important;color:var(--fc-text)!important}
[class*="Nav_navInner__"]{color:var(--fc-text)!important}
[class*="NavLogo_navLogo__"],[class*="NavLogo_navLogo__"] a{color:var(--fc-text)!important;
  font-family:"Bricolage Grotesque",sans-serif!important;font-weight:800}
[class*="Nav_navLinks__"] a,[class*="Nav_navLinks__"]{color:var(--fc-muted)!important}
[class*="Nav_navLinks__"] a:hover{color:var(--fc-text)!important}
[class*="NavMiniSearchBar_navMiniSearchBar__"]{background:var(--fc-surface)!important;
  border:1px solid var(--fc-line)!important;border-radius:12px!important;color:var(--fc-text)!important}
[class*="NavMiniSearchBar_navMiniSearchBar__"] input{background:transparent!important;
  color:var(--fc-text)!important;border:0!important}
[class*="NavMiniSearchBar_navMiniSearchBar__"] input::placeholder{color:var(--fc-muted2)!important}
[class*="Nav_navIconButtons__"] svg,[class*="Nav_navIconButtons__"]{color:var(--fc-text)!important;fill:currentColor}

/* ---- Dropdown-Menüs ---- */
[class*="Dropdown_dropdownMenu__"],[class*="Dropdown_dropdownContent__"]{
  background:var(--fc-surface)!important;border:1px solid var(--fc-line)!important;
  border-radius:14px!important;box-shadow:0 24px 60px rgba(0,0,0,.55)!important;color:var(--fc-text)!important}
[class*="Dropdown_dropdown__"] a{color:var(--fc-muted)!important}
[class*="Dropdown_dropdown__"] a:hover{color:var(--fc-accent)!important}

/* ---- Mobile-Menü ---- */
.bm-menu{background:var(--fc-bg2)!important}
.bm-item-list,.bm-item-list a,[class*="MobileMenu_"]{color:var(--fc-text)!important}
.bm-burger-bars{background:var(--fc-text)!important}
.bm-overlay{background:rgba(0,0,0,.7)!important}

/* ---- Detail-Hero ---- */
[class*="DetailHero_detailHero__"]{background:transparent!important;color:var(--fc-text)!important}
[class*="DetailHero_detailHero__"] img{border-radius:16px}
[class*="detail-hero"]{color:var(--fc-text)!important}

/* ---- StarRating ---- */
[class*="StarRating_starRating__"]{color:var(--fc-accent)!important}

/* ---- Buttons (inkl. neutralisierte Install-CTAs) ---- */
[class*="Button_button__"]{background:var(--fc-accent)!important;color:#0A0B0E!important;
  border:0!important;border-radius:12px!important;font-weight:700!important;
  box-shadow:0 6px 24px rgba(245,166,35,.32);transition:.25s var(--fc-ease);
  font-family:"Hanken Grotesk",sans-serif!important}
[class*="Button_button__"]:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(245,166,35,.42)}

/* ---- Screenshots ---- */
[class*="ScreenshotContainer_screenshotContainer__"]{background:transparent!important}
[class*="ScreenshotItem_screenshotItem__"]{border:1px solid var(--fc-line)!important;
  border-radius:16px!important;overflow:hidden;background:var(--fc-surface)!important}

/* ---- Beschreibung ---- */
[class*="DetailDescription_detailDescription__"]{color:var(--fc-muted)!important}
[class*="DetailDescription_detailDescription__"] b,
[class*="DetailDescription_detailDescription__"] strong,
[class*="DetailDescription_detailDescription__"] h1,
[class*="DetailDescription_detailDescription__"] h2,
[class*="DetailDescription_detailDescription__"] h3{color:var(--fc-text)!important}
[class*="DetailDescription_detailDescription__"] a{color:var(--fc-accent)!important}

/* ---- SectionTitle ---- */
[class*="SectionTitle_sectionTitle__"]{color:var(--fc-text)!important}

/* ---- Karten / Grid (ClubGridItem, Carousel) ---- */
[class*="DetailRelatedContainer_"],[class*="Grid_grid__"],[class*="Grid_gridItems__"],
[class*="Carousel_carousel__"]{background:transparent!important}
[class*="ClubGridItem_clubGridItem__"],[class*="CarouselItem_carouselItem__"]{
  background:var(--fc-surface)!important;border:1px solid var(--fc-line)!important;
  border-radius:16px!important;color:var(--fc-text)!important;overflow:hidden;
  transition:.3s var(--fc-ease);box-shadow:none!important}
[class*="ClubGridItem_clubGridItem__"]:hover,[class*="CarouselItem_carouselItem__"]:hover{
  border-color:var(--fc-line2)!important;transform:translateY(-4px);
  background:var(--fc-surface2)!important;box-shadow:0 18px 44px rgba(0,0,0,.5)!important}
[class*="ClubGridItem_clubGridItem__"] *,[class*="CarouselItem_carouselItem__"] *{color:var(--fc-text)!important}

/* ---- Footer ---- */
[class*="Footer_footer__"]{background:var(--fc-bg2)!important;border-top:1px solid var(--fc-line)!important;color:var(--fc-muted)!important}
[class*="Footer_footerInner__"],[class*="Footer_footerCopyright__"]{color:var(--fc-muted2)!important}
[class*="Footer_footerNav__"] a{color:var(--fc-muted)!important}
[class*="Footer_footerNav__"] a:hover{color:var(--fc-accent)!important}

/* ---- Install-CTAs komplett entfernen (Add to Chrome/Edge etc.) ---- */
[class*="DetailHero_detailHero__col__cta__"]{display:none!important}
[class*="Button_button-blue__"]{display:none!important}

/* ---- Native Filter-Dropdowns (Kategorie/Land/Sortierung) ---- */
[class*="NativeStyledDropdown_dropdown__"],
[class*="NativeStyledDropdown_dropdownSelectElement__wrapper__"]{
  background:var(--fc-surface)!important;border:1px solid var(--fc-line)!important;
  border-radius:12px!important;color:var(--fc-text)!important}
[class*="NativeStyledDropdown_dropdownSelectElement__"]{background:var(--fc-surface)!important;
  color:var(--fc-text)!important;border:0!important}
[class*="NativeStyledDropdown_"] option{background:#131519!important;color:var(--fc-text)!important}
[class*="NativeStyledDropdown_"] svg{color:var(--fc-text)!important;fill:currentColor}

/* ---- generische helle Reste einfangen ---- */
input,select,textarea{background:var(--fc-surface)!important;color:var(--fc-text)!important;
  border:1px solid var(--fc-line)!important}
hr{border-color:var(--fc-line)!important}

/* ---- DE/EN-Sprachschalter im Detail-Nav (ersetzt "English") ---- */
.dropdown-top-element a{color:var(--fc-muted)!important;transition:.2s;text-decoration:none}
.dropdown-top-element a:hover{color:var(--fc-text)!important}
.dropdown-top-element a.active{color:var(--fc-accent)!important;font-weight:700}

/* ---- fan.club-Nav auf Detailseiten (ersetzt Original-Nav) ---- */
[class*="Nav_nav__"]{display:none!important}
.mobile-menu-container,.bm-burger-button,.bm-menu-wrap,.bm-overlay,#react-burger-menu-btn,#react-burger-cross-btn,[class*="MobileMenu_"]{display:none!important}
#fc-appnav{position:sticky;top:0;z-index:100;background:rgba(10,11,14,.85);backdrop-filter:blur(16px);border-bottom:1px solid var(--fc-line)}
#fc-appnav .fcn-wrap{max-width:1180px;margin:0 auto;padding:0 28px;height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
#fc-appnav .fcn-brand{display:flex;align-items:center;gap:10px;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:19px;color:var(--fc-text)!important;text-decoration:none;letter-spacing:-.03em}
#fc-appnav .fcn-mark{width:30px;height:30px;border-radius:8px;background:var(--fc-accent);display:grid;place-items:center;font-size:9px;line-height:.9;text-align:center;font-weight:800;color:#0A0B0E!important;box-shadow:0 4px 18px rgba(245,166,35,.4)}
#fc-appnav .fcn-word{color:var(--fc-muted)!important;font-weight:500}#fc-appnav .fcn-word b{font-weight:800;color:var(--fc-text)!important}
#fc-appnav .fcn-links{display:flex;gap:34px;align-items:center}
#fc-appnav .fcn-links a{font-size:15px;color:var(--fc-muted)!important;text-decoration:none;transition:.2s}
#fc-appnav .fcn-links a:hover{color:var(--fc-text)!important}
#fc-appnav .fcn-right{display:flex;align-items:center;gap:22px}
#fc-appnav .fcn-lang{font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.06em;color:var(--fc-muted2)}
#fc-appnav .fcn-lang a{color:var(--fc-muted2)!important;text-decoration:none;transition:.2s}
#fc-appnav .fcn-lang a:hover{color:var(--fc-text)!important}
#fc-appnav .fcn-lang a.active{color:var(--fc-accent)!important;font-weight:700}
#fc-appnav .fcn-btn{display:inline-flex;align-items:center;font-weight:600;font-size:15px;padding:11px 20px;border-radius:12px;background:var(--fc-accent);color:#0A0B0E!important;text-decoration:none;box-shadow:0 6px 24px rgba(245,166,35,.32);transition:.25s var(--fc-ease)}
#fc-appnav .fcn-btn:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(245,166,35,.42)}
@media(max-width:760px){#fc-appnav .fcn-links,#fc-appnav .fcn-lang{display:none}#fc-appnav .fcn-wrap{padding:0 18px}}
