.elementor-1016 .elementor-element.elementor-element-8c246fc{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--padding-top:30px;--padding-bottom:10px;--padding-left:0px;--padding-right:0px;}.elementor-1016 .elementor-element.elementor-element-8c246fc.e-con{--align-self:center;}.elementor-1016 .elementor-element.elementor-element-4891c48{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1016 .elementor-element.elementor-element-b65196f img{width:100%;}.elementor-1016 .elementor-element.elementor-element-4a6668e .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-weight:600;}.elementor-1016 .elementor-element.elementor-element-2519afa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(max-width:767px){.elementor-1016 .elementor-element.elementor-element-4891c48{--width:24px;}.elementor-1016 .elementor-element.elementor-element-4a6668e .elementor-heading-title{font-size:22px;}}@media(min-width:768px){.elementor-1016 .elementor-element.elementor-element-4891c48{--width:3%;}}/* Start custom CSS *//* CSS PERSONALIZADO COMPLETO PARA EL LISTADO DE TIENDAS WP STORE LOCATOR */

/* 1. Cambiar toda la tipografía por Montserrat */
/* Aplicar Montserrat a todos los elementos relevantes del listado */
#wpsl-stores ul li,
#wpsl-stores ul li .wpsl-direction-wrap {
    font-family: 'Montserrat', sans-serif !important; /* Usar !important para asegurar que se aplique */
    font-size: 12px; /* Tamaño de fuente 12px */
    line-height: 1.5; /* Altura de línea para mejorar legibilidad */
}

/* Estilo base para cada elemento de la lista (cada tienda) */
#wpsl-stores ul li {
    list-style: none; /* Eliminar los puntos o números de la lista */
    background-color: #fff; /* Fondo blanco para cada item */
    border: 1px solid #e0e0e0; /* Marco gris suave de 1px */
    padding: 15px; /* Espacio interno dentro del marco */
    margin-bottom: 20px; /* Espacio entre cada tienda listada */
    border-radius: 5px; /* Esquinas ligeramente redondeadas para el marco */
    box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* Sombra suave, opcional */
    display: flex; /* Habilitar flexbox para el contenedor principal de la tienda */
    flex-direction: column; /* Apilar los contenidos verticalmente */
    align-items: flex-start; /* Alinear todo el contenido a la izquierda */
}

/* Contenedor principal de los detalles de la tienda */
.wpsl-store-location {
    width: 100%; /* Ocupa todo el ancho disponible dentro del LI */
    margin-bottom: 0; /* Aseguramos que no haya margen inferior aquí */
}

/* Estilos para el párrafo que contiene la imagen, nombre y dirección */
/* ###################################################################### */
/* ############### CAMBIO CLAVE PARA EL ESPACIO DE LA DIRECCIÓN ############### */
/* ###################################################################### */
#wpsl-result-list li p {
    margin: 0 0 10px 0 !important; /* Reducir el margen inferior del párrafo a 10px */
    padding: 0; /* Asegurar que no tenga padding extra */
    display: flex; /* Mantenemos el flex para el orden interno */
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}
/* ###################################################################### */


/* Asegurar que la imagen, nombre y spans de dirección se comporten como items Flex */
#wpsl-result-list li p > img,
#wpsl-result-list li p > strong,
#wpsl-result-list li p > span {
    display: block;
    width: auto;
}

/* Orden de los elementos dentro del párrafo */
#wpsl-stores ul li .wpsl-store-location > p:first-of-type > img.wpsl-store-thumb {
    order: 1;
    margin: 0 !important; /* Eliminar todos los márgenes */
    width: 250px !important;
    height: auto !important;
    max-width: 250px;
}

.wpsl-store-location > p:first-of-type > strong {
    order: 2;
    margin-top: 5px; /* Espacio desde la imagen */
    margin-bottom: 5px;
    font-size: 1.1em;
    font-weight: bold;
    text-align: left;
}

.wpsl-store-location > p:first-of-type > .wpsl-street {
    order: 3;
    margin-bottom: 2px;
    text-align: left;
}

.wpsl-store-location > p:first-of-type > span:last-of-type {
    order: 4;
    margin-bottom: 0; /* Aseguramos que no haya margen inferior aquí */
    text-align: left;
}

/* ###################################################################### */
/* ############### CAMBIOS CLAVE PARA REDUCIR ESPACIOS ################ */
/* ###################################################################### */

/* Información del Teléfono (wpsl-contact-details) en 1 sola línea */
.wpsl-contact-details {
    display: block;
    margin-top: 0 !important; /* Eliminamos el margen superior para que el espacio lo controle el 'p' de dirección */
    text-align: left;
}

