/* Apex Solved shared mobile layer: phone menu, wide tables, footer tap targets.
   Loaded on every page with the top nav. Paired with /assets/site-mobile.js. */

html { overflow-x: clip; }

/* phone menu (button + drop panel are injected by site-mobile.js) */
.apxm-btn { display: none; }
.apxm-panel { display: none; }
@media (max-width: 980px) {
  html.apxm-on .nav-links { display: none !important; }
  html.apxm-on .apxm-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; flex: none; margin: 0 10px 0 auto; padding: 0;
    background: transparent; border: 1px solid rgba(245,180,0,0.45); border-radius: 0;
    color: #F5B400; cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  html.apxm-on .apxm-btn:last-child { margin-right: 0; }
  html.apxm-on .apxm-btn svg { width: 18px; height: 18px; display: block; }
  html.apxm-on .apxm-btn[aria-expanded="true"] { background: rgba(245,180,0,0.12); }
  html.apxm-on .apxm-panel.open {
    display: flex; flex-direction: column;
    position: absolute; top: 100%; left: 0; right: 0; z-index: 200;
    background: rgba(10,10,10,0.98); border-bottom: 1px solid rgba(245,180,0,0.35);
    padding: 4px 16px 10px; box-shadow: 0 18px 40px rgba(0,0,0,0.55);
  }
  html.apxm-on .apxm-panel a.apxm-link {
    display: flex !important; align-items: center; gap: 10px; min-height: 48px; padding: 0 2px;
    font-family: 'Saira', sans-serif; font-weight: 700; font-size: 13px; letter-spacing: 0.16em;
    text-transform: uppercase; color: #ECE8E1 !important; text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  html.apxm-on .apxm-panel a.apxm-link:last-child { border-bottom: 0; }
  html.apxm-on .apxm-panel a.apxm-link:hover,
  html.apxm-on .apxm-panel a.apxm-link.on { color: #F5B400 !important; }
  html.apxm-on .apxm-panel a.apxm-link svg { width: 15px; height: 15px; display: block; }
}

/* wide comparison tables scroll inside their own box on phones */
@media (max-width: 760px) {
  article table, main table, .wrap table, .container table {
    display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
}

/* footer tap targets on phones and tablets */
@media (max-width: 980px) {
  .footer-sitemap { gap: 0 18px !important; }
  .footer-sitemap a { display: inline-flex; align-items: center; min-height: 40px; }
  .footer-social { gap: 4px !important; }
  .footer-social a { width: 40px; height: 40px; align-items: center; justify-content: center; }
  footer address a { display: inline-flex; align-items: center; min-height: 40px; }
}

/* short CTA label and search icon, shared across nav templates */
.nav-cta-short { display: none; }
.nav-links .nav-search { display: inline-flex; align-items: center; }
.nav-links .nav-search svg { width: 16px; height: 16px; display: block; }
@media (max-width: 600px) {
  .nav-cta .nav-cta-full { display: none !important; }
  .nav-cta .nav-cta-short { display: inline !important; }
  nav .nav-cta { white-space: nowrap; flex: none; }
  nav .logo { min-width: 0; white-space: nowrap; }
  nav.top { padding-left: 18px !important; padding-right: 18px !important; }
}
