@use "bulma/sass/utilities/css-variables" as cv;
@use "bulma/sass/utilities/initial-variables" as iv;

.#{iv.$class-prefix}select {
    select {
        // TODO Remove below when the following problem will be fixed from Bulma or Safari:
        // https://github.com/jgthms/bulma/issues/2626
        // https://bugs.webkit.org/show_bug.cgi?id=202055
        text-rendering: auto !important;

        padding-right: 2.5em;
        option {
            padding: cv.getVar("control-padding-vertical") cv.getVar("control-padding-horizontal");
        }

        &[disabled] {
            // Chrome add `opacity: 0.7` on disabled select, but not on disabled input fields.
            // every disabled fields now have the same look.
            opacity: 1;
        }
    }
    &.is-empty select {
        color: cv.getRgbaVar("grey", 0.7);
    }
    // fix Bulma 0.8.2
    &.is-loading::after {
        top: calc(50% - (1em * 0.5));
        right: calc((2.5em * 0.5) - .5em);
    }
}