.wpsl-contact-details span {
    display: inline;
    white-space: nowrap;
}

.wpsl-contact-details strong {
    display: inline;
}

/* Información de kilómetros y link en 2 líneas */
.wpsl-direction-wrap {
    display: block;
    margin-top: 0 !important; /* <-- ¡NUEVO: Eliminar el margen superior por completo! */
    text-align: left;
}

.wpsl-direction-wrap a.wpsl-directions {
    display: block;
    margin-top: 5px; /* Espacio entre los km y el enlace */
    font-weight: bold;
    color: #E30613;
    text-decoration: none;
    text-align: left;
}
/* ###################################################################### */


/* CSS PARA LA BARRA DE BÚSQUEDA DEL WP STORE LOCATOR */

/* 1. Estilo para el contenedor principal de la barra de búsqueda (.wpsl-search) */
.wpsl-search {
    background-color: #fff; 
    border: 2px solid #E30613; 
    border-radius: 8px; 
    padding: 10px; 
}

/* 2. Estilo para el texto "Buscar una dirección:" */
.wpsl-search label[for="wpsl-search-input"] {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px; 
    font-weight: bold; 
    color: #000; 
    margin-bottom: 2px; /* Espacio debajo del label si está en su propia línea */
    display: block; /* Aseguramos que el label esté en su propia línea */
}

/* Contenedor del input para que el label y el input se comporten bien */
.wpsl-search .wpsl-input {
    flex-grow: 1; /* Permite que el input ocupe el espacio disponible */
    min-width: 200px; /* Ancho mínimo para el input */
}

/* 3. Estilo para el cuadro de texto (input de dirección) */
#wpsl-search-input {
    border: 1px solid #E30613 !important; /* Borde de 1px, color #E30613 */
    font-family: 'Montserrat', sans-serif !important; /* Tipografía Montserrat */
    font-size: 14px !important; /* Tamaño 14px */
    color: #000 !important; /* Color negro */
    padding: 10px 15px !important; /* Padding interno para el texto */
    border-radius: 4px; /* Un poco de redondeo para que coincida con el botón */
    width: 100%; /* Ocupa el 100% del espacio de su contenedor flex-grow */
    box-sizing: border-box; /* Asegurar que el padding no aumente el tamaño total */
}


/* ESTILOS ESPECÍFICOS PARA EL BOTÓN DE BÚSQUEDA (#wpsl-search-btn) */
#wpsl-search-btn {
    
    background-image: none !important; 
    background-color: #E30613 !important;
    padding: 7px 50px !important; 
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important; 
    color: #fff !important; 
    border: none !important; 
    border-radius: 4px !important; 
    cursor: pointer !important; 
    transition: background-color 0.3s ease !important; 
    
    /* Propiedades para anular estilos por defecto del navegador en botones (último recurso) */
    appearance: none !important;
    -webkit-appearance: none !important; /* Para navegadores Webkit (Chrome, Safari) */
    -moz-appearance: none !important; /* Para navegadores Mozilla (Firefox) */
}

/* Estilo para el botón de buscar al hacer hover */
#wpsl-search-btn:hover {
    background-color: #000 !important; 
}


#wpsl-result-list{
    width:30%;   
}
#wpsl-gmap{
    width:70%;
}

#wpsl-checkbox-filter.wpsl-checkbox-3-columns li, .wpsl-custom-checkboxes.wpsl-checkbox-3-columns li {
    width: 30%;
}

#wpsl-checkbox-filter, .wpsl-custom-checkboxes {
    width: 30%;
}

/* ESTILOS SOLO PARA MÓVILES (Pantallas de hasta 767px de ancho) */
/* Estos estilos se aplicarán en móviles, haciendo que el mapa y los resultados se apilen. */
@media screen and (max-width: 767px) {
    #wpsl-result-list {
        width: 100% !important; /* El listado ocupa todo el ancho en móviles */
        float: none !important; /* Asegura que no haya flotadores que impidan que se apile */
        margin-bottom: 20px; /* Un pequeño espacio entre el listado y el mapa en móvil */
        box-sizing: border-box; /* Asegura que el padding no afecte el width total */
    }

    #wpsl-gmap {
        width: 100% !important; /* El mapa ocupa todo el ancho en móviles */
        float: none !important; /* Asegura que no haya flotadores que impidan que se apile */
        box-sizing: border-box; /* Asegura que el padding no afecte el width total */
    }
}/* End custom CSS */