@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;700;800;900&family=Barlow:wght@400;500;600&family=Montserrat:wght@600;700;800&display=swap');

:root {
  --gnvb-navy:   #09152a;
  --gnvb-mid:    #0f2240;
  --gnvb-blue:   #1a3a6b;
  --gnvb-orange: #f05a1a;
  --gnvb-ora2:   #ff7a3d;
  --gnvb-white:  #ffffff;
  --gnvb-grey:   #8a9bb5;
  --gnvb-glght:  #c8d4e8;
  --gnvb-card:   #0d1e38;
  --gnvb-bdr:    rgba(255,255,255,.07);
  --gnvb-green:  #3ec97a;
  --gnvb-red:    #f04444;
}

.gnvb-widget {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  background: var(--gnvb-navy);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 32px 90px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.05);
  font-family: 'Barlow', sans-serif;
  color: var(--gnvb-white);
}

/* Desktop : 100% pleine largeur */
.gnvb-widget {
  width: 100%;
  max-width: 100%;
  border-radius: 18px;
}
/* Tablette : conserve la taille actuelle */
@media (max-width: 1024px) and (min-width: 601px) {
  .gnvb-widget {
    max-width: 100%;
    border-radius: 14px;
  }
}
/* Mobile : pleine largeur, coins réduits */
@media (max-width: 600px) {
  .gnvb-widget {
    max-width: 100%;
    border-radius: 10px;
  }
}
/* Montserrat pour tous les éléments en gras / titres */
.gnvb-widget strong,
.gnvb-widget b,
.gnvb-wh-text h2,
.gnvb-mbadge,
.gnvb-vs,
.gnvb-tname,
.gnvb-mrow-teams em,
.gnvb-cdn,
.gnvb-scr,
.gnvb-rk-name,
.gnvb-rk-name.gnvb-me,
.gnvb-bval,
.gnvb-blbl,
.gnvb-tab,
.gnvb-tab.gnvb-on,
.gnvb-rk-pts,
.gnvb-rk-pos,
.gnvb-mday,
.gnvb-badge,
.gnvb-mtime,
.gnvb-cdlabel {
  font-family: 'Montserrat', sans-serif;
}


/* HEADER */
.gnvb-wh {
  background: linear-gradient(140deg, #0a1e3d 0%, #1c3f78 100%);
  padding: 16px 20px 14px;
  display: flex; align-items: center; gap: 14px;
  border-bottom: 2.5px solid var(--gnvb-orange);
  position: relative; overflow: hidden;
}
.gnvb-wh::after {
  content: ''; position: absolute; right: -30px; top: -30px;
  width: 160px; height: 160px;
  background: radial-gradient(circle, rgba(240,90,26,.18) 0%, transparent 65%);
  pointer-events: none;
}
.gnvb-logo-box {
  width: 44px; height: 44px; border-radius: 9px;
  background: var(--gnvb-orange); flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 900; font-size: 13px; color: #fff;
  line-height: 1.1; text-align: center;
}
.gnvb-wh-text h2 {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 800; font-size: 19px;
  letter-spacing: .4px; text-transform: uppercase;
  margin: 0; padding: 0; border: none; color: var(--gnvb-white);
}
.gnvb-wh-text span {
  font-size: 11px; color: var(--gnvb-grey);
  letter-spacing: 1.2px; text-transform: uppercase; font-weight: 500;
}
.gnvb-live-pill {
  margin-left: auto;
  display: flex; align-items: center; gap: 5px;
  font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--gnvb-green);
  background: rgba(62,201,122,.1); border: 1px solid rgba(62,201,122,.25);
  border-radius: 20px; padding: 4px 9px;
}
.gnvb-pulse {
  width: 7px; height: 7px; background: var(--gnvb-green);
  border-radius: 50%; animation: gnvb-blink 1.6s infinite;
}
@keyframes gnvb-blink { 0%,100%{opacity:1} 50%{opacity:.3} }

/* TABS */
.gnvb-tabs { display: flex; background: var(--gnvb-mid); border-bottom: 1px solid var(--gnvb-bdr); }
.gnvb-tab {
  flex: 1; padding: 11px 4px; text-align: center; cursor: pointer;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700; font-size: 12px; letter-spacing: .8px; text-transform: uppercase;
  color: var(--gnvb-grey); border-bottom: 2px solid transparent;
  transition: all .2s; user-select: none;
}
.gnvb-tab.gnvb-on { color: var(--gnvb-orange); border-bottom-color: var(--gnvb-orange); background: rgba(240,90,26,.06); }
.gnvb-tab:hover:not(.gnvb-on) { color: var(--gnvb-glght); }
.gnvb-panel { display: none; } .gnvb-panel.gnvb-on { display: block; }

