/*------------------------------------*\
    
    WebFX Choices.js Customizations - Global styling for select box/text inputs using Choices.js

    Add custom Choices.js select input styling to this file if it should be applied to all Choices.js select inputs on the site
    Otherwise, put your styles in individual block stylesheets

\*------------------------------------*/


.choices__inner {
    width: 100%;
    display: block;
    height: 62px;
    background-color: var(--light);
    color: var(--primary-text-color);
    border: none;
    border-bottom: 5px solid var(--light);
    font-size: 16px;
    border-radius: 0;
    font-family: var(--font-montserrat);
    padding: 19px 70px 11px 20px !important;
    font-weight: 400;
    transition: all ease 0.1s;
}

.choices__list--single {
    padding: 0;
}

.bg-light .choices__inner {
    background: var(--white);
    border-bottom: 5px solid var(--white);
}

.bg-medium .choices__inner {
    background: var(--dark);
    border-bottom: 5px solid var(--dark);
    color: var(--white);
}

.bg-dark .choices__inner {
    background: var(--medium);
    border-bottom: 5px solid var(--medium);
    color: var(--white);
}

.choices {
    z-index: 2;
}

.choices[data-type*='select-one']:after {
    content: "\e902";
    font-family: 'rmfx-icon';
    width: 62px;
    height: 100%;
    border: none;
    top: 3px;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-left: 1px solid var(--light-accent);
    font-size: 18px;
    color: var(--primary-color);
    padding-top: 0;
    z-index: 3;
}

.bg-dark .choices[data-type*='select-one']:after {
    border-left: 1px solid var(--dark);
}

.bg-medium .choices[data-type*='select-one']:after {
    border-left: 1px solid var(--medium);
}

.choices[data-type*='select-one'].is-open:after {
    margin-top: 0;
    border-left: none;
    transform: rotate(180deg);
    padding-top: 1px;
    border-right: 1px solid var(--light-accent);
    top: 0;
    height: calc(100% - 6px);
}

.bg-dark .choices[data-type*='select-one'].is-open:after,
.bg-dark .choices[data-type*='select-one'].is-focused:after {
    border-right: 1px solid var(--dark);
}

.bg-medium .choices[data-type*='select-one'].is-open:after,
.bg-medium .choices[data-type*='select-one'].is-focused:after {
    border-right: 1px solid var(--medium);
}

.is-open .choices__inner {
    border-radius: 0;
}

.is-focused .choices__inner,
.is-open .choices__inner {
    border: none;
    border-bottom: 5px solid var(--primary-color);
}

.is-open .choices__list[aria-expanded] {
    border: none;
}

.bg-light .is-focused .choices__inner,
.bg-dark .is-focused .choices__inner,
.bg-medium .is-focused .choices__inner {
    border-bottom: 5px solid var(--primary-color);
}


.choices[data-type*='select-one'] .choices__input {
    display: none;
}

.choices__list--dropdown .choices__item--selectable:after {
    display: none;
}

.choices__list--dropdown .choices__item {
    position: relative;
    padding: 19px 20px !important;
    font-size: 16px;
    color: var(--primary-text-color);
    font-weight: 400;
}

.choices__list--dropdown .choices__item:nth-child(even) {
    background: var(--light);
}

.bg-medium .choices__list--dropdown .choices__item,
.bg-dark .choices__list--dropdown .choices__item {
    background: var(--medium);
    color: var(--white);
}

.bg-medium .choices__list--dropdown .choices__item:nth-child(even),
.bg-dark .choices__list--dropdown .choices__item:nth-child(even) {
    background: var(--dark);
}

.choices__list--dropdown .choices__item--selectable.is-highlighted {
    background-color: var(--primary-color) !important;
}

.is-flipped.is-open .choices__inner {
    border-radius: 0;
}

.choices__list--dropdown {
    border: none;
    box-shadow: 0 5px 15px rgba(38, 58, 73, 0.15);
    margin-top: 0;
}

.is-open .choices__list--dropdown {
    border-color: transparent;
}

.bg-dark .choices__list--dropdown,
.bg-medium .choices__list--dropdown {
    box-shadow: 0 5px 15px rgba(12, 21, 28, 0.15);
}

.half-and-half-contact--with-image .choices__inner {
    background: var(--light);
    border-bottom: 5px solid var(--light);
    color: var(--primary-text-color);
}

.half-and-half-contact--with-image .choices[data-type*='select-one']:after {
    border-left: 1px solid #D3DCE1;
}

.half-and-half-contact--with-image .choices[data-type*='select-one'].is-open:after,
.half-and-half-contact--with-image .choices[data-type*='select-one'].is-focused:after {
    border-right: 1px solid #D3DCE1;
}


.half-and-half-contact--with-image .is-focused .choices__inner,
.half-and-half-contact--with-image .is-open .choices__inner {
    border: none;
    border-bottom: 5px solid var(--primary-color);
}

.half-and-half-contact--with-image .choices__list--dropdown .choices__item {
    background: var(--white);
    color: var(--primary-text-color);

}

.half-and-half-contact--with-image .choices__list--dropdown .choices__item:nth-child(even) {
    background: var(--light);
    color: var(--primary-text-color);
}