/* ==========================================
   FINAL CLICKABILITY FIX (Chrome Safe)
   ========================================== */

/* Always allow header clicks */
.header,
.header * {
  pointer-events: auto !important;
  z-index: 99999 !important;
}

/* Main site canvas must be clickable */
[data-canvas="container"],
.l-theme {
  position: relative !important;
  z-index: 10 !important;
  pointer-events: auto !important;
}

/* Off-canvas menu must NOT block page when closed */
.mobile-nav,
.sb-slidebar,
.slidebar,
.offcanvas-menu {
  pointer-events: none !important;
}

/* Enable menu only when open */
body.slidebar-open .mobile-nav,
body.offcanvas-open .mobile-nav,
body.mobile-nav-open .mobile-nav,
.mobile-nav.active,
.mobile-nav.sb-active,
.mobile-nav.is-open {
  pointer-events: auto !important;
}

/* Kill invisible overlays that block clicks */
.sb-site-overlay,
.sb-overlay,
.slidebar-overlay,
.offcanvas-overlay,
.js-offcanvas-overlay,
#sb-site-overlay,
[class*="overlay"],
[id*="overlay"] {
  pointer-events: none !important;
}
/* MOBILE ACCORDION BUTTONS: make them visible + styled */
.mobile-nav .mobile-acc-btn{
  background: #f2f2f2 !important;
  color: #111 !important;
  border: 1px solid rgba(0,0,0,.12) !important;
}

/* Chevron visible */
.mobile-nav .mobile-acc-btn .chev{
  color: #111 !important;
  opacity: 1 !important;
}
/* Override theme.css: allow accordion panels to open/close */
.mobile-nav .mobile-acc-panel[hidden]{
  display: none !important;
  padding: 10px 6px 0;
}

.mobile-nav .mobile-acc-panel:not([hidden]){
  display: block !important;
  padding: 10px 6px 0;
}
/* ================================
   MOBILE ACCORDION — FORCE OPEN/CLOSE
   Overrides theme.css display:none
   ================================ */

/* Keep panels closed by default */
.mobile-nav li.mobile-acc > .mobile-acc-panel{
  display: none !important;
  padding: 10px 6px 0 !important;
}

/* Open state (class-driven) */
.mobile-nav li.mobile-acc.is-open > .mobile-acc-panel{
  display: block !important;
}

/* Make the buttons visibly clickable */
.mobile-nav .mobile-acc-btn{
  background: #f2f2f2 !important;
  color: #111 !important;
  border: 1px solid rgba(0,0,0,.12) !important;
}
.mobile-details { width: 100%; }
.mobile-details > summary.mobile-acc-btn { list-style: none; cursor: pointer; }
.mobile-details > summary::-webkit-details-marker { display: none; }
.mobile-acc-panel-content { padding: 10px 6px 0; }
.mobile-details[open] .chev { transform: rotate(180deg); display: inline-block; }
.mobile-details > summary {
  pointer-events: auto !important;
  user-select: none;
}
/* Native mobile accordion */
.mobile-details { width: 100%; }

.mobile-details > summary.mobile-acc-btn {
  list-style: none;
  cursor: pointer;
}

.mobile-details > summary::-webkit-details-marker {
  display: none;
}

.mobile-acc-panel-content {
  padding: 10px 6px 0;
}

.mobile-details[open] .chev {
  transform: rotate(180deg);
  display: inline-block;
}
/* FORCE mobile menu above hero/credibility bar */
.mobile-nav{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  height: 100vh !important;
  width: min(86vw, 360px) !important;
  background: #ffffff !important;
  z-index: 999999 !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  pointer-events: auto !important;
}

/* Ensure everything inside menu is clickable */
.mobile-nav *{
  pointer-events: auto !important;
}

/* Keep hero behind the menu */
.hero-intro{
  position: relative !important;
  z-index: 1 !important;
}

/* Optional overlay (if you use one) */
#mobileNavOverlay{
  position: fixed;
  inset: 0;
  z-index: 999998;
  background: rgba(0,0,0,.45);
}
.mobile-details { width: 100%; }
.mobile-details > summary.mobile-acc-btn { list-style: none; cursor: pointer; }
.mobile-details > summary::-webkit-details-marker { display:none; }
.mobile-acc-panel-content { padding: 10px 6px 0; }
.mobile-details[open] .chev { transform: rotate(180deg); display:inline-block; }
/* Mobile accordion button background + text */
.mobile-nav .mobile-acc-btn,
.mobile-nav .mobile-details > summary.mobile-acc-btn{
  background: #f2f2f2 !important;
  color: #111 !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 12px !important;
}

/* Hover / focus */
.mobile-nav .mobile-acc-btn:hover,
.mobile-nav .mobile-details > summary.mobile-acc-btn:hover,
.mobile-nav .mobile-acc-btn:focus,
.mobile-nav .mobile-details > summary.mobile-acc-btn:focus{
  background: #e9e9e9 !important;
  outline: none !important;
}

