/* ==========================================================================
   Content Boundary — Single source of truth for page content layout
   Full-width with standardized gap on both sides.
   Change --page-gap in variables.css to adjust globally.
   ========================================================================== */

/* All content sections: full width with consistent side gap */
.content-section {
    padding-left: var(--page-gap, 15px) !important;
    padding-right: var(--page-gap, 15px) !important;
}

/* Direct children stretch full width — no max-width cap */
.content-section > div:not([class*="modal"]):not([id*="modal"]),
.content-section > section {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* Explicit overrides — ensure all page panels, toolbars, etc. go full width */
.app-content-panel,
.reqset-toolbar,
.app-banners-row,
.dashboard-grid,
.sched-container,
.requestarr-content,
.media-hunt-collection-view,
.nzb-hunt-container,
.system-tab-panel,
.content-boundary-inner {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box;
}

/* Mobile: tighter gap */
@media (max-width: 768px) {
    .content-section {
        padding-left: var(--page-gap-mobile, 10px) !important;
        padding-right: var(--page-gap-mobile, 10px) !important;
    }
}
