:root {
    --font-input: 13px;
    --font-input-mobile: 13px;
    --height-input: var(--input-height);
    --height-input: var(--input-height);
    --color-input: var(--color-text);
    --color-input-reverse: var(--color-body);
    --background-input: var(--color-layout);
    --background-input-odd: var(--color-primary-layout);
    --background-input-active: var(--color-primary);
    --background-select-option-active: var(--color-primary);
    --border-input: var(--color-primary-transparent-lighter);
    --radius-input: var(--common-radius-md);
    --padding-input-x: 15px;
    --border-select-option: var(--color-primary-transparent-lighter);
    --padding-select-option: 5px 15px;
    --border-select-search: var(--color-primary-transparent-lighter);
}

/* select2 single */

.form--select-wrapper {
    width: 100%;
    position: relative !important;
}

.select2-container {
    width: 100% !important;
}

.form--select-wrapper.sm {
    width: 100%;
    max-width: 135px;
    position: relative !important;
    margin: auto;
}

.form--select-wrapper .select2:nth-of-type(2) {
    display: none !important;
}

/* -------------------------- */

/* -------------------------- */

.select2-container--default .select2-selection--single {
    background-color: transparent;
    border: 1px solid var(--border-input);
    border-radius: var(--radius-input);
}

.select2-container .select2-selection--single {
    height: var(--height-input);
}

.select2-container--default
    .select2-selection--single
    .select2-selection__arrow {
    height: var(--height-input);
    top: 0px;
    right: 10px;
    width: 20px;
    display: none;
}

.select2-container .select2-search--inline .select2-search__field {
    font-size: var(--font-input) !important;
    margin: auto !important;
    margin-left: 8px !important;
    margin-top: 10px !important;
    margin-bottom: 6px !important;
}

.form-select {
    height: var(--height-input);
    background-color: var(--background-input);
    border: 1px solid var(--border-input);
    border-radius: var(--radius-input);
}

.select2-container--default
    .select2-selection--single
    .select2-selection__clear {
    margin-right: 10px !important;
    height: 26px !important;
}

.select2-container--default
    .select2-selection--single
    .select2-selection__clear
    span {
    color: var(--color-input) !important;
    font-size: var(--font-input-mobile);
    position: absolute;
    top: -1px;
    height: 100%;
    right: 16px;
    display: flex;
    font-size: 16px;
    align-items: center;
    z-index: 1;
}

.form-select:disabled {
    background-color: initial !important;
}

.select2-container--default.select2-container--disabled
    .select2-selection--single {
    background-color: var(--background-input) !important;
    cursor: default;
}

.form--select-wrapper .form--select {
    width: 100% !important;
    height: var(--height-input);
    background-color: var(--background-input);
    border: 1px solid var(--border-input);
    border-radius: var(--radius-input);
}

.form--select-wrapper .select2-container {
    width: 100% !important;
    background-color: var(--background-input);
    border: none;
    border-radius: var(--radius-input);
}

.form--select-wrapper
    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow {
    right: 8px;
    top: 7px;
    display: none !important;
}

.form--select-wrapper .select2-container .select2-selection--single {
    height: var(--height-input);
    border-radius: var(--radius-input);
    font-size: var(--font-input);
    border: 1px solid var(--border-input);
    background-color: var(--background-input);
}

.select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
    line-height: var(--height-input);
    padding-left: var(--padding-input-x) !important;
    padding-right: var(--padding-input-x);
    font-size: var(--font-input);
    color: var(--color-input);
}

.select2-container--default .select2-results__option--selected {
    background-color: var(--background-select-option-active) !important;
}

.select2-container--default
    .select2-selection--single
    .select2-selection__placeholder {
    color: #5e5e5e;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    /*border: var(--inputBorder) !important;*/
    border: 1px solid var(--border-select-search) !important;
    outline: none !important;
    border-radius: 0px !important;
    border-radius: var(--radius-input);
    padding-left: var(--padding-input-x);
    padding-right: var(--padding-input-x);
    font-size: var(--font-input);
}

.form--select-wrapper .select2-dropdown {
    border: 1px solid var(--border-input);
}

.select2-container--open .select2-dropdown--below {
    border: var(--border-input);
    /*border-color: red;*/
}

.select2-container--default
    .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--background-input-active) !important;
    border-bottom: 1px solid var(--border-input);
    color: var(--color-input-reverse) !important;
}

.form--select-wrapper .select2-results__option {
    font-size: var(--font-input);
    padding-left: var(--padding-input-x) !important;
    padding-right: var(--padding-input-x) !important;
}

.select2-search--dropdown {
    background-color: var(--background-input);
}

.select2-results__option {
    background-color: var(--background-input);
    border-bottom: 1px solid var(--border-select-option) !important;
    border-right: 1px solid var(--border-select-option) !important;
    border-left: 1px solid var(--border-select-option) !important;
    font-size: var(--font-input);
    padding: var(--padding-select-option);
    /*border-radius: var(--radius-input);*/
    color: var(--color-primary-reverse);
}

.select2-results__option:nth-of-type(odd) {
    background-color: var(--background-input-odd);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: var(--background-input);
    color: var(--color-input);
}

.select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
    color: var(--color-input) !important;
    line-height: var(--height-input) !important;
    color: rgb(41, 40, 40);
}

/* multiple */

.select2-container--default .select2-selection--multiple {
    background-color: var(--background-input) !important;
    border: 1px solid var(--border-input) !important;
    padding: var(--padding-input);
}

.select2-results__option:last-of-type {
    border-radius: 0px !important;
}

.select2-container--default
    .select2-selection--multiple
    .select2-selection__choice {
    background-color: var(--background-input) !important;
    border: 1px solid var(--border-input) !important;
    color: var(--color-input);
    font-size: var(--font-input-mobile);
    margin-top: 15px !important;
}

.select2-container .select2-selection--multiple {
    min-height: var(--height-input) !important;
}

.select2-container,
.select2-dropdown,
.select2-search,
.select2-results {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
    background-color: var(--background-input);
    /*border-radius: var(--radius-input);*/
}

.select2-container {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
    background-color: transparent;
    /*border-radius: var(--radius-input);*/
}

.select2-search {
    border-radius: 0px;
    padding: 0px;
}

/* control radius */

/* --------------------------------------- */

/* --------------------------------------- */

/* --------------------------------------- */

.form--input-with-select .select--single-wrapper {
    width: 35%;
}
.form--input-with-icon .select2-container--default .select2-selection--single {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-select
    .select2-container--default
    .select2-selection--single {
    border-radius: var(--radius-input) 0px 0px var(--radius-input);
}

.form--input-with-icon .form-select {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-select .form-select {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-icon .form--select-wrapper .form--select {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-select .form--select-wrapper .form--select {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-icon .form--select-wrapper .select2-container {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-select .form--select-wrapper .select2-container {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-icon
    .form--select-wrapper
    .select2-container
    .select2-selection--single {
    /*border-radius: 0px var(--radius-input) var(--radius-input) 0px;*/
}

.form--input-with-icon
    .select2-container--default
    .select2-search--dropdown
    .select2-search__field {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}

.form--input-with-select
    .select2-container--default
    .select2-search--dropdown
    .select2-search__field {
    border-radius: 0px var(--radius-input) var(--radius-input) 0px;
}
