#annunci-filtro {
   padding-top:25px;
   padding-bottom:40px;
}

#annunci-filtro form,
#annunci-filtro form .form-campi,
#annunci-filtro form .form-azioni,
#filtri-avanzati {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
/*debug colori
#annunci-filtro form {border:1px solid red; padding:2px;}
#annunci-filtro form .form-campi {border:1px solid blue; padding:2px;}
#annunci-filtro form .form-azioni {border:1px solid green; padding:2px;}
#filtri-avanzati {border:1px solid orange; padding:2px;}
*/

#annunci-filtro form input,
/*#annunci-filtro form select, da nascondere poi*/
#annunci-filtro form .apri-avanzati {
    background-color: var(--nectar-extra-color-1);
    border-radius: 8px;
   height:37px;
   padding: 0 15px !important;
   appearance: none; 
   border: 1px solid #fff;
}
#annunci-filtro form input,
#annunci-filtro form select, /*da nascondere poi*/
#annunci-filtro form input::placeholder,
#annunci-filtro form .apri-avanzati {
    color:#fff;
    font-size:18px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

#annunci-filtro form input:focus,
#annunci-filtro form input:active/*,
#annunci-filtro form select:focus*/ {    
   border: 1px solid #fff;
}
#annunci-filtro form input:focus::placeholder {
   color:var(--nectar-extra-color-1);
}

#annunci-filtro form .apri-avanzati {
    display: block;
    line-height: 40px;
   position: relative;
   cursor: pointer;
}
#annunci-filtro form .apri-avanzati .form-chevron-down{
   position: absolute;
   right: 16px;
   top:50%;
   transform: translateY(-50%);   
}
#annunci-filtro form .apri-avanzati .form-chevron-down::after{
   content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='11' viewBox='0 0 19 11' fill='none'%3E%3Cpath d='M1.5 1.5L9.5 9.5L17.5 1.5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}



/*custom select*/
.custom-select {
   position: relative;
}

.custom-select select {
  /*display: none; hide original SELECT element: */
}

.custom-select .select-selected {
  background-color: var(--nectar-extra-color-1);
   position: relative;
}
.custom-select .select-selected::after{
   content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='11' viewBox='0 0 19 11' fill='none'%3E%3Cpath d='M1.5 1.5L9.5 9.5L17.5 1.5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
   position: absolute;
   right: 16px;
   top:50%;
   transform: translateY(-50%);   
}
/*
<svg xmlns="http://www.w3.org/2000/svg" width="29" height="16" viewBox="0 0 29 16" fill="none">
    <path d="M1 1L14.5 15L28.5 1" stroke="white"/>
</svg>

clip-path: polygon(100% 0%, 0 0%, 50% 100%);
*/

/* style the selected item: */
.custom-select .select-selected {
   appearance: none; 
   background-color: var(--nectar-extra-color-1);
    border-radius: 10px;
   height:40px;
   border: 1px solid #fff;
   color:#fff;
    text-align: center;
   padding: 8px 15px !important; 
   cursor: pointer; 
}
/* Style dropdown: */
.custom-select .select-items {
  position: absolute;
  background-color: var(--nectar-extra-color-4);
  top:calc(100% - 2px);
  left: 0;
  right: 0;
  z-index: 99;
   padding:15px;
   border-radius: 0 0 10px 10px;
   border: 2px solid #fff;
   border-top:2px solid var(--nectar-accent-color);
   max-height: 176px;
    overflow: auto;
   
}

/*stile scrollbar*/
.custom-select .select-items::-webkit-scrollbar {
    width: 6px;
}
/* the progress bar of the scrollbar. */
.custom-select .select-items::-webkit-scrollbar-track {
    background: #EEE;
    border-radius: 30px;
    border-right:2px solid var(--nectar-extra-color-4);;
    border-left:2px solid var(--nectar-extra-color-4);;
}
/* the draggable scrolling handle */
.custom-select .select-items::-webkit-scrollbar-thumb {
  background: #CCC;
  border-radius: 30px;
} 


/*items typography*/
.custom-select .select-selected,
.custom-select .select-items div {
    font-size:18px; 
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
/*single items*/
.custom-select .select-items div {
   color:var(--nectar-extra-color-1);
   padding: 4.5px 15px !important;   
   cursor: pointer;
}

/*selected item on open*/
.custom-select .select-selected.select-arrow-active {
    border-radius: 10px 10px 0 0;
}

/* Hide the items when the select box is closed: */
.custom-select .select-hide {
  display: none;
}

.custom-select .select-items div:hover, 
.custom-select .same-as-selected {
  color: var(--nectar-accent-color) !important;
}


/*submit*/
#submit-search,
#filtri-reset {
   width: 100%;
   background-color: #fff !important;
   border: 1px solid var(--nectar-extra-color-1) !important;
   color: var(--nectar-extra-color-1) !important;
   border-radius: 10px !important;
   text-align:center;
   font-size:18px;
   display: flex;
   align-items: center;
   justify-content: center;
   min-height: 42px;
}


