/* colloca la voce prescelta bene al centro verticalmente; con il garamond infatti tende a scendre in basso */

.bootstrap-select .dropdown-toggle {
    height: 38px;
    padding-top: 0;
    padding-bottom: 0;
}

.bootstrap-select .filter-option {
    display: flex;
    align-items: center;
    height: 100%;
}
.bootstrap-select .filter-option-inner-inner {
    position: relative;
    top: 4px;
    color: #000 !important;
    margin-right: 5px
}


/* Voci della tendina, sia nel menù, sia in selectpicker */
.dropdown-item, ul.dropdown-menu a, a.normal-toggle, a.selected-toggle{
    font-family: var(--font-principale) !important;
    font-size: var(--size-mini) !important
}

/* solo tendine */
.bootstrap-select .dropdown-menu li a span.text {
    /*font-size: 16px;*/
}

/* Cambia la il testo della voce selezionata */
.bootstrap-select > .dropdown-toggle .filter-option {
    font-family: var(--font-principale) !important;
    font-size: var(--size-mini)
}


/* Cambia il font del campo di ricerca nel selectpicker */
.bootstrap-select .bs-searchbox input {
    font-family: var(--font-principale) !important;
    font-size: var(--size-mini) !important;                  /* dimensione testo */
    
}

.bootstrap-select .bs-searchbox input:focus {
    border-color: white;
    box-shadow: 0 0 8px #5ab14c;
    -moz-box-shadow: 0 0 8px #5ab14c;
    -webkit-box-shadow: 0 0 8px #5ab14c;
}

.bootstrap-select .dropdown-menu li.active a.active {
    background-color: var(--verde) !important;
}


/* Questi erano in front-end.css, ma non mi è chiaro il significato */
.bootstrap-select .btn {
     height: 38px;
     background-color: #f1f1f1;
     /*border-radius: 0;*/
     border-color: #8c8c8c;
     font-size: 18px;
     font-family: var(--font-principale);
     color:#464646
}
.bootstrap-select .dropdown-menu {
    /*top: 100% !important;*/
    bottom: auto !important;
}