// @import "../core/core";
// @import "../molecules/btn-group";

@mixin dc-input-group {
    display: flex;
    margin-bottom: $dc-space100;
}

@mixin dc-input-addon {

    display: inline-block;
    padding: $dc-space75 + .2 $dc-space100 $dc-space75;
    border: 1px solid $dc-gray60;
    background-color: $dc-gray80;
    color: $dc-gray20;
    line-height: 1;

    &:first-child {
        border-right-width: 0;
        border-top-left-radius: $dc-radius100;
        border-bottom-left-radius: $dc-radius100;
    }

    &:last-child {
        border-left-width: 0;
        border-top-right-radius: $dc-radius100;
        border-bottom-left-radius: $dc-radius100;
    }
}

@mixin dc-input--in-input-group {
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
    border-radius: 0;

    &:first-child {
        border-top-left-radius: $dc-radius100;
        border-bottom-left-radius: $dc-radius100;
    }

    &:last-child {
        border-top-right-radius: $dc-radius100;
        border-bottom-left-radius: $dc-radius100;
    }
}

@mixin dc-btn--in-input-group {
    @include _dc-btn--grouped;
}

@mixin dc-input-group-selectors {

    .dc-input-group {
        @include dc-input-group;
    }

    .dc-input-addon {
        @include dc-input-addon;
    }

    .dc-input--in-input-group {
        @include dc-input--in-input-group;
    }

    .dc-btn--in-input-group {
        @include dc-btn--in-input-group;
    }
}