/* BoostHub shared custom select UI extracted from main.css.
   Keep this file loaded after calc-controls.css and before page-specific overrides. */

.slt_2 {
    position: relative;
    z-index: 1;
    cursor: pointer;
    padding: 0 0 6px;
}

.slt_2.active {
    z-index: 2;
}

.slt_2.active .slt_2__list {
    display: block;
}

.slt_2 input {
    cursor: pointer;
}

.slt_2__list {
    padding: 0;
    margin: 0;
    list-style-type: none;
    position: absolute;
    top: 46px;
    left: 0;
    width: 100%;
    border-radius: 8px;
    background: #fff;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    z-index: -1;
    border: 2px solid #d9d5d0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: none;
    max-height: 300px;
    scrollbar-width: thin;
    scrollbar-color: #fe9900 #f0f0f0;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

.slt_2__list::-webkit-scrollbar {
    width: 8px;
}

.slt_2__list::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 4px;
}

.slt_2__list::-webkit-scrollbar-thumb {
    background: #fe9900;
    border-radius: 4px;
    transition: background 0.3s ease;
}

.slt_2__list::-webkit-scrollbar-thumb:hover {
    background: #ff6b00;
}

.slt_2__list li {
    padding: 0;
    margin: 0;
}

.slt_2__option,
.slt_2__option:visited {
    color: #373737;
    font-family: var(--bh-font-sans);
    font-size: 1.4rem;
    border: none;
    text-align: left;
    padding: 11px 21px 11px 17px;
    line-height: 1;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    text-decoration: none;
}

.slt_2__option:hover,
.slt_2__option:focus,
.slt_2__option.active {
    background: #c9d3e3;
}

.slt_2__output {
    border: 2px solid #d9d5d0;
    padding: 11px 0 11px 17px;
    border-radius: 20px;
    position: relative;
    line-height: 1;
    height: 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    background: transparent;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}

.slt_2.active .slt_2__output,
.slt_2__output:hover,
.slt_2__output:focus {
    border: 2px solid #fe9900;
}

.slt_2__output .inpVisible {
    border: 0;
    width: calc(100% - 35px);
    color: #fff;
    font-family: var(--bh-font-sans);
    font-size: 1.5rem;
    background: transparent;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
}

.slt_2__output:after {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fe9a02;
    border-right: 2px solid #fe9a02;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    position: absolute;
    top: calc(50% - 7px);
    right: 14px;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background: #fe9900;
    width: 6px;
}

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background: #fe9900;
}

.mCSB_scrollTools .mCSB_draggerRail {
    width: 6px;
    background: #152030;
}

.mCSB_scrollTools .mCSB_draggerContainer {
    position: absolute;
    top: 9px;
    left: 0;
    bottom: 0;
    right: 0;
    height: calc(100% - 18px);
}

.mCSB_inside > .mCSB_container {
    margin-right: 0;
}

.mCSB_scrollTools {
    width: 16px;
    right: 0;
    height: 100%;
    top: 0;
    padding: 9px 0;
    box-sizing: border-box;
    background: #fff;
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
    background: #fe9900;
    opacity: 1;
}

.slt_2__option.active {
    background: linear-gradient(135deg, #fe9900, #ff6b00);
    color: white;
    font-weight: 700;
}

.slt_3 {
    position: relative;
    cursor: pointer;
    padding: 0 0 6px;
}

.slt_3__output {
    border: 2px solid #d9d5d0;
    padding: 11px 0 11px 17px;
    border-radius: 20px;
    position: relative;
    line-height: 1;
    height: 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    background: transparent;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
}

.slt_3__list {
    padding: 0;
    margin: 0;
    list-style-type: none;
    position: absolute;
    top: 46px;
    left: 0;
    width: 100%;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    z-index: -1;
    border: 2px solid #d9d5d0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: none;
    height: 206px;
}

.slt_3__option,
.slt_3__option:visited {
    color: #373737;
    font-family: var(--bh-font-sans);
    font-size: 1.4rem;
    border: none;
    text-align: left;
    padding: 11px 21px 11px 17px;
    line-height: 1;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
}

.slt_3__output::after {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    border-top: 2px solid #fe9a02;
    border-right: 2px solid #fe9a02;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
    position: absolute;
    top: calc(50% - 7px);
    right: 14px;
}

.slt_3.active .slt_3__output,
.slt_3__output:hover,
.slt_3__output:focus {
    border: 2px solid #fe9900;
}

.slt_3.active .slt_3__list {
    display: block;
    z-index: 1;
}

.slt_3__option:hover,
.slt_3__option:focus,
.slt_3__option.active {
    background: #c9d3e3;
}