/* =============================== */

/*  BLEUBLANCDUNK.COM  -  v2.4     */

/*  + .winner pour marquer vainqueur*/

/*  + keep recap PTS bold only      */

/* =============================== */



:root {

  --bg: #f5f7fa;

  --ink: #0b1b33;

  --primary: #1a4b9a;

  --primary-2: #2a66d4;

  --chip-pre: #0b79ff;

  --chip-live: #16a34a;

  --chip-final: #d94c4c;

  --border: #e2e8f0;

}



* { box-sizing: border-box; }



html, body {

  margin: 0;

  padding: 0;

  background: var(--bg);

  color: var(--ink);

  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  text-align: center;

}



/* Header / Logo */

header { background: transparent; padding: 12px 0 0; }

header .banner {

  display: block;

  width: 100%;

  max-width: 1100px;

  height: auto;

  margin: 0 auto 10px;

  object-fit: contain;

  border-radius: 10px;

}

h1 { font-weight: 800; font-size: 24px; margin: 6px 0 14px; color: var(--ink); }



/* Main */

main { width: 100%; max-width: 1100px; margin: 0 auto; padding: 0 12px 36px; }

/* H1 uniquement pour le SEO, caché visuellement */

.h1-hidden {

  position: absolute;

  left: -9999px;

  top: auto;

  width: 1px;

  height: 1px;

  overflow: hidden;

  white-space: nowrap;

}



/* Controls */

.controls {

  background: #eef3fa;

  border: 1px solid var(--border);

  border-radius: 12px;

  padding: 12px;

  margin: 0 0 10px;

  box-shadow: 0 1px 3px rgba(0,0,0,.06);

  text-align: left;

}

.date-controls { display: flex; align-items: center; gap: 12px; justify-content: center; }

.date-controls h2 { margin: 0; font-size: 18px; font-weight: 900; letter-spacing: .2px; }

.chip-btn {

  background: var(--primary);

  color: #fff;

  border: none;

  border-radius: 10px;

  padding: 6px 10px;

  font-size: 18px;

  cursor: pointer;

  transition: .15s;

}

.chip-btn:hover { background: var(--primary-2); }

.fr-filter { text-align: center; margin-top: 8px; font-size: 14px; }



/* Calendrier (toggle) */

.calendar-toggle-wrap { margin: 8px 0 16px; }

.cal-toggle {

  background: #fff;

  border: 1px solid var(--border);

  border-radius: 12px;

  padding: 8px 10px 12px;

  box-shadow: 0 1px 3px rgba(0,0,0,.06);

  text-align: left;

}

.cal-summary {

  display: flex;

  align-items: center;

  gap: 10px;

  font-weight: 900;

  cursor: pointer;

  user-select: none;

  padding: 6px 8px;

  border-radius: 10px;

}

.cal-summary .emoji { font-size: 18px; }

.cal-summary .chev {

  margin-left: auto;

  font-size: 16px;

  opacity: .7;

  transition: transform .25s;

}

.cal-toggle[open] .cal-summary .chev { transform: rotate(180deg); }

.cal {

  background: #fff;

  border: 1px solid var(--border);

  border-radius: 10px;

  padding: 12px;

  box-shadow: 0 1px 2px rgba(0,0,0,.05);

  margin-top: 8px;

  text-align: left;

}

.cal-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 8px;

}

.cal-title { font-weight: 800; }

.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }

.cal-wd {

  text-align: center;

  font-weight: 800;

  background: #f3f4f6;

  border-radius: 6px;

  padding: 6px 0;

}

.cal-empty { height: 38px; }

.cal-day {

  height: 38px;

  border: 1px solid var(--border);

  background: #fff;

  border-radius: 6px;

  cursor: pointer;

  transition: .15s;

  font-weight: 700;

}

