/* =========================================================
   FD BRAWL - MASTER DESIGN SYSTEM
   Source unique de vérité pour le style global du site
   ========================================================= */
:root {
  color-scheme: dark;
  --fd-yellow: #ffbb2f;
  --fd-orange: #fb923c;
  --fd-blue: #38bdf8;
  --fd-green: #22c55e;
  --fd-red: #ef4444;
  --fd-purple: #a855f7;

  --fd-bg-dark: #070b17;
  --fd-card: rgba(15, 23, 42, 0.78);
  --fd-card-strong: rgba(15, 23, 42, 0.92);
  --fd-border: rgba(255, 255, 255, 0.14);
  --fd-muted: rgba(255, 255, 255, 0.72);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  width: 100%;
  overflow-x: hidden;
  font-family: Arial, sans-serif !important;
  color: #ffffff;
  background-color: var(--fd-bg-dark);
  background-image: none !important;
  background-size: cover !important;
  background-position: center top !important;
  background-attachment: fixed !important;
}

h1, h2, h3, h4 { margin: 0; }
a { color: inherit; text-decoration: none; }
img, video, iframe { max-width: 100%; height: auto; }

/* LAYOUT GLOBAL UNIFIÉ (Inspiré de news.html) */
main, .fd-page-shell, .container, .page, .content, .fd-page, .news-page, .fd-quiz-page {
  width: min(1180px, calc(100vw - 28px)) !important;
  max-width: none !important;
  margin: 34px auto 86px !important;
}

/* COMPOSANTS : GLASSMORPHISM */
.panel, .card, .fd-card, .section, .fd-quiz-panel, .featured, .news-card, .fd-giveaways-hero {
  border: 1px solid var(--fd-border) !important;
  border-radius: 28px !important;
  background: var(--fd-card) !important;
  box-shadow: 0 18px 55px rgba(0, 0, 0, 0.24) !important;
  backdrop-filter: blur(10px) !important;
}

/* BOUTONS GLOBAUX */
button, .btn, .fd-btn, .chip, .small-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--fd-border);
  border-radius: 999px;
  background: rgba(15,23,42,0.70);
  color: #fff;
  font-family: Arial, sans-serif;
  font-weight: 900;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
}

button:hover, .btn:hover, .fd-btn:hover, .chip:hover, .small-btn:hover {
  background: rgba(255,255,255,0.1);
  transform: translateY(-1px);
}

button.primary, .btn.primary, .fd-btn.primary, .chip.active {
  color: #111827 !important;
  background: linear-gradient(135deg, var(--fd-yellow), var(--fd-orange)) !important;
  border-color: rgba(255,187,47,0.74) !important;
}

/* INPUTS */
input, select {
  min-height: 44px;
  border: 1px solid var(--fd-border);
  border-radius: 16px;
  padding: 0 14px;
  background: rgba(15,23,42,0.74);
  color: #fff;
  font-family: Arial, sans-serif;
  font-weight: 700;
  outline: none;
}
input:focus, select:focus {
  border-color: var(--fd-yellow);
}

/* Correction de l'espacement haut de la page Home */
.fd-bs-hero {
    margin-top: -20px !important;
    padding-top: 10px !important;
}

/* ================================================= */
/* HARMONISATION GLOBALE DES ESPACEMENTS (HAUT & BAS) */
/* ================================================= */

/* Remonte le contenu global sous la bannière sur toutes les pages */
main, .container, .content-wrapper, .fd-bs-hero {
    margin-top: 5px !important;
    padding-top: 10px !important;
}

main > *:first-child {
    margin-top: 0 !important;
}

/* Réduit l'espace avant le bloc Fan Content Policy / Footer */
main > *:last-child {
    margin-bottom: 15px !important;
}

footer, [class*="fan-policy"], [class*="policy"], .fd-footer {
    margin-top: 20px !important;
    padding-top: 15px !important;
}

/* Réduction agressive de l'espace avant Fan Content Policy */
[class*="fan-policy"], [id*="fan-policy"], .fd-fan-policy {
    margin-top: 5px !important;
    padding-top: 5px !important;
}
main {
    margin-bottom: 0px !important;
    padding-bottom: 5px !important;
}

/* ================================================= */
/* APPLICATION GLOBALE : ESPACEMENT FAN CONTENT POLICY */
/* ================================================= */
[class*="fan-policy"], [id*="fan-policy"], [class*="policy"], [id*="policy"], footer {
    margin-top: 5px !important;
    padding-top: 5px !important;
}
main, .main-content, #main {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

/* ========================================================================== */
/* UNIFICATION GLOBALE DE TOUS LES CONTENEURS, CARTES ET BLOCS DU SITE         */
/* ========================================================================== */
.card, .panel, .box, .bulle, .fd-settings-card,
div[class*='card'], div[class*='box'], div[class*='bulle'], 
div[class*='panel'], div[class*='item'], div[class*='wrapper'],
section, article {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), none center/cover no-repeat !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* ========================================================================== */
/* CORRECTION DES CHEVAUCHEMENTS ET ESPACEMENTS DES CONTENEURS                  */
/* ========================================================================== */
.card, .panel, .box, .bulle, .fd-settings-card,
div[class*='card'], div[class*='box'], div[class*='bulle'], 
div[class*='panel'], div[class*='item'], div[class*='wrapper'],
section, article {
    margin-bottom: 20px !important;
    box-sizing: border-box !important;
}

/* Empêche les doubles fonds et bordures en cas d'éléments imbriqués */
section section, article article, div[class*='wrapper'] div[class*='card'], div[class*='panel'] div {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 10px !important;
}

/* Retrait de l'effet d'assombrissement, conservation de l'image pure */
.card, .panel, .box, .bulle, .fd-settings-card,
div[class*='card'], div[class*='box'], div[class*='bulle'], 
div[class*='panel'], div[class*='item'], div[class*='wrapper'],
section, article {
    background: none center/cover no-repeat !important;
}

/* Restauration propre du fond de page sans filtre ni effet parasite */
body, html, .fd-bs-home {
    background-image: var(--fd-bg-image, none) !important;
    background-color: #0f172a !important;
    backdrop-filter: none !important;
    filter: none !important;
}


/* Neutralisation du fond noir pour la section hero / main home */
.fd-bs-home,
.fd-bs-hero,
.fd-bs-video-card {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}