/*
 Theme Name: LemonPaill Child
 Template: hello-elementor
*/

/* ====== RESET LÉGER ====== */
html, body { margin:0; padding:0; background:transparent; }
.site-header, .elementor-location-header { background:transparent !important; box-shadow:none !important; }

/* ====== VARIABLES ====== */
:root{
  --lp-black:#000;
  --lp-white:#fff;
  --lp-yellow:#F4D230;           /* jaune du site */
}

/* =========================================================
   HEADER & NAV (DESKTOP)
   ========================================================= */
.lp-header{
  position: sticky;                /* reste visible en scroll */
  top: 0;
  height: 0;                       /* n’ajoute PAS de bande blanche */
  z-index: 9999;
  background: transparent !important;
}
.lp-nav{
  position: relative;
  display: flex;
  justify-content: center;
  transform: translateY(clamp(14px, 2.4vw, 30px)); /* crée l’espace visuel sous le haut de la page */
}

/* Pastille du menu (verre dépoli) */
.lp-menu{
  list-style:none;
  margin:0;
  padding:8px 12px;
  display:inline-flex; align-items:center; gap:14px;
  border:1.5px solid var(--lp-black);
  border-radius:999px;
  background:rgba(255,255,255,.22);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  backdrop-filter: blur(10px) saturate(120%);
  box-shadow:0 1px 0 var(--lp-black), inset 0 1px 0 rgba(0,0,0,.08);
}
.lp-menu > li{ margin:0; padding:0; }
.lp-menu a{
  display:inline-block;
  padding:8px 12px;
  text-decoration:none;
  color:var(--lp-black);
  border-radius:12px;
  font-weight:600;
  line-height:1;
}
.lp-menu a:hover{ transform: translateY(-1px); }

/* CTA “Espace membre” */
.lp-menu > li:last-child > a{
  background:var(--lp-black);
  color:var(--lp-white);
  border:2px solid var(--lp-white);      /* liseré blanc demandé */
  border-radius:999px;
  padding:10px 16px;
  box-shadow:none;
}

/* =========================================================
   MOBILE (≤ 900px)
   ========================================================= */
.lp-burger{ display:none; }
.lp-mobile[hidden]{ display:none !important; }

@media (max-width:900px){
  /* On masque la pastille desktop */
  .lp-menu{ display:none !important; }

  /* ===== BURGER FIXE EN HAUT À DROITE ===== */
  .lp-burger{
    display:block;
    position: fixed !important;    /* pour ne pas dépendre du parent */
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 10010 !important;

    width:46px; height:46px;
    border-radius:50%;
    background:var(--lp-yellow);
    border:2px solid var(--lp-black);
    box-shadow:0 2px 0 rgba(0,0,0,.25);
  }
  .lp-burger span{
    position:absolute; left:11px; right:11px; height:2px;
    background:var(--lp-black); border-radius:2px;
    transition:transform .25s ease, opacity .2s ease, top .25s ease;
  }
  .lp-burger span:nth-child(1){ top:15px; }
  .lp-burger span:nth-child(2){ top:22px; }
  .lp-burger span:nth-child(3){ top:29px; }
  .lp-burger.is-open span:nth-child(1){ top:22px; transform:rotate(45deg); }
  .lp-burger.is-open span:nth-child(2){ opacity:0; }
  .lp-burger.is-open span:nth-child(3){ top:22px; transform:rotate(-45deg); }

  /* Décalage si barre d’admin WP visible */
  body.admin-bar .lp-burger{ top: 60px !important; }

  /* ===== PANNEAU MOBILE BLANC ===== */
  .lp-mobile{
    position: fixed; inset:0; z-index:10005;
    background:#fff; color:#000;
    padding:96px 24px 28px;
    transform:translateX(100%); transition:transform .28s ease;
    display:grid; gap:0;
  }
  .lp-mobile.is-open{ transform:translateX(0); }

  /* Liens sobres avec séparateur fin + animation d’apparition */
  .lp-mobile .menu-item{ list-style:none; margin:0; opacity:0; transform:translateY(6px); }
  .lp-mobile a{
    display:block; padding:16px 0;
    font-weight:700; color:#000; text-decoration:none;
    border-bottom:1px solid #eee;
  }
  .lp-mobile a:hover{ color:var(--lp-yellow); }

  /* Animation “stagger” */
  @keyframes lpFadeUp { from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:translateY(0)} }
  .lp-mobile.is-open .menu-item{ animation: lpFadeUp .22s ease forwards; }
  .lp-mobile.is-open .menu-item:nth-child(1){ animation-delay: 40ms; }
  .lp-mobile.is-open .menu-item:nth-child(2){ animation-delay: 80ms; }
  .lp-mobile.is-open .menu-item:nth-child(3){ animation-delay: 120ms; }
  .lp-mobile.is-open .menu-item:nth-child(4){ animation-delay: 160ms; }
  .lp-mobile.is-open .menu-item:nth-child(5){ animation-delay: 200ms; }
  .lp-mobile.is-open .menu-item:nth-child(6){ animation-delay: 240ms; }
}