.cal-day:hover { background: #e8f0ff; border-color: #c7d2fe; }

.cal-day.today { background: #eaf2ff; border-color: #93c5fd; }

.cal-day.selected {

  background: #1a4b9a;

  color: #fff;

  border-color: #1a4b9a;

}

.cal-help { color: #6b7280; font-size: 12px; margin-top: 6px; text-align: center; }



/* Cards */

.card {

  position: relative;

  background: #fff;

  border: 1px solid var(--border);

  border-radius: 12px;

  padding: 8px;

  margin: 12px 0;

  overflow: hidden;

  box-shadow: 0 2px 4px rgba(0,0,0,.06);

}

.card-main { display: flex; align-items: center; justify-content: space-between; gap: 10px; }

.team { flex: 1; display: flex; flex-direction: column; align-items: center; }

.team .logo { width: 86px; height: 86px; }

.tri { font-weight: 800; font-size: 20px; line-height: 1.1; }

.wl { font-size: 12px; color: #64748b; }

.center { flex: 1.3; display: flex; flex-direction: column; align-items: center; gap: 4px; }

.score { font-size: 22px; font-weight: 800; }

.status-chip {

  border-radius: 999px;

  padding: 2px 10px;

  font-size: 12px;

  font-weight: 800;

  color: #fff;

}

.status-chip.pre { background: var(--chip-pre); }

.status-chip.live { background: var(--chip-live); }

.status-chip.final { background: var(--chip-final); }

.expand-btn { background: none; border: none; cursor: pointer; font-size: 18px; }



/* Vainqueur */

.winner { font-weight: 800; }



/* Rubans 🇫🇷 */

.side-flag {

  position: absolute;

  top: 0;

  bottom: 0;

  width: 10px;

  opacity: 0.95;

  pointer-events: none;

  background: linear-gradient(

    to bottom,

    rgba(0,85,164,1) 0%,

    rgba(0,85,164,0.9) 20%,

    rgba(150,180,230,0.7) 30%,

    rgba(255,255,255,1) 55%,

    rgba(255,150,140,0.7) 70%,

    rgba(239,65,53,0.9) 85%,

    rgba(239,65,53,1) 100%

  );

}

.side-flag.left {

  left: 0;

  border-top-left-radius: 12px;

  border-bottom-left-radius: 12px;

}

.side-flag.right {

  right: 0;

  border-top-right-radius: 12px;

  border-bottom-right-radius: 12px;

}



/* Détails / boxscores */

.card-details { display: none; margin-top: 10px; text-align: left; }

.card.open .card-details { display: block; }

.stack-boxscores { display: flex; flex-direction: column; gap: 20px; }

.detail-title { font-weight: 800; margin: 0 0 6px; text-align: left; }

.detail-box {

  background: #f8fafc;

  border: 1px solid var(--border);

  border-radius: 10px;

  padding: 8px;

  box-shadow: 0 1px 2px rgba(0,0,0,0.03);

}



/* Tableau générique */

.table-wrap {

  overflow: auto;

  border-radius: 12px;

  background: #fff;

  box-shadow: 0 2px 8px rgba(0,0,0,.04);

}

table.bx {

  width: 100%;

  border-collapse: collapse;

  font-size: 13px;

  margin-bottom: 10px;

}

table.bx th,

table.bx td {

  border-bottom: 1px solid #e5e7eb;

  padding: 6px 8px;

  text-align: center;

}

table.bx th:first-child,

table.bx td:first-child { text-align: left; }



/* Joueur FR (global boxscores) */

table.bx tr.row-fr {

  background: linear-gradient(

    90deg,

    rgba(0,85,164,0.15) 0%,

    rgba(0,85,164,0.25) 10%,

    rgba(255,255,255,0.9) 45%,

    rgba(239,65,53,0.25) 80%,

    rgba(239,65,53,0.15) 100%

  );

}



/* === Ajouts V3.2 (logos diffuseurs) === */

.card .broadcast {

  margin-top: 4px;

  display: flex;

  gap: 8px;

  align-items: center;

  flex-wrap: wrap;

}

.card .bcast-logo {

  height: 20px;

  max-width: 70px;

  object-fit: contain;

  filter: brightness(0.95);

  transition: transform 0.15s ease;

}

.card .bcast-logo:hover { transform: scale(1.05); }



/* ⭐️ Titulaire */

.starter-star {

  color: #f5c518;

  margin-right: 6px;

  font-size: 12px;

  line-height: 1;

  vertical-align: middle;

}

.starter-legend { font-size: 12px; color: #64748b; margin: 4px 0 8px; }



/* ========================= */

/*   Récap FR - carte & table */

/* ========================= */



/* Carte récap FR avec bordure bleu-blanc-rouge */

.card.fr-night{

  position: relative;

  border-radius: 20px;

  border: 2px solid transparent;

  background:

    linear-gradient(#ffffff, #ffffff) padding-box,

    linear-gradient(135deg,#0055a4,#ffffff,#ef4135) border-box;

  box-shadow: 0 18px 45px rgba(15,23,42,.15);

  margin: 12px 0 24px;

  padding: 8px;

}



.card.fr-night .card-main{

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 10px 12px 6px;

  text-align: center;

  background: #f9fbff;

  border-radius: 14px;

}



.card.fr-night .card-main .score{

  font-size: 20px;

  font-weight: 700;

  color: #0f172a;

}



.card.fr-night .card-main .status-chip.pre{

  display: inline-flex;

  align-items: center;

  justify-content: center;

  background: #1d4ed8;

  color: #ffffff;

  border-radius: 999px;

  padding: 3px 12px;

  font-size: .75rem;

  margin-top: 4px;

  text-transform: uppercase;

  letter-spacing: .04em;

}



/* Partie tableau */

.card.fr-night .card-details{

  padding: 0;

  border-top: 1px solid #e2e8f0;

  margin-top: 8px;

}



.card.fr-night .table-wrap{

  overflow: auto;

  max-height: none;

  border-radius: 12px;

  background: #ffffff;

  box-shadow: 0 2px 8px rgba(0,0,0,.04);

}



/* Tableau récap FR */

.card.fr-night table.bx{

  width: 100%;

  border-collapse: collapse;

  font-size: 13px;

  margin-bottom: 0;

  min-width: 720px;

}



.card.fr-night thead{

  background: #0f172a;

  color: #ffffff;

}



.card.fr-night thead th{

  font-weight: 600;

  font-size: .78rem;

  letter-spacing: .06em;

  text-transform: uppercase;

  padding: 10px 12px;

  white-space: nowrap;

}



.card.fr-night tbody td{

  padding: 9px 12px;

  font-size: .88rem;

  border-bottom: 1px solid #e5e7eb;

}



.card.fr-night tbody tr:nth-child(even){

  background: #f9fafb;

}



.card.fr-night tbody tr:hover{

  background: #e5edff;

}



/* Cellule joueur + avatar */

.card.fr-night td.player-cell{

  display: flex;

  align-items: center;

  gap: 10px;

  white-space: nowrap;

}



.card.fr-night td.player-cell img{

  width: 56px;          /* VRAIMENT plus gros = beaucoup plus de pixels utiles */

  height: 56px;

  border-radius: 50%;

  flex-shrink: 0;

  object-fit: cover;



  /* zéro artifice qui “floute” visuellement */

  background: transparent;

  border: 0;

  box-shadow: none;

  image-rendering: auto;

}



.card.fr-night td.player-cell {

  position: relative;

}



.card.fr-night td.player-cell .hs-wrap {

  position: relative;

  width: 56px;

  height: 56px;

  flex-shrink: 0;

}



.card.fr-night td.player-cell .hs-bg {

  position: absolute;

  inset: 0;

  border-radius: 50%;

  background: radial-gradient(

    circle,

    rgba(255,255,255,1) 0%,

    rgba(230,230,230,1) 35%,

    rgba(180,180,180,1) 100%

  );

  /* léger, subtil - tu peux assombrir si tu veux */

}



.card.fr-night td.player-cell .hs-img {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  object-fit: cover;

  image-rendering: auto;

}

/* =========================

   Favoris banner (style joueurs.php)

   ========================= */



#favBannerWrap{

  margin: 10px 0 16px;

}





#favBanner::-webkit-scrollbar{

  height:8px;

}

#favBanner::-webkit-scrollbar-thumb{

  background:#cbd5e1;

  border-radius:999px;

}

/* Cartes favoris : caler sur les cartes joueurs */

#favBanner {

  display: flex;

  gap: 12px;

  overflow-x: auto;

}



.fav-card {

  position: relative;

  overflow: hidden;

  border-radius: 16px;

  border: 1px solid #e7eaf2;

  background: #fff;

  min-width: 260px;

}



/* Bandeau haut */

.fav-stripe {

  min-height: 62px;

  padding: 8px 12px 8px 14px;

  border-radius: 16px 16px 0 0;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 10px;

  color: #fff;

}



.fav-name {

  font-weight: 900;

  font-size: 18px;

}



.fav-stripe-right {

  display: flex;

  align-items: center;

}



.fav-logo {

  height: 40px;

  width: auto;

  object-fit: contain;

}



/* etc. (fav-hs-wrap, fav-meta…) comme tu l’avais déjà */





.fav-card:hover{

  transform:translateY(-2px);

  box-shadow:0 10px 22px rgba(15,23,42,.12);

}



/* stripe façon joueurs.php */





.fav-team-logo {

  height: 34px;

  width: auto;

  opacity: 0.95;

}





.fav-tri{

  font-size:12px;

  font-weight:800;

  padding:2px 7px;

  border-radius:999px;

  background:rgba(255,255,255,.12);

  border:1px solid rgba(255,255,255,.35);

}



/* body */

.fav-body{

  position:relative;

  display:flex;

  gap:10px;

  align-items:center;

  padding:10px 12px 12px;

  min-height:110px;

}



/* headshot */

.fav-hs-wrap{

  position:relative;

  width:92px;

  height:92px;

  flex:0 0 92px;

}

.fav-hs-bg{

  position:absolute;

  inset:0;

  background:#fff;             /* fond blanc pour transparence */

  border-radius:12px;

  border:1px solid #eef2f7;

}

.fav-hs{

  position:absolute;

  inset:0;

  width:100%;

  height:100%;

  object-fit:contain;

  transform:scale(1.08);       /* un poil plus grand */

  filter:drop-shadow(0 4px 10px rgba(0,0,0,.18));

}



/* textes */

.fav-meta{

  display:flex;

  flex-direction:column;

  gap:4px;

  min-width:0;

}

.fav-line{

  font-size:13px;

  font-weight:700;

  color:#0f172a;

}

.fav-stats{

  font-size:13px;

  color:#334155;

  font-weight:600;

}

.fav-soon{

  font-size:12px;

  color:#64748b;

  margin-top:2px;

}





/* ===== Bannière cookies BleuBlancDunk ===== */



#bbdCookieBanner {

  position: fixed;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 5000;

  background: rgba(15, 23, 42, 0.96);

  color: #e5e7eb;

  font-size: 14px;

  line-height: 1.4;

  padding: 12px 16px;

  box-shadow: 0 -4px 16px rgba(15,23,42,.5);

}



#bbdCookieBanner-inner {

  max-width: 1100px;

  margin: 0 auto;

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 12px 18px;

}



#bbdCookieBanner-text {

  flex: 1 1 260px;

}



#bbdCookieBanner-title {

  font-weight: 600;

  margin-bottom: 4px;

  font-size: 14px;

}



#bbdCookieBanner-text a {

  color: #93c5fd;

  text-decoration: underline;

}



#bbdCookieBanner-buttons {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  justify-content: flex-end;

}



.bbdCookie-btn {

  cursor: pointer;

  border-radius: 999px;

  padding: 6px 14px;

  font-size: 13px;

  font-weight: 500;

  border: 1px solid transparent;

  background: transparent;

  color: #e5e7eb;

  transition: background .15s ease, border-color .15s ease, transform .08s ease;

}



.bbdCookie-btn-primary {

  background: linear-gradient(135deg,#1d4ed8,#0ea5e9);

  border-color: #1d4ed8;

  color: #ffffff;

}



.bbdCookie-btn-primary:hover {

  transform: translateY(-1px);

  box-shadow: 0 4px 12px rgba(15,23,42,0.4);

}



.bbdCookie-btn-secondary {

  border-color: #64748b;

  background: rgba(15,23,42,0.75);

}



.bbdCookie-btn-secondary:hover {

  background: rgba(15,23,42,0.9);

}



/* Mobile : contenu sur 2 lignes */

@media (max-width: 640px) {

  #bbdCookieBanner-inner {

    align-items: flex-start;

  }

  #bbdCookieBanner-buttons {

    justify-content: flex-start;

  }

}

/* 🇫🇷 Surbrillance tricolore pour les Français (récap FR) */

