@import "../../variables";
@import "../../mixin/set-input-look";
@import "../../mixin/set-native-states";

.sz-html-select {
    display: inline-block;
    margin: $margin;

    .select-native {
        @include setLook(
                $color-grey-50,
                $color-grey-900,
                $font-family,
                $font-size,
                $padding,
                $border-color,
                $border-width,
                $border-style,
                $border-radius
        );

        @include setDisabledColor($color-disabled, $border-color-disabled);
        @include setFocusAsBorder($border-color-focus);
    }

    @import "../common-nested/label-with-element-container";

    .select-no-value {
        color: $color-grey-500;
    }

    .select-option-placeholder {
        display: none;
    }

    .select-option {
        background-color: $color-grey-50;
        color: $color-grey-900;
        font-size: $font-size;
    }
}