/**
 * Custom CSS overrides for Helix3 template
 * Fixes navigation display issue after security hardening (July 2026)
 *
 * Problem: Nav header appears transparent/overlapped by slider content
 * Root cause: sticky-header JS wrapper + missing z-index hierarchy
 * Fix: Ensure header has solid white background, proper stacking context
 */

/* Ensure header is always visible above page content */
#sp-header {
  position: relative;
  z-index: 999;
  background: #ffffff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

/* Ensure top bar also stays above */
#sp-top-bar {
  position: relative;
  z-index: 1000;
}

/* Fix sticky wrapper height collapse */
.sticky-wrapper {
  position: relative;
  z-index: 999;
  min-height: 90px;
}

/* Ensure nav links are visible - black text on white background */
.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span {
  color: #333333;
  font-weight: 500;
}

.sp-megamenu-parent > li > a:hover,
.sp-megamenu-parent > li.active > a {
  color: #eb4947;
}

/* When header becomes fixed (scrolled), maintain white bg */
#sp-header.menu-fixed {
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

/* Ensure the page content doesn't overlap the header */
#sp-main-body,
#sp-page-title {
  position: relative;
  z-index: 1;
}