/* LOADING / ERROR */
.gnvb-state { padding: 38px 20px; text-align: center; }
.gnvb-spinner {
  width: 30px; height: 30px; margin: 0 auto 14px;
  border: 3px solid rgba(240,90,26,.2); border-top-color: var(--gnvb-orange);
  border-radius: 50%; animation: gnvb-spin .75s linear infinite;
}
@keyframes gnvb-spin { to { transform: rotate(360deg); } }
.gnvb-state-msg { font-size: 13px; color: var(--gnvb-grey); line-height: 1.6; }
.gnvb-state-sub { font-size: 11px; color: rgba(138,155,181,.4); margin-top: 6px; }
.gnvb-retry {
  margin-top: 14px; padding: 8px 18px; border-radius: 8px; cursor: pointer;
  background: rgba(240,90,26,.12); border: 1px solid rgba(240,90,26,.3);
  color: var(--gnvb-orange);
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 13px;
  transition: background .2s;
}
.gnvb-retry:hover { background: rgba(240,90,26,.25); }

/* PROCHAIN MATCH */
.gnvb-next-wrap { padding: 20px; }
.gnvb-mbadge {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(240,90,26,.1); border: 1px solid rgba(240,90,26,.28);
  border-radius: 20px; padding: 4px 10px; margin-bottom: 16px;
  font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--gnvb-orange);
}
.gnvb-matchup { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 16px; }
.gnvb-team { flex: 1; text-align: center; }
.gnvb-tlogo {
  width: 54px; height: 54px; border-radius: 11px; margin: 0 auto 8px;
  overflow: hidden; display: flex; align-items: center; justify-content: center;
}
.gnvb-tlogo img { width: 100%; height: 100%; object-fit: contain; }
.gnvb-tlogo.gnvb-home { background: var(--gnvb-orange); }
.gnvb-tlogo.gnvb-away { background: var(--gnvb-blue); border: 1px solid rgba(255,255,255,.1); }
.gnvb-tlogo.gnvb-fb { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 13px; }
.gnvb-tname { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 15px; text-transform: uppercase; }
.gnvb-tsub { font-size: 11px; color: var(--gnvb-grey); margin-top: 2px; }
.gnvb-vs-col { text-align: center; flex-shrink: 0; }
.gnvb-vs { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 26px; color: rgba(255,255,255,.12); display: block; }
.gnvb-mdate { font-size: 12px; color: var(--gnvb-grey); margin-top: 4px; }
.gnvb-mtime { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 17px; margin-top: 2px; }
.gnvb-venue {
  display: flex; align-items: center; gap: 7px;
  font-size: 12px; color: var(--gnvb-grey);
  background: rgba(255,255,255,.04); border-radius: 8px;
  padding: 8px 13px; margin-bottom: 18px;
}
.gnvb-cdlabel { font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--gnvb-grey); text-align: center; margin-bottom: 10px; }
.gnvb-cd { display: flex; justify-content: center; gap: 8px; margin-bottom: 18px; }
.gnvb-cdb {
  flex: 1; max-width: 80px;
  background: var(--gnvb-card); border: 1px solid var(--gnvb-bdr);
  border-radius: 11px; padding: 10px 6px; text-align: center;
}
.gnvb-cdb.gnvb-tick { animation: gnvb-tflash .3s ease-out; }
@keyframes gnvb-tflash { 0%{border-color:rgba(240,90,26,.55)} 100%{border-color:var(--gnvb-bdr)} }
.gnvb-cdn { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 33px; line-height: 1; display: block; }
.gnvb-cdu { font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--gnvb-grey); margin-top: 4px; display: block; }
.gnvb-btn-tk {
  display: block; width: 100%;
  background: var(--gnvb-orange); color: #fff !important;
  text-align: center; padding: 13px; border-radius: 10px; text-decoration: none !important;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 15px;
  letter-spacing: 1px; text-transform: uppercase;
  transition: background .2s, transform .1s; border: none; cursor: pointer;
}
.gnvb-btn-tk:hover { background: var(--gnvb-ora2) !important; transform: translateY(-1px); }

