/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* ==========================================================================
   GLOBAL LAYOUT & RESPONSIVE FIXES (Zero Horizontal Overflow)
   ========================================================================== */

*, *::before, *::after {
  box-sizing: border-box !important;
}

html, body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Force Bricks root containers to stretch 100% without flex compression */
#bricks-content,
.brx-content,
.brxe-section,
.brxe-container {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* Ensure all semantic sections span full width */
section, main, header, footer {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ==========================================================================
   MOBILE DRAWER NAVIGATION FIX (Zero Offscreen Overflow)
   ========================================================================== */

.mm-mobile-drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  width: 320px !important;
  max-width: 85vw !important;
  height: 100vh !important;
  transform: translateX(100%) !important;
  visibility: hidden !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s ease !important;
  z-index: 99999 !important;
  box-shadow: -6px 0 24px rgba(0,0,0,0.15) !important;
}

.mm-mobile-drawer.active {
  transform: translateX(0) !important;
  visibility: visible !important;
}

.mm-drawer-backdrop {
  position: fixed !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.5) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  z-index: 99998 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity 0.3s ease, visibility 0.3s ease !important;
}

.mm-drawer-backdrop.active {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}