////
///
/// Center
/// ===========================================================================
///
/// Centering layout primitive.
/// Pure spatial logic. No colors. No shadows.
///
/// @group Flow
/// @author Scape Press
/// @link https://scape.style
/// @since 0.1.0 initial release
/// @access public
///
////

@layer ss.flow {

.ss-f-center {
    box-sizing: content-box;
    max-width: var(--ss-f-center-max, var(--ss-measure-default));
    margin-inline: auto;
    padding-inline: var(--ss-f-center-gutter, var(--ss-spacing-4));
}

// Center variants
.ss-f-center-narrow {
    --ss-f-center-max: var(--ss-measure-narrow);
}
.ss-f-center-wide {
    --ss-f-center-max: var(--ss-measure-wide);
}
.ss-f-center-full {
    --ss-f-center-max: 100%;
}

// Text centering
.ss-f-center-text {
    text-align: center;
}

// Flex centering (both axes)
.ss-f-center-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

}