/* =========================================================
   RIZVAL — base commune de l'espace membre (style « version 3 »)
   Design uniquement : couleurs, typo, menu, cartes en verre.
   Chaque page ajoute ses propres règles dans son <style>.
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@125,800;125,900&family=Manrope:wght@400;500;600;700;800&display=swap');
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
:root{
  --red:#E4032E;--red2:#ff1f47;--red-deep:#B0021F;--red-glow:rgba(228,3,46,.28);
  --ink:#eef2f8;--ink-2:#e6ebf3;--card:#ffffff;--card-2:#f5f7fb;--card-line:rgba(7,27,52,.09);--paper:#071b34;--muted:#566780;--soft:rgba(7,27,52,.05);--rt:#d10029;
  --glass:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.8));--solid:#ffffff;--inset:#f1f4f9;--track:rgba(7,27,52,.08);--shadow:0 24px 60px rgba(7,27,52,.10);
  --nav-bg:rgba(238,242,248,.72);--win:#0f8a5a;--win-bg:rgba(16,160,100,.1);--loss:#d10029;--loss-bg:rgba(228,3,46,.08);
  --safe:#0f8a5a;--safeb:rgba(16,160,100,.1);--semi:#a86400;--semib:rgba(234,150,0,.12);--fun:#7a3fd1;--funb:rgba(122,63,209,.1);
  --gold:#C97C00;--glowop:.45;
}
:root[data-theme="dark"]{
  --ink:#020c1a;--ink-2:#0a1a33;--card:#0a1a33;--card-2:#0e2140;--card-line:rgba(255,255,255,.08);--paper:#f3f6fb;--muted:#93a4bd;--soft:rgba(255,255,255,.06);--rt:#ff5a70;
  --glass:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));--solid:#0a2244;--inset:rgba(1,7,16,.55);--track:rgba(255,255,255,.08);--shadow:0 24px 60px rgba(0,0,0,.35);
  --nav-bg:rgba(2,12,26,.62);--win:#4ee2a2;--win-bg:rgba(52,211,153,.13);--loss:#ff5a70;--loss-bg:rgba(255,90,112,.13);
  --safe:#4ee2a2;--safeb:rgba(52,211,153,.13);--semi:#fcc855;--semib:rgba(251,191,36,.13);--fun:#d4b0ff;--funb:rgba(192,132,252,.15);
  --gold:#FFB92E;--glowop:1;
}
html{overflow-x:hidden;}
body{background:var(--ink) !important;color:var(--paper);font-family:'Manrope',sans-serif !important;-webkit-font-smoothing:antialiased;transition:background-color .5s,color .5s;overflow-x:hidden;}
/* halos de fond */
body::before,body::after{content:'';position:fixed;border-radius:50%;pointer-events:none;z-index:0;opacity:var(--glowop);animation:rzDrift 18s ease-in-out infinite alternate;}
body::before{width:720px;height:720px;left:-220px;top:-260px;background:radial-gradient(closest-side,rgba(228,3,46,.32),transparent);}
body::after{width:760px;height:760px;right:-260px;top:280px;background:radial-gradient(closest-side,rgba(37,82,216,.30),transparent);animation-delay:-6s;}
@keyframes rzDrift{from{transform:translate(0,0) scale(1);}to{transform:translate(60px,40px) scale(1.12);}}

