@import '../wireframe/_globals';

@mixin global__flag($base-cls: 'global__flag') {
    display: flex;
    width: 100%;
}

@mixin global__flag__body($base-cls: 'global__flag') {
    display: flex;
    width: 100%;
}

@mixin global__flag__content($base-cls: 'global__flag') {
    display: flex;
    vertical-align: middle;

    .#{$base-cls}--top & {
        vertical-align: top;
    }

    .#{$base-cls}--bottom & {
        vertical-align: bottom;
    }
}

@mixin global__flag__image($base-cls: 'global__flag') {
    padding-right: 10px;

    > img {
        display: block;
        max-width: none;
    }

    .#{$base-cls}--rev & {
        padding-right: 0;
        padding-left: 10px;
    }
}