@import './styles/<!--partnerName--settings-->';
@import './styles/tools';

.c-dropdown-select-box {
    position: relative;
    display: inline-block;
}

    .c-dropdown-select-box__value {
        cursor: pointer;
    }

        .c-dropdown-select-box__value__icon {
            transform: translateY(7px);
        }


    $c-dropdown-select-box__options--arrow-distance: 80%;
    $c-dropdown-select-box__options--arrow-size: 24px;
    .c-dropdown-select-box__options {
        padding: 22px 22px 0 23px;
        background: $white-color;
        position: absolute;
        left: calc(#{-$c-dropdown-select-box__options--arrow-distance} +
            #{-$c-dropdown-select-box__options--arrow-size / 2});
        top: calc(100% + #{$c-dropdown-select-box__options--arrow-size / 2});
        box-shadow: 0 4px 60px 0 transparentize($black-color, 0.8);
    }
    
        .c-dropdown-select-box__options__arrow {
            @include css-arrow(
                $direction: 'up',
                $arrowSize: $c-dropdown-select-box__options--arrow-size,
                $backgroundColor: $white-color,
                $distanceAcross: $c-dropdown-select-box__options--arrow-distance
            );
        }

        .c-dropdown-select-box__options__option {
            padding-bottom: 10px;
            margin-bottom: 10px;
            border-bottom: 1px solid $grey-middle;
            display: block;
            width: 100%;

            &:last-child {
                border-bottom: none;
            }
        }