//
//  Common
//  _____________________________________________

& when (@media-common = true) {
    .select-slider {
        &.select-slider-has-bg {
            padding-bottom: 36px;
            padding-top: 36px;
        }
        &.select-slider-beige {
            background-color: #f8f8f8;
        }
        .tab {
            border-bottom: none;
            text-align: center;
            a {
                .lib-font-size(16);
                color: @djo-gray;
                display: inline-block;
                line-height: 1.25;
                img {
                    border: 5px solid #d4d4d4;
                    border-radius: 50%;
                    display: block;
                    margin-bottom: 12px;
                    margin-left: auto;
                    margin-right: auto;
                }
            }
            &.active-tab {
                a {
                    cursor: default;
                    &:hover,
                    &:focus {
                        text-decoration: none;
                    }
                    img {
                        border-color: @djo-blue;
                    }
                }
            }
            &:not(.active-tab) {
                a {
                    &:hover,
                    &:focus {
                        color: @djo-blue;
                        img {
                            border-color: @djo-blue;
                        }
                    }
                }
            }
        }
        .slider-arrow {
            width: 24px;
        }
    }
}


//
//  Mobile
//  _____________________________________________

.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
    .select-slider {
        &.select-slider-is-paired-with-dropdown {
            margin-bottom: 20px;
        }
    }
}


//
//  Desktop
//  _____________________________________________

.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
    .select-slider {
        &.select-slider-is-paired-with-dropdown {
            margin-bottom: 68px;
        }
    }
}