.card.fr-night tr.row-fr{

  background: linear-gradient(

    90deg,

    rgba(0,85,164,0.18) 0%,

    rgba(0,85,164,0.10) 16%,

    rgba(255,255,255,1) 50%,

    rgba(239,65,53,0.10) 84%,

    rgba(239,65,53,0.18) 100%

  );

}



.card.fr-night tr.row-fr:hover{

  background: linear-gradient(

    90deg,

    rgba(0,85,164,0.24) 0%,

    rgba(0,85,164,0.14) 16%,

    rgba(255,255,255,1) 50%,

    rgba(239,65,53,0.14) 84%,

    rgba(239,65,53,0.24) 100%

  );

}



/* PTS en gras */

.card.fr-night td.pts{

  font-weight: 800;

  color: #111827;

}



/* Lignes cliquables vers joueurs (sans style visible) */

.card.fr-night tr.clickable {

  cursor: pointer;

}

.card.fr-night tr.clickable * {

  text-decoration: none !important;

  color: inherit !important;

}



/* Status */

.status { text-align: center; font-weight: 600; color: #64748b; }



/* Responsive */

@media (max-width: 920px) {

  header .banner { max-width: 100%; }

  main { max-width: 96%; }

  .team .logo { width: 70px; height: 70px; }

  .score { font-size: 20px; }

}



/* === BBD V1.4 - compléments page équipe === */

.h2 { font-size:18px; font-weight:700; }



/* ========================= */

/* BARRE D'ONGLETS PRINCIPALE */

/* ========================= */



/* Team cards: gros logo en fond, à gauche, rogné */

.team-card { position: relative; overflow: hidden; }

.team-card .wm-left {

  position: absolute;

  left: -6px;

  top: 0;

  width: 65%;

  height: 100%;

  background-repeat: no-repeat;

  background-size: contain;

  background-position: left center;

  opacity: .12;

  pointer-events: none;

}



/* ===== BBD - Compléments spécifiques à team.php (scoped) ===== */



/* Barre d’onglets locale de team.php */

.page-teams .tabs{

  max-width:1100px;

  margin:8px auto 14px;

  padding:6px 10px;

  background:#fff;

  border:1px solid var(--border);

  border-radius:12px;

  display:flex;

  gap:8px;

  justify-content:center;

  align-items:center;

  box-shadow:0 2px 8px rgba(0,0,0,.06);

}

.page-teams .tab{

  padding:8px 14px;

  border-radius:10px;

  font-weight:800;

  border:1px solid transparent;

}

.page-teams .tab:hover{background:#f2f6ff;border-color:#dbe6ff}

.page-teams .tab.active{background:var(--primary);color:#fff}



/* Contrôles (boutons) */

.page-teams .controls{

  display:flex;

  justify-content:flex-end;

  gap:10px;

  margin:0 0 10px;

}

.page-teams .btn{

  background:#fff;

  border:1px solid var(--border);

  border-radius:10px;

  padding:8px 12px;

  font-weight:800;

  cursor:pointer;

  box-shadow:0 1px 3px rgba(0,0,0,.06);

}

.page-teams .btn:hover{background:#f7faff}



/* Sections conférences + grilles */

.page-teams .confs{display:grid;grid-template-columns:1fr 1fr;gap:14px}

@media (max-width:860px){ .page-teams .confs{grid-template-columns:1fr} }

.page-teams .conf{

  background:#fff;

  border:1px solid var(--border);

  border-radius:12px;

  padding:10px;

  box-shadow:0 2px 8px rgba(0,0,0,.06);

  text-align:left;

}

.page-teams .conf h2{

  margin:2px 4px 8px;

  font-size:16px;

  font-weight:900;

  color:#64748b;

}

.page-teams .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}

@media (max-width:640px){ .page-teams .grid{grid-template-columns:repeat(2,1fr)} }



/* Cartes équipe */

.page-teams .team-card{

  position:relative;

  border-radius:12px;

  overflow:hidden;

  box-shadow:0 2px 8px rgba(0,0,0,.06);

  color:#fff;

  text-align:center;

  cursor:pointer;

  display:flex;

  flex-direction:column;

  align-items:center;

  justify-content:flex-start;

  padding:18px 10px;

  min-height:180px;

  transition:transform .2s ease, box-shadow .2s ease;

}

.page-teams .team-card:hover{

  transform:scale(1.03) translateY(-3px);

  box-shadow:0 6px 18px rgba(0,0,0,.18);

}



/* Ruban tricolore fin à gauche */

.page-teams .team-card.fr::before{

  content:"";

  position:absolute;

  top:0;bottom:0;left:0;width:10px;

  background:linear-gradient(to bottom,#0055a4 0%,#2b70b9 20%,#ffffff 45%,#f5d9d9 60%,#ef4135 80%,#c92525 100%);

  border-top-left-radius:12px;

  border-bottom-left-radius:12px;

  box-shadow:inset -1px 0 0 rgba(0,0,0,.08);

  pointer-events:none;

  z-index:1;

}



/* Filigrane XXL à gauche (ne capte pas les clics) */

.page-teams .tc-mark{

  position:absolute;

  left:-18%;top:-8%;

  width:140%;height:140%;

  background-repeat:no-repeat;

  background-position:left center;

  background-size:auto 95%;

  opacity:.08;

  filter:grayscale(100%);

  pointer-events:none;

  z-index:1;

}

.page-teams .tc-logo{

  width:90px;height:90px;

  object-fit:contain;

  filter:drop-shadow(0 3px 3px rgba(0,0,0,.25));

  margin-bottom:10px;

  position:relative;

  z-index:2;

}

.page-teams .tc-name{

  font-weight:900;

  font-size:16px;

  line-height:1.15;

  text-transform:uppercase;

  margin-bottom:4px;

  position:relative;

  z-index:2;

}

.page-teams .tc-wl{

  font-weight:800;

  font-size:14px;

  opacity:.95;

  position:relative;

  z-index:2;

}



/* Classements (deux tableaux) */

.page-teams .tables{

  margin-top:16px;

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:12px;

}

@media (max-width:860px){ .page-teams .tables{grid-template-columns:1fr} }

.page-teams .table{

  background:#fff;

  border:1px solid var(--border);

  border-radius:12px;

  overflow:hidden;

  box-shadow:0 2px 8px rgba(0,0,0,.06);

}

.page-teams .table header{

  padding:10px 12px;

  background:#eef3fa;

  border-bottom:1px solid var(--border);

}

.page-teams .table header strong{font-size:14px}

.page-teams table{width:100%;border-collapse:collapse;font-size:14px}

.page-teams th,

.page-teams td{

  padding:8px 10px;

  border-bottom:1px solid #eef2f7;

  text-align:left;

}

.page-teams th{

  font-weight:900;

  color:#41526b;

  background:#fafbff;

}

.page-teams td.pct,

.page-teams th.pct{text-align:right}

.page-teams tr:hover td{background:#fafcff}

.page-teams .hidden{display:none!important}



/* Vue équipe (4 panneaux) */

.page-teams .team-view{

  margin-top:14px;

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:12px;

}

@media (max-width:980px){ .page-teams .team-view{grid-template-columns:1fr} }

.page-teams .panel{

  position:relative;

  background:#fff;

  border:1px solid var(--border);

  border-radius:12px;

  box-shadow:0 2px 8px rgba(0,0,0,.06);

  overflow:hidden;

  text-align:left;

}

.page-teams .panel header{

  display:flex;

  align-items:center;

  gap:12px;

  padding:12px;

  border-bottom:1px solid var(--border);

  background:#f8fbff;

}



/* Carte récap entête */

.page-teams #panelRecap .team-head{

  display:flex;

  align-items:center;

  gap:14px;

}

.page-teams #panelRecap .team-head img{

  width:72px;

  height:72px;

  object-fit:contain;

}

.page-teams #teamNameHdr{

  font-weight:900;

  font-size:24px;

  line-height:1;

}

.page-teams #teamTriHdr{color:#6b7280;font-size:14px}

.page-teams #teamRecordHdr{

  margin-left:auto;

  font-size:32px;

  line-height:1;

  padding:8px 14px;

  border-radius:999px;

  background:#eef3fa;

  border:1px solid var(--border);

  font-weight:900;

  min-width:64px;

  text-align:center;

}

.page-teams .recap-mark{

  position:absolute;

  inset:0;

  background-repeat:no-repeat;

  background-position:center center;

  background-size:auto 180%;

  opacity:.05;

  filter:grayscale(100%);

  pointer-events:none;

}



/* Stats grilles du récap */

.page-teams .stats,

.page-teams .stats2,

.page-teams .stats3{

  display:grid;

  gap:10px;

  padding:12px;

}

.page-teams .stats{grid-template-columns:repeat(4,1fr)}

.page-teams .stats2{grid-template-columns:repeat(3,1fr)}

.page-teams .stats3{grid-template-columns:repeat(3,1fr)}

.page-teams .stat{

  background:#f9fbff;

  border:1px solid #e8eef8;

  border-radius:10px;

  padding:10px;

  text-align:center;

}

.page-teams .stat b{display:block;font-size:18px}



/* Tableaux “derniers / à venir / roster” */

.page-teams .tbl{width:100%;border-collapse:collapse}

.page-teams .tbl th,

.page-teams .tbl td{

  padding:8px 10px;

  border-bottom:1px solid #eef2f7;

  text-align:left;

}

.page-teams .tbl th{

  background:#fafbff;

  font-weight:900;

  color:#41526b;

}

.page-teams .td-right{text-align:right}

.page-teams .muted{color:#6b7280}

.page-teams .w{color:#16a34a;font-weight:900}

.page-teams .l{color:#dc2626;font-weight:900}



/* Roster - surbrillance FR */

.page-teams .fr-player{

  background:linear-gradient(

    90deg,

    rgba(0,85,164,0.12) 0%,

    rgba(0,85,164,0.18) 12%,

    rgba(255,255,255,0.95) 50%,

    rgba(239,65,53,0.18) 82%,

    rgba(239,65,53,0.12) 100%

  );

}

.page-teams .fr-player td{border-bottom-color:#d9e6ff}

.page-teams .badge-fr{

  display:inline-block;

  background:#0055a4;

  color:#fff;

  border-radius:6px;

  padding:2px 6px;

  font-size:11px;

  margin-left:6px;

}



/* Ajustements responsive team.php */

@media (max-width:640px){

  .page-teams .team-card{padding:14px 8px}

  .page-teams .tc-logo{width:72px;height:72px}

  .page-teams .tc-name{font-size:14px}

  .page-teams .tc-wl{font-size:13px}

}



/* TABS header (global) */

header .tabs{

  max-width:1100px;

  margin:8px auto 14px;

  padding:6px 10px;

  background:#fff;

  border:1px solid var(--border);

  border-radius:12px;

  display:flex;

  gap:8px;

  justify-content:center;

  align-items:center;

  box-shadow:0 2px 8px rgba(0,0,0,.06);

}

header .tab{

  padding:8px 14px;

  border-radius:10px;

  font-weight:800;

  line-height:1;

  border:1px solid transparent;

}

header .tab:hover{ background:#f2f6ff; border-color:#dbe6ff; }

header .tab.active{ background:var(--primary); color:#fff; }



/* Ligne 4 des stats : FG% / 3P% / FT% / OREB / DREB */

.page-teams .stats4{

  display:grid;

  grid-template-columns:repeat(5,1fr);

  gap:10px;

  padding:12px;

}



/* Mini bandeau tricolore pour équipes FR (classements) */

.mini-flag {

  display: inline-block;

  width: 18px;

  height: 10px;

  margin-left: 8px;

  vertical-align: -1px;

  border-radius: 2px;

  background: linear-gradient(

    to right,

    #0055a4 0%,

    #0055a4 33.33%,

    #ffffff 33.33%,

    #ffffff 66.66%,

    #ef4135 66.66%,

    #ef4135 100%

  );

  box-shadow: 0 0 0 1px rgba(0,0,0,.06) inset;

}



/* Pastille "sur le terrain" bleue, après le nom */

.on-dot {

  display:inline-block;

  width:8px; height:8px;

  border-radius:50%;

  background:#0b79ff;

  margin-left:6px;

  vertical-align:middle;

  box-shadow:0 0 0 2px #fff;

}



/* Voile de contraste sur les vignettes */

.team-card::after{

  content:"";

  position:absolute;

  inset:0;

  pointer-events:none;

  border-radius:1rem;

  background:

    radial-gradient(120% 90% at 20% -10%, rgba(0,0,0,.12), rgba(0,0,0,0) 45%),

    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.18));

}

.team-card.veil-strong::after{

  background:

    radial-gradient(120% 90% at 20% -10%, rgba(0,0,0,.18), rgba(0,0,0,0) 45%),

    linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.32));

}



/* Ruban tricolore pour équipes FR dans les classements */

.page-teams table tr.fr-team {

  position: relative;

  background: #fff;

}



/* Classements : lignes cliquables */

.page-teams .tables table tbody tr {

  cursor: pointer;

  transition: background-color .15s, box-shadow .15s;

}

.page-teams .tables table tbody tr:hover {

  background-color: #f8fafc;

  box-shadow: inset 2px 0 0 var(--primary);

}



/* Logo d'équipe dans les tableaux */

.page-teams .tbl .team-logo {

  width: 22px;

  height: 22px;

  object-fit: contain;

  vertical-align: middle;

  margin-right: 6px;

  border-radius: 4px;

  background: #fff;

  box-shadow: 0 0 2px rgba(0,0,0,.08);

}



/* Statut qualification */

.page-teams tr.seed-playoff td { border-left: 4px solid #16a34a; }

.page-teams tr.seed-playin td  { border-left: 4px solid #f59e0b; }

.page-teams tr.seed-out td     { border-left: 4px solid #cbd5e1; }



.page-teams .flag-fr { margin-left: 6px; font-size: 13px; }

.page-teams .seed-badge {

  display: inline-block;

  margin-left: 8px;

  padding: 2px 6px;

  border-radius: 999px;

  font-size: 11px;

  font-weight: 700;

  vertical-align: middle;

}

.page-teams .seed-badge.po  { background:#16a34a15; color:#166534; }

.page-teams .seed-badge.pi  { background:#f59e0b15; color:#92400e; }

.page-teams .seed-badge.out { background:#e5e7eb;   color:#475569; }

.page-teams .tbl .team-link{

  text-decoration: none;

  color: inherit;

  font-weight: 700;

}

.page-teams .tbl tr[data-tri] { cursor: pointer; }

.page-teams .tbl tr[data-tri]:hover td { background:#fafcff; }

.page-teams .flag-fr{ margin-left:6px; font-size: 12px; }

.page-teams .fr-player td{ border-bottom-color:#d9e6ff; }

.page-teams .badge-fr{

  display:inline-block;

  background:#0055a4;

  color:#fff;

  border-radius:6px;

  padding:2px 6px;

  font-size:11px;

  margin-left:6px;

}



/* ========================= */

/* HEADER GLOBAL BBD (logo + nav + compte) */

/* ========================= */



.topbar {

  background: #f8fafc;

  padding-bottom: 4px;

}



.topbar-inner {

  max-width: 1100px;

  margin: 0 auto;

  padding: 8px 12px 0;

  display: flex;

  justify-content: center;

  align-items: flex-start;

}



.logo-link {

  display: block;

}



.logo-link .banner {

  display: block;

  max-width: 100%;

  height: auto;

}



/* Carte de navigation centrée */

.nav-shell {

  max-width: 1100px;

  margin: 8px auto 0;

  padding: 0 12px;

}



.nav-card {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 20px;



  background: #ffffff;

  border-radius: 16px;

  border: 1px solid var(--border);

  box-shadow: 0 4px 14px rgba(15,23,42,0.08);

  padding: 8px 20px;

}

/* =========================

   Bandeau "Mes joueurs français favoris"

   ========================= */



#favBanner {

  display: flex;

  gap: 14px;

  padding: 0 4px 6px;

  overflow-x: auto;

}



/* Carte favori (même esprit que .card mais plus compact) */

#favBanner .fav-card {

  --accent: #1a2c5e;

  flex: 0 0 260px;

  max-width: 260px;

  border-radius: 16px;

  border: 1px solid #e7eaf2;

  background: #fff;

  overflow: hidden;

  position: relative;

  text-decoration: none;

  color: inherit;

}



/* Bandeau haut avec dégradé + logo équipe */

#favBanner .fav-stripe {

  min-height: 56px;

  padding: 8px 12px 8px 14px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 10px;

  border-top-left-radius: 16px;

  border-top-right-radius: 16px;

  color: #fff;

}



#favBanner .fav-name {

  font-weight: 900;

  font-size: 16px;

  line-height: 1.1;

}



#favBanner .fav-stripe-right {

  flex: 0 0 auto;

  display: flex;

  align-items: center;

}



#favBanner .fav-logo {

  height: 40px;

  width: auto;

  object-fit: contain;

}

#favBanner .fav-body {

  display: grid;

  grid-template-columns: 110px minmax(0, 1fr);

  gap: 10px;

  padding: 12px 14px 14px;

  align-items: center;

}



/* Portrait joueur : on fixe une vraie boîte */

#favBanner .fav-hs-wrap {

  width: 110px;

  height: 110px;

  position: relative;

  flex: none;

}



#favBanner .fav-hs-bg {

  position: absolute;

  inset: 0;

  border-radius: 18px;

  background: #f8fafc;

}



#favBanner .fav-hs {

  position: relative;

  width: 100%;

  height: 100%;

  object-fit: contain;

  border-radius: 18px;

  display: block;

  filter: drop-shadow(0 4px 10px rgba(15, 23, 42, 0.25));

}



/* Texte à droite du portrait */

#favBanner .fav-meta {

  font-size: 13px;

}



