/* ============================================================================
   BVL Mobile Nav — version SIMPLIFIÉE & ROBUSTE.
   Barre flottante (bas) + menu plein écran à ACCORDÉON + recherche live.
   100 % mobile (≤ 900px). Hors mobile : masqué.
   ============================================================================ */
:root{ --mnav-ease:cubic-bezier(.22,1,.36,1); }

.bvl-mnav{ display:none; }

@media (max-width:900px){

  .bvl-mnav{ display:block; }
  body{ padding-bottom:96px !important; }
  .bvl-sticky-cart{ bottom:86px !important; }
  /* Une seule entrée de menu = la barre du bas → on masque le burger du thème */
  .site-header .menu-btn{ display:none !important; }

  /* ---------- BARRE BAS (sous le menu thème z200 et le panier z101) ---------- */
  .bvl-mnav-bar{
    position:fixed; left:16px; right:16px; bottom:16px; height:64px; z-index:90;
    background:var(--ink,#0A0A0A); border-radius:20px; display:flex; align-items:center;
    box-shadow:0 14px 40px rgba(0,0,0,.3);
  }
  .bvl-mnav-tab{
    flex:1; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    color:rgba(250,250,247,.55); background:none; border:0; cursor:pointer; text-decoration:none;
    position:relative; transition:color .2s; -webkit-tap-highlight-color:transparent;
  }
  .bvl-mnav-tab svg{ width:21px; height:21px; display:block; }
  .bvl-mnav-tl{ font-family:var(--mono,monospace); font-size:8px; letter-spacing:.1em; text-transform:uppercase; }
  .bvl-mnav-tab.on{ color:var(--acid,#D8FF3D); }
  .bvl-mnav-bdg{
    position:absolute; top:8px; right:calc(50% - 18px);
    background:var(--acid,#D8FF3D); color:var(--ink,#0A0A0A);
    font-family:var(--mono,monospace); font-size:8px; font-weight:700;
    min-width:15px; height:15px; border-radius:99px; display:flex; align-items:center; justify-content:center; padding:0 3px;
  }

  /* ---------- OVERLAYS ---------- */
  .bvl-mnav-menu, .bvl-mnav-srch{
    position:fixed; inset:0; z-index:9100; background:var(--ink,#0A0A0A); color:var(--paper,#FAFAF7);
    display:flex; flex-direction:column; visibility:hidden;
    transform:translateX(-100%); transition:transform .4s var(--mnav-ease), visibility .4s;
  }
  .bvl-mnav-srch{ transform:translateY(100%); }
  .bvl-mnav.is-menu   .bvl-mnav-menu{ transform:none; visibility:visible; }
  .bvl-mnav.is-search .bvl-mnav-srch{ transform:none; visibility:visible; }

  .bvl-mnav-menu-h{
    display:flex; align-items:center; justify-content:space-between; flex:none;
    padding:18px 22px; border-bottom:1px solid rgba(255,255,255,.1);
  }
  .bvl-mnav-word{ font-family:var(--display,'Inter Tight',sans-serif); font-weight:700; letter-spacing:.18em; font-size:15px; color:var(--paper,#FAFAF7); }
  .bvl-mnav-x{ width:40px; height:40px; border:0; background:none; color:var(--paper,#FAFAF7); font-size:24px; line-height:1; cursor:pointer; }

  /* ---------- LISTE (ACCORDÉON) ---------- */
  .bvl-mnav-list{ flex:1; overflow-y:auto; padding:6px 0; -webkit-overflow-scrolling:touch; }
  .bvl-mnav-row{
    display:flex; align-items:center; justify-content:space-between; width:100%; text-align:left;
    background:none; border:0; border-bottom:1px solid rgba(255,255,255,.07);
    color:var(--paper,#FAFAF7); font-family:var(--display,'Inter Tight',sans-serif);
    font-size:22px; font-weight:600; letter-spacing:-.02em; padding:15px 22px; cursor:pointer; text-decoration:none;
  }
  .bvl-mnav-row:active{ background:rgba(255,255,255,.04); }
  .bvl-mnav-chev{ font-family:var(--mono,monospace); font-size:22px; font-weight:300; color:rgba(250,250,247,.5); transition:transform .25s var(--mnav-ease); }
  .bvl-mnav-grp.open .bvl-mnav-chev{ transform:rotate(45deg); }
  .bvl-mnav-acc{ max-height:0; overflow:hidden; transition:max-height .35s var(--mnav-ease); background:rgba(255,255,255,.03); }
  .bvl-mnav-grp.open .bvl-mnav-acc{ max-height:560px; }
  .bvl-mnav-sub{ display:block; color:rgba(250,250,247,.72); text-decoration:none; font-size:15px; padding:12px 22px 12px 34px; border-bottom:1px solid rgba(255,255,255,.05); }
  .bvl-mnav-sub:first-child{ color:var(--acid,#D8FF3D); }

  .bvl-mnav-menu-f{ flex:none; display:flex; gap:22px; padding:16px 22px; border-top:1px solid rgba(255,255,255,.1); font-family:var(--mono,monospace); font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
  .bvl-mnav-menu-f a{ color:rgba(250,250,247,.6); text-decoration:none; }

  /* ---------- RECHERCHE ---------- */
  .bvl-mnav-field{ display:flex; align-items:center; gap:11px; margin:20px 22px 0; flex:none; border-bottom:1.5px solid rgba(250,250,247,.28); padding-bottom:12px; }
  .bvl-mnav-field svg{ width:22px; height:22px; flex:none; stroke:rgba(250,250,247,.5); }
  .bvl-mnav-field input{ flex:1; background:none; border:0; outline:none; color:var(--paper,#FAFAF7); font-family:var(--display,'Inter Tight',sans-serif); font-size:22px; font-weight:500; }
  .bvl-mnav-field input::placeholder{ color:rgba(250,250,247,.32); }
  .bvl-mnav-clr{ background:none; border:0; color:rgba(250,250,247,.5); font-size:20px; cursor:pointer; display:none; }
  .bvl-mnav.is-typing .bvl-mnav-clr{ display:block; }
  .bvl-mnav-srch-body{ flex:1; overflow-y:auto; padding:22px; }
  .bvl-mnav-lbl{ font-family:var(--mono,monospace); font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--acid,#D8FF3D); margin:0 0 14px; }
  .bvl-mnav.is-typing .bvl-mnav-rest{ display:none; }
  .bvl-mnav:not(.is-typing) .bvl-mnav-results{ display:none; }
  .bvl-mnav-trend a{ display:block; color:rgba(250,250,247,.6); text-decoration:none; font-family:var(--display,'Inter Tight',sans-serif); font-size:22px; font-weight:600; padding:8px 0; }
  .bvl-mnav-res{ display:flex; align-items:center; gap:14px; padding:11px 0; text-decoration:none; color:var(--paper,#FAFAF7); border-bottom:1px solid rgba(255,255,255,.08); }
  .bvl-mnav-res .th{ width:50px; height:50px; flex:none; border-radius:9px; overflow:hidden; background:#1a1a18; }
  .bvl-mnav-res .th img{ width:100%; height:100%; object-fit:cover; }
  .bvl-mnav-res .br{ font-family:var(--mono,monospace); font-size:9px; letter-spacing:.13em; color:rgba(250,250,247,.5); text-transform:uppercase; margin-bottom:4px; }
  .bvl-mnav-res .nm{ font-size:15px; font-weight:500; }
  .bvl-mnav-res .pr{ margin-left:auto; font-size:14px; font-weight:600; color:var(--acid,#D8FF3D); white-space:nowrap; }
  .bvl-mnav-none{ color:rgba(250,250,247,.4); padding:24px 0; }
}