/* ============================================================================
   GOLD BERG — MOBILE DRAWER MENU  (single-button / single-click)
   Add this block at the END of style.css
   ============================================================================
   WHY: the old menu had TWO stylesheets fighting (.menu-toggle/.main-nav.active
   from style.css vs .menu-toggle/.main-nav.open from user-style-ref.css) plus a
   second binding source, which produced two icons and needed two clicks.
   ============================================================================ */

/* 1. Kill every legacy hamburger so a second icon can never appear */
.menu-toggle{display:none !important}

/* 2. The ONE new hamburger button (hidden on desktop) */
.gbg-burger{
  display:none;
  background:transparent;
  border:1px solid var(--border);
  width:44px;height:44px;border-radius:4px;
  padding:0;cursor:pointer;
  align-items:center;justify-content:center;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .25s,background .25s;
}
.gbg-burger:hover{border-color:var(--red)}
.gbg-burger-inner{display:block;width:22px;height:16px;position:relative}
.gbg-burger-inner span,
.gbg-burger-inner span::before,
.gbg-burger-inner span::after{
  content:'';position:absolute;left:0;width:22px;height:2px;
  background:var(--navy);display:block;
  transition:transform .3s ease,opacity .2s ease,background .2s ease;
}
.gbg-burger-inner span{top:7px}
.gbg-burger-inner span::before{top:-7px}
.gbg-burger-inner span::after{top:7px}

/* button morphs into an X while the drawer is open */
body.gbg-menu-open .gbg-burger-inner span{background:transparent}
body.gbg-menu-open .gbg-burger-inner span::before{transform:translateY(7px) rotate(45deg)}
body.gbg-menu-open .gbg-burger-inner span::after{transform:translateY(-7px) rotate(-45deg)}

/* 3. Dark overlay */
.gbg-overlay{
  position:fixed;top:0;right:0;bottom:0;left:0;
  background:rgba(0,0,0,.6);
  opacity:0;visibility:hidden;
  transition:opacity .3s ease,visibility .3s ease;
  z-index:9998;
}
body.gbg-menu-open .gbg-overlay{opacity:1;visibility:visible}

/* 4. Left slide-in drawer */
.gbg-drawer{
  position:fixed;top:0;left:0;height:100%;
  width:290px;max-width:85vw;
  background:#1a1a2e;
  z-index:9999;
  transform:translateX(-100%);
  transition:transform .35s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;
  overflow-y:auto;-webkit-overflow-scrolling:touch;
  box-shadow:4px 0 26px rgba(0,0,0,.45);
}
body.gbg-menu-open .gbg-drawer{transform:translateX(0)}

/* close (X) button — top right inside the drawer */
.gbg-drawer-close{
  position:absolute;top:12px;right:12px;
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.1);border:0;color:#fff;
  font-size:24px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .25s ease,transform .25s ease;
}
.gbg-drawer-close:hover{background:#c1272d;transform:rotate(90deg)}

.gbg-drawer-head{
  padding:20px 20px 16px;
  border-bottom:1px solid rgba(255,255,255,.1);
  padding-right:62px;
}
.gbg-drawer-head img{height:44px;width:auto;background:#fff;padding:6px;border-radius:5px;display:block}

/* 5. Menu items — white text, red hover */
.gbg-drawer-nav{padding:8px 0}
.gbg-drawer-nav ul{list-style:none;margin:0;padding:0}
.gbg-drawer-nav li{position:relative;margin:0}
.gbg-drawer-nav li a{
  display:block;
  padding:14px 22px;
  color:#fff;
  font-size:14px;font-weight:600;
  text-transform:uppercase;letter-spacing:1.2px;
  border-bottom:1px solid rgba(255,255,255,.07);
  transition:background .25s ease,color .25s ease,padding-left .25s ease;
}
.gbg-drawer-nav li a:hover,
.gbg-drawer-nav li a:focus,
.gbg-drawer-nav li.current-menu-item > a,
.gbg-drawer-nav li.current_page_item > a{
  background:#c1272d;color:#fff;padding-left:28px;
}
/* sub menus */
.gbg-drawer-nav .sub-menu{background:rgba(0,0,0,.28);list-style:none;margin:0;padding:0}
.gbg-drawer-nav .sub-menu li a{
  padding:11px 22px 11px 38px;
  font-size:13px;font-weight:500;
  text-transform:none;letter-spacing:.3px;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.gbg-drawer-nav .sub-menu li a:hover{background:#c1272d;padding-left:44px}
/* "Request a Quote" style item */
.gbg-drawer-nav li.quote-btn-strip{background:#c1272d}
.gbg-drawer-nav li.quote-btn-strip a{background:transparent;border-bottom:0}
.gbg-drawer-nav li.quote-btn-strip a:hover{background:#a81f25}

.gbg-drawer-foot{
  margin-top:auto;
  padding:18px 22px;
  border-top:1px solid rgba(255,255,255,.1);
  color:#9aa0b4;font-size:13px;line-height:1.9;
}
.gbg-drawer-foot a{color:#9aa0b4;transition:color .25s ease}
.gbg-drawer-foot a:hover{color:#c1272d}

/* 6. body scroll lock while the drawer is open */
body.gbg-menu-open{overflow:hidden}

/* 7. Breakpoint: mobile / tablet */
@media(max-width:992px){
  .gbg-burger{display:inline-flex}
  /* the dark nav strip is not needed on mobile — hiding it also removes
     any leftover second hamburger that used to sit inside it */
  .nav-strip{display:none !important}
  .header-inner{flex-wrap:wrap}
  .header-search{flex:0 0 100%;order:3;max-width:none;margin:10px 0 0}
}

/* 8. Drawer is mobile-only */
@media(min-width:993px){
  .gbg-drawer,
  .gbg-overlay{display:none !important}
}

/* 9. nicer on very small phones */
@media(max-width:400px){
  .gbg-drawer{width:82vw}
  .gbg-drawer-nav li a{font-size:13px;padding:13px 18px}
}
/* ===== MOBILE MENU BLUE THEME ===== */
@media (max-width: 992px) {
  .gbg-drawer,
  .gbg-drawer-wrapper {
    background: linear-gradient(180deg, #1e3c72 0%, #2a5298 100%) !important;
  }
  
  .gbg-drawer-list li a {
    color: #ffffff !important;
  }
  
  .gbg-drawer-list li a:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
  }
}