/*------------------------------------*\
    WRAPPERS
\*------------------------------------*/

@use "../../helpers";

$wrapper__padding: 1rem !default;
$wrapper__width--medium: 48rem !default;
$wrapper__width--large: 60rem !default;
$wrapper__width--xlarge: 72rem !default;

.ds_wrapper {
    margin: 0 auto;
    padding: 0 $wrapper__padding;
    width: 100%;

    &--no-overflow {
        overflow: hidden;
    }
}

@include helpers.ds_media-query(medium) {
    .ds_wrapper {
        width: $wrapper__width--medium;
    }
}

@include helpers.ds_media-query(large) {
    .ds_wrapper {
        width: $wrapper__width--large;
    }
}

@include helpers.ds_media-query(xlarge) {
    .ds_wrapper {
        width: $wrapper__width--xlarge;
    }
}