@import '_abstract-control';
@import 'button-base';
@import '_abstract-links';
@import 'colors';

/*
    Стрелочка select.svg содержит в себе отступ в 8px справа
    из-за Android браузера, который не умеет background-position edge offsets.

    :active отсутствует из за бага в Chrome 50 https://bugs.chromium.org/p/chromium/issues/detail?id=613885
*/

@control-icon-width: 8px;
@select-padding-right: @control-icon-width + 2 * @control-icon-margin;
@option-padding: 9px 30px 9px 33px;
@option-min-height: 34px;


.abstract-select-background() {
    color: @control-font-color-complementary;
    border-color: @control-border-color;
    padding-right: @select-padding-right;
    background-color: @control-background-color;
    background-image: url('select.svg');
    background-repeat: no-repeat;
    background-position: right center;

    [disabled] &,
    &[disabled] {
        background-color: @control-background-color-complementary;
        border-color: @control-border-color;
    }
}

/* stylelint-disable selector-nested-pattern */
.abstract-select() {
    .abstract-control();
    .abstract-select-background();

    text-align: left;
    cursor: pointer;

    &:global(.focus-visible) {
        .abstract-control-focus-visible();
    }

    &::-ms-expand {
        display: none;
    }

    &:-moz-focusring {
        color: transparent;
        text-shadow: 0 0 0 @color-gray-80;
    }

    &_flexible {
        width: auto;
    }
}
/* stylelint-enable */

.select-light() {
    border: 0;
    background-color: transparent;

    &:hover,
    &:focus,
    &:active {
        color: @link-color-active;
    }
}

.select-light-disabled() {
    color: inherit;
    background-color: transparent;

    &:hover {
        color: inherit;
        background-color: transparent;
    }
}

.select-light-invalid() {
    color: @link-color-active;
    box-shadow: none;
}