/* When the <details> is open, keep it highlighted */
.mobile-nav details[open] > summary.mobile-acc-btn{
  background: #e9e9e9 !important;
}

/* Chevron visible */
.mobile-nav .chev{
  color: #111 !important;
  opacity: 1 !important;
}
.mobile-details { width: 100%; }
.mobile-details > summary.mobile-acc-btn { list-style: none; cursor: pointer; }
.mobile-details > summary::-webkit-details-marker { display: none; }
.mobile-acc-panel-content { padding: 10px 6px 0; }
.mobile-details[open] .chev { transform: rotate(180deg); display: inline-block; }

/* Safety: ensure Services summary is clickable */
.mobile-details > summary { pointer-events: auto !important; }
/* When mobile menu is open, disable hero interaction */
body.mobile-nav-open .hero-intro,
body.mobile-nav-open .credibility-bar {
  pointer-events: none !important;
}

/* Ensure mobile menu always sits above hero */
.mobile-nav {
  z-index: 999999 !important;
  background: #fff !important;
}
/* ==========================================
   GUARANTEED FIX: stop click-stealing layers
   When menu open -> only menu is interactive
   ========================================== */

/* 1) Disable clicks everywhere when menu is open */
body.mobile-nav-open * {
  pointer-events: none !important;
}

/* 2) Re-enable clicks only for the mobile menu + its children */
body.mobile-nav-open .mobile-nav,
body.mobile-nav-open .mobile-nav * {
  pointer-events: auto !important;
}

/* 3) Force mobile menu above everything */
body.mobile-nav-open .mobile-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  height: 100vh !important;
  width: min(86vw, 360px) !important;
  background: #ffffff !important;
  z-index: 2147483647 !important; /* max practical z-index */
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
/* Make native accordion behave predictably */
.mobile-details { width: 100%; }
.mobile-details > summary.mobile-acc-btn { list-style: none; cursor: pointer; }
.mobile-details > summary::-webkit-details-marker { display: none; }

.mobile-acc-panel-content { padding: 10px 6px 0; }

/* Ensure submenu renders cleanly (prevents floating/overlay look) */
.mobile-submenu { list-style: none; padding: 0; margin: 0; }
.mobile-submenu li { margin: 6px 0; }
.mobile-submenu a { display: block; padding: 12px 14px; border-radius: 12px; text-decoration: none; }

/* Chevron rotate */
.mobile-details[open] .chev { transform: rotate(180deg); display: inline-block; }
.mobile-details { width: 100%; }
.mobile-details > summary.mobile-acc-btn { list-style: none; cursor: pointer; }
.mobile-details > summary::-webkit-details-marker { display: none; }
.mobile-acc-panel-content { padding: 10px 6px 0; }
.mobile-details[open] .chev { transform: rotate(180deg); display: inline-block; }
/* ==============================
   Mobile menu: unified styling
   ============================== */

/* Drawer */
.mobile-nav{
  background: #ffffff !important;
}

/* Top CTA button inside menu (if it's using .btn) */
.mobile-nav .nav-cta-mobile .btn{
  background: #1F6FAE !important;
  border-color: #1F6FAE !important;
  color: #fff !important;
  border-radius: 12px !important;
}

/* Phone row */
.mobile-nav .mobile-link a{
  color: #0F2A44 !important;
}

/* Accordion tile (summary/button look) */
.mobile-nav .mobile-acc-btn{
  width: 100%;
  background: #f3f5f7 !important;
  color: #0F2A44 !important;
  border: 1px solid rgba(15,42,68,.14) !important;
  border-radius: 12px !important;
  padding: 14px 14px !important;
  font-weight: 700 !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Hover/focus */
.mobile-nav .mobile-acc-btn:hover,
.mobile-nav .mobile-acc-btn:focus{
  background: #eef2f6 !important;
  border-color: rgba(31,111,174,.40) !important;
  outline: none !important;
}

/* When <details> is open */
.mobile-nav details[open] > summary.mobile-acc-btn{
  background: #eef2f6 !important;
  border-color: #1F6FAE !important;
  box-shadow: 0 10px 22px rgba(31,111,174,.12);
}

/* Chevron */
.mobile-nav .chev{
  color: #0F2A44 !important;
  opacity: 1 !important;
}
.mobile-nav details[open] .chev{
  transform: rotate(180deg);
}

/* Panel content */
.mobile-nav .mobile-acc-panel-content{
  padding: 10px 6px 0 !important;
}

/* Section subtitles */
.mobile-nav .mobile-acc-subtitle{
  color: rgba(15,42,68,.70) !important;
  font-weight: 700 !important;
}

/* Submenu links */
.mobile-nav .mobile-submenu a{
  display: block;
  background: #ffffff !important;
  color: #0F2A44 !important;
  border: 1px solid rgba(15,42,68,.10) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  text-decoration: none !important;
}

/* Hover/focus on submenu links */
.mobile-nav .mobile-submenu a:hover,
.mobile-nav .mobile-submenu a:focus{
  background: #f7fbff !important;
  border-color: rgba(31,111,174,.35) !important;
  color: #1F6FAE !important;
  outline: none !important;
}

/* Contact row tile look (if needed) */
.mobile-nav .mobile-link a{
  background: #ffffff !important;
  border: 1px solid rgba(15,42,68,.10) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  text-decoration: none !important;
}
.mobile-nav .mobile-link a:hover{
  background: #f7fbff !important;
  border-color: rgba(31,111,174,.35) !important;
  color: #1F6FAE !important;
}
/* ==========================================
   MOBILE MENU FINAL LAYOUT + CLEAN LOOK
   (fixes bullets, spacing, and messy overlay)
   ========================================== */

/* Drawer panel */
#mobileNav.mobile-nav{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  height: 100vh !important;
  width: min(86vw, 380px) !important;
  background: #ffffff !important;
  z-index: 2147483647 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 14px 12px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.22);
  -webkit-overflow-scrolling: touch;
}

