/* ============================================================
unibet-lp-pronostics.css
Feuille commune aux LP "Cotes & Pronostics" Unibet :
- hub Ligue des Champions
- pages match (ex. Slavia Prague - Lens)
Tout est prefixe par .unibet-match-page (racine de chaque LP),
sauf le bloc psel fourni par Unibet, qui cible volontairement
le layout du site.
============================================================ */
/* ============================================================
Integration layout psel (fourni par l'equipe Unibet, tel quel)
============================================================ */
psel-generated-page .psel-layout__main-content>h1,
psel-generated-page .psel-layout__main-content>.psel-breadcrumb {
display: none !important;
}
psel-generated-page .psel-layout__main-content--full {
max-width: none !important;
}
.generic-page-content .psel-layout__main-content--full>div {
padding: 0 !important;
}
@font-face {
font-family: psel-oswald;
src: url(https://www.unibet.fr/fonts/oswald-regular.woff2) format('woff2'), url(https://www.unibet.fr/fonts/oswald-regular.woff) format('woff');
font-weight: 400;
font-size: normal;
}
@font-face{font-display:swap;font-family:"Unibet-ExtraBold";font-weight:700 800;src:url("https://www.unibet.fr/fonts/Unibet-ExtraBold.woff2") format("woff2")}
@font-face{font-display:swap;font-family:"Unibet-Black";font-weight:900;src:url("https://www.unibet.fr/fonts/Unibet-Black.woff2") format("woff2")}
@font-face{font-display:swap;font-family:"Unibet-Cotes-Bold";font-weight:700;src:url("https://www.unibet.fr/fonts/UnibetCotes-Bold.woff2") format("woff2")}
.unibet-match-page{
color-scheme:light;
/* --- tokens officiels Unibet --- */
--background_ternary:#f2f0f0; /* fond de page */
--background_primary:#ffffff; /* surfaces */
--background_secondary:#e4e4e4; /* barre d'onglets */
--background_quaternary:#eeeeee;
--background_header:#000b06; /* bandeau header */
--background_button:#fee71d; /* CTA jaune */
--background_button_hover:#f4dc12;
--background_cotes:#299b59; /* bouton de cote */
--background_cotes_hover:#54af7a;
--background_win:#e7ffef;
--background_fail:#ffd5de;
--content_primary:#020a05; /* noir Unibet */
--content_white:#ffffff;
--content_grey_warm:#45474c; /* texte courant */
--content_grey_cold:#a4a4a4; /* texte secondaire */
--content_indicator:#147b44;
--content_win:#147B44;
--content_lose:#fe2e5b;
--content_secondary:#ffe71f; /* jaune Unibet */
--surface:var(--background_primary);
--ground:var(--background_ternary);
--rubric:var(--content_primary);
--text:var(--content_grey_warm);
--text-strong:var(--content_primary);
--muted:#6E7278;
--border:#e0e0e0;
--border-soft:#ececec;
--away:#E8C300; /* jaune assombri, lisible sur blanc */
--shadow:0 .0625rem .1875rem rgba(0,38,90,.1);
--font-body:"Roboto",Arial,Helvetica,sans-serif;
--font-heading:"Unibet-ExtraBold","Roboto",Arial,sans-serif;
--font-cote:"Unibet-Cotes-Bold","Roboto",Arial,sans-serif;
--r-surface:.5rem; /* 8px : cartes */
--r-pill:.375rem; /* 6px : cotes */
--r-btn:.25rem; /* 4px : boutons */
--gut:clamp(12px,2.4vw,20px);
--ease:cubic-bezier(.22,.61,.36,1);
--filet:rgba(255,255,255,.22);
}
.unibet-match-page *{margin:0;padding:0;box-sizing:border-box}
.unibet-match-page h1,.unibet-match-page h2,.unibet-match-page h3,.unibet-match-page p,.unibet-match-page ul,.unibet-match-page ol,.unibet-match-page li,.unibet-match-page dl,.unibet-match-page dt,.unibet-match-page dd,.unibet-match-page table,.unibet-match-page thead,.unibet-match-page tbody,.unibet-match-page tr,.unibet-match-page th,.unibet-match-page td,.unibet-match-page nav,.unibet-match-page section,.unibet-match-page aside,.unibet-match-page article,.unibet-match-page time,.unibet-match-page i,.unibet-match-page b,.unibet-match-page strong,.unibet-match-page span,.unibet-match-page div{background:transparent;border:0;font-style:normal;text-align:inherit}
.unibet-match-page ul,.unibet-match-page ol{list-style:none}
.unibet-match-page table{border-collapse:collapse;width:auto}
.unibet-match-page a{text-decoration:none}
.unibet-match-page i{font-style:italic}
html:has(.unibet-match-page){scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html:has(.unibet-match-page){scroll-behavior:auto}.unibet-match-page *{animation:none!important;transition:none!important}}
.unibet-match-page{
background:var(--ground);
color:var(--text);
font-family:var(--font-body);
font-size:.875rem;
line-height:1.55;
-webkit-font-smoothing:antialiased;
}
.unibet-match-page a{color:inherit}
.unibet-match-page img{max-width:100%}
.unibet-match-page :focus-visible{outline:.1875rem solid var(--content_indicator);outline-offset:.125rem;border-radius:.25rem}
.unibet-match-page .container{max-width:80rem;margin:0 auto;padding-inline:var(--gut)}
/* ---------- 1. Bandeau header (psel-header__container) ---------- */
.unibet-match-page .topbar{background:var(--background_header);color:var(--content_white)}
.unibet-match-page .topbar__inner{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding-block:.5rem}
.unibet-match-page .fil-ariane ol{display:flex;flex-wrap:wrap;gap:.375rem;list-style:none;font-size:.75rem;color:#9aa39e}
.unibet-match-page .fil-ariane li+li::before{content:"›";margin-right:.375rem;color:#4a5450}
.unibet-match-page .fil-ariane a{text-decoration:none}
.unibet-match-page .fil-ariane a:hover{color:#fff;text-decoration:underline}
.unibet-match-page .topbar__meta{display:flex;align-items:center;gap:.5rem;font-size:.75rem;font-weight:600;color:#9aa39e}
.unibet-match-page .topbar__meta strong{color:#fff}
/* ---------- 2. Bloc match ---------- */
.unibet-match-page .match-hero{
position:relative;isolation:isolate;overflow:hidden;
padding-block:1rem;background:var(--background_header);
}
/* la photo reste une balise img : posee en couche de fond, filtree */
.unibet-match-page .match-hero .image-coupee-top{
position:absolute;inset:0;z-index:-2;
width:100%;height:100%;object-fit:cover;object-position:center 38%;
filter:grayscale(.2) brightness(.62) saturate(1.05);
}
.unibet-match-page .match-hero::after{
content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
background:linear-gradient(180deg,rgba(0,11,6,.35) 0%,rgba(0,11,6,.72) 55%,rgba(0,11,6,.92) 100%);
}
.unibet-match-page .match-hero .hero-main,.unibet-match-page .match-hero .hero-aside{
background:rgba(0,11,6,.68);border:.0625rem solid rgba(255,255,255,.16);
-webkit-backdrop-filter:blur(.375rem);backdrop-filter:blur(.375rem);box-shadow:none;
}
.unibet-match-page .match-hero .match-intro{color:#cfdcd6}
.unibet-match-page .match-hero .match-intro strong{color:#fff}
.unibet-match-page .match-hero .fil-ariane--page ol{color:#9fbaac}
.unibet-match-page .match-hero .fil-ariane--page li:last-child{color:#fff}
.unibet-match-page .match-hero .fil-ariane--page li+li::before{color:#5c7a6c}
.unibet-match-page .match-hero .fil-ariane--page a:hover{color:#fff}
.unibet-match-page .match-hero .match-card{background:rgba(0,0,0,.5);border:.0625rem solid rgba(255,255,255,.16)}
.unibet-match-page .match-hero .hero-aside h2{color:#fff}
.unibet-match-page .match-hero .problegend li{color:#cfdcd6}
.unibet-match-page .match-hero .problegend .pc{color:#fff}
.unibet-match-page .match-hero .probsplit{background:rgba(255,255,255,.16)}
.unibet-match-page .hero-grid{display:flex;flex-wrap:wrap;gap:.75rem;align-items:flex-start}
.unibet-match-page .hero-grid>*{flex:1 1 26rem;min-width:0}
.unibet-match-page .hero-grid>*+*{flex:1 1 16rem}
.unibet-match-page .hero-main{background:var(--surface);border-radius:var(--r-surface);box-shadow:var(--shadow);padding:1rem}
.unibet-match-page .fil-ariane--page{margin-bottom:.625rem}
.unibet-match-page .fil-ariane--page ol{color:var(--muted);font-size:.75rem}
.unibet-match-page .fil-ariane--page li+li::before{color:var(--content_grey_cold)}
.unibet-match-page .fil-ariane--page li:last-child{font-weight:600;color:var(--text-strong)}
.unibet-match-page .fil-ariane--page a:hover{color:var(--text-strong)}
.unibet-match-page .match-hero h1{
font-family:var(--font-heading);font-weight:800;
font-size:clamp(1.5rem,3vw,2rem);line-height:1.12;
color:#fff;text-wrap:balance;margin-bottom:.5rem;
}
.unibet-match-page .match-intro{font-size:.875rem}
.unibet-match-page .match-intro strong{font-weight:700;color:var(--text-strong)}
.unibet-match-page .match-card{
display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;
background:var(--background_header);border-radius:var(--r-surface);
overflow:hidden;margin-top:.875rem;color:#fff;
}
.unibet-match-page .team-card{padding:.875rem 1rem;display:flex;flex-direction:column;justify-content:center;min-width:0}
.unibet-match-page .team-card:last-child{text-align:right;align-items:flex-end}
.unibet-match-page .team-name{font-family:var(--font-heading);font-weight:800;font-size:clamp(1rem,2.4vw,1.375rem);line-height:1.15}
.unibet-match-page .match-center-card{
display:flex;flex-direction:column;align-items:center;justify-content:center;
padding:.75rem 1rem;background:rgba(255,255,255,.06);
}
.unibet-match-page .match-versus{font-family:var(--font-heading);font-weight:800;font-size:1rem;color:var(--content_secondary)}
.unibet-match-page .match-date{font-size:.6875rem;font-weight:600;color:#8a948f}
/* ---------- Boutons ---------- */
.unibet-match-page .cta-btn,.unibet-match-page .btn{
display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
font-family:var(--font-body);font-size:.875rem;font-weight:700;
text-decoration:none;border:.0625rem solid var(--background_button);
background:var(--background_button);color:var(--content_primary);
padding:.625rem 1rem;border-radius:var(--r-btn);min-height:2.5rem;
transition:background-color .12s ease;
}
.unibet-match-page .cta-btn:hover,.unibet-match-page .btn:hover{background:var(--background_button_hover);border-color:var(--background_button_hover)}
.unibet-match-page .cta-btn--hero{margin-top:.875rem}
.unibet-match-page .cta-btn--block{width:100%}
/* CTA compact dans les tableaux */
.unibet-match-page .cta-bet-mini{
display:inline-flex;align-items:center;justify-content:center;
min-height:1.75rem;padding:.25rem .75rem;white-space:nowrap;text-decoration:none;
background:var(--background_button);color:var(--content_primary);
border:.0625rem solid var(--background_button);border-radius:var(--r-btn);
font-size:.75rem;font-weight:700;
transition:background-color .12s ease;
}
.unibet-match-page .cta-bet-mini:hover{background:var(--background_button_hover);border-color:var(--background_button_hover)}
/* bouton de cote (psel-outcome) — seul élément vert */
.unibet-match-page .odds-value{
display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
min-height:2rem;min-width:4rem;padding:.25rem .625rem;
background:var(--background_cotes);color:var(--content_white);
border:0;border-radius:var(--r-pill);text-decoration:none;
font-family:var(--font-cote);font-weight:700;font-size:.875rem;
font-variant-numeric:tabular-nums;
}
.unibet-match-page .odds-value:hover{background:var(--background_cotes_hover)}
/* cote chaude : favori du marche */
.unibet-match-page .odds-value--hot{
position:relative;overflow:visible;
box-shadow:0 0 0 .0625rem rgba(255,126,2,.55),0 0 .5rem rgba(255,126,2,.35);
}
/* corps de la flamme : carre a trois coins arrondis, pointe en haut */
.unibet-match-page .odds-value--hot::after{
content:"";position:absolute;top:-.5625rem;right:-.375rem;
width:.9375rem;height:.9375rem;
background:linear-gradient(200deg,#ffd76b 0%,#ff9e1b 45%,#ff5b00 100%);
border-radius:0 50% 50% 50%;transform:rotate(45deg);transform-origin:50% 70%;
box-shadow:0 0 .5rem rgba(255,91,0,.75);
animation:flamme 1.05s ease-in-out infinite;
}
/* coeur clair */
.unibet-match-page .odds-value--hot::before{
content:"";position:absolute;top:-.1875rem;right:-.0625rem;
width:.4375rem;height:.4375rem;z-index:1;
background:linear-gradient(200deg,#fffbe0,var(--background_button));
border-radius:0 50% 50% 50%;transform:rotate(45deg);transform-origin:50% 70%;
animation:flamme 1.05s ease-in-out infinite .12s;
}
@keyframes flamme{
0%,100%{transform:rotate(45deg) scaleY(1) scaleX(1)}
35%{transform:rotate(45deg) scaleY(1.28) scaleX(.9)}
60%{transform:rotate(45deg) scaleY(.94) scaleX(1.08)}
80%{transform:rotate(45deg) scaleY(1.1) scaleX(.97)}
}
/* ---------- Tableau des buteurs du match ---------- */
.unibet-match-page .rank-cell{
display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:var(--r-btn);
background:var(--background_quaternary);color:var(--text-strong);
font-family:var(--font-cote);font-weight:700;font-size:.75rem;font-variant-numeric:tabular-nums;
}
.unibet-match-page .seo-table tr.is-favorite .rank-cell{background:var(--content_primary);color:var(--content_secondary)}
.unibet-match-page .club{font-size:.75rem;color:var(--muted)}
/* ---------- 3. Onglets (psel-tabs) ---------- */
.unibet-match-page .anchor-nav{position:sticky;top:0;z-index:40;background:var(--background_secondary)}
.unibet-match-page .anchor-nav ul{display:flex;gap:0;list-style:none;overflow-x:auto;scrollbar-width:thin;position:relative}
.unibet-match-page .anchor-nav a{
display:flex;align-items:center;white-space:nowrap;text-decoration:none;
font-size:.75rem;font-weight:600;color:var(--muted);
height:3rem;padding-inline:.75rem;border-bottom:.25rem solid transparent;
}
.unibet-match-page .anchor-nav a:hover{color:var(--text-strong);border-bottom-color:var(--content_indicator)}
/* ---------- 4. Panneaux ---------- */
.unibet-match-page .lp-main{padding-block:.75rem 1.5rem}
.unibet-match-page .grid{display:grid;gap:.75rem}
.unibet-match-page .grid--2{grid-template-columns:repeat(auto-fit,minmax(20rem,1fr))}
.unibet-match-page .grid--main{display:flex;flex-wrap:wrap;gap:.75rem;align-items:flex-start}
.unibet-match-page .grid--main>*{flex:1 1 26rem;min-width:0}
.unibet-match-page .grid--main>*+*{flex:1 1 16rem}
.unibet-match-page .section{scroll-margin-top:3.25rem;margin-bottom:1.25rem}
/* titre de section = psel-title-rubric */
.unibet-match-page .section > h2{
display:flex;align-items:center;gap:.5rem;
background:var(--rubric);color:var(--content_white);
border-radius:var(--r-surface);min-height:2.5rem;padding:.5rem .75rem;
font-family:var(--font-heading);font-weight:800;font-size:clamp(.9375rem,1.6vw,1.125rem);
line-height:1.2;margin-bottom:.75rem;text-wrap:balance;
}
.unibet-match-page .panel{background:var(--surface);border-radius:var(--r-surface);box-shadow:var(--shadow);overflow:hidden}
.unibet-match-page .panel__head{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;border-bottom:.0625rem solid var(--border-soft)}
.unibet-match-page .panel__head h3,.unibet-match-page .panel__head h2{font-family:var(--font-heading);font-size:.875rem;font-weight:800;color:var(--text-strong);margin:0}
.unibet-match-page .panel__head h3::before,.unibet-match-page .panel__head h2::before{display:none}
.unibet-match-page .panel__hint{font-size:.6875rem;font-weight:600;color:var(--content_grey_cold)}
.unibet-match-page .panel__body{padding:.75rem}
.unibet-match-page .panel__body--flush{padding:0}
.unibet-match-page .panel__foot{padding:.75rem;border-top:.0625rem solid var(--border-soft)}
/* tableaux */
.unibet-match-page .table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}
.unibet-match-page .seo-table{width:100%;border-collapse:collapse;font-size:.8125rem}
.unibet-match-page .seo-table th{
text-align:left;font-size:.6875rem;font-weight:600;color:var(--muted);
padding:.5rem .75rem;border-bottom:.0625rem solid var(--border);white-space:nowrap;
}
.unibet-match-page .seo-table td{padding:.5rem .75rem;border-bottom:.0625rem solid var(--border-soft);vertical-align:middle;color:var(--text)}
.unibet-match-page .seo-table tbody tr:last-child td{border-bottom:0}
.unibet-match-page .seo-table tbody tr:hover{background:var(--background_quaternary)}
.unibet-match-page .seo-table .num{font-variant-numeric:tabular-nums;white-space:nowrap}
.unibet-match-page .seo-table .lbl{font-weight:600;color:var(--text-strong)}
.unibet-match-page .seo-table td.sc{white-space:nowrap}
.unibet-match-page .seo-table td.sc .num{display:inline-block;margin-left:.25rem;font-weight:700;color:var(--text-strong)}
/* barre de répartition en cellule (psel-progress-bar) */
.unibet-match-page .probcell{display:flex;align-items:center;gap:.5rem;min-width:9rem}
.unibet-match-page .probcell .bar{flex:1 1 auto;height:.375rem;border-radius:2.5rem;background:var(--background_quaternary);overflow:hidden}
.unibet-match-page .probcell .bar i{display:block;height:100%;background:var(--background_cotes);border-radius:2.5rem}
.unibet-match-page .probcell .bar i.is-draw{background:var(--content_grey_cold)}
.unibet-match-page .probcell .bar i.is-away{background:var(--away)}
.unibet-match-page .probcell .pc{font-weight:700;font-variant-numeric:tabular-nums;min-width:2.125rem;text-align:right;color:var(--text-strong)}
/* liste label / valeur */
.unibet-match-page .kv{list-style:none}
.unibet-match-page .kv li{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem;padding:.5rem 0;border-bottom:.0625rem solid var(--border-soft)}
.unibet-match-page .kv li:last-child{border-bottom:0}
.unibet-match-page .kv span{font-size:.75rem;color:var(--muted)}
.unibet-match-page .kv strong{font-weight:700;font-size:.8125rem;text-align:right;color:var(--text-strong)}
/* encart répartition */
.unibet-match-page .hero-aside{background:var(--surface);border-radius:var(--r-surface);box-shadow:var(--shadow);padding:.75rem}
.unibet-match-page .hero-aside h2{font-family:var(--font-heading);font-size:.875rem;font-weight:800;color:var(--text-strong);margin-bottom:.75rem}
.unibet-match-page .hero-aside h2::before{display:none}
.unibet-match-page .probsplit{display:flex;height:.5rem;border-radius:2.5rem;overflow:hidden;background:var(--background_quaternary)}
.unibet-match-page .probsplit span{display:block}
.unibet-match-page .probsplit .p-home{background:var(--background_cotes)}
.unibet-match-page .probsplit .p-draw{background:var(--content_grey_cold)}
.unibet-match-page .probsplit .p-away{background:var(--away)}
.unibet-match-page .problegend{list-style:none;margin-top:.75rem;display:grid;gap:.5rem}
.unibet-match-page .problegend li{display:flex;align-items:center;gap:.5rem;font-size:.8125rem}
.unibet-match-page .problegend .nm{flex:1 1 auto;min-width:0}
.unibet-match-page .problegend .pc{font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-strong)}
.unibet-match-page .problegend .od{
font-family:var(--font-cote);font-weight:700;font-size:.8125rem;font-variant-numeric:tabular-nums;
background:var(--background_cotes);color:#fff;border-radius:var(--r-pill);
padding:.125rem .5rem;min-width:3rem;text-align:center;
}
/* ---------- Terrain / compositions ----------
Par defaut : terrain horizontal (desktop).
Sous 820px : bascule a la verticale.
*/
.unibet-match-page .pitch__teams{display:flex;flex-wrap:wrap;gap:.125rem;margin:0 auto .5rem;width:100%;max-width:48rem}
.unibet-match-page .pitch__team{
flex:1 1 14rem;display:flex;align-items:center;justify-content:center;gap:.5rem;
flex-wrap:nowrap;white-space:nowrap;min-width:0;
font-family:var(--font-heading);font-weight:800;font-size:.875rem;color:var(--text-strong);
}
.unibet-match-page .pitch__formation{
font-family:var(--font-cote);font-weight:700;font-size:.75rem;font-variant-numeric:tabular-nums;
color:var(--text-strong);background:var(--background_quaternary);
border-radius:var(--r-btn);padding:.125rem .375rem;
}
.unibet-match-page .pitch{
position:relative;display:flex;gap:.125rem;
background:#002314;border-radius:var(--r-surface);padding:.5rem;
width:100%;max-width:48rem;margin-left:auto;margin-right:auto;
aspect-ratio:105/68;min-height:22rem;
}
.unibet-match-page .pitch::before,.unibet-match-page .pitch::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}
.unibet-match-page .pitch::before{width:8.5rem;height:8.5rem;border-radius:50%;border:.0625rem solid var(--filet)}
.unibet-match-page .pitch::after{width:.3125rem;height:.3125rem;border-radius:50%;background:rgba(255,255,255,.45)}
.unibet-match-page .pitch__half{
flex:1 1 0;display:flex;align-items:stretch;gap:.25rem;
padding:.75rem .375rem;position:relative;min-width:0;
background:repeating-linear-gradient(90deg,rgba(255,255,255,.04) 0 3rem,transparent 3rem 6rem);
border:.0625rem solid rgba(255,255,255,.18);
}
.unibet-match-page .pitch__half--home{border-radius:var(--r-surface) 0 0 var(--r-surface);border-right:0}
.unibet-match-page .pitch__half--away{border-radius:0 var(--r-surface) var(--r-surface) 0;flex-direction:row-reverse}
.unibet-match-page .pitch__half::before,.unibet-match-page .pitch__half::after,.unibet-match-page .pitch__line--gk::before{
content:"";position:absolute;top:50%;transform:translateY(-50%);
border:.0625rem solid var(--filet);pointer-events:none;
}
.unibet-match-page .pitch__half::before{left:-.0625rem;width:4.5rem;height:64%;border-left:0;border-radius:0 .125rem .125rem 0}
.unibet-match-page .pitch__half::after{left:-.0625rem;width:1.875rem;height:30%;border-left:0;border-radius:0 .125rem .125rem 0}
.unibet-match-page .pitch__line--gk::before{
left:-.0625rem;width:.4375rem;height:16%;border-left:0;
background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.5);
}
.unibet-match-page .pitch__half--away::before,.unibet-match-page .pitch__half--away::after,.unibet-match-page .pitch__half--away .pitch__line--gk::before{
left:auto;right:-.0625rem;border-left:.0625rem solid var(--filet);border-right:0;
border-radius:.125rem 0 0 .125rem;
}
.unibet-match-page .pitch__line--gk::after{
content:"";position:absolute;top:50%;left:4rem;width:.25rem;height:.25rem;
border-radius:50%;background:rgba(255,255,255,.45);transform:translateY(-50%);
}
.unibet-match-page .pitch__half--away .pitch__line--gk::after{left:auto;right:4rem}
.unibet-match-page .pitch__line{display:flex;flex-direction:column;justify-content:space-around;gap:.5rem;flex:1 1 0;min-width:0}
.unibet-match-page .pitch__line--gk{flex:0 0 4rem}
.unibet-match-page .player{display:flex;flex-direction:column;align-items:center;gap:.25rem;min-width:0;text-align:center}
.unibet-match-page .player__num{
display:grid;place-items:center;width:1.75rem;height:1.75rem;border-radius:2.5rem;
font-family:var(--font-cote);font-weight:700;font-size:.8125rem;font-variant-numeric:tabular-nums;
background:#fff;color:var(--content_primary);box-shadow:0 .0625rem .125rem rgba(0,0,0,.35);
}
.unibet-match-page .player[data-team="away"] .player__num{background:var(--background_button)}
.unibet-match-page .player__name{
font-size:.6875rem;font-weight:600;color:#dfe9e4;line-height:1.2;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
}
/* --- responsive : terrain vertical --- */
@media (max-width:820px){
.unibet-match-page .pitch{flex-direction:column;width:100%;max-width:26rem;margin:0 auto;overflow:hidden;aspect-ratio:68/105;min-height:30rem}
.unibet-match-page .pitch__teams{max-width:26rem;margin-left:auto;margin-right:auto}
.unibet-match-page .pitch__team{flex:0 0 auto;font-size:.8125rem}
.unibet-match-page .player__name{font-size:.625rem}
.unibet-match-page .pitch__half{
flex-direction:column;align-items:stretch;min-height:14rem;padding:.625rem .375rem;
background:repeating-linear-gradient(180deg,rgba(255,255,255,.04) 0 3rem,transparent 3rem 6rem);
}
.unibet-match-page .pitch__half--home{border-radius:var(--r-surface) var(--r-surface) 0 0;border-right:.0625rem solid rgba(255,255,255,.18);border-bottom:0}
.unibet-match-page .pitch__half--away{border-radius:0 0 var(--r-surface) var(--r-surface);flex-direction:column-reverse;border-top:0}
.unibet-match-page .pitch__half::before,.unibet-match-page .pitch__half::after,.unibet-match-page .pitch__line--gk::before{
top:-.0625rem;left:50%;right:auto;bottom:auto;transform:translateX(-50%);
border:.0625rem solid var(--filet);border-top:0;
}
.unibet-match-page .pitch__half::before{height:4.5rem;width:64%;border-radius:0 0 .125rem .125rem}
.unibet-match-page .pitch__half::after{height:1.875rem;width:30%;border-radius:0 0 .125rem .125rem}
.unibet-match-page .pitch__line--gk::before{height:.4375rem;width:16%;border-radius:0;border-top:0;border-color:rgba(255,255,255,.5)}
.unibet-match-page .pitch__half--away::before,.unibet-match-page .pitch__half--away::after,.unibet-match-page .pitch__half--away .pitch__line--gk::before{
top:auto;bottom:-.0625rem;border-top:.0625rem solid var(--filet);border-bottom:0;
border-radius:.125rem .125rem 0 0;
}
.unibet-match-page .pitch__line--gk::after{top:4rem;left:50%;right:auto;transform:translateX(-50%)}
.unibet-match-page .pitch__half--away .pitch__line--gk::after{top:auto;bottom:4rem}
/* en colonne : Slavia au dessus, terrain, Lens en dessous */
.unibet-match-page .panel__body--pitch{display:flex;flex-direction:column}
.unibet-match-page .pitch__teams{display:contents}
.unibet-match-page .pitch__team--home{order:1;margin-bottom:.5rem}
.unibet-match-page .pitch{order:2}
.unibet-match-page .pitch__team--away{order:3;margin-top:.5rem}
.unibet-match-page .pitch__line{flex-direction:row;justify-content:space-around;align-items:center;gap:.375rem}
.unibet-match-page .pitch__line--gk{flex:0 0 2.75rem}
.unibet-match-page .player{flex:1 1 0}}
/* prose SEO — pleine largeur, en colonnes sur grand écran */
.unibet-match-page .odds-analysis{display:grid;gap:.625rem}
.unibet-match-page .odds-analysis p{font-size:.875rem;line-height:1.6}
.unibet-match-page .odds-analysis strong{font-weight:700;color:var(--text-strong)}
.unibet-match-page .odds-analysis ul{list-style:none;display:grid;gap:.25rem}
.unibet-match-page .odds-analysis--columns{display:block;columns:30rem;column-gap:2rem}
.unibet-match-page .odds-analysis--columns p{break-inside:avoid;margin-bottom:.625rem}
.unibet-match-page .prose-card{background:var(--surface);border-radius:var(--r-surface);box-shadow:var(--shadow);padding:1rem}
.unibet-match-page .pronostic-box{
background:var(--surface);border-radius:var(--r-surface);box-shadow:var(--shadow);padding:1rem;
}
.unibet-match-page .pronostic-box p{font-size:.875rem;line-height:1.6}
.unibet-match-page .pronostic-box strong{font-weight:700;color:var(--text-strong)}
.unibet-match-page .odds-disclaimer{font-size:.6875rem;color:var(--content_grey_cold);margin-top:.625rem}
.unibet-match-page .odds-disclaimer--bottom{text-align:center}
/* pastilles de forme */
.unibet-match-page .formrow{display:flex;align-items:center;gap:.25rem;flex-wrap:wrap}
.unibet-match-page .fpill{
width:1.375rem;height:1.375rem;border-radius:var(--r-btn);display:inline-grid;place-items:center;
vertical-align:middle;font-size:.6875rem;font-weight:700;color:#fff;
}
.unibet-match-page .fpill--w{background:var(--content_win)}
.unibet-match-page .fpill--d{background:var(--content_grey_cold)}
.unibet-match-page .fpill--l{background:var(--content_lose)}
.unibet-match-page .fpill--sm{width:1.25rem;height:1.25rem;font-size:.625rem}
.unibet-match-page .teamhead{display:flex;align-items:center;gap:.625rem;flex-wrap:wrap}
.unibet-match-page .teamhead .rank{
font-size:.6875rem;font-weight:600;color:var(--muted);
background:var(--background_quaternary);border-radius:var(--r-btn);padding:.1875rem .5rem;
}
.unibet-match-page .statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:.0625rem;background:var(--border-soft);border-block:.0625rem solid var(--border-soft)}
.unibet-match-page .statrow__item{background:var(--surface);padding:.5rem .75rem}
.unibet-match-page .statrow__label{display:block;font-size:.625rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}
.unibet-match-page .statrow__value{display:block;font-family:var(--font-cote);font-size:1.125rem;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.3;color:var(--text-strong)}
.unibet-match-page .chips{display:flex;flex-wrap:wrap;gap:.375rem}
.unibet-match-page .chip{
display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:600;
background:var(--background_quaternary);border-radius:2.5rem;
padding:.1875rem .625rem .1875rem .1875rem;color:var(--text-strong);
}
.unibet-match-page .chip b{
display:grid;place-items:center;min-width:1.125rem;height:1.125rem;border-radius:50%;
background:var(--content_win);color:#fff;font-size:.625rem;font-variant-numeric:tabular-nums;
}
/* comparatif */
.unibet-match-page .compare{display:grid;gap:.5rem}
.unibet-match-page .compare__row{display:grid;grid-template-columns:2.75rem 1fr auto 1fr 2.75rem;align-items:center;gap:.5rem;font-size:.8125rem}
.unibet-match-page .compare__val{font-family:var(--font-cote);font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-strong)}
.unibet-match-page .compare__val--l{text-align:right}
.unibet-match-page .compare__lbl{font-size:.6875rem;font-weight:600;color:var(--muted);white-space:nowrap;padding-inline:.375rem}
.unibet-match-page .compare__bar{height:.375rem;background:var(--background_quaternary);border-radius:2.5rem;overflow:hidden;display:flex}
.unibet-match-page .compare__bar--l{justify-content:flex-end}
.unibet-match-page .compare__bar i{display:block;height:100%;background:var(--background_cotes);border-radius:2.5rem}
.unibet-match-page .compare__bar--r i{background:var(--content_primary)}
/* état vide */
.unibet-match-page .emptystate{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--background_quaternary);border-radius:var(--r-surface)}
.unibet-match-page .emptystate__mark{font-family:var(--font-cote);font-size:1.5rem;font-weight:700;color:var(--content_grey_cold);line-height:1}
.unibet-match-page .emptystate p{font-size:.8125rem;margin:0}
/* absents */
.unibet-match-page .outlist{list-style:none}
.unibet-match-page .outlist li{padding:.5rem .75rem;display:flex;align-items:center;justify-content:space-between;gap:.625rem;font-size:.8125rem;border-bottom:.0625rem solid var(--border-soft)}
.unibet-match-page .outlist li:last-child{border-bottom:0}
.unibet-match-page .outlist strong{font-weight:600;color:var(--text-strong)}
.unibet-match-page .outlist .tag{font-size:.6875rem;font-weight:600;color:var(--content_lose);background:var(--background_fail);border-radius:var(--r-btn);padding:.125rem .5rem}
.unibet-match-page .count-badge{font-size:.6875rem;font-weight:700;color:#fff;background:var(--content_lose);border-radius:2.5rem;padding:.125rem .5rem}
/* FAQ — pleine largeur du container */
.unibet-match-page .faq-wrap{padding-block:.75rem 1.5rem}
.unibet-match-page .faq-list{display:grid;gap:.5rem}
.unibet-match-page .faq-item{background:var(--surface);border-radius:var(--r-surface);box-shadow:var(--shadow);overflow:hidden}
.unibet-match-page .faq-question{font-family:var(--font-heading);font-weight:800;font-size:.9375rem;color:var(--text-strong);flex:1 1 auto;margin:0}
.unibet-match-page .faq-question::before{display:none}
.unibet-match-page .faq-answer{padding:0 .75rem .75rem 3.125rem;font-size:.875rem;line-height:1.6;margin:0}
@media (max-width:520px){.unibet-match-page .faq-answer{padding-left:.75rem}}
/* ---------- Bandeau bonus fixe en bas d'ecran ----------
Ancre en bas du viewport, au dessus du contenu. La page
reserve sa hauteur pour que rien ne passe dessous. */
.unibet-match-page .bonus-bar{
position:fixed;left:0;right:0;bottom:0;z-index:60;
background:var(--background_header) url("https://cdn-media.unibet.fr/static/unibet-lp-bonus-paris-sportif-fond.png") center/cover no-repeat;
border-top:.0625rem solid rgba(255,255,255,.16);
box-shadow:0 -.25rem 1rem rgba(0,0,0,.35);
}
/* voile sombre : garantit le contraste du texte quelle que soit l'image */
.unibet-match-page .bonus-bar::before{
content:"";position:absolute;inset:0;pointer-events:none;
background:linear-gradient(90deg,rgba(0,11,6,.88) 0%,rgba(0,11,6,.6) 50%,rgba(0,11,6,.88) 100%);
}
.unibet-match-page .bonus-bar__link{
position:relative;z-index:1;
display:flex;align-items:center;justify-content:center;gap:.875rem;flex-wrap:wrap;
max-width:80rem;margin:0 auto;text-decoration:none;color:#fff;
padding:.625rem calc(var(--gut) + 1.5rem);
padding-bottom:calc(.625rem + env(safe-area-inset-bottom,0px));
}
.unibet-match-page .bonus-bar__logo{height:3.75rem;width:auto;flex:none}
.unibet-match-page .bonus-bar__legal{font-size:.6875rem;color:#c6d1cb;min-width:0}
.unibet-match-page .bonus-bar__cta{
flex:none;display:inline-flex;align-items:center;min-height:2.5rem;
font-weight:700;font-size:.875rem;
background:var(--background_button);color:var(--content_primary);
padding:.625rem 1.25rem;border-radius:var(--r-btn);
transition:background-color .12s ease;
}
.unibet-match-page .bonus-bar__link:hover .bonus-bar__cta{background:var(--background_button_hover)}
@media (max-width:560px){
.unibet-match-page .bonus-bar__link{gap:.5rem;padding-left:.75rem;padding-right:2rem}
.unibet-match-page .bonus-bar__logo{height:2.875rem}
.unibet-match-page .bonus-bar__cta{padding:.5rem .875rem;font-size:.8125rem}
.unibet-match-page .bonus-bar__legal{font-size:.625rem}}
/* hauteur reservee sous le contenu */
.unibet-match-page{padding-bottom:7rem}
/* mentions legales */
.unibet-match-page .legal{padding:1rem var(--gut) 2rem;max-width:60rem;margin:0 auto;font-size:.6875rem;color:var(--content_grey_cold);text-align:center;line-height:1.5}
.unibet-match-page .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* ============================================================
Révélation au scroll
Etat au repos = visible. La classe .js-reveal n'est posée par
le script que si JS est actif et que l'utilisateur n'a pas
demandé de réduire les animations : sans elle, rien n'est caché.
============================================================ */
/* le terrain se deploie ligne par ligne : gardien, defense, milieu, attaque */
/* la serie de forme s'egrene dans l'ordre chronologique */
/* les barres de données se remplissent à l'apparition */
/* ============================================================
Specifique au hub (filtres, calendrier, chiffres cles...)
============================================================ */
/* ============================================================
Révélation au scroll
Etat au repos = visible. La classe .js-reveal n'est posée par
le script que si JS est actif et que l'utilisateur n'a pas
demandé de réduire les animations : sans elle, rien n'est caché.
============================================================ */
/* la serie de forme s'egrene dans l'ordre chronologique */
/* les barres de données se remplissent à l'apparition */
/* ============================================================
Specifique page hub : filtres de journee, listes d'affiches,
classement vainqueur. Memes tokens que la page match.
============================================================ */
/* filtres par journee (psel-tabs secondaires) */
.unibet-match-page .filterbar{display:flex;flex-wrap:wrap;gap:.375rem;align-items:center}
.unibet-match-page .filterbtn{
display:inline-flex;align-items:center;gap:.375rem;cursor:pointer;
font-family:var(--font-body);font-size:.75rem;font-weight:600;color:var(--text-strong);
background:var(--background_quaternary);border:0;border-radius:2.5rem;
padding:.3125rem .75rem;min-height:1.75rem;
transition:background-color .12s ease,color .12s ease;
}
.unibet-match-page .filterbtn:hover{background:var(--background_secondary)}
.unibet-match-page .filterbtn b{
display:grid;place-items:center;min-width:1.125rem;height:1.125rem;border-radius:50%;
background:var(--content_grey_cold);color:#fff;font-size:.625rem;font-weight:700;
font-variant-numeric:tabular-nums;transition:background-color .12s ease;
}
/* ligne d'intertitre "journee" dans le tableau des affiches */
.unibet-match-page .seo-table tr.daygroup td{
background:var(--background_quaternary);
font-family:var(--font-heading);font-weight:800;font-size:.6875rem;
letter-spacing:.03em;text-transform:uppercase;color:var(--text-strong);
padding:.375rem .75rem;border-bottom:.0625rem solid var(--border);
}
.unibet-match-page .seo-table tbody tr.daygroup:hover td{background:var(--background_quaternary)}
.unibet-match-page .seo-table tr[hidden]{display:none}
/* affiche : equipe / equipe */
.unibet-match-page .affiche{display:flex;align-items:center;gap:.4375rem;flex-wrap:wrap;min-width:0}
.unibet-match-page .affiche .vs{
font-family:var(--font-heading);font-weight:800;font-size:.625rem;
color:var(--content_grey_cold);flex:none;
}
.unibet-match-page .pays{font-size:.75rem;color:var(--muted)}
/* chiffres cles sous le hero */
.unibet-match-page .keyfacts{
display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.0625rem;
background:var(--border-soft);border-radius:var(--r-surface);overflow:hidden;
box-shadow:var(--shadow);margin-bottom:1.25rem;
}
.unibet-match-page .keyfacts__item{background:var(--surface);padding:.625rem .75rem}
.unibet-match-page .keyfacts__label{display:block;font-size:.625rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}
.unibet-match-page .keyfacts__value{display:block;
font-family:var(--font-cote);font-size:1.125rem;font-weight:700;
font-variant-numeric:tabular-nums;line-height:1.3;color:var(--text-strong);
}
.unibet-match-page .keyfacts__value small{font-family:var(--font-body);font-size:.75rem;font-weight:600;color:var(--muted)}
/* ---------- Calendrier papier du hero ----------
Trois feuillets d'ephemeride : bandeau du mois perfore,
quantieme en gros, jour de semaine, nombre d'affiches.
Chaque feuillet filtre la liste des rencontres. */
.unibet-match-page .calpaper{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;perspective:37.5rem}
.unibet-match-page .calsheet{
position:relative;display:block;overflow:hidden;text-decoration:none;
background:#fff;border-radius:.375rem;min-width:0;
/* pile de feuilles : une epaisseur claire decalee sous le feuillet */
box-shadow:
.1875rem .25rem 0 -.0625rem rgba(255,255,255,.45),
.1875rem .25rem .0625rem rgba(0,0,0,.22),
0 .1875rem .5rem rgba(0,0,0,.38);
/* le feuillet pivote autour de sa reliure, en haut */
transform-origin:50% 0;
/* 'backwards' et non 'both' : une fois joue, le survol reprend la main */
animation:arrachage .65s var(--ease) backwards;
transition:transform .18s var(--ease),box-shadow .18s var(--ease);
}
.unibet-match-page .calsheet:nth-child(2){animation-delay:.09s}
.unibet-match-page .calsheet:nth-child(3){animation-delay:.18s}
/* la feuille se decroche du bloc et retombe, avec un rebond */
@keyframes arrachage{
0%{opacity:0;transform:rotateX(-92deg)}
55%{opacity:1;transform:rotateX(14deg)}
78%{transform:rotateX(-6deg)}
100%{opacity:1;transform:rotateX(0)}
}
/* au survol : la feuille se souleve et gondole legerement */
.unibet-match-page .calsheet:hover{
transform:translateY(-.1875rem) rotate(-.7deg);
box-shadow:
.25rem .375rem 0 -.0625rem rgba(255,255,255,.5),
.25rem .375rem .125rem rgba(0,0,0,.24),
0 .5rem 1rem rgba(0,0,0,.45);
}
/* coin corne, en bas a droite : il se retrousse au survol */
.unibet-match-page .calsheet::after{
content:"";position:absolute;right:0;bottom:0;width:.875rem;height:.875rem;
background:linear-gradient(315deg,var(--background_ternary) 50%,transparent 50%);
box-shadow:-.0625rem -.0625rem .125rem rgba(0,0,0,.12);
transition:width .2s var(--ease),height .2s var(--ease);
}
.unibet-match-page .calsheet:hover::after{width:1.5rem;height:1.5rem}
/* bandeau du mois, perfore par la reliure */
.unibet-match-page .calsheet__top{
position:relative;display:block;padding:.5rem 0 .1875rem;text-align:center;
background:var(--content_primary);color:var(--content_secondary);
font-family:var(--font-heading);font-weight:800;font-size:.5625rem;
letter-spacing:.08em;text-transform:uppercase;
}
.unibet-match-page .calsheet__top::before,.unibet-match-page .calsheet__top::after{
content:"";position:absolute;top:.1875rem;width:.25rem;height:.25rem;border-radius:50%;
background:var(--background_ternary);box-shadow:inset 0 .0625rem .0625rem rgba(0,0,0,.45);
}
.unibet-match-page .calsheet__top::before{left:28%}
.unibet-match-page .calsheet__top::after{right:28%}
.unibet-match-page .calsheet__num{
display:block;padding-top:.1875rem;text-align:center;color:var(--content_primary);
font-family:var(--font-cote);font-weight:700;font-variant-numeric:tabular-nums;
font-size:1.625rem;line-height:1.05;
}
.unibet-match-page .calsheet__dow{
display:block;text-align:center;font-size:.5625rem;font-weight:700;
letter-spacing:.05em;text-transform:uppercase;color:var(--muted);
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-inline:.125rem;
}
.unibet-match-page .calsheet__count{
display:block;margin-top:.3125rem;padding:.25rem 0;text-align:center;
border-top:.0625rem dashed var(--border);
font-size:.625rem;font-weight:700;color:var(--content_indicator);
}
/* ============================================================
COUCHE D'INTEGRATION unibet.fr
Le contenu est injecte par le CMS dans le layout Angular psel-* :
- dl/dt/dd, main, summary sont supprimes -> div/span, FAQ ouverte
- les elements vides sont supprimes -> tout element porte du texte
- les attributs aria-* sont supprimes
- le JS n'est pas fiable -> 100 % CSS
- -> ancres en chemin complet
Tout le CSS de la page est prefixe par .unibet-match-page :
rien ne deborde sur le header, le menu ou le footer du site.
============================================================ */
/* --- hauteurs du shell unibet.fr (mesurees sur seo-test-hub) ---
bandeau ARJEL : max(10vh, 3.5rem), sticky
header : 5.125rem < 768px | 6.125rem < 1024px | 4.75rem au-dela
(valeurs legerement minorees : la nav glisse sous le header,
jamais d'interstice)
Hors site (apercu local), tout retombe a 0. */
.unibet-match-page{--lp-site-band:0px;--lp-site-header:0px;--lp-nav-h:3rem}
.psel-layout .unibet-match-page{--lp-site-header:5.1rem}
@media (min-width:768px){.psel-layout .unibet-match-page{--lp-site-header:6.1rem}}
@media (min-width:1024px){.psel-layout .unibet-match-page{--lp-site-header:4.72rem}}
.psel-layout__with-mmeg .unibet-match-page{--lp-site-band:max(10vh,3.5rem)}
/* nav collante : se cale sous le header du site (z-index 10) et passe
dessous, jamais par-dessus */
.unibet-match-page .anchor-nav{top:calc(var(--lp-site-band) + var(--lp-site-header));z-index:9}
/* onglet actif sans JS : la section ciblee allume son lien */
.unibet-match-page:has(#cotes:target) .anchor-nav a[href$="#cotes"],
.unibet-match-page:has(#paris:target) .anchor-nav a[href$="#paris"],
.unibet-match-page:has(#buteurs:target) .anchor-nav a[href$="#buteurs"],
.unibet-match-page:has(#pronostic:target) .anchor-nav a[href$="#pronostic"],
.unibet-match-page:has(#compositions:target) .anchor-nav a[href$="#compositions"],
.unibet-match-page:has(#formes:target) .anchor-nav a[href$="#formes"],
.unibet-match-page:has(#confrontations:target) .anchor-nav a[href$="#confrontations"],
.unibet-match-page:has(#absents:target) .anchor-nav a[href$="#absents"],
.unibet-match-page:has(#autres-pronostics:target) .anchor-nav a[href$="#autres-pronostics"],
.unibet-match-page:has(#faq:target) .anchor-nav a[href$="#faq"]{color:var(--text-strong);border-bottom-color:var(--content_indicator)}
/* ancres : le point d'arrivee est remonte de la hauteur des barres
collantes. Fonctionne aussi quand le router Angular refait le
defilement lui-meme (il ignore scroll-margin-top). */
.unibet-match-page .section,.unibet-match-page .faq-wrap{position:relative}
.unibet-match-page .lp-anchor{
position:absolute;left:0;
top:calc(-1 * (var(--lp-site-band) + var(--lp-site-header) + var(--lp-nav-h) + 1rem));
width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;pointer-events:none;
}
/* en-tetes de panneau : l'element d'espacement vide est remplace */
.unibet-match-page .panel__head{flex-wrap:wrap}
.unibet-match-page .panel__head>.panel__hint,
.unibet-match-page .panel__head>.count-badge,
.unibet-match-page .panel__head>.filterbar{margin-left:auto}
/* barres de donnees : la valeur est ecrite dans la barre (sinon le CMS
la supprime comme element vide), puis masquee visuellement */
.unibet-match-page .probcell .bar i,
.unibet-match-page .compare__bar i,
.unibet-match-page .probsplit span{font-size:0;line-height:0;color:transparent;overflow:hidden;white-space:nowrap}
/* pastilles de couleur en pseudo-elements */
.unibet-match-page .problegend .nm{display:flex;align-items:center;gap:.5rem}
.unibet-match-page .problegend .nm::before{content:"";flex:none;width:.5rem;height:.5rem;border-radius:2.5rem;background:var(--content_grey_cold)}
.unibet-match-page .problegend .is-home .nm::before{background:var(--background_cotes)}
.unibet-match-page .problegend .is-away .nm::before{background:var(--away)}
.unibet-match-page .pitch__name{display:inline-flex;align-items:center;gap:.5rem}
.unibet-match-page .pitch__name::before{content:"";flex:none;width:.75rem;height:.75rem;border-radius:2.5rem}
.unibet-match-page .pitch__team--home .pitch__name::before{background:#fff;box-shadow:inset 0 0 0 .125rem var(--content_primary)}
.unibet-match-page .pitch__team--away .pitch__name::before{background:var(--background_button)}
/* FAQ : questions et reponses toujours visibles (bon pour le SEO,
et n'existe pas cote CMS) */
.unibet-match-page .faq-item{padding:.875rem 1rem}
.unibet-match-page .faq-question{display:flex;align-items:flex-start;gap:.625rem;line-height:1.3}
.unibet-match-page .faq-question::before{
content:"?";display:grid;place-items:center;flex:none;width:1.375rem;height:1.375rem;
border-radius:50%;background:var(--content_primary);color:var(--content_secondary);
font-family:var(--font-heading);font-size:.75rem;line-height:1;
}
.unibet-match-page .faq-answer{padding:.375rem 0 0 2rem}
@media (max-width:520px){.unibet-match-page .faq-answer{padding-left:0}}
/* chiffres cles en mobile : 2 colonnes, le dernier bloc impair prend
toute la largeur (plus de case vide) */
@media (max-width:560px){
.unibet-match-page .keyfacts{grid-template-columns:1fr 1fr}
.unibet-match-page .keyfacts__item:last-child:nth-child(odd){grid-column:1/-1}
}
/* stats de forme en mobile : 2 x 2 au lieu de 3 + 1 */
@media (max-width:560px){
.unibet-match-page .statrow{grid-template-columns:1fr 1fr}
}
/* terrain vertical : les reperes de but de l'equipe exterieure restent
centres (la regle desktop, plus specifique, les poussait a droite) */
@media (max-width:820px){
.unibet-match-page .pitch__half--away::before,
.unibet-match-page .pitch__half--away::after,
.unibet-match-page .pitch__half--away .pitch__line--gk::before,
.unibet-match-page .pitch__half--away .pitch__line--gk::after{left:50%;right:auto}
}
/* liens d'affiche (remplacent les lignes cliquables en JS) */
.unibet-match-page a.affiche,.unibet-match-page .lp-rowlink{color:inherit;text-decoration:none}
.unibet-match-page a.affiche:hover,.unibet-match-page .lp-rowlink:hover{text-decoration:underline}
/* bandeau bonus : sous le header et son menu deroulant (z-index 10) */
.unibet-match-page .bonus-bar{z-index:9}
.unibet-match-page .bonus-bar__link{padding-left:var(--gut);padding-right:var(--gut)}
@media (max-width:560px){.unibet-match-page .bonus-bar__link{padding-left:.75rem;padding-right:.75rem}}
/* animations des pseudo-elements coupees aussi en mouvement reduit */
@media (prefers-reduced-motion:reduce){
.unibet-match-page *::before,.unibet-match-page *::after{animation:none!important;transition:none!important}
}
/* --- specifique au hub : onglets actifs et filtres par journee --- */
/* onglet actif sans JS : la section ciblee allume son lien */
.unibet-match-page:has(#rencontres:target) .anchor-nav a[href$="#rencontres"],
.unibet-match-page:has(#vainqueur:target) .anchor-nav a[href$="#vainqueur"],
.unibet-match-page:has(#buteurs:target) .anchor-nav a[href$="#buteurs"],
.unibet-match-page:has(#analyse:target) .anchor-nav a[href$="#analyse"],
.unibet-match-page:has(#faq:target) .anchor-nav a[href$="#faq"],
.unibet-match-page:has(.lp-matches .lp-anchor:target) .anchor-nav a[href$="#rencontres"]{color:var(--text-strong);border-bottom-color:var(--content_indicator)}
/* ---------- Filtres par journee, sans JS ----------
Chaque filtre est un lien vers une ancre ; :target + :has()
masquent les autres journees. Sans correspondance, tout
reste affiche. */
.unibet-match-page .lp-matches{position:relative}
.unibet-match-page .filterbtn{text-decoration:none}
.unibet-match-page .lp-matches:has(#j-0809:target) tr[data-day]:not([data-day="08/09/2026"]),
.unibet-match-page .lp-matches:has(#j-0909:target) tr[data-day]:not([data-day="09/09/2026"]),
.unibet-match-page .lp-matches:has(#j-1009:target) tr[data-day]:not([data-day="10/09/2026"]){display:none}
.unibet-match-page .lp-matches:not(:has(.lp-anchor:target)) .filterbtn--all,
.unibet-match-page .lp-matches:has(#j-0809:target) .filterbtn[href$="#j-0809"],
.unibet-match-page .lp-matches:has(#j-0909:target) .filterbtn[href$="#j-0909"],
.unibet-match-page .lp-matches:has(#j-1009:target) .filterbtn[href$="#j-1009"]{background:var(--content_primary);color:var(--content_white)}
.unibet-match-page .lp-matches:not(:has(.lp-anchor:target)) .filterbtn--all b,
.unibet-match-page .lp-matches:has(#j-0809:target) .filterbtn[href$="#j-0809"] b,
.unibet-match-page .lp-matches:has(#j-0909:target) .filterbtn[href$="#j-0909"] b,
.unibet-match-page .lp-matches:has(#j-1009:target) .filterbtn[href$="#j-1009"] b{background:var(--content_secondary);color:var(--content_primary)}
/* le feuillet du calendrier de la journee filtree s'allume */
.unibet-match-page:has(#j-0809:target) .calsheet[href$="#j-0809"],
.unibet-match-page:has(#j-0909:target) .calsheet[href$="#j-0909"],
.unibet-match-page:has(#j-1009:target) .calsheet[href$="#j-1009"]{box-shadow:0 0 0 .1875rem var(--content_secondary),0 .375rem .875rem rgba(0,0,0,.45)}
body:has(#unibet-match-page) { margin: 0; padding: 0; }
#unibet-match-page { width: 100%; min-width: 0; }
#unibet-match-page .grid { grid-template-columns: minmax(0, 1fr); gap: max(.75rem, 12px); }
#unibet-match-page .section { margin-bottom: max(1.25rem, 20px); }
#unibet-match-page #top { width: 100%; max-width: none; }
#unibet-match-page #top > .container { width: 100%; max-width: none; }
#unibet-match-page #top .hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
#unibet-match-page #top .hero-main { width: 100%; min-width: 0; }
#unibet-match-page .auteur { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 1rem; padding: 1rem; background: var(--surface); border-radius: var(--r-surface); box-shadow: var(--shadow); }
#unibet-match-page .auteur > .img { flex: 0 0 80px; }
#unibet-match-page .auteur > .img img { display: block; width: 80px; height: 80px; object-fit: contain; }
#unibet-match-page .auteur > .text { flex: 1 1 0; min-width: 0; }
#unibet-match-page .auteur .par, #unibet-match-page .auteur .metier { font-size: .75rem; color: var(--muted); }
#unibet-match-page .auteur .nom { font-family: var(--font-heading); font-size: 1.125rem; font-weight: 700; color: var(--text-strong); }
#unibet-match-page .auteur p { margin-top: .625rem; font-size: .8125rem; line-height: 1.5; }
#unibet-match-page .auteur .rs { display: flex; gap: .75rem; margin-top: .75rem; }
#unibet-match-page .auteur .rs a { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; min-height: 32px; }
#unibet-match-page .auteur .rs img { display: block; width: 20px; height: 20px; }
#unibet-match-page .hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .625rem .75rem; margin-top: .875rem; }
#unibet-match-page .hero-actions .cta-btn--hero { margin-top: 0; max-width: 100%; }
@media (max-width: 359.98px) {
html:has(#unibet-match-page) { font-size: 93.75%; }
}
#unibet-match-page #partager { margin-top: .75rem; }
#unibet-match-page .share-row { display: flex; align-items: center; gap: .625rem; min-width: 0; }
#unibet-match-page .share-label { flex: 0 0 auto; margin: 0; font-size: .75rem; font-weight: 600; white-space: nowrap; }
#unibet-match-page #partager .filterbar { flex: 1 1 auto; flex-wrap: nowrap; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; padding: .25rem .125rem; scrollbar-width: thin; scrollbar-color: var(--muted) transparent; }
#unibet-match-page #partager .filterbtn { flex: 0 0 auto; min-height: 2rem; border: 1px solid var(--border); background: rgba(2, 10, 5, .04); color: var(--text-strong); white-space: nowrap; }
#unibet-match-page #partager .filterbtn:hover { background: var(--background_secondary); }
#unibet-match-page #partager .filterbtn:focus-visible, #unibet-match-page #partager .filterbar:focus-visible { outline: 2px solid var(--content_indicator); outline-offset: 2px; }
#unibet-match-page .interaction-status { margin-top: .625rem; font-size: .75rem; line-height: 1.5; overflow-wrap: anywhere; }
#unibet-match-page .interaction-status[hidden] { display: none; }
#unibet-match-page .interaction-status a { color: inherit; text-decoration: underline; text-underline-offset: .15em; }
#unibet-match-page:has(#auteur-unibet:target) .anchor-nav a[href$="#auteur-unibet"] { color: var(--text-strong); border-bottom-color: var(--content_indicator); }
@media (min-width: 1024px) {
#unibet-match-page #top .hero-grid { width: 85%; max-width: 960px; margin-inline: auto; }
}
#unibet-match-page .hero-secondary-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: .5rem; width: min(100%, 24rem); min-width: 0; max-width: 100%; }
#unibet-match-page #resumer-ia { flex: 1 1 0; min-width: 0; margin: 0; padding: 0; color: #cfdcd6; background: transparent; box-shadow: none; overflow: visible; }
#unibet-match-page #resumer-ia .panel__body { height: 100%; padding: 0; }
#unibet-match-page #resumer-ia .odds-analysis { height: 100%; margin: 0; }
#unibet-match-page .hero-secondary-actions .content-action-btn { display: flex; flex: 1 1 0; align-items: center; justify-content: center; box-sizing: border-box; height: auto; min-width: 0; min-height: 2.5rem; padding: .375rem .625rem; border: 1px solid rgba(255, 255, 255, .24); border-radius: var(--r-btn); background: transparent; color: #cfdcd6; font-family: inherit; font-size: .75rem; font-weight: 500; line-height: 1.4; text-align: center; text-decoration: none; white-space: normal; }
#unibet-match-page #resumer-ia .content-action-btn { height: 100%; }
#unibet-match-page .hero-secondary-actions .content-action-btn:hover { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .5); color: #fff; }
#unibet-match-page .hero-secondary-actions .content-action-btn:focus-visible { outline: 2px solid var(--content_secondary); outline-offset: 3px; }
@media (max-width: 639.98px) {
#unibet-match-page .hero-secondary-actions { flex: 1 1 100%; width: 100%; }
}
#unibet-match-page .section .odds-analysis { gap: 1rem; }
#unibet-match-page .section .odds-analysis--columns p { margin-bottom: 1rem; }
#unibet-match-page .section .panel__body > .compare + .odds-analysis,
#unibet-match-page .section .panel__body > .compare + .odds-disclaimer,
#unibet-match-page .section .panel__body > .statrow + .odds-analysis,
#unibet-match-page .section .panel__body > .table-wrapper + .odds-analysis { margin-top: 1.25rem; }
#unibet-match-page .section .panel__foot > .odds-analysis + .cta-btn,
#unibet-match-page .section .prose-card > p + .cta-btn { margin-top: 1rem; }
#unibet-match-page .section .odds-analysis + .odds-disclaimer,
#unibet-match-page .section .odds-disclaimer + .odds-analysis { margin-top: 1rem; }
#unibet-match-page .pronostic-box { border-left: 4px solid var(--content_primary); background: #f1f8f3; margin-bottom: 1rem; box-shadow: none; }
#unibet-match-page .pronostic-box p { margin: 0; font-weight: 600; }
#unibet-match-page .faq-list, #unibet-match-page .faq-item,
#unibet-match-page .faq-question, #unibet-match-page .faq-answer { text-align: left; }
#unibet-match-page .faq-question { justify-content: flex-start; }
#unibet-match-page .faq-answer { padding: .625rem 0 0 2rem; }
#unibet-match-page i.w100 { width: 100%; }
#unibet-match-page i.w4 { width: 4%; }
#unibet-match-page i.w66-67 { width: 66.67%; }
#unibet-match-page i.w75 { width: 75%; }
#unibet-match-page i.w83-33 { width: 83.33%; }
#unibet-match-page i.w87 { width: 87%; }
#unibet-match-page i.w9 { width: 9%; }