#favBanner .fav-line {

  font-weight: 600;

  margin-bottom: 4px;

}



#favBanner .fav-tw {

  color: #2563eb;

}



#favBanner .fav-stats {

  font-size: 12px;

  color: #64748b;

}



#favBanner .fav-last-line strong {

  font-weight: 800;

}

#favBanner .fav-last-title{

  font-size: 12px;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: .06em;

  color: #64748b;

  margin-bottom: 4px;

}



#favBanner .fav-last-match{

  font-size: 12px;

  font-weight: 600;

  margin-bottom: 3px;

}



#favBanner .fav-last-stats{

  font-size: 11px;

  color: #475569;

  line-height: 1.3;

}



/* Mobile : une carte par ligne max si l’écran est petit */

@media (max-width: 640px) {

  #favBanner .fav-card {

    flex: 0 0 80%;

    max-width: 80%;

  }

}
/* Carte spéciale NBA CUP */
.nba-cup-card {
  position: relative;
  overflow: hidden;
}

/* Logo en transparence */
.nba-cup-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/img/nba-cup-bracket.svg") center center no-repeat;
  background-size: 55%;         /* Taille du logo */
  opacity: 0.08;                /* Transparence subtile */
  pointer-events: none;         /* Important pour ne pas bloquer les clics */
  z-index: 1;
}

