/* ########################### */
/* # NICE SELECT # */
/* ########################### */

/* Remove default icon select */ 
p.et_pb_contact_field:after {
    display:none!important
}

/* Remove default wpsl input select */
select#wpsl-category-list {
    display: none!important;
}

/* ### INPUT NICE SELECT ### */ 

/* Default nice select */ 
.nice-select {
    clear: both;
    cursor: pointer;
    display: block;  
    outline: 0; 
    transition: all .2s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    width: auto;
}

/* Placeholder text select input closed */ 
span.current {
    vertical-align: middle!important; 
    color:#999;
    bottom:0;
}

/* Placeholder text select input hover */ 
.nice-select.divi-form-builder-field.select-field.et_pb_contact_select.open span.current {
    color: var(--color-2);
}

/* Select input closed */ 
.nice-select.et_pb_contact_select.input,
.nice-select.divi-form-builder-field.select-field.et_pb_contact_select {
    background-color: #fff;
    border: 1px solid #d9d9d9;
    height: auto;
    line-height: 1.4em;
}


/* Select input open */ 
.nice-select.divi-form-builder-field.select-field.et_pb_contact_select.open{
    background-color: #fff;
    color: var(--color-2);
    border: 2px solid var(--color-2);
    border-radius: 0!important;
    z-index: 999999!important;
}


/* ### ICON NICE SELECT ### */ 

/* Icon after Nice select */ 
.nice-select:after {
    border-bottom: 2px solid #999;
    border-right: 2px solid #999;
    content: '';
    display: block;
    height: 7px;
    width: 7px;
    position: absolute;
    right: 12px;
    top: 50%;
    margin-top: -4px;
    pointer-events: none;
    -webkit-transform-origin: 66% 66%;
    -ms-transform-origin: 66% 66%;
    transform-origin: 66% 66%;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out;
}


/* Icon after Nice select hover and active */ 
.nice-select.open:after {
    -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
} 



/* ### LIST OPTIONS ### */

/* Default list options */ 
.nice-select .option {
    padding: 6px 12px!important;
    margin: 0;
    cursor: pointer;
    list-style: none;
    outline: 0;
    text-align: left;
    -webkit-transition: all .2s;
    transition: all .2s;
}


/* List option closed */ 
.nice-select .list {
    display: none;
    box-shadow: 0 0 0 2px var(--color-2);
    border-radius: 0 0 2px 2px;
    margin-top: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute!important;
    top: 100%;
    width: 100%;
    left: 0;
    margin: 0;
    padding-top: 12px!important;
    padding-bottom: 6px!important;
    -webkit-transform-origin: 50% 0;
    -ms-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: scale(.75) translateY(-21px);
    -ms-transform: scale(.75) translateY(-21px);
    transform: scale(.75) translateY(-21px);
    -webkit-transition: all .2s cubic-bezier(.5,0,0,1.25),opacity .15s ease-out;
    transition: all .2s cubic-bezier(.5,0,0,1.25),opacity .15s ease-out;
}


/* List option open */ 
.nice-select.open .list {
    display:block;
    opacity: 1;
    background: #fff;
    padding:0;
    height:auto;
    pointer-events: auto;
    -webkit-transform: scale(1) translateY(0);
    -ms-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0);
    z-index: 999999!important;
}


/* List option remove Placeholder */ 
.nice-select .option.disabled {
    display:none!important;
}


/* List option links sélectionné focus and hover */ 
.nice-select .option.focus,
.nice-select .option.selected.focus,
.nice-select .option:hover {
    background-color: #ecf0f1;
}


/* List option link non sélectionné container */ 
.nice-select .list:hover .option:not(:hover) {
    background-color: transparent!important;
}


/* List option link sélectionné */ 
.nice-select .option.selected {
    font-weight: 700!important;
    color: var(--color-2);
}

/* List option link sélectionné add icon */     
li.option.selected.focus:before {
    content: "\4e";
    font-family: "ETmodules";
    font-size: 16px;
    color: var(--color-2);
    margin-right: 4px;
    vertical-align: top;
}