@media(min-width:1000px){
   #annunci-filtro {
      padding-top: 35px;
      padding-bottom: 40px;
      padding-left: 30px;
      padding-right: 30px;
   }
   /*nelle altre pagine, le righe row che hanno il form da tablet in su hanno border radius*/
   .wpb_row:has(#annunci-filtro) .inner-wrap.row-bg-layer {
       border-radius: 15px;
   }
   
   #annunci-filtro form {
      flex-direction: row;
   }
   /*#annunci-filtro form .form-campi,
   #annunci-filtro form .form-azioni {
      flex-grow:1;
   }*/
   #annunci-filtro form .form-campi {
      flex-direction: row;
      flex-wrap: wrap;
   }
   #annunci-filtro form .form-campi {
      flex-shrink:0;
      /*flex-basis: 82%;*/
      width: 85%;
   }
   #annunci-filtro form .form-campi input,
   #annunci-filtro form .form-campi input::placeholder {
      text-align: left;
   }
   #annunci-filtro form .form-campi > div {
      flex-grow:1;
   }
   #annunci-filtro form .form-campi > div:has(#ann_job_title) {
      /*flex-basis: calc((100% - 15px)/3);*/
      width:calc(33% - 15px);
   } 
   #annunci-filtro form .form-campi > div:has(#ann_luogo) {
      /*flex-basis: calc((100% - 15px)/2);*/
      width:calc(66% - 15px);
   }
   
   #annunci-filtro form .form-azioni {
      /*flex-shrink:1;
      flex-basis: 18%;*/
      width: 15%;
   }
   #annunci-filtro form .form-campi #filtri-avanzati {
      flex-direction: row;
      width:100%;
      display: flex !important;
   }
   #annunci-filtro form .form-campi #filtri-avanzati > div {
      /*flex-grow:1;
      flex-basis: calc((100% - 30px)/3);*/
      width: calc((100% - 30px)/3);
   }
   #annunci-filtro form .form-campi #filtri-avanzati select {
      text-align: left;
   }
   
   #annunci-filtro form input, 
   #annunci-filtro form input::placeholder, 
   #annunci-filtro form .apri-avanzati {
       font-size: 20px;
   }
   #annunci-filtro form input, 
   #annunci-filtro form .apri-avanzati {
       border-radius: 15px;
       height: 56px;
       border: 2px solid #fff;
   }
   #submit-search, 
   #filtri-reset {
       /*border: 2px solid var(--nectar-extra-color-1) !important;*/
       border: 2px solid #fff !important;
       min-height: 56px;
       border-radius: 15px !important;
      font-size:20px;
   }
   #filtri-reset {
      display: none !important;
   }
   
   #annunci-filtro form .apri-avanzati {
      display: none;
   }
}
 
@media(min-width:1000px) and (max-width:1249px){
   #filtri-reset span {
      display: none;
   }
}
@media(min-width:1250px){
   #annunci-filtro form input, 
   #annunci-filtro form input::placeholder, 
   #annunci-filtro form .apri-avanzati {
       font-size: 25px;
   }
   #submit-search, 
   #filtri-reset {
      font-size: 25px;
   }
}



/*stile dei select2*/
.custom-select .select2-container {
    width:100% !important;
}
.custom-select .select2-selection {
    border-radius: 8px;
    height: 37px;
    border: 0px solid #fff;
    /*background: transparent;*/
   background-color: var(--nectar-extra-color-1)
}
.custom-select #ann_job_title + .select2 .select2-selection {
    border: 1px solid #fff;
}

.custom-select .select2-selection > span {
    height: 100% !important;
}

.custom-select .select2-selection > span.select2-selection__rendered {
   color:#fff;
    font-size:18px; 
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.3px;
      padding-top:4px;
}

.select2-container--open .select2-dropdown {
    /*width: auto;*/
    border-top: 3px solid var(--nectar-accent-color);
    margin-top: 0px;
    overflow: hidden;
   border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
   border: none !important;
}
.select2-container--open .select2-dropdown .select2-search,
.select2-container--open .select2-dropdown .select2-results {
   background-color: #f8f5f5;
}
/*.select2-container--open .select2-dropdown .select2-results .select2-results__options {
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}*/
.select2-container--open .select2-dropdown .select2-results .select2-results__options > li {
    word-break: break-word;
    line-height: 1;
   padding: 13px 10px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected], 
.select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: transparent;
    color: var(--nectar-accent-color);
}

.select2-selection__arrow b {
   display: none !important;
}
.select2-selection__arrow::after{
   content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='11' viewBox='0 0 19 11' fill='none'%3E%3Cpath d='M1.5 1.5L9.5 9.5L17.5 1.5' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
   position: absolute;
   right: 15px;
   top:50%;
   transform: translateY(-50%);   
}
.custom-select #ann_job_title + .select2 .select2-selection__arrow::after {
    display: none !important;
}

@media(min-width:1000px){
   .custom-select .select2-selection {
       height: 56px;      
       border-radius: 15px;
   }
   .custom-select #ann_job_title + .select2 .select2-selection {
       border: 2px solid #fff; 
   } 

   .custom-select .select2-selection > span.select2-selection__rendered {
       font-size: 20px;
      text-align: left;
      padding-top:13px;
   }
   .select2-selection__arrow::after{
      right: 0; 
   }
   
}
 
@media(min-width:1000px) and (max-width:1249px){
   
}

@media(min-width:1250px){
   .custom-select .select2-selection > span.select2-selection__rendered {
       font-size: 25px;
   }
}