/* Le contenu normal passe au-dessus */
.nba-cup-card > * {
  position: relative;
  z-index: 5;
}
.cup-chip {
  margin-top: 6px;
  background: #fff6d8;
  border: 1px solid #f5c343;
  border-radius: 999px;
  padding: 6px 14px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.cup-chip-content {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cup-chip-logo {
  width: 60px;
  height: auto;
  display: block;
}

.cup-chip-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.2;
  text-transform: uppercase;
}

.cup-chip-main {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .03em;
}

.cup-chip-stage {
  font-size: 12px;
  font-weight: 600;
  color: #444;
}

.cup-chip-provider {
  font-size: 10px;
  opacity: .7;
}
/* Pastille NBA CUP — version blanche premium */
.cup-chip {
  margin-top: 8px;
  background: #ffffff;
  border: 1px solid #dcdcdc;
  border-radius: 12px;
  padding: 8px 12px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.cup-chip-content {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cup-chip-logo {
  width: 50px;
  height: auto;
  display: block;
  opacity: 0.9;
}

.cup-chip-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.2;
  text-transform: uppercase;
}

.cup-chip-main {
  font-size: 13px;
  font-weight: 700;
  color: #222;
}

.cup-chip-stage {
  font-size: 11px;
  font-weight: 600;
  color: #444;
}

.cup-chip-provider {
  font-size: 10px;
  color: #666;
}
/* Onglets */

.main-tabs {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 24px;

  flex: 1 1 auto;

}



.main-tabs a {

  text-decoration: none;

  font-weight: 600;

  color: var(--ink);

  padding: 6px 12px;

  border-radius: 8px;

  transition: background-color .15s, color .15s;

}



.main-tabs a:hover {

  background: #e8f0ff;

  color: var(--primary);

}



.main-tabs a.active {

  background: var(--primary);

  color: #ffffff;

}



/* Menu compte */

.user-menu {

  position: relative;

  font-size: 0.85rem;

}



.user-menu-toggle {

  color: #fff !important;

  background: #1e3a8a;

  border: 1px solid #1e3a8a;

  border-radius: 50%;

  width: 32px;

  height: 32px;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 18px;

}



.user-menu-toggle:hover {

  background: #163d80;

  transform: translateY(-1px);

}



.user-menu-dropdown {

  position: absolute;

  right: 0;

  margin-top: 6px;

  min-width: 170px;

  padding: 8px 0;

  border-radius: 12px;

  background: #ffffff;

  box-shadow: 0 10px 30px rgba(15,23,42,.16);

  border: 1px solid #e2e8f0;

  opacity: 0;

  transform: translateY(4px);

  pointer-events: none;

  transition: opacity .12s ease, transform .12s ease;

  z-index: 20;

}



.user-menu:hover .user-menu-dropdown,

.user-menu:focus-within .user-menu-dropdown {

  opacity: 1;

  transform: translateY(0);

  pointer-events: auto;

}



.user-menu-label {

  padding: 4px 14px 6px;

  font-size: 0.75rem;

  text-transform: uppercase;

  letter-spacing: .08em;

  color: #94a3b8;

}



.user-menu-link {

  display: block;

  padding: 7px 14px;

  font-size: 0.85rem;

  color: #0f172a;

  text-decoration: none;

  white-space: nowrap;

  cursor: pointer;

  transition: background .12s ease, color .12s ease;

}



.user-menu-link:hover {

  background: #eff6ff;

  color: #1d4ed8;

}

/* H1 SEO caché */

.h1-hidden {

  position: absolute;

  left: -9999px;

  top: auto;

  width: 1px;

  height: 1px;

  overflow: hidden;

  white-space: nowrap;

}



/* Bandeaux favoris (joueurs + équipes) */

.fav-banner-wrap {

  max-width: 1100px;

  margin: 0 auto 8px;

  padding: 0 16px;

}



.fav-banner-wrap .fav-title {

  margin: 8px 0 4px;

  font-size: 16px;

  font-weight: 700;

  color: #0f172a;

  text-align: left;

  display: block;

}



/* Mobile : nav en colonne, bouton compte centré */

@media (max-width: 640px) {

  .nav-card {

    flex-direction: column;

    align-items: center;

    gap: 6px;

  }



  .user-menu {

    align-self: center;

  }

}

/* ========== FIXES MOBILE 2025-12-03 ========== */



/* Tables : forcer le scroll horizontal propre */

.table-wrap {

  overflow-x: auto;

  -webkit-overflow-scrolling: touch; /* inertie iOS */

}



/* Largeur minimale pour que les colonnes respirent */

table.bx {

  width: 100%;

  border-collapse: collapse;

  font-size: 13px;

  min-width: 640px;   /* important : déclenche le scroll horizontal */

}



@media (max-width: 480px) {

  table.bx {

    font-size: 11px;

    min-width: 600px;

  }

  table.bx th,

  table.bx td {

    padding: 4px 6px;

  }

}

/* Compactage général mobile */

@media (max-width: 640px) {

  /* barre d’onglets */

  header .tabs {

    padding: 4px 6px;

    gap: 12px;

  }

  header .tab {

    padding: 6px 10px;

    font-size: 13px;

  }



  /* bloc date + filtre FR */

  .controls {

    padding: 10px 8px;

  }

  .date-controls {

    gap: 8px;

  }

  .date-controls h2 {

    font-size: 16px;

    text-align: center;

  }

  .chip-btn {

    padding: 4px 8px;

    font-size: 16px;

  }



  /* cartes de matchs */

  .card {

    padding: 8px 6px;

  }

  .card-main {

    gap: 6px;

  }

  .team .logo {

    width: 64px;

    height: 64px;

  }

  .tri {

    font-size: 16px;

  }

  .score {

    font-size: 20px;

  }

}



/* ========== NAV / MENU MOBILE (<= 640px) ========== */

@media (max-width: 640px) {



  /* Bannière moins “massive” */

  header .banner {

    max-width: 100%;

    margin-bottom: 6px;

    border-radius: 0;        /* on peut enlever le gros arrondi si tu veux */

  }



  .topbar-inner {

    padding: 4px 8px 0;

  }



  .nav-shell {

    padding: 0 8px;

  }



  /* Carte de menu plus compacte, tout sur UNE ligne */

  .nav-card {

    padding: 4px 10px;

    border-radius: 12px;

    gap: 10px;

    flex-direction: row;               /* repasse en ligne sur mobile */

    justify-content: space-between;

    align-items: center;

  }



  /* Onglets : plus petits, éventuellement scrollables si ça coince */

  .main-tabs {

    gap: 8px;

    justify-content: flex-start;

    flex: 1 1 auto;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;

  }



  .main-tabs a {

    padding: 4px 8px;

    font-size: 13px;

    white-space: nowrap;

  }



  /* Bouton compte : plus discret mais toujours accessible à droite */

  .user-menu {

    flex: 0 0 auto;

    align-self: center;

  }



  .user-menu-toggle {

    width: 30px;

    height: 30px;

    font-size: 16px;

  }

}



/* Option bonus : nav collée en haut au scroll sur mobile */

@media (max-width: 640px) {

  .nav-shell {

    position: sticky;

    top: 0;

    z-index: 40;

    background: var(--bg);

  }

}



/* =============== PAGE PLAYOFFS / PLAY-IN =============== */

/* ========== PAGE PLAYOFFS ========== */



.page-playoffs main.playoffs-main {

  width: 100%;

  max-width: 1100px;

  margin: 0 auto;

  padding: 0 12px 40px;

}



/* Barre de contrôle */

.playoffs-controls {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

  gap: 16px;

  background: #eef3fa;

  border: 1px solid var(--border);

  border-radius: 14px;

  padding: 12px 14px;

  box-shadow: 0 1px 3px rgba(0,0,0,.06);

  margin: 0 0 16px;

}



.po-controls-left {

  display: flex;

  flex-wrap: wrap;

  gap: 12px 20px;

  align-items: center;

}



.po-title {

  font-size: 20px;

  font-weight: 800;

  margin: 0;

}



.po-season-select {

  display: flex;

  flex-direction: column;

  gap: 4px;

  font-size: 14px;

}

.po-season-select select {

  border-radius: 8px;

  border: 1px solid var(--border);

  padding: 4px 8px;

}



/* Playoffs / Play-In */

.po-type-toggle {

  display: inline-flex;

  border-radius: 999px;

  padding: 2px;

  background: #dbe3f5;

  gap: 4px;

}

.po-type-btn {

  border: none;

  padding: 4px 10px;

  border-radius: 999px;

  font-size: 13px;

  font-weight: 600;

  cursor: pointer;

  background: transparent;

  color: #1f2933;

}

.po-type-btn.active {

  background: #fff;

  color: var(--primary);

  box-shadow: 0 1px 3px rgba(0,0,0,.1);

}



/* Résumé FR */

.po-fr-summary {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  align-items: center;

  justify-content: flex-end;

}

.po-fr-chip {

  display: inline-flex;

  align-items: center;

  gap: 6px;

  padding: 4px 10px;

  border-radius: 999px;

  background: #fff;

  border: 1px solid var(--border);

  font-size: 13px;

}

.po-fr-chip .emoji { font-size: 16px; }



/* ===== Onglets EST / OUEST ===== */

.po-brackets {

  margin-top: 10px;

}



.po-conf-tabs {

  display: inline-flex;

  border-radius: 999px;

  background: #e5ecfa;

  padding: 3px;

  gap: 4px;

  margin-bottom: 12px;

}



.po-conf-tab {

  border: none;

  padding: 5px 14px;

  border-radius: 999px;

  background: transparent;

  cursor: pointer;

  font-size: 14px;

  font-weight: 600;

  color: #1f2933;

  transition: background .15s, color .15s;

}

.po-conf-tab.active {

  background: #fff;

  color: var(--primary);

  box-shadow: 0 1px 3px rgba(0,0,0,.08);

}



/* Panneaux de conférences (vertical) */

.po-conf-panels {

  margin-top: 4px;

}



.po-conf-panel {

  display: none;

}

.po-conf-panel.active {

  display: block;

}



/* Blocs de rounds verticaux */

.po-round-block {

  background: #fff;

  border-radius: 12px;

  border: 1px solid var(--border);

  padding: 10px 12px;

  margin-bottom: 12px;

  box-shadow: 0 1px 3px rgba(0,0,0,.04);

}



.po-round-title {

  margin: 0 0 8px;

  font-size: 15px;

  font-weight: 800;

  text-align: left;

  color: #111827;

}



/* Liste verticale de séries */

.po-series-column {

  display: flex;

  flex-direction: column;

  gap: 8px;

}



/* Carte série verticale */

.po-series-card {

  position: relative;

  border-radius: 10px;

  border: 1px solid var(--border);

  padding: 8px 10px;

  background: #f9fafb;

  text-align: left;

  display: flex;

  flex-direction: column;

  gap: 4px;

}



/* petit ruban FR si série avec Français */

.po-series-card.po-has-fr::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  width: 6px;

  border-radius: 10px 0 0 10px;

  background: linear-gradient(

    to bottom,

    rgba(0,85,164,1) 0%,

    rgba(255,255,255,1) 50%,

    rgba(239,65,53,1) 100%

  );

}



/* Header série : seeds + équipes */

.po-series-header {

  display: flex;

  justify-content: space-between;

  gap: 8px;

  font-size: 13px;

}

.po-team-label {

  display: flex;

  flex-direction: column;

}

.po-team-name {

  font-weight: 700;

}

.po-team-seed {

  font-size: 12px;

  color: #6b7280;

}



/* Score de la série */

.po-series-score {

  font-size: 13px;

  font-weight: 700;

  color: #111827;

}



/* Infos complémentaires (FR, statut) */

.po-series-meta {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  font-size: 12px;

  color: #4b5563;

}

.po-meta-chip {

  padding: 2px 8px;

  border-radius: 999px;

  border: 1px solid #d1d5db;

  background: #fff;

}



/* Responsive */

@media (max-width: 800px) {

  .playoffs-controls {

    flex-direction: column;

    align-items: stretch;

  }

  .po-fr-summary {

    justify-content: flex-start;

  }

}

/* ============================

   BANNIÈRE BLESSURES 3 COLONNES

   ============================ */



#injuryTickerWrap {

  margin: 8px 0 4px;

  display: flex;

  justify-content: center;

}