/* Masquer header/footer UNIQUEMENT sur ce template */
.page-template-lemonpaill-–-classement .site-header,
.page-template-lemonpaill-–-classement header,
.page-template-lemonpaill-–-classement .site-footer,
.page-template-lemonpaill-–-classement footer {
  display: none !important;
}

/* Si le nom du template diffère, ajoute plutôt : */
.lp-hide-theme-ui .site-header,
.lp-hide-theme-ui header,
.lp-hide-theme-ui .site-footer,
.lp-hide-theme-ui footer { display:none !important; }

/* ----- Le reste du style (déjà fourni) ----- */
.lp.lp-cls, .lp.lp-cls * { box-sizing: border-box; }
.lp.lp-cls{ display:grid; grid-template-columns:32% 68%; min-height:min(100vh,100dvh); background:#f3f3f3; }
.lp-cls-left{ position:relative; padding:32px 28px; color:#fff; background:linear-gradient(180deg,#f39a3b 0%,#e86c3a 100%); display:flex; flex-direction:column; justify-content:space-between; }
.lp-cls-left-top{ display:flex; gap:8px; }
.lp-pill{ border:1px solid rgba(255,255,255,.45); background:rgba(255,255,255,.12); color:#fff; width:40px; height:40px; border-radius:999px; display:grid; place-items:center; cursor:pointer; }
.pill-ghost{ background:transparent; }
.lp-eyebrow{ margin:0 0 8px; opacity:.9; }
.lp-title{ margin:0 0 8px; font-size:clamp(28px,3.6vw,44px); line-height:1.05; }
.lp-sub{ margin:0; opacity:.9; max-width:26ch; }
.lp-gear{ position:absolute; left:16px; bottom:16px; opacity:.75; }
.lp-cls-right{ padding:28px clamp(16px,2.8vw,36px); background:#eef1ee; }
.lp-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.lp-head h2{ margin:0; font-size:clamp(20px,2.2vw,28px); }
.lp-select{ position:relative; display:inline-flex; align-items:center; background:#fff; border:1px solid #d7d7d7; border-radius:8px; padding:8px 36px 8px 12px; }
.lp-select select{ appearance:none; border:0; outline:none; background:transparent; min-width:240px; font-size:14px; }
.lp-select .car{ position:absolute; right:10px; pointer-events:none; }
.lp-table{ background:rgba(255,255,255,.8); border:1px solid #e2e2e2; border-radius:16px; overflow:hidden; backdrop-filter:blur(4px); }
.lp-thead, .lp-row{ display:grid; align-items:center; grid-template-columns:1.6fr .6fr .6fr .8fr .8fr 56px; }
.lp-thead{ background:rgba(250,250,250,.7); color:#666; font-weight:600; padding:14px 18px; border-bottom:1px solid #e9e9e9; }
.lp-tbody .lp-row{ padding:14px 18px; color:#2b2b2b; text-decoration:none; border-bottom:1px solid #eaeaea; transition:background .15s ease; }
.lp-tbody .lp-row:hover{ background:rgba(0,0,0,.035); }
.c-name{ display:flex; align-items:center; gap:10px; min-width:0; }
.nm{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.c-points strong{ font-weight:700; }
.ob{ width:36px; height:36px; display:inline-grid; place-items:center; border-radius:999px; background:#e8c53a; border:1px solid rgba(0,0,0,.08); }
.dot{ width:14px; height:14px; border-radius:50%; display:inline-block; border:1px solid rgba(0,0,0,.12); }
.podium-1 .dot{ background:#d4af37; } .podium-2 .dot{ background:#bfc0c0; } .podium-3 .dot{ background:#b87333; }
.r{ opacity:.7; min-width:22px; }
.lp-empty{ padding:24px; text-align:center; color:#7b7b7b; }
@media (max-width:1024px){
  .lp.lp-cls{ grid-template-columns:100%; }
  .lp-cls-left{ display:none; }
  .lp-cls-right{ padding:18px 14px; }
  .lp-thead, .lp-row{ grid-template-columns:1.4fr .6fr .6fr .6fr .7fr 44px; }
  .ob{ width:32px; height:32px; }
}
@media (max-width:640px){
  .lp-thead, .lp-row{ grid-template-columns:1.6fr .6fr .6fr .7fr 44px; }
  .c-presences{ display:none; }
  .lp-select select{ min-width:160px; }
}