/* border-box reset, SCOPED to our own roots — sections, headers (the
   <fabrement-header> component form) and footers all print
   `data-ui-id="section-root"` via fabrement_block_wrapper_attributes().
   A bare `*` reset would land on the whole theme and on the editor chrome,
   since this file is enqueued globally (see GbBlockLoader::setup_block_inner_style).
   `:where()` keeps the specificity at 0, exactly like the old `*` selector,
   so a block's own style.css still overrides it without !important. */
:where([data-ui-id="section-root"], fabrement-header, .fabrement-block-inner, .block-inner),
:where([data-ui-id="section-root"], fabrement-header, .fabrement-block-inner, .block-inner)::before,
:where([data-ui-id="section-root"], fabrement-header, .fabrement-block-inner, .block-inner)::after,
:where([data-ui-id="section-root"], fabrement-header, .fabrement-block-inner, .block-inner) *,
:where([data-ui-id="section-root"], fabrement-header, .fabrement-block-inner, .block-inner) *::before,
:where([data-ui-id="section-root"], fabrement-header, .fabrement-block-inner, .block-inner) *::after {
    box-sizing: border-box;
}


.fabrement-block-inner,
.block-inner {
    width: 100%;
    /* --fabrement-content-max is the CONTENT width (e.g. 1440). The side gutter
       (--fabrement-pad-inline) is added OUTSIDE it, so the content reaches the full
       content-max and the gutter only kicks in as the viewport narrows. With
       box-sizing:border-box the content area = (content-max + 2*pad) - 2*pad = content-max. */
    max-width: calc(var(--fabrement-content-max, 1440px) + 2 * var(--fabrement-pad-inline, 0px));
    margin-inline: auto;
    padding-inline: var(--fabrement-pad-inline, 0px);
    box-sizing: border-box;
}

/* Full-bleed: break the section out to the full viewport width via negative
   margin. Triggered by the .fabrement-full-bleed utility OR by a section root
   carrying WordPress's `alignfull` class. The inner (.fabrement-block-inner)
   stays centered/contained, so only the section background goes edge-to-edge. */

.fabrement-full-bleed,
[data-ui-id="section-root"].alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    box-sizing: border-box;
}
/* Anti-bleed clip for regular sections. Headers are EXCLUDED: their dropdowns
   (.e-drop below the 68px bar) and mobile panel must escape the root box —
   both the component-rooted form (<fabrement-header>) and a plain <section> header
   detected by its burger-panel hook. */
[data-ui-id="section-root"]:not(fabrement-header):not(:has([data-fabrement-panel])) {
    overflow: clip;
}