
/* ===== VERDOR Mobile Bar v27 (mobile-only) ===== */
@media (max-width: 1024px) {
  /* Top bar */
  .mb27-bar {
    position: fixed !important;
    top: 0; left: 0; right: 0;
    height: 56px;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 12px !important;
    background: #ffffff !important;
    border-bottom: 1px solid rgba(0,0,0,.06) !important;
    z-index: 2147483647 !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.08) !important;
  }
  .mb27-left { display: flex; align-items: center; gap: 8px; }
  .mb27-logo { height: 28px; width: auto; }
  .mb27-title { font-weight: 700; font-size: 16px; }
  .mb27-burger {
    width: 44px; height: 44px; display:flex; align-items:center; justify-content:center;
    background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:10px; box-shadow:0 6px 18px rgba(0,0,0,.12);
  }
  .mb27-burger span, .mb27-burger::before, .mb27-burger::after {
    content:""; display:block; width:22px; height:2px; background:#111; position:relative;
    transition:transform .25s, opacity .2s;
  }
  .mb27-burger::before { position:absolute; transform: translateY(-6px); }
  .mb27-burger::after  { position:absolute; transform: translateY(6px); }
  .mb27-open .mb27-burger span{ opacity:0; }
  .mb27-open .mb27-burger::before{ transform: rotate(45deg); }
  .mb27-open .mb27-burger::after{ transform: rotate(-45deg); }

  /* Full-screen overlay menu */
  .mb27-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,.48);
    opacity: 0; pointer-events: none; transition: opacity .22s;
    z-index: 2147483646;
  }
  .mb27-open .mb27-overlay { opacity: 1; pointer-events: auto; }

  .mb27-panel {
    position: fixed; top:56px; left: 0; right:0; bottom: 0;
    background:#fff; transform: translateY(-6%); opacity: 0;
    transition: transform .26s ease, opacity .22s ease;
    z-index: 2147483646;
    display: flex; flex-direction: column;
  }
  .mb27-open .mb27-panel { transform: translateY(0); opacity: 1; }

  .mb27-menu {
    list-style: none; margin: 0; padding: 8px 8px 20px 8px; overflow:auto; flex:1;
  }
  .mb27-menu li a {
    display:block; padding: 14px 14px; text-decoration:none; color:#111;
    border-bottom: 1px solid rgba(0,0,0,.06);
  }

  /* Push body content below the bar */
  body { padding-top: 56px !important; }
}


/* v27b: hide legacy header on mobile to avoid duplicate brand bar */
@media (max-width: 1024px) {
  header,
  .site-header {
    display: none !important;
  }
  /* but still keep main content spacing from our fixed bar */
  body { padding-top: 56px !important; }
}

/* v27c: right action group (cart + burger) */
@media (max-width: 1024px) {
  .mb27-right { display:flex; align-items:center; gap:8px; }
  .mb27-btn {
    width: 44px; height: 44px; display:flex; align-items:center; justify-content:center;
    background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:10px; box-shadow:0 6px 18px rgba(0,0,0,.12);
  }
  .mb27-cart svg { width:22px; height:22px; }
  .mb27-badge {
    position:absolute; top:-4px; right:-4px; min-width:18px; height:18px; border-radius:9px;
    background:#111; color:#fff; font-size:11px; line-height:18px; text-align:center; padding:0 4px;
  }
  .mb27-btn-wrap { position:relative; }
}


/* v27e: Title in bar + hide in-content titles on mobile */
@media (max-width: 1024px) {
  .mb27-title {
    font-weight: 700; font-size: 15px; line-height: 1;
    max-width: 46vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  /* Hide duplicate brand/title sections on mobile (content area) */
  .page-header, .page-title, .site-branding, .brand, .store-title,
  .masthead, .breadcrumb, .breadcrumbs, .header__brand, .logo-text {
    display: none !important;
  }
  /* Generic: hide the first H1 in main to avoid duplicate page title */
  main h1:first-of-type { display: none !important; }
}


/* v27f: Masquer le menu mobile en desktop (>=1025px) */
@media (min-width: 1025px) {
  .mb27-panel,
  .mb27-overlay,
  .mb27-bar,
  .mb27-menu,
  .mb27-panel ul,
  footer .mb27-menu {
    display: none !important;
  }
}


/* v27g: prevent ghost elements on desktop */
/* Default: hide everything (safety) */
.mb27-bar,
.mb27-overlay,
.mb27-panel,
.mb27-menu { display: none; }

/* Mobile explicit show */
@media (max-width: 1024px) {
  .mb27-bar { display: flex !important; }
  .mb27-overlay,
  .mb27-panel { display: block !important; }
  .mb27-menu { display: block !important; }
}

/* Desktop force-hide (extra safety) */
@media (min-width: 1025px) {
  .mb27-panel,
  .mb27-overlay,
  .mb27-bar,
  .mb27-menu { display: none !important; }
}


/* v27i: prevent invisible panel from catching clicks */
@media (max-width: 1024px) {
  .mb27-panel { pointer-events: none; visibility: hidden; }
  .mb27-open .mb27-panel { pointer-events: auto; visibility: visible; }
}
