/**
 * Default V2 Layout Container
 * Centralized container wrapper that constrains header, content, and footer
 * to the same max-width as two_panel component
 * 
 * Note: two_panel components handle their own max-width and padding constraints.
 * This container ensures all content (header, footer, two_panel) aligns to the same width.
 */

@import url("/css/design_v2/color.css");
@import url("/css/design_v2/standards.css");
@import url("/css/design_v2/breakpoints.css");

/* Layout container wrapper - constrains all page content */
.pp-layout-container {
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
  /* Allow child elements with backgrounds to extend beyond container */
  overflow-x: visible;
}

/* Tablet: responsive width (matches two_panel behavior) */
@media (min-width: 600px) {
  .pp-layout-container {
    max-width: 100%;
  }
}

/* Desktop: constrain to same width as two_panel (with navbar alignment) */
@media (min-width: 1240px) {
  .pp-layout-container {
    max-width: calc(var(--Container-Width-Desktop-Wide) + 50px);
  }
}

/* Ensure body allows overflow for extended backgrounds */
body {
  overflow-x: visible;
}