/* ============================================
   MENU PREMIUM — MaillotPascher.store
   ============================================ */

/* ── OVERLAY ── */
.pm-overlay{
  position:fixed;inset:0;z-index:2000;
  pointer-events:none;visibility:hidden;
}
.pm-overlay.open{pointer-events:auto;visibility:visible;}
.pm-overlay::before{
  content:'';position:absolute;inset:0;
  background:rgba(0,0,0,0.75);
  backdrop-filter:blur(5px);
  opacity:0;transition:opacity .35s ease;
}
.pm-overlay.open::before{opacity:1;}

/* ── PANEL ── */
.pm-panel{
  position:absolute;top:0;left:0;bottom:0;
  width:420px;
  background:linear-gradient(160deg,#0d0d0d 0%,#101010 60%,#101010 100%);
  border-right:1px solid rgba(124,124,124,0.2);
  box-shadow:4px 0 60px rgba(0,0,0,0.8);
  display:flex;flex-direction:column;
  transform:translateX(-100%);
  transition:transform .38s cubic-bezier(.22,1,.36,1);
  overflow:hidden;
}
.pm-overlay.open .pm-panel{transform:translateX(0);}
@media(max-width:440px){.pm-panel{width:100vw;}}

/* ── HEADER ── */
.pm-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px;
  border-bottom:1px solid rgba(124,124,124,0.12);
  flex-shrink:0;
}
.pm-logo{height:36px;width:auto;filter:drop-shadow(0 0 8px rgba(124,124,124,0.4));}
.pm-close{
  width:34px;height:34px;border-radius:50%;
  background:rgba(124,124,124,0.1);border:1px solid rgba(124,124,124,0.2);
  cursor:pointer;position:relative;flex-shrink:0;
  transition:background .2s,transform .2s;
}
.pm-close:hover{background:rgba(124,124,124,0.25);transform:rotate(90deg);}
.pm-close span{
  position:absolute;top:50%;left:50%;
  width:13px;height:1.5px;background:#a0a0a0;border-radius:2px;
}
.pm-close span:first-child{transform:translate(-50%,-50%) rotate(45deg);}
.pm-close span:last-child{transform:translate(-50%,-50%) rotate(-45deg);}