.injury-pill {

  max-width: 1076px;

  width: calc(100% - 32px);

  background: #0f172a;

  color: #e5e7eb;

  border-radius: 16px;

  padding: 10px 16px;

  display: flex;

  align-items: stretch;

  gap: 14px;

  box-shadow: 0 10px 25px rgba(15,23,42,0.25);

}



/* Colonnes */



.injury-col {

  display: flex;

  flex-direction: column;

  justify-content: center;

}



/* Colonne 1 : label */



.injury-col-label {

  flex: 0 0 auto;

  padding-right: 8px;

  border-right: 1px solid rgba(148,163,184,0.5);

}



.injury-label {

  font-size: 12px;

  text-transform: uppercase;

  letter-spacing: .12em;

  font-weight: 700;

  color: #bfdbfe;

  white-space: nowrap;

}



/* Colonne 2 : headshot + logo */



.injury-col-player {

  flex: 0 0 auto;

  min-width: 48px;

}

.injury-col-text {

  flex: 1 1 auto;

  min-width: 0;

  text-align: left;        /* ← au cas où */

  align-items: flex-start; /* ← évite tout centrage vertical */

}



.injury-player-stack {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 4px;

}



.injury-headshot {

  width: 28px;

  height: 28px;

  border-radius: 50%;

  object-fit: cover;

  border: 1px solid #334155;

  background: #020617;

}



.injury-teamlogo {

  width: 24px;

  height: 24px;

  object-fit: contain;

}



/* Colonne 3 : texte */



.injury-text {

  font-size: 13px;

  line-height: 1.35;

  white-space: normal;

  text-align: left;        /* ← AJOUT essentiel */

}





.injury-text {

  font-size: 13px;

  line-height: 1.35;

  white-space: normal;

}



/* petit fade sur le texte quand on change de blessé */

.injury-text.fade {

  animation: injury-fade 0.35s ease-out;

}



@keyframes injury-fade {

  from { opacity: 0; transform: translateY(2px); }

  to   { opacity: 1; transform: translateY(0); }

}