/* Lock page scroll when menu open */
body.mobile-nav-open{
  overflow: hidden !important;
}

/* Overlay behind menu */
#mobileNavOverlay{
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,.45) !important;
  z-index: 2147483646 !important;
}

/* Reset default list styles inside menu (removes bullets/indent) */
#mobileNav ul,
#mobileNav li{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Native <details>/<summary> accordion */
#mobileNav details{
  width: 100% !important;
  margin: 10px 0 !important;
}

#mobileNav details > summary{
  list-style: none !important;
  cursor: pointer !important;
  user-select: none !important;

  background: #f3f5f7 !important;
  color: #0F2A44 !important;
  border: 1px solid rgba(15,42,68,.16) !important;
  border-radius: 14px !important;

  padding: 14px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-weight: 800 !important;
}

/* Remove default summary marker */
#mobileNav details > summary::-webkit-details-marker{
  display: none !important;
}

/* Open state */
#mobileNav details[open] > summary{
  border-color: rgba(31,111,174,.55) !important;
  background: #eef4fb !important;
  box-shadow: 0 10px 24px rgba(31,111,174,.14);
}

/* Chevron */
#mobileNav .chev{
  color: #0F2A44 !important;
  opacity: 1 !important;
  transition: transform .2s ease !important;
}
#mobileNav details[open] .chev{
  transform: rotate(180deg) !important;
}

/* Panel content spacing */
#mobileNav .mobile-acc-panel-content{
  padding: 10px 6px 2px !important;
}

/* Section subtitles (Canada/USA) */
#mobileNav .mobile-acc-subtitle{
  margin: 10px 8px 6px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: rgba(15,42,68,.65) !important;
}

/* Submenu links become clean "cards" */
#mobileNav .mobile-submenu a,
#mobileNav .mobile-link a{
  display: block !important;
  margin: 6px 0 !important;
  padding: 12px 14px !important;

  background: #ffffff !important;
  border: 1px solid rgba(15,42,68,.12) !important;
  border-radius: 12px !important;

  color: #0F2A44 !important;
  text-decoration: none !important;
  line-height: 1.25 !important;
}

/* Hover/focus */
#mobileNav .mobile-submenu a:hover,
#mobileNav .mobile-submenu a:focus,
#mobileNav .mobile-link a:hover,
#mobileNav .mobile-link a:focus{
  background: #f7fbff !important;
  border-color: rgba(31,111,174,.45) !important;
  color: #1F6FAE !important;
  outline: none !important;
}
/* ==========================================
   MOBILE MENU FINAL LAYOUT + CLEAN LOOK
   ========================================== */

#mobileNav.mobile-nav{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  height: 100vh !important;
  width: min(86vw, 380px) !important;
  background: #ffffff !important;
  z-index: 2147483647 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 14px 12px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.22);
  -webkit-overflow-scrolling: touch;
}

body.mobile-nav-open{
  overflow: hidden !important;
}

#mobileNavOverlay{
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,.45) !important;
  z-index: 2147483646 !important;
  display: none;
}

body.mobile-nav-open #mobileNavOverlay{
  display: block !important;
}

#mobileNav ul,
#mobileNav li{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Accordion styling */
#mobileNav details{
  width: 100% !important;
  margin: 10px 0 !important;
}

#mobileNav details > summary{
  list-style: none !important;
  cursor: pointer !important;
  background: #f3f5f7 !important;
  color: #0F2A44 !important;
  border: 1px solid rgba(15,42,68,.16) !important;
  border-radius: 14px !important;
  padding: 14px !important;
  display: flex !important;
  justify-content: space-between !important;
  font-weight: 800 !important;
}

#mobileNav details > summary::-webkit-details-marker{
  display: none !important;
}

#mobileNav details[open] > summary{
  background: #eef4fb !important;
}

#mobileNav .mobile-submenu a,
#mobileNav .mobile-link a{
  display: block !important;
  margin: 6px 0 !important;
  padding: 12px 14px !important;
  background: #ffffff !important;
  border: 1px solid rgba(15,42,68,.12) !important;
  border-radius: 12px !important;
  color: #0F2A44 !important;
  text-decoration: none !important;
}