/* typo */
.display,.disp{font-family:'Archivo',sans-serif !important;font-stretch:125%;font-weight:900;text-transform:uppercase;letter-spacing:-.02em;}
.num{font-family:'Archivo',sans-serif;font-stretch:125%;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em;}
.lab{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.lab.rt,.rt{color:var(--rt);}
.muted{color:var(--muted);}

/* briques */
.glass{background:var(--glass);border:1px solid var(--card-line);border-radius:28px;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:var(--shadow);}
.pill{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;}
.p-soft{background:var(--soft);color:var(--paper);}
.p-live{background:var(--red);color:#fff;box-shadow:0 0 20px rgba(228,3,46,.55);}
.p-safe,.p-win{background:var(--safeb);color:var(--safe);}
.p-semi{background:var(--semib);color:var(--semi);}
.p-fun{background:var(--funb);color:var(--fun);}
.p-loss{background:var(--loss-bg);color:var(--loss);}
.dot{width:7px;height:7px;border-radius:50%;background:#fff;animation:rzPulse 1.2s ease-in-out infinite;}
@keyframes rzPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.25;transform:scale(.6)}}
.btn3{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:50px;padding:0 24px;border-radius:16px;border:0;font:800 14px 'Manrope',sans-serif;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s;text-decoration:none;}
.btn3:hover{transform:translateY(-2px);}
.btn3:active{transform:scale(.97);}
.btn3-red{background:linear-gradient(180deg,#ff1f47,#d10029);color:#fff;box-shadow:0 12px 30px rgba(228,3,46,.42),inset 0 1px 0 rgba(255,255,255,.3);}
.btn3-soft{background:var(--soft);color:var(--paper);box-shadow:inset 0 0 0 1px var(--card-line);}
.btn3-sm{height:40px;padding:0 16px;border-radius:12px;font-size:13px;}
.chip3{height:38px;padding:0 16px;border-radius:999px;border:0;background:var(--soft);color:var(--muted);font:700 13px 'Manrope',sans-serif;cursor:pointer;box-shadow:inset 0 0 0 1px var(--card-line);transition:all .2s;}
.chip3:hover{color:var(--paper);}
.chip3.on,.chip3.active{background:var(--paper);color:var(--ink);box-shadow:none;}
.crest{border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:'Archivo',sans-serif;font-stretch:125%;font-weight:900;color:#fff;flex-shrink:0;box-shadow:inset 0 0 0 2px rgba(255,255,255,.2),0 10px 26px rgba(0,0,0,.35);}
.inp3,.glass input[type=text],.glass input[type=number],.glass input[type=email],.glass input[type=password],.glass select,.glass textarea{height:50px;border-radius:16px;border:0;background:var(--inset);box-shadow:inset 0 0 0 1px var(--card-line);color:var(--paper);padding:0 16px;font:700 16px 'Manrope',sans-serif;box-sizing:border-box;width:100%;}
.glass textarea{height:auto;padding:14px 16px;}
.inp3:focus,.glass input:focus,.glass select:focus,.glass textarea:focus{outline:2px solid var(--red);outline-offset:0;}
.rise{animation:rzRise .8s cubic-bezier(.16,.84,.24,1) both;}
@keyframes rzRise{from{opacity:0;transform:translateY(26px) scale(.98);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.grow-x{transform-origin:left;animation:rzGx 1.2s cubic-bezier(.2,.9,.2,1) both .3s;}@keyframes rzGx{from{transform:scaleX(0)}}
.draw{animation:rzDraw 1.6s cubic-bezier(.3,.8,.2,1) both .3s;}@keyframes rzDraw{from{stroke-dashoffset:var(--from)}}
.shine{position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.07) 48%,transparent 60%);animation:rzShine 6s ease-in-out infinite;pointer-events:none;}
@keyframes rzShine{0%{transform:translateX(-120%)}55%,100%{transform:translateX(120%)}}
.ring-border{position:relative;border-radius:30px;padding:1.5px;background:conic-gradient(from var(--ang),rgba(228,3,46,0) 0deg,rgba(228,3,46,0) 200deg,#ff1f47 300deg,#ffd0d7 330deg,rgba(228,3,46,0) 360deg);animation:rzSpin 4.5s linear infinite;}
@keyframes rzSpin{to{--ang:360deg}}

/* ---------- menu (même structure HTML sur toutes les pages) ---------- */
nav{position:sticky !important;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 40px !important;background:var(--nav-bg) !important;backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);border-bottom:1px solid var(--card-line) !important;}
nav .logo img{height:24px !important;}
:root[data-theme="dark"] nav .logo img{content:url('rizval-intro/logo-blanc.png');}
.nav-links{display:flex;gap:2px !important;padding:5px;border-radius:999px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--card-line);font-size:14px !important;font-weight:700 !important;flex-wrap:nowrap !important;}
.nav-links a{height:40px;padding:0 16px;border-radius:999px;display:inline-flex;align-items:center;color:var(--muted) !important;transition:all .25s;}
.nav-links a:hover{color:var(--paper) !important;}
.nav-links a.active{background:var(--red);color:#fff !important;box-shadow:0 8px 22px rgba(228,3,46,.45);}
.nav-right{display:flex;align-items:center;gap:10px !important;}
.theme-toggle,.lang-toggle{width:44px !important;height:44px !important;border-radius:14px !important;border:1px solid var(--card-line) !important;background:var(--soft) !important;color:var(--paper) !important;box-shadow:none !important;transition:transform .2s;}
.theme-toggle:hover,.lang-toggle:hover{transform:translateY(-2px);}
.lang-menu{background:var(--solid) !important;border-color:var(--card-line) !important;}
.btn-logout{height:44px;display:inline-flex !important;align-items:center;padding:0 16px !important;border-radius:14px !important;background:var(--soft) !important;border:1px solid var(--card-line) !important;color:var(--paper) !important;font-family:'Manrope',sans-serif !important;font-weight:800 !important;font-size:13px !important;transition:transform .2s;}
.btn-logout:hover{transform:translateY(-2px);color:var(--rt) !important;}
.nav-right a[href="profil.html"]{background:linear-gradient(135deg,#ff1f47,#7a0018) !important;color:#fff !important;border:0 !important;}

/* ---------- conteneur et en-tête de page ---------- */
.wrap3{position:relative;z-index:2;max-width:1360px;margin:0 auto;padding:48px 56px 80px;box-sizing:border-box;}
.ph3{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:44px;flex-wrap:wrap;}
.ph3 > div:first-child{display:flex;flex-direction:column;gap:12px;}
.ph3 h1{margin:0;font-size:clamp(40px,5vw,72px);line-height:.92;}
.ph3 p{margin:0;color:var(--muted);font-size:16px;line-height:1.55;max-width:60ch;}
.sec3{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:72px 0 28px;}
.sec3 h2{margin:0;font-size:32px;line-height:1;}
.foot3{position:relative;z-index:2;max-width:1360px;margin:0 auto;padding:24px 56px 40px;border-top:1px solid var(--card-line);font-size:12.5px;color:var(--muted);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;box-sizing:border-box;}

/* ---------- mobile ---------- */
@media(max-width:900px){
  nav{padding:12px 14px !important;gap:8px;flex-wrap:wrap;row-gap:10px;}
  .nav-links{display:none !important;}
  .nav-links.mobile-open{display:flex !important;width:100%;overflow-x:auto;order:3;border-radius:18px;}
  .mobile-menu-btn{display:inline-flex !important;align-items:center;color:var(--paper) !important;}
  body:has(.app-tab-bar) .mobile-menu-btn{display:none !important;}
  .nav-right{gap:6px !important;flex-wrap:wrap;}
  .theme-toggle,.lang-toggle{width:38px !important;height:38px !important;border-radius:12px !important;}
  .btn-logout{height:38px;padding:0 12px !important;font-size:11px !important;border-radius:12px !important;white-space:nowrap;}
  .nav-right a[href="profil.html"]{display:none !important;}
  body:has(.app-tab-bar){padding-bottom:80px;}
  .app-tab-bar{display:flex !important;position:fixed;bottom:0;left:0;right:0;z-index:200 !important;background:var(--nav-bg) !important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--card-line) !important;}
  .app-tab-bar a.active .tab-label{color:var(--rt) !important;}
  .wrap3{padding:24px 16px 48px;}
  .ph3{margin-bottom:26px;}
  .ph3 h1{font-size:40px;}
  .sec3{margin:44px 0 18px;}
  .sec3 h2{font-size:24px;}
  .foot3{padding:20px 16px 100px;}
  body::before,body::after{width:420px;height:420px;}
}
@media (prefers-reduced-motion:reduce){body::before,body::after,.rise,.grow-x,.draw,.shine,.ring-border,.dot{animation:none !important;}}

/* pas d'animation d'entrée au changement de page */
.rise,.reveal{animation:none !important;}
.podium-avatar{animation:none !important;}
.crest{animation:none !important;}

/* bouton Admin (créé par le JS) : même forme que Mon profil / Se déconnecter */
nav a[href="admin.html"]{height:44px;padding:0 16px !important;border-radius:14px !important;font-family:'Manrope',sans-serif;font-weight:800 !important;font-size:13px !important;background:var(--red) !important;color:#fff !important;box-shadow:0 8px 22px rgba(228,3,46,.35);transition:transform .2s;box-sizing:border-box;}
nav a[href="admin.html"]:hover{transform:translateY(-2px);}
@media(max-width:900px){nav a[href="admin.html"]{height:38px;padding:0 12px !important;font-size:11px !important;border-radius:12px !important;}}

/* titres en Archivo très large : ne jamais déborder sur petit écran */
.ph3 > div:first-child,.ph3 > *{min-width:0;max-width:100%;}
.ph3 h1,.page-head h1{overflow-wrap:break-word;}
@media(max-width:900px){
  .ph3 h1,.page-head h1{font-size:clamp(26px,8.6vw,40px) !important;}
}
/* chiffres des cartes : jamais coupés en deux lignes (ex. « +18.50 € ») */
.kpi .num,.g-card .num{white-space:nowrap;}
@media(max-width:420px){.kpi .num{font-size:clamp(20px,6.6vw,30px) !important;}}

/* état d'une sélection de combiné : heure ou LIVE · minute */
.rz-leg-st{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font:800 11px 'Manrope',sans-serif;letter-spacing:.03em;white-space:nowrap;background:var(--soft);color:var(--muted);flex-shrink:0;}
.rz-leg-st.is-live{background:var(--red);color:#fff;box-shadow:0 0 14px rgba(228,3,46,.45);}
.rz-leg-st.is-live i{width:6px;height:6px;border-radius:50%;background:#fff;animation:rzPulse 1.2s ease-in-out infinite;}
.leg-bottom .rz-leg-st{margin-left:auto;margin-right:10px;}
/* sur petit écran : l'état de la sélection passe sous le nom du match */
@media(max-width:480px){
  .cc-leg{flex-wrap:wrap;row-gap:6px;}
  .cc-leg .cc-txt{flex:1 1 calc(100% - 170px);}
  .cc-leg .rz-leg-st{order:10;margin-left:18px;}
  .ccard{min-width:0;max-width:100%;}
}

/* rz-wait-v2 */
/* rz-wait-v3 */
/* combiné terminé, en attente du résultat */
.p-wait{background:rgba(245,158,11,.14);color:#f5b544;box-shadow:inset 0 0 0 1px rgba(245,158,11,.35);white-space:nowrap;text-transform:none;letter-spacing:.01em;max-width:100%;}
.cc-right{flex-wrap:wrap;min-width:0;}
@media(max-width:480px){.p-wait{white-space:normal;height:auto !important;min-height:28px;padding-top:5px;padding-bottom:5px;line-height:1.25;}}
:root:not([data-theme="dark"]) .p-wait{color:#b45309;background:rgba(245,158,11,.14);}
.rz-leg-st.is-done{background:var(--soft);color:var(--muted);box-shadow:inset 0 0 0 1px var(--card-line);}
.match-status.is-wait{text-transform:none !important;letter-spacing:.01em !important;max-width:100%;white-space:normal !important;height:auto !important;min-height:32px;line-height:1.25;padding-top:6px !important;padding-bottom:6px !important;background:rgba(245,158,11,.16) !important;color:#f5b544 !important;box-shadow:inset 0 0 0 1px rgba(245,158,11,.4) !important;}
:root:not([data-theme="dark"]) .match-status.is-wait{color:#b45309 !important;}
