/* ============================================================
   MZANZI OVERRIDE — override.css
   Loaded LAST with highest priority.
   Kills all old Gowilds / Elementor layout constraints.
   ============================================================ */

/* ── KILL OLD THEME WRAPPERS ── */
/* Force every old wrapper to full width */
.site,
#page,
#content,
.site-content,
.content-area,
.entry-content > *:not(.alignwide):not(.alignfull),
.wp-site-blocks,
.is-layout-constrained > *,
.is-layout-flow > * {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  float: none !important;
  clear: both !important;
}

/* Kill any grid/flex that constrains width */
.site,
#page,
#content,
.site-content {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
}

/* Kill any old sidebar layout */
#primary,
#secondary,
.sidebar,
.widget-area {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

/* ── KILL OLD HEADER ── */
/* Hide the old Gowilds header — we have our own */
.header-builder-frontend,
.wp-site-header:not(#mzHeader),
.gowilds-page-loading,
.canvas-mobile,
#gva-overlay,
.gva-header,
.header-default,
.site-header-default,
[class*="gowilds-header"],
[class*="gva-header"],
[id*="gva-header"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* ── FORCE OUR HEADER VISIBLE (desktop only) ── */
#mzHeader {
  display: block !important;
  visibility: visible !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 99999 !important;
}
/* Mobile nav handles itself — hide desktop header on mobile */
@media (max-width: 900px) {
  #mzHeader { display: none !important; }
}

/* ── KILL ELEMENTOR LAYOUT ── */
.elementor-page,
.elementor-section-wrap,
.elementor-section,
.elementor-container,
.elementor-row,
.elementor-column-wrap,
.elementor-widget-wrap {
  max-width: none !important;
}

/* Kill any leftover margin from old theme — but NOT padding (header offset uses it) */
body {
  margin: 0 !important;
  overflow-x: hidden !important;
  background: #fff !important;
  /* padding-top set dynamically by JS to match fixed header height */
}

/* Pages with their own hero handle offset internally */
body .hero,
body .tp-hero,
body .lw-hero,
/* page-hero margin-top set by critical inline CSS */

/* ── MAKE OUR CONTENT FULL WIDTH ── */
/* Hero must be edge-to-edge */
.hero,
.tp-hero,
.lw-hero,
.about-hero,
.page-hero,
.cta-banner,
.tour-types,
.gallery-slider-section,
.testimonials-section,
.stats-bar,
.tp-facts,
.lw-facts {
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  box-sizing: border-box !important;
}

/* Better approach — just make body a clean block */
body.mzanzi-theme {
  width: 100% !important;
  max-width: 100% !important;
}

/* Our sections are full width by default */
section,
.section,
footer,
header {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ── PROTECT FIXED/OVERLAY ELEMENTS FROM WIDTH RESETS ── */
/* Mobile drawer — must NOT be 100% width on desktop */
nav.mz-mobile-drawer,
#mzMobileDrawer,
.mz-mobile-drawer {
  width: 320px !important;
  max-width: 320px !important;
  position: fixed !important;
  top: 0 !important;
  height: 100vh !important;
  right: -110% !important;
  left: auto !important;
  z-index: 99992 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.mz-mobile-overlay,
#mzMobileOverlay {
  z-index: 99991 !important;
}
nav.mz-mobile-drawer.open,
#mzMobileDrawer.open,
.mz-mobile-drawer.open {
  right: 0 !important;
}
/* Full width on phones */
@media (max-width: 600px) {
  nav.mz-mobile-drawer,
  #mzMobileDrawer,
  .mz-mobile-drawer {
    width: 100vw !important;
    max-width: 100vw !important;
    right: -100vw !important;
  }
  nav.mz-mobile-drawer.open,
  #mzMobileDrawer.open,
  .mz-mobile-drawer.open {
    right: 0 !important;
  }
}

/* Our container centers content correctly */
.container {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.container--wide {
  max-width: 1400px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* ── HERO IMAGE FIX ── */
.hero {
  position: relative !important;
  min-height: 90vh !important;
  display: flex !important;
  align-items: center !important;
  /* margin-top set by critical inline CSS — do NOT override here */
}
.hero-slideshow {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.hero-slide {
  position: absolute !important;
  inset: 0 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  transition: opacity 1.2s ease !important;
}
.hero-slide.active {
  opacity: 1 !important;
}
.hero-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(to bottom, rgba(14,31,22,.35) 0%, rgba(14,31,22,.6) 100%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
.hero-content {
  position: relative !important;
  z-index: 2 !important;
}

/* ── WHEN NO HERO IMAGE LOADED (placeholder state) ── */
/* Show dark green + gold text still visible */
.hero-slide:not([style*="url"]) {
  background-color: var(--forest) !important;
}

/* ── BODY CLASSES — add mzanzi-theme to body ── */
/* (added via functions.php body_class filter) */

/* ── KILL ANY COLUMN LAYOUT FROM OLD THEME ── */
/* These are the classes Gowilds uses to make that column layout */
.col-xs-12,
.col-sm-12,
.col-md-12,
.container-fluid,
.wrap,
#wrapper,
.wrapper,
.boxed,
.boxed-layout {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

/* ── ADMIN BAR OFFSET ── */
.admin-bar #mzHeader { top: 32px !important; }
.admin-bar .hero,
.admin-bar .page-hero,
.admin-bar .tp-hero,
.admin-bar .lw-hero,
/* admin-bar hero offset handled by critical inline */
@media screen and (max-width: 782px) {
  .admin-bar #mzHeader { top: 46px !important; }
  /* admin-bar hero handled by critical inline */
}

/* ── FOOTER FULL WIDTH ── */
.site-footer,
#siteFooter {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
}

/* ── WP TRAVEL ENGINE SINGLE PAGE OVERRIDE ── */
/* Force WTE trip pages to not use old template */
.single-trip .entry-content,
.single-trip #content,
.single-trip .site-content {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
}

/* ── MOBILE ── */
@media (max-width: 900px) {
  .hero { min-height: 420px !important; align-items: flex-start !important; }
  .container, .container--wide { padding-left: 16px !important; padding-right: 16px !important; }
}
@media (max-width: 600px) {
  .hero { min-height: 360px !important; align-items: flex-start !important; }
}

/* ── LOGO SIZE LOCK — NEVER let logo grow beyond nav height ── */
.mz-logo-icon,
.mz-logo img,
.mz-logo .mz-logo-img,
.site-logo img,
.site-logo-img,
img.site-logo-img,
img.mz-logo-img {
  width: 42px !important;
  height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  object-fit: contain !important;
}

/* Kill any WP custom logo output that could be injected */
.custom-logo-link img,
.wp-custom-logo img {
  max-height: 44px !important;
  width: auto !important;
  max-width: 180px !important;
}


