/* =========================================================================
   ZERO-PADDING / ZERO-MARGIN FULL BLEED EXPERIENCE CLOUD RESET
   ========================================================================= */

:root {
    --lwc-layoutVerticalPadding: 0rem !important;
    --lwc-spacingXLarge: 0rem !important;
    --lwc-spacingLarge: 0rem !important;
    --lwc-spacingMedium: 0rem !important;
    --lwc-spacingSmall: 0rem !important;
    --lwc-spacingXSmall: 0rem !important;
    --lwc-spacingXxSmall: 0rem !important;
    --dxp-c-header-container-spacing-block-start: 0rem !important;
    --dxp-c-header-container-spacing-block-end: 0rem !important;
    --dxp-c-header-container-spacing-inline-start: 0rem !important;
    --dxp-c-header-container-spacing-inline-end: 0rem !important;
    --dxp-c-header-container-min-height: 0rem !important;
    --dxp-c-header-container-max-height: 0rem !important;
    --dxp-c-footer-container-spacing-block-start: 0rem !important;
    --dxp-c-footer-container-spacing-block-end: 0rem !important;
    --dxp-c-footer-container-spacing-inline-start: 0rem !important;
    --dxp-c-footer-container-spacing-inline-end: 0rem !important;
    --dxp-c-footer-container-min-height: 0rem !important;
    --dxp-c-footer-container-max-height: 0rem !important;
    --dxp-c-section-columns-max-width: 100% !important;
    --dxp-c-section-column-gutter-width: 0rem !important;
    --dxp-g-spacing-small: 0rem !important;
    --dxp-g-spacing-medium: 0rem !important;
    --dxp-g-spacing-large: 0rem !important;
    --dxp-s-body-bg-color: #ffffff !important;
}

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

html {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    background: #ffffff !important;
    overflow-x: hidden !important;
}

/* body must NOT declare its own overflow-x: doing so forces the paired
   overflow-y to compute as "auto" (CSS overflow-value coupling), which turns
   body into a second, non-scrolling scroll container nested inside html and
   breaks position:sticky for descendants (e.g. the portal sidebar) that
   expect to stick to the real viewport. html alone already clips horizontal
   overflow for the whole page. */
body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    background: #ffffff !important;
    overflow: visible !important;
}

webruntime-app,
webruntime-router-container,
webruntime-page {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    display: block !important;
    background: #ffffff !important;
    overflow: visible !important;
}

/* Force all Experience Cloud wrapper containers to full width with zero padding/margins */
.siteforceContentArea,
.siteforcePanelsContainer,
.siteforceContentArea .comm-layout-column,
.siteforceContentArea .comm-layout-column:not(:empty),
.comm-layout-column,
.comm-layout-column:not(:empty),
.comm-page-container,
.comm-page-body,
.comm-content-body,
.contentRegion,
.slds-col,
.slds-col--padded,
.slds-col_padded,
.slds-p-horizontal_medium,
.slds-p-horizontal--medium,
.slds-p-around_medium,
.slds-p-around--medium,
.slds-p-around_large,
.slds-p-around--large,
.slds-m-top_x-large,
.slds-m-top--x-large,
.slds-m-top_large,
.slds-m-top--large,
.slds-m-top_medium,
.slds-m-top--medium,
.ui-widget,
.community_layout-section,
.community_layout-sldsFlexibleLayout,
.community_layout-simpleThemeLayout,
.dxp-content-layout,
.dxp-page-layout,
community_layout-simple-theme-layout,
community_layout-slds-flexible-layout,
community_layout-section,
community_layout-column,
community_builder-page-layout,
[data-region-name='content'],
[data-region-name='col1'] {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    border: none !important;
    box-shadow: none !important;
}

/* Remove default Salesforce theme layout headers, footers & placeholders completely */
community_layout-simple-theme-layout > header,
community_layout-simple-theme-layout > footer,
community_layout-simple-theme-layout header,
community_layout-simple-theme-layout footer,
.community_layout-simpleThemeLayout > header,
.community_layout-simpleThemeLayout > footer,
.community_layout-simpleThemeLayout header,
.community_layout-simpleThemeLayout footer,
header[data-f6-region],
footer[data-f6-region],
[data-region-name='header'],
[data-region-name='footer'],
[data-region-name='headerSection'],
[data-region-name='footerSection'],
.comm-content-header,
.comm-content-footer,
.siteforceServiceNotAvailable {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    visibility: hidden !important;
    overflow: hidden !important;
}

/* Expand main layout container to full bleed */
main,
main[data-f6-region],
community_layout-simple-theme-layout > main,
community_layout-simple-theme-layout main,
.community_layout-simpleThemeLayout > main,
.community_layout-simpleThemeLayout main {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    flex: 1 1 100% !important;
    display: flex !important;
    flex-direction: column !important;
    border: none !important;
    box-shadow: none !important;
}

/* Host LWC full width fill */
c-order-tracking-app,
c-portal-order-search,
c-order-confirmation-header,
c-order-confirmation {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}
