// @import "../core/core";

//  = SELECT
//  ---------------------------------------------------------------------------

@mixin dc-select {
    height: $dc-space200;
    padding: 0 $dc-space200 0 $dc-space75;
    transition: box-shadow .2s linear, border-color .2s linear;
    border: $dc-border50 solid $dc-gray60;
    border-radius: $dc-radius100;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iOXB4IiBoZWlnaHQ9IjVweCIgdmlld0JveD0iMCAwIDkgNSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxuczpza2V0Y2g9Imh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaC9ucyI+ICAgICAgICA8dGl0bGU+VHJpYW5nbGUgODwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZGVmcz48L2RlZnM+ICAgIDxnIGlkPSJBbmFseXRpY3MtRmlsdGVyIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4gICAgICAgIDxnIGlkPSJQb3J0cmFpdC0tLTUvNVMvNUMtMiIgc2tldGNoOnR5cGU9Ik1TQXJ0Ym9hcmRHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTE3Ni4wMDAwMDAsIC0xMDcuMDAwMDAwKSIgZmlsbD0iIzNFM0UzRSI+ICAgICAgICAgICAgPHBhdGggZD0iTTE3NiwxMDcgTDE4NSwxMDcgTDE4MC41LDExMiBMMTc2LDEwNyBaIiBpZD0iVHJpYW5nbGUtOCIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+PC9wYXRoPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+) no-repeat calc(100% - 8px) 50% $dc-white;
    font-size: $dc-body-font-size;
    font-weight: $dc-normal-font-weight;
    line-height: 1.3;

    -webkit-appearance: none;
    -moz-appearance: none;

    &:hover {
        border-color: $dc-blue40;
    }

    &:focus,
    &:active {
        border-color: $dc-blue40;
        outline: 0;
    }

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

    &[disabled] {
        border-color: $dc-gray70;
        background-color: $dc-gray80;
        background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB3aWR0aD0iOXB4IiBoZWlnaHQ9IjVweCIgdmlld0JveD0iMCAwIDkgNSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4gICAgICAgIDx0aXRsZT5pbWFnZTwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZGVmcz48L2RlZnM+ICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIG9wYWNpdHk9IjAuNSI+ICAgICAgICA8ZyBpZD0iaW1hZ2UiIGZpbGw9IiNCNkI2QjYiPiAgICAgICAgICAgIDxnIGlkPSJBbmFseXRpY3MtRmlsdGVyIj4gICAgICAgICAgICAgICAgPGcgaWQ9IlBvcnRyYWl0LS0tNS81Uy81Qy0yIj4gICAgICAgICAgICAgICAgICAgIDxwb2x5Z29uIGlkPSJUcmlhbmdsZS04IiBwb2ludHM9IjAgMCA5IDAgNC41IDUiPjwvcG9seWdvbj4gICAgICAgICAgICAgICAgPC9nPiAgICAgICAgICAgIDwvZz4gICAgICAgIDwvZz4gICAgPC9nPjwvc3ZnPg==);
        color: $dc-gray50;
    }
}

@mixin dc-select--small {
    height: $dc-space150;
    font-size: $dc-font50;
    text-transform: uppercase;
}

@mixin dc-select--is-error {
    border-color: $dc-red40;

    &:hover,
    &:focus {
        border-color: $dc-red40;
    }
}

@mixin dc-select-selectors {
    .dc-select {
        @include dc-select;
    }

    .dc-select--small {
        @include dc-select--small;
    }

    .dc-select--is-error {
        @include dc-select--is-error;
    }
}