/* Responsive mobile */



@media (max-width: 640px) {

  .injury-pill {

    flex-direction: column;

    align-items: flex-start;

    gap: 8px;

  }

  .injury-col-label {

    border-right: none;

    padding-right: 0;

  }

  .injury-label {

    margin-bottom: 2px;

  }

  .injury-col-player {

    flex-direction: row;

  }

}
.cup-chip {
  margin-top: 4px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #111;
  border: 1px solid #d4af37;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.cup-chip-main {
  font-weight: 700;
  color: #f5e3a3;
}

.cup-chip-stage {
  font-weight: 500;
  opacity: .9;
}

.cup-chip-provider {
  font-weight: 600;
  font-size: 10px;
  padding-left: 6px;
  border-left: 1px solid rgba(255,255,255,.2);
  opacity: .9;
}

/* Carte spéciale NBA CUP : watermark en fond, sous tout le reste */
.nba-cup-card {
  position: relative;
  overflow: hidden;
}

.nba-cup-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/img/nba-cup-bracket.svg") center center no-repeat;
  background-size: 60%;
  opacity: 0.06;
  pointer-events: none;
  z-index: 0;  /* IMPORTANT : en-dessous des side-flag */
}

/* Tout le contenu de la carte au-dessus du watermark */
.nba-cup-card > * {
  position: relative;
  z-index: 1;
}

/* On s’assure que les drapeaux passent bien au-dessus */
.side-flag {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 8px;
  z-index: 2;
}
/* Pastille NBA CUP – fond blanc propre */
.cup-chip {
  margin-top: 6px;
  background: #ffffff;             /* fond blanc */
  border: 1px solid #d4d4d4;
  border-radius: 999px;
  padding: 6px 12px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  color: #111;
}

.cup-chip-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

.cup-chip-logo {
  width: 50px;
  height: auto;
  display: block;
}

.cup-chip-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.2;
  text-transform: uppercase;
}

.cup-chip-main {
  font-size: 13px;
  font-weight: 700;
  color: #111;
}

.cup-chip-stage {
  font-size: 11px;
  font-weight: 600;
  color: #444;  /* “QUART DE FINALE EST” */
}

.cup-chip-provider {
  font-size: 10px;
  color: #666;
}

.cup-chip-provider {
  display: flex;
  align-items: center;
  margin-top: 2px;
}

.prime-logo {
  height: 22px;
  width: auto;
  opacity: 0.85;
  transition: opacity .2s;
}

.prime-logo:hover {
  opacity: 1;
}

.online-pill{
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 10px;
  border-radius:999px;
  background:#fff;
  margin-right:12px;
}

.online-badge{
  min-width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#fff;
  border:2px solid #ef4444;
  color:#ef4444;
  font-weight:900;
  font-size:12px;
  line-height:1;
}

.online-label{
  color:#ef4444;
  font-weight:800;
  font-size:13px;
  white-space:nowrap;
}
.nav-card{
  display:flex;
  align-items:center;
}
.main-tabs{ flex: 1; }
.user-menu{ margin-left:auto; }
/* ===== Compteur visiteurs en ligne (header) ===== */
#onlineCount {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 28px;
  height: 22px;
  padding: 0 8px;

  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .02em;

  color: #0f172a;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(148,163,184,.55);

  box-shadow:
    0 6px 16px rgba(15,23,42,.18),
    inset 0 1px 0 rgba(255,255,255,.7);

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  transform: translateY(-1px);
}

/* option : un petit "LIVE" avant le compteur via le wrapper si tu l'as */
#onlineCountWrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;

  background: linear-gradient(
    90deg,
    rgba(37,99,235,.10),
    rgba(255,255,255,.10),
    rgba(220,38,38,.10)
  );

  border: 1px solid rgba(148,163,184,.35);
  box-shadow: 0 10px 26px rgba(15,23,42,.12);
}

#onlineCountWrap::before{
  content: "LIVE";
  font-weight: 900;
  font-size: 11px;
  letter-spacing: .10em;
  color: rgba(15,23,42,.75);
}

/* petite pastille pulse discrète */
#onlineCountWrap::after{
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(34,197,94,.95);
  box-shadow: 0 0 0 0 rgba(34,197,94,.35);
  animation: bbdPulse 1.6s infinite;
}

@keyframes bbdPulse {
  0%   { box-shadow: 0 0 0 0 rgba(34,197,94,.35); }
  70%  { box-shadow: 0 0 0 10px rgba(34,197,94,0); }
  100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}
/* ===== Chip "En ligne" (header) ===== */
.online-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;

  padding:6px 10px;
  border-radius:999px;

  background: rgba(255,255,255,.72);
  border: 1px solid rgba(148,163,184,.40);

  box-shadow:
    0 10px 22px rgba(15,23,42,.10),
    inset 0 1px 0 rgba(255,255,255,.70);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  font-family: system-ui;
  line-height:1;
}

.online-label{
  font-size: 13px;
  font-weight: 650;
  color: rgba(15,23,42,.75);
  letter-spacing: .01em;
}

/* point "live" discret */
.online-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34,197,94,.35);
  animation: onlinePulse 1.7s infinite;
}

@keyframes onlinePulse{
  0%{ box-shadow: 0 0 0 0 rgba(34,197,94,.35); }
  70%{ box-shadow: 0 0 0 10px rgba(34,197,94,0); }
  100%{ box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}

/* le nombre (id conservé) */
#onlineCount.online-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-width: 26px;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;

  font-size: 12px;
  font-weight: 850;

  color: rgba(15,23,42,.92);

  /* petit effet bleu/blanc/rouge subtil */
  background: linear-gradient(
    90deg,
    rgba(37,99,235,.14),
    rgba(255,255,255,.85),
    rgba(220,38,38,.12)
  );
  border: 1px solid rgba(148,163,184,.45);

  box-shadow:
    0 8px 18px rgba(15,23,42,.12),
    inset 0 1px 0 rgba(255,255,255,.65);
}/* === Social icons header : style icône pure === */
.social-links {
  display: flex;
  align-items: center;
  gap: 12px;
}

.social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;              /* IMPORTANT */
  background: none;        /* PAS DE BULLE */
  border-radius: 0;        /* PAS DE ROND */
  line-height: 1;
  transition: transform .12s ease, opacity .12s ease;
}

.social-link:hover {
  transform: translateY(-1px);
  opacity: 0.75;
}

/* Taille & rendu SVG */
.social-link svg {
  width: 20px;
  height: 20px;
  display: block;
  fill: #1f2937; /* gris foncé élégant */
}

/* Instagram : vraie couleur */
.social-link.instagram svg {
  fill: #E1306C;
}

/* X : noir/gris officiel */
.social-link.twitter svg {
  fill: #111827;
}
.user-menu-toggle{
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.35);
  background:rgba(255,255,255,.10);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform .12s ease, background .12s ease, border-color .12s ease;
}
.user-menu-toggle:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.16);
  border-color:rgba(148,163,184,.55);
}
.user-icon{
  width:18px;
  height:18px;
  fill:#0f172a;
  opacity:.9;
  display:block;
}
/* =========================================
   Home : 3 colonnes avec classements sticky
   ========================================= */

.page-3cols{
  width: 100%;
  max-width: 1680px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr) 250px;
  gap: 14px;
  padding: 0 12px 36px;
}

