@layer container {
    .barlayout20 {
        position: relative;
        color: var(--text-color);
        background: none;
    }

    :where(.barlayout20) > .background-wrapper {
        position: absolute;
        z-index: -1;
        inset: 0;
        overflow: hidden;

        background: linear-gradient(
                180deg,
                var(--background-color),
                var(--gradiant-background-color, var(--background-color))
        );
    }

    :where(.barlayout20) > .background-wrapper .image-background {
        object-fit: cover;
        width: 100%;
        height: 100%;
    }

    .barlayout20__container {
        display: grid;
        grid-template-columns:
                [full-start padding_left-start]
                    var(--_content-inline-padding)
                [content-start padding_left-end]
                    var(--_content-width)
                [content-end padding_right-start]
                    var(--_content-inline-padding)
                [full-end padding_right-end];

        margin: 0;
        padding: 0;
        width: 100%;
        row-gap: var(--module-gap);
        container-type: inline-size;
    }

    .barlayout20__container > * {
        grid-column: content;
    }

    .barlayout20:has(> .barlayout20__container--fill-left) > .background-wrapper {
        left: 0;
        right: auto;
        width: calc(((100% - var(--_bg-width)) / 2) + var(--_bg-width));
        background: linear-gradient(
                180deg,
                var(--background-color),
                var(--gradiant-background-color, var(--background-color))
        );
        color: var(--text-color);
    }

    .barlayout20:has(> .barlayout20__container--fill-right) > .background-wrapper {
        right: 0;
        left: auto;
        width: calc(((100% - var(--_bg-width)) / 2) + var(--_bg-width));
        background: linear-gradient(
                180deg,
                var(--background-color),
                var(--gradiant-background-color, var(--background-color))
        );
        color: var(--text-color);
    }
}