/* MATCH ROWS */
.gnvb-mlist { list-style: none; margin: 0; padding: 0; }
.gnvb-mrow {
  display: flex; align-items: center; padding: 11px 20px;
  border-bottom: 1px solid var(--gnvb-bdr); gap: 12px; transition: background .15s;
}
.gnvb-mrow:last-child { border-bottom: none; }
.gnvb-mrow:hover { background: rgba(255,255,255,.025); }
.gnvb-mrow.gnvb-hl { background: rgba(240,90,26,.07); border-left: 3px solid var(--gnvb-orange); }
.gnvb-mdate-col { text-align: center; min-width: 38px; flex-shrink: 0; }
.gnvb-mday { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 22px; line-height: 1; }
.gnvb-mmo { font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--gnvb-grey); margin-top: 1px; }
.gnvb-msep { width: 1px; height: 34px; background: var(--gnvb-bdr); flex-shrink: 0; }
.gnvb-minfo { flex: 1; min-width: 0; }
.gnvb-mrow-teams {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 14px;
  text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gnvb-mrow-teams em { font-style: normal; color: var(--gnvb-orange); }
.gnvb-mrow-sub { font-size: 11px; color: var(--gnvb-grey); margin-top: 2px; }
.gnvb-mright { flex-shrink: 0; text-align: right; }
.gnvb-badge {
  display: inline-block; padding: 3px 8px; border-radius: 5px;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 12px;
  letter-spacing: .4px; text-transform: uppercase;
}
.gnvb-bwin  { background: rgba(62,201,122,.14); color: var(--gnvb-green); border: 1px solid rgba(62,201,122,.28); }
.gnvb-bloss { background: rgba(240,68,68,.12);  color: var(--gnvb-red);   border: 1px solid rgba(240,68,68,.22); }
.gnvb-bnext { background: var(--gnvb-orange); color: #fff; }
.gnvb-bahead { background: rgba(240,90,26,.1); color: var(--gnvb-orange); border: 1px solid rgba(240,90,26,.22); }
.gnvb-scr { font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 17px; margin-bottom: 2px; }

/* BILAN */
.gnvb-bilan { display: flex; padding: 13px 20px; border-bottom: 1px solid var(--gnvb-bdr); }
.gnvb-bstat { flex: 1; text-align: center; border-right: 1px solid var(--gnvb-bdr); }
.gnvb-bstat:last-child { border-right: none; }
.gnvb-bval { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 27px; line-height: 1; }
.gnvb-blbl { font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--gnvb-grey); margin-top: 3px; }

/* CLASSEMENT */
.gnvb-rk-head {
  display: flex; padding: 7px 20px;
  font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--gnvb-grey); border-bottom: 1px solid var(--gnvb-bdr);
  justify-content: space-between;
}
.gnvb-rk-row {
  display: flex; align-items: center; padding: 9px 16px;
  border-bottom: 1px solid var(--gnvb-bdr); gap: 10px; transition: background .15s;
}
.gnvb-rk-row:last-child { border-bottom: none; }
.gnvb-rk-row:hover { background: rgba(255,255,255,.025); }
.gnvb-rk-row.gnvb-me { background: rgba(240,90,26,.08); border-left: 3px solid var(--gnvb-orange); }
.gnvb-rk-pos { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 17px; min-width: 22px; text-align: center; color: var(--gnvb-glght); }
.gnvb-rk-pos.gnvb-top { color: var(--gnvb-orange); }
.gnvb-rk-logo { width: 26px; height: 26px; flex-shrink: 0; object-fit: contain; }
.gnvb-rk-name { flex: 1; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 14px; text-transform: uppercase; }
.gnvb-rk-name.gnvb-me { color: var(--gnvb-orange); }
.gnvb-rk-j { font-size: 11px; color: var(--gnvb-grey); min-width: 22px; text-align: right; }
.gnvb-rk-pts { font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 15px; min-width: 28px; text-align: right; }

/* FOOTER */
.gnvb-foot {
  padding: 9px 20px; display: flex; align-items: center; justify-content: space-between;
  border-top: 1px solid var(--gnvb-bdr); background: rgba(0,0,0,.2);
}
.gnvb-foot-l { font-size: 11px; color: var(--gnvb-grey); }
.gnvb-foot-l strong { color: var(--gnvb-orange); }
.gnvb-foot-r { display: flex; align-items: center; gap: 6px; }
.gnvb-src { font-size: 10px; color: rgba(138,155,181,.4); }
.gnvb-upd {
  background: none; border: none; cursor: pointer;
  font-size: 10px; color: var(--gnvb-grey);
  display: flex; align-items: center; gap: 3px;
  padding: 4px 7px; border-radius: 5px; transition: all .2s;
}
.gnvb-upd:hover { color: var(--gnvb-orange); background: rgba(240,90,26,.08); }
.gnvb-upd.gnvb-spin svg { animation: gnvb-spin .7s linear infinite; }


/* ── Police Montserrat pour les éléments en gras ─────────── */
.gnvb-widget strong,
.gnvb-widget b,
.gnvb-widget h2,
.gnvb-widget .gnvb-vs,
.gnvb-widget .gnvb-mtime,
.gnvb-widget .gnvb-cdn,
.gnvb-widget .gnvb-scr,
.gnvb-widget .gnvb-rk-pts,
.gnvb-widget .gnvb-bval,
.gnvb-widget .gnvb-tname,
.gnvb-widget .gnvb-foot-l strong {
  font-family: 'Montserrat', 'Barlow Condensed', sans-serif;
  font-weight: 700;
}