.wpfiltros{ display: flex; width: 100%; font-family: 'Lato', Arial, sans-serif; padding:12px; background:#fff; border-radius:6px; }
.wpf_mensaje_inicial {display: block; background-color: rgba(217, 217, 217, 0.2); border-radius: 20px; padding: 20px 30px; color: #073D63; font-family: 'Saira'; font-size: 20px; font-weight: 600; margin-top: 20px; margin-right: 15px; }
.wpf_mensaje_inicial.mobile { display: none;}
.wpf_toolbar{ display: inline; width: 35%; align-items:center; margin-right: 15px;}
.wpf_address{ position:relative; min-width:420px; }
.wpf_input{ width:82% !important; padding:12px 44px 12px 16px !important; border:2px solid #063D63 !important; border-radius:30px !important; font-size:16px; color:#063D63; outline: none; }
.wpf_geo_btn{ position: relative; right: 0px; top: 5px; width:36px; height:36px; border-radius:50%; border:none; background:#fff url('../img/gps.png') no-repeat center; background-size: 32px; cursor:pointer !important; box-shadow:none; outline: none;}
.wpf_geo_btn:hover { background-color: inherit;}
.wpf_tabs{ display:flex; gap:12px; list-style:none; padding:0; margin:0; }
.wpf_tabs li a{ display:inline-block; padding:9px 30px 7px 30px; border-radius:25px; border:2px solid #063D63; color:#063D63; text-decoration:none; font-size: 18px; font-weight:700; line-height: 27px; background:#fff; }
.wpf_tabs li a.active{ background:#063D63; color:#fff; }
.wpf_tabs li a:hover { color: #FFFFFF !important; background-color: #063D63; transition: all .4s ease-in-out;}
.select-filtros {    border-style: solid;
    border-width: 2px 2px 2px 2px;
    font-family: 'Lato', Arial, sans-serif;
    font-size: 18px;
    line-height: 30px;
    font-weight: 700;
    vertical-align: middle;
    border-radius: 25px;
    color: #063D63 !important;
    border-color: #063D63;
    margin-top: 10px;
    margin-right: 10px;
    padding: 9px 45px 9px 30px;
    background: url('../img/arrow-down-azul.svg') 95% center no-repeat;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    outline: none;}
.wpf_content{ margin-top:10px;}
.wpf_panel{ background:#fff; border-radius:8px; min-height: 60px; }
.fila{ display:flex; gap:12px; flex-wrap:wrap; }
.filtro-box{ /*min-width:220px; flex:1 1 240px; */}
.filtro-box label{ display:block; font-weight:700; margin-bottom:6px; color:#063D63; }
/*.filtro-box select{ width:100%; padding:10px 12px; border:2px solid #063D63; border-radius:20px; background:#fff; }*/
.wpf_panel_extras{ width: 65%; align-items:center; padding: 0 20px 40px 20px; gap:24px; box-shadow:0 2px 6px rgba(0,0,0,0.08);  }
.wpf_slider_wrap{ margin-top:15px; font-family: 'Saira', Arial, sans-serif; color: #073D63; font-size: 18px; font-weight: 400; padding-left: 10px;}
.wpf_slider{ width:320px; }
.wpf_slider input[type=range]{ width:100%; accent-color:#149edc; outline: none; background-color: #063D63;}
.wpf_slider_labels{ display:flex; justify-content:space-between; font-size:13px; color:#063D63; margin-top:6px; }
.wpf_order_wrap{ font-weight: 400; color: #073D63; font-size: 16px; margin-top: 10px; margin-left: -5px; clear: both; }
.wpf_actions{ padding-top:25px; clear: both; }
.wpf_btn{ background-color:#0A9ED9; color:#fff;  border: 2px solid #0A9ED9; padding:6px 46px; border-radius:25px; font-size: 18px; font-weight: 700; box-shadow:none; cursor: pointer;}
.wpf_btn:hover { background: #fff; color: #0A9ED9; border: 2px solid #0A9ED9;}
.wpf_btn.disabled{pointer-events: none; opacity: .65;}
.hidden{ display:none !important; }

/* Slider distancia */

.filtros-distancia {
    font-family: 'Saira';
    font-size: 18px;
    margin-bottom: 40px;
    margin-top: 30px;
    width: 50%;
    color: #073D63;
}

.filtros-distancia label {
    display: block;
    /*padding-left: 10px;*/
}

.distancia-slider {
    height: 2px !important;
    border: none !important;
}

.distancia-slider .noUi-connects {
    border-radius: 0;
    background-color: #0A9ED9;
    height: 2px;
}

.distancia-slider .noUi-connect {
    background: #063D63;
}

.distancia-slider .noUi-handle {
    border: none;
    width: 32px;
    height: 32px;
    background: url('../img/icono-distancia-slider.svg') center center no-repeat;
    margin-top: -26px;
    right: -17px; /* half the width */
    box-shadow: none;
    background-color: #fff;
    outline: none;
}

.distancia-slider .noUi-handle:after,
.distancia-slider .noUi-handle:before {
    background: none;
}

.noUi-horizontal .noUi-tooltip {
    bottom: -90%;
    padding: 0 5px;
    border: none;
    color: inherit;
    font-size: 16px;
}


/* Toggle button */
.toggle {
    position: relative;
    display: inline-block;
    margin-top: 0.5rem;
    width: 50px;
    height: 26px;
    background-color: hsl(0, 0%, 85%);
    border-radius: 25px;
    cursor: pointer;
    transition: background-color 0.25s ease-in;
}
.toggle::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 22px;
    height: 22px;
    background-color: white;
    border-radius: 50%;
    transition: all 0.25s ease-out;
}
.hide-me:checked + .toggle {
    /*background-color: hsl(102, 58%, 39%);*/
    background-color:#063D63;
}
.hide-me:checked + .toggle::after {
    transform: translateX(24px);
}
.hide-me {
    opacity: 0;
    height: 0;
    width: 0;
}

/* Mobile */
@media (max-width: 767.98px) {
    .wpf_mensaje_inicial { display: none; }
    .wpf_mensaje_inicial.mobile { display: inherit; margin-right: 0; margin-bottom: 15px;}
    .wpfiltros{ flex-direction: column; width: inherit;}
    .wpf_toolbar{ width: 100%; margin-right: 0; margin-bottom: 15px; }
    .wpf_address { min-width: auto; width: 100%; }
    .wpf_input { width: 88% !important;}
    .wpf_panel_extras{ width: 100%; padding: 0; box-shadow: none; }
    .filtros-distancia { width: 100%; }
    .wpf_tabs { display: inherit; padding-bottom: 10px; border-bottom: 1px solid #ccc; }
    .wpf_tabs li { display: inline; }
    .wpf_tabs a { white-space: nowrap; margin: 0 8px 16px 0;}
    .filtro-box, .select-filtros { width: 100%;}
}