/* on garde ton main habituel centré */
.page-3cols > main{
  max-width: 1100px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

/* Sidebars */
.side-card{
  position: sticky;
  top: 18px;
  background: #ffffff;
  border: 1px solid var(--border, rgba(148,163,184,.35));
  border-radius: 16px;
  padding: 10px 10px 6px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
}
.side-sub{
  display: none;
}

.side-hdr{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px 6px 12px;
  border-bottom: 1px solid rgba(148,163,184,.18);
  margin-bottom: 6px;
}

.side-hdr strong{
  font-weight: 400;   /* ❌ plus de gras */
  font-size: 15px;
  color: #0f172a;
}

.side-sub{ font-size: 12px; font-weight: 800; color:#64748b; }

/* Mini standings */
.side-standings{ padding: 4px 6px 8px; }

.side-row{
  display: grid;
  grid-template-columns: 22px 28px 1fr auto auto;
  gap: 8px;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid rgba(148,163,184,.12);
}
.side-row:last-child{ border-bottom: none; }

.side-rk{
  font-weight: 950;
  color: #334155;
  font-variant-numeric: tabular-nums;
}

.side-logo{
  width: 24px;
  height: 24px;
  object-fit: contain;
  display:block;
}

.side-name{
  font-weight: 900;
  color:#0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.side-wl{
  font-weight: 900;
  color:#334155;
  font-variant-numeric: tabular-nums;
}

.side-pct{
  font-weight: 900;
  color:#64748b;
  font-variant-numeric: tabular-nums;
}

.side-row:hover{
  cursor: pointer;
  opacity: .92;
}
/* Masque le nom long de l'équipe */
.side-name{
  display: none;
}
.side-tri{
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .04em;
  color: #0f172a;
}
/* Masque la colonne pourcentage */
.side-pct{
  display: none;
}
.side-row{
  grid-template-columns: 26px 32px 1fr auto; 
  /* rang | logo | TRI | V-D */
}
.side-wl{
  font-size: 13px;
  color: #475569;
}

.side-rk{
  font-size: 13px;
  color: #64748b;
}
/* Supprime le nom long */
.side-name{
  display: none;
}
.side-logo{
  width: 36px;
  height: 36px;
}

/* Responsive : on masque les côtés sur écrans moyens/petits */
@media (max-width: 1250px){
  .page-3cols{ display:block; max-width: 1120px; }
  .side{ display:none; }
  .page-3cols > main{ max-width: 1100px; margin: 0 auto; }
}
/* Ligne avec joueur français */
.side-row.has-fr{
  background: linear-gradient(
    90deg,
    rgba(0,85,164,0.08),   /* bleu */
    rgba(255,255,255,0.06),
    rgba(239,65,53,0.08)   /* rouge */
  );
  border-radius: 8px;
}

/* Un tout petit peu plus visible au hover */
.side-row.has-fr:hover{
  background: linear-gradient(
    90deg,
    rgba(0,85,164,0.14),
    rgba(255,255,255,0.10),
    rgba(239,65,53,0.14)
  );
}
.side-row.has-fr .side-tri{
  position: relative;
}

/* Chaque ligne doit remplir toute la largeur de la carte */
.side-row{
  width: 100%;
  display: grid;              /* ou flex si tu veux, mais grid = nickel */
  grid-template-columns: 22px 34px 44px 1fr; /* rk | logo | tri | wl */
  align-items: center;
  box-sizing: border-box;
}

/* Le surlignage/hover doit aller bord à bord */
.side-row{
  border-radius: 10px;        /* comme tu aimes */
}

/* (optionnel mais conseillé) : évite les “trous” visuels */
#sideStandingsWest, #sideStandingsEast{
  width: 100%;
}
/* =========================================================
   HOME ONLY : élargir le header + nav sur la page 3 colonnes
   ========================================================= */
.page-3cols header .banner,
.page-3cols .topbar-inner,
.page-3cols .nav-shell{
  max-width: 1560px;      /* même largeur que .page-3cols */
}

/* Le header interne doit aussi prendre toute la largeur */
.page-3cols .topbar-inner{
  width: 100%;
  justify-content: center;
}

/* Nav-card : ne pas rester “serré” */
.page-3cols .nav-card{
  max-width: 1076px;      /* le contenu de nav reste confortable */
  width: 100%;
  margin: 0 auto;
}

/* =========================================================
   Side standings : lignes bord à bord (fond + hover)
   ========================================================= */
.page-3cols .side-standings{
  padding: 0;             /* <- important : plus de marge interne */
}

.page-3cols .side-row{
  width: 100%;
  padding: 8px 10px;      /* <- padding horizontal pour que ça fasse “carte pleine” */
  margin: 0;              /* <- bord à bord */
  border-bottom: 1px solid rgba(148,163,184,.10);
  border-radius: 0;       /* <- sinon tu vois des “trous” entre les lignes */
}

.page-3cols .side-row:last-child{
  border-bottom: none;
}

/* Ton surlignage FR doit remplir toute la ligne */
.page-3cols .side-row.has-fr{
  border-radius: 0; /* bord à bord */
}

/* Hover bord à bord */
.page-3cols .side-row:hover{
  background: rgba(15,23,42,.03);
}

/* Option : séparer visuellement les blocs avec un léger arrondi global */
.page-3cols .side-card{
  overflow: hidden; /* <- fait “clip” des lignes aux coins de la carte */
}
/* ================================
   FIX Z-INDEX : dropdown au-dessus des sidebars
   ================================ */

/* La grille devient une référence */
.page-3cols{
  position: relative;
}

/* Colonne centrale au-dessus */
.page-3cols .center-col{
  position: relative;
  z-index: 50;
}

/* Sidebars en-dessous */
.page-3cols .side{
  position: relative;
  z-index: 10;
}

/* Et leurs cartes sticky aussi */
.page-3cols .side-card{
  position: sticky;
  z-index: 10;
}

.nav-card{
  flex-wrap: wrap;              /* ✅ autorise à passer à la ligne si besoin */
  row-gap: 8px;
  column-gap: 16px;
}

.main-tabs{
  flex: 1 1 520px;              /* ✅ peut rétrécir */
  min-width: 0;                 /* ✅ super important */
  flex-wrap: wrap;              /* ✅ si ça coince, les onglets passent ligne 2 */
  justify-content: center;
}

.social-links{
  flex: 0 0 auto;
}

.online-chip{
  flex: 0 0 auto;
}

.user-menu{
  flex: 0 0 auto;
  margin-left: auto;            /* ✅ garde le compte à droite */
}
.nav-shell{
  overflow: hidden; /* coupe tout micro débordement */
}
.nav-card{
  padding: 8px 16px;   /* 🔧 réduit un poil (au lieu de 20+) */
  gap: 14px;
}

.social-links{
  gap: 10px;           /* 🔧 réduit l’écart entre X / IG */
}

.user-menu{
  margin-left: 8px;    /* 🔧 évite le push excessif */
}
.nav-card{
  max-width: 1076px;
  box-sizing: border-box;
}
/* Le container nav : 1100 AU TOTAL (padding inclus) */
.nav-shell{
  max-width: 1100px;
  margin: 8px auto 0;
  padding: 0 12px;
  box-sizing: border-box; /* ✅ clé */
  width: 100%;
}

/* La carte : prend toute la largeur utile (donc 1076) */
.nav-card{
  width: 100%;
  box-sizing: border-box;
}
/* 🔒 Verrouille la largeur nav sur TOUTES les pages */
.nav-shell{
  width: 100%;
  max-width: 1100px;
  padding: 0 12px;
  box-sizing: border-box !important;
}

.nav-card{
  width: 100%;
  box-sizing: border-box;
}
header.topbar {
  position: relative;
  z-index: 1000;
}
.user-menu {
  position: relative;
  z-index: 1100;
}

.user-menu-dropdown {
  position: absolute;
  z-index: 1200;
}
header.topbar {
  position: sticky;
  top: 0;
  z-index: 9999;
  isolation: isolate;
}
header.topbar { position: relative; z-index: 1000; isolation: isolate; }
.user-menu { position: relative; z-index: 1100; }
.user-menu-dropdown { position: absolute; z-index: 1200; }
/* =========================================================
   FIX MENU COMPTE (dropdown derrière / non cliquable)
   À COLLER TOUT EN BAS de styles.css
   ========================================================= */

/* 1) Le header doit dominer toute la page */
header.topbar{
  position: sticky;
  top: 0;
  z-index: 100000;          /* très haut */
  isolation: isolate;       /* stacking context propre */
}

/* 2) Sur la home 3 colonnes : la colonne centrale au-dessus des sides */
.page-3cols{ position: relative; z-index: 0; }
.page-3cols .center-col{ position: relative; z-index: 10; }
.page-3cols .side{ position: relative; z-index: 1; }

/* 3) IMPORTANT : pas de clipping pour laisser sortir le dropdown */
.nav-shell,
.nav-card{
  overflow: visible !important;
}

/* 4) Dropdown au-dessus de tout ce qui est dans la colonne */
.user-menu{ position: relative; z-index: 100001; }
.user-menu-dropdown{
  z-index: 100002;
}

/* 5) (optionnel mais recommandé) ouverture via classe plutôt que hover */
.user-menu.is-open .user-menu-dropdown{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
/* === FIX: le header NE DOIT PAS être sticky (seuls les classements) === */
header.topbar{
  position: static !important; /* ou relative */
  top: auto !important;
}