/* ── GENRE ── */
.pm-genre{
  display:flex;gap:6px;padding:14px 20px;
  border-bottom:1px solid rgba(124,124,124,0.08);
  flex-shrink:0;
}
.pm-genre-btn{
  flex:1;padding:8px 0;border-radius:9px;
  background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);
  color:rgba(255,255,255,0.5);font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:all .2s;
}
.pm-genre-btn:hover{background:rgba(124,124,124,0.1);border-color:rgba(124,124,124,0.3);color:#c2c2c2;}
.pm-genre-btn.active{
  background:linear-gradient(135deg,rgba(81,81,81,0.45),rgba(96,96,96,0.35));
  border-color:rgba(124,124,124,0.55);color:#fff;
  box-shadow:0 0 12px rgba(124,124,124,0.2);
}

/* ── SPORTS ── */
.pm-sports{
  display:grid;grid-template-columns:repeat(4,1fr);gap:6px;
  padding:12px 20px;
  border-bottom:1px solid rgba(124,124,124,0.08);
  flex-shrink:0;
}
.pm-sport-card{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:9px 4px;border-radius:11px;
  background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);
  cursor:pointer;font-family:inherit;transition:all .2s;
}
.pm-sport-card:hover{background:rgba(124,124,124,0.1);border-color:rgba(124,124,124,0.3);}
.pm-sport-card.active{
  background:linear-gradient(135deg,rgba(81,81,81,0.4),rgba(96,96,96,0.3));
  border-color:rgba(124,124,124,0.55);
  box-shadow:0 0 14px rgba(124,124,124,0.2);
}
.pm-sport-icon{font-size:20px;line-height:1;}
.pm-sport-card>span:last-child{font-size:9px;font-weight:700;color:rgba(255,255,255,0.55);letter-spacing:.3px;text-align:center;}
.pm-sport-card.active>span:last-child{color:#c2c2c2;}

/* ── SLIDE WRAP ── */
.pm-slide-wrap{
  flex:1;
  position:relative;
  overflow:hidden; /* CRITIQUE */
  min-height:0;
}

/* ── SLIDES ── */
.pm-slide{
  position:absolute;
  inset:0;
  display:flex;flex-direction:column;
  transition:transform .32s cubic-bezier(.22,1,.36,1);
  overflow:hidden;
}
/* par défaut : caché à droite */
.pm-slide{transform:translateX(100%);}
/* actif : centré */
.pm-slide.active{transform:translateX(0);}
/* sorti à gauche — complètement caché */
.pm-slide.exit{transform:translateX(-100%);}

.pm-slide-title{
  padding:12px 20px;
  font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:2px;
  color:rgba(124,124,124,0.7);flex-shrink:0;
  border-bottom:1px solid rgba(124,124,124,0.08);
}

/* ── LEAGUES ── */
.pm-leagues-grid{
  flex:1;overflow-y:auto;padding:6px 12px 12px;
  display:flex;flex-direction:column;gap:2px;
  scrollbar-width:thin;scrollbar-color:rgba(124,124,124,0.25) transparent;
}
.pm-leagues-grid::-webkit-scrollbar{width:3px;}
.pm-leagues-grid::-webkit-scrollbar-thumb{background:rgba(124,124,124,0.3);border-radius:3px;}

.pm-league-btn{
  display:flex;align-items:center;gap:12px;
  padding:11px 12px;border-radius:10px;
  background:none;border:1px solid transparent;
  cursor:pointer;font-family:inherit;
  text-align:left;width:100%;
  transition:background .15s,border-color .15s;
}
.pm-league-btn:hover{
  background:rgba(124,124,124,0.08);
  border-color:rgba(124,124,124,0.2);
}
.pm-league-flag{font-size:18px;flex-shrink:0;width:26px;text-align:center;}
.pm-league-name{flex:1;font-size:14px;font-weight:600;color:rgba(255,255,255,0.8);}
.pm-league-btn:hover .pm-league-name{color:#fff;}
.pm-league-count{
  font-size:10px;font-weight:700;
  background:rgba(124,124,124,0.15);
  color:#a0a0a0;padding:2px 8px;border-radius:20px;
  flex-shrink:0;white-space:nowrap;
}

/* ── CLUBS ── */
.pm-back{
  display:flex;align-items:center;gap:6px;
  padding:11px 20px;
  background:none;border:none;border-bottom:1px solid rgba(124,124,124,0.08);
  cursor:pointer;font-family:inherit;
  color:rgba(124,124,124,0.7);font-size:12px;font-weight:700;
  letter-spacing:.5px;text-transform:uppercase;
  transition:color .15s;flex-shrink:0;
}
.pm-back:hover{color:#a0a0a0;}

.pm-clubs-grid{
  flex:1;overflow-y:auto;padding:8px 12px 12px;
  display:grid;grid-template-columns:1fr 1fr;gap:5px;
  scrollbar-width:thin;scrollbar-color:rgba(124,124,124,0.25) transparent;
  align-content:start;
}
.pm-clubs-grid::-webkit-scrollbar{width:3px;}
.pm-clubs-grid::-webkit-scrollbar-thumb{background:rgba(124,124,124,0.3);border-radius:3px;}
@media(max-width:360px){.pm-clubs-grid{grid-template-columns:1fr;}}

.pm-club-btn{
  display:flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:9px;
  background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);
  text-decoration:none;
  transition:background .15s,border-color .15s,transform .15s;
}
.pm-club-btn:hover{
  background:rgba(124,124,124,0.12);
  border-color:rgba(124,124,124,0.3);
  transform:translateY(-1px);
}
.pm-club-logo{
  width:26px;height:26px;border-radius:0;
  background:none;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;overflow:hidden;
}
.pm-club-logo img{width:26px;height:26px;object-fit:contain;}
.pm-club-flag{font-size:14px;}
.pm-club-name{
  font-size:12px;font-weight:600;color:rgba(255,255,255,0.75);
  overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
  flex:1;min-width:0;
}
.pm-club-btn:hover .pm-club-name{color:#fff;}

/* ── FOOTER LINKS ── */
.pm-footer-links{
  display:grid;grid-template-columns:1fr 1fr;gap:5px;
  padding:12px 16px;
  border-top:1px solid rgba(124,124,124,0.12);
  flex-shrink:0;
}
.pm-footer-link{
  display:flex;align-items:center;gap:6px;
  padding:9px 11px;border-radius:9px;
  background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);
  font-size:11px;font-weight:600;color:rgba(255,255,255,0.55);
  text-decoration:none;transition:all .2s;
}
.pm-footer-link:hover{
  background:rgba(124,124,124,0.12);
  border-color:rgba(124,124,124,0.3);color:#c2c2c2;
}

/* ── HAMBURGER ── */
.nav-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0);}
.nav-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ════════════ OVERRIDE CLAIR NOIR & BLANC ════════════ */
.pm-overlay::before{background:rgba(0,0,0,.45);}
.pm-panel{background:#ffffff;border-right:1px solid rgba(0,0,0,.1);box-shadow:4px 0 50px rgba(0,0,0,.22);}
.pm-header{border-bottom:1px solid rgba(0,0,0,.08);}
.pm-logo{filter:none;}
.pm-close{background:#f2f2f2;border:1px solid rgba(0,0,0,.1);}
.pm-close:hover{background:#e6e6e6;}
.pm-close span{background:#0a0a0a;}
.pm-genre{border-bottom:1px solid rgba(0,0,0,.07);}
.pm-genre-btn{background:#f5f5f5;border:1px solid rgba(0,0,0,.08);color:#666;}
.pm-genre-btn:hover{background:#ececec;border-color:rgba(0,0,0,.16);color:#0a0a0a;}
.pm-genre-btn.active{background:#0a0a0a;border-color:#0a0a0a;color:#fff;box-shadow:none;}
.pm-sports{border-bottom:1px solid rgba(0,0,0,.07);}
.pm-sport-card{background:#f5f5f5;border:1px solid rgba(0,0,0,.07);}
.pm-sport-card:hover{background:#ececec;border-color:rgba(0,0,0,.16);}
.pm-sport-card.active{background:#0a0a0a;border-color:#0a0a0a;box-shadow:none;}
.pm-sport-card>span:last-child{color:#666;}
.pm-sport-card.active>span:last-child{color:#fff;}
.pm-slide-title{color:#888;border-bottom:1px solid rgba(0,0,0,.07);}
.pm-leagues-grid{scrollbar-color:rgba(0,0,0,.25) transparent;}
.pm-leagues-grid::-webkit-scrollbar-thumb{background:rgba(0,0,0,.25);}
.pm-league-btn:hover{background:#f2f2f2;border-color:rgba(0,0,0,.1);}
.pm-league-name{color:#222;}
.pm-league-btn:hover .pm-league-name{color:#000;}
.pm-league-count{background:#f0f0f0;color:#0a0a0a;}
.pm-back{color:#666;border-bottom:1px solid rgba(0,0,0,.07);}
.pm-back:hover{color:#0a0a0a;}
.pm-clubs-grid{scrollbar-color:rgba(0,0,0,.25) transparent;}
.pm-clubs-grid::-webkit-scrollbar-thumb{background:rgba(0,0,0,.25);}
.pm-club-btn{background:#f7f7f7;border:1px solid rgba(0,0,0,.06);}
.pm-club-btn:hover{background:#efefef;border-color:rgba(0,0,0,.16);}
.pm-club-name{color:#333;}
.pm-club-btn:hover .pm-club-name{color:#000;}
.pm-footer-links{border-top:1px solid rgba(0,0,0,.08);}
.pm-footer-link{background:#f5f5f5;border:1px solid rgba(0,0,0,.07);color:#555;}
.pm-footer-link:hover{background:#ececec;border-color:rgba(0,0,0,.16);color:#0a0a0a;}


/* ════════════ OVERRIDE FOND NOIR — menu slide-out ════════════ */
.pm-overlay::before{ background:rgba(0,0,0,.62); }
.pm-panel{ background:#0a0a0a; border-right:1px solid rgba(255,255,255,.12); box-shadow:4px 0 50px rgba(0,0,0,.7); }
.pm-header{ border-bottom:1px solid rgba(255,255,255,.1); }
.pm-logo{ filter:none; }
.pm-close{ background:#1a1a1a; border:1px solid rgba(255,255,255,.14); }
.pm-close:hover{ background:#262626; }
.pm-close span{ background:#fff; }
.pm-genre{ border-bottom:1px solid rgba(255,255,255,.08); }
.pm-genre-btn{ background:#161616; border:1px solid rgba(255,255,255,.1); color:#aaa; }
.pm-genre-btn:hover{ background:#222; border-color:rgba(255,255,255,.2); color:#fff; }
.pm-genre-btn.active{ background:#fff; border-color:#fff; color:#000; box-shadow:none; }
.pm-sports{ border-bottom:1px solid rgba(255,255,255,.08); }
.pm-sport-card{ background:#161616; border:1px solid rgba(255,255,255,.1); }
.pm-sport-card:hover{ background:#222; border-color:rgba(255,255,255,.2); }
.pm-sport-card.active{ background:#fff; border-color:#fff; box-shadow:none; }
.pm-sport-card>span:last-child{ color:#aaa; }
.pm-sport-card.active>span:last-child{ color:#000; }
.pm-slide-title{ color:#888; border-bottom:1px solid rgba(255,255,255,.08); }
.pm-leagues-grid{ scrollbar-color:rgba(255,255,255,.25) transparent; }
.pm-leagues-grid::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.25); }
.pm-league-btn:hover{ background:#161616; border-color:rgba(255,255,255,.12); }
.pm-league-name{ color:#ddd; }
.pm-league-btn:hover .pm-league-name{ color:#fff; }
.pm-league-count{ background:#1c1c1c; color:#fff; }
.pm-back{ color:#aaa; border-bottom:1px solid rgba(255,255,255,.08); }
.pm-back:hover{ color:#fff; }
.pm-clubs-grid{ scrollbar-color:rgba(255,255,255,.25) transparent; }
.pm-clubs-grid::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.25); }
.pm-club-btn{ background:#141414; border:1px solid rgba(255,255,255,.08); }
.pm-club-btn:hover{ background:#1e1e1e; border-color:rgba(255,255,255,.2); }
.pm-club-name{ color:#ccc; }
.pm-club-btn:hover .pm-club-name{ color:#fff; }
.pm-footer-links{ border-top:1px solid rgba(255,255,255,.1); }
.pm-footer-link{ background:#161616; border:1px solid rgba(255,255,255,.1); color:#aaa; }
.pm-footer-link:hover{ background:#222; border-color:rgba(255,255,255,.2); color:#fff; }


/* ════════════ FINAL — menu en NOIR PROFOND + texte blanc ════════════ */
.pm-panel{ background:#000000 !important; }
.pm-close{ background:#000000 !important; border:1px solid rgba(255,255,255,.18) !important; }
.pm-genre-btn,.pm-sport-card,.pm-club-btn,.pm-footer-link,.pm-league-btn{ background:#000000 !important; }
.pm-league-count{ background:#1a1a1a !important; color:#ffffff !important; }
.pm-genre-btn,.pm-league-name,.pm-club-name,.pm-footer-link,.pm-back,.pm-slide-title{ color:#ffffff !important; }
.pm-sport-card>span:last-child{ color:#e6e6e6 !important; }
.pm-genre-btn.active,.pm-sport-card.active{ background:#ffffff !important; border-color:#fff !important; }
.pm-genre-btn.active{ color:#000000 !important; }
.pm-sport-card.active>span:last-child{ color:#000000 !important; }

/* ═══ MENU GRIS ═══ */
.pm-panel{ background:#262626 !important; border-right:1px solid rgba(255,255,255,.14) !important; }
.pm-close{ background:#3a3a3a !important; }
.pm-close:hover{ background:#474747 !important; }
.pm-genre-btn,.pm-sport-card,.pm-club-btn,.pm-footer-link{ background:#333333 !important; border:1px solid rgba(255,255,255,.12) !important; }
.pm-genre-btn:hover,.pm-sport-card:hover,.pm-club-btn:hover,.pm-footer-link:hover{ background:#424242 !important; }
.pm-league-btn:hover{ background:#333333 !important; }
.pm-league-count{ background:#454545 !important; color:#fff !important; }
.pm-genre-btn.active,.pm-sport-card.active{ background:#ffffff !important; }
.pm-genre-btn.active{ color:#000000 !important; }
.pm-sport-card.active>span:last-child{ color:#000000 !important; }

/* ═══ INVERSION gris↔noir : panneau NOIR, lignes GRISES ═══ */
.pm-panel{ background:#000000 !important; border-right:1px solid rgba(255,255,255,.14) !important; }
.pm-close{ background:#2a2a2a !important; }
.pm-close:hover{ background:#383838 !important; }
.pm-genre-btn,.pm-sport-card,.pm-club-btn,.pm-footer-link,.pm-league-btn{ background:#2a2a2a !important; border:1px solid rgba(255,255,255,.1) !important; }
.pm-genre-btn:hover,.pm-sport-card:hover,.pm-club-btn:hover,.pm-footer-link:hover,.pm-league-btn:hover{ background:#3a3a3a !important; }
.pm-league-count{ background:#000000 !important; color:#ffffff !important; }
.pm-genre-btn.active,.pm-sport-card.active{ background:#ffffff !important; }
.pm-genre-btn.active{ color:#000000 !important; }
.pm-sport-card.active>span:last-child{ color:#000000 !important; }