.elementor-7647 .elementor-element.elementor-element-1859a1e5:not(.elementor-motion-effects-element-type-background), .elementor-7647 .elementor-element.elementor-element-1859a1e5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAFAFA;}.elementor-7647 .elementor-element.elementor-element-1859a1e5 > .elementor-container{max-width:1140px;}.elementor-7647 .elementor-element.elementor-element-1859a1e5{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:10px;}.elementor-7647 .elementor-element.elementor-element-1859a1e5 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-7647 .elementor-element.elementor-element-30911235 .page-heading{font-family:"Lato", Sans-serif;font-size:14px;font-weight:400;padding:14px 0px 14px 0px;}.elementor-7647 .elementor-element.elementor-element-30911235 .woocommerce-breadcrumb{fill:#222222;color:#222222;}.elementor-7647 .elementor-element.elementor-element-30911235 .woocommerce-breadcrumb a:hover{fill:#555555;color:#555555;}.elementor-7647 .elementor-element.elementor-element-30911235 .page-heading a.back-history{font-family:"Lato", Sans-serif;font-size:14px;fill:#222222;color:#222222;}.elementor-7647 .elementor-element.elementor-element-30911235 .page-heading a.back-history:hover{fill:#555555;color:#555555;}.elementor-7647 .elementor-element.elementor-element-64665d9{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-7647 .elementor-element.elementor-element-201482f{--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:flex-start;--margin-top:30px;--margin-bottom:30px;--margin-left:0px;--margin-right:0px;--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-7647 .elementor-element.elementor-element-f1de03b{--display:flex;}.elementor-7647 .elementor-element.elementor-element-433291d{--display:flex;}.elementor-7647 .elementor-element.elementor-element-05299f7{--cols:3;}.elementor-7647 .elementor-element.elementor-element-05299f7 > .elementor-widget-container{padding:0px 25px 0px 25px;}.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-button .button-text:last-child{margin-left:7px;}.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-button .button-text:first-child{margin-right:7px;}.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-item.type-list{text-align:left;}.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-item.type-list .etheme-product-grid-content{align-self:center;}@media(max-width:1024px){.elementor-7647 .elementor-element.elementor-element-30911235 > .elementor-widget-container{padding:0px 15px 0px 15px;}}@media(max-width:767px){.elementor-7647 .elementor-element.elementor-element-05299f7{--cols:2;}.elementor-7647 .elementor-element.elementor-element-05299f7 > .elementor-widget-container{padding:10px 10px 10px 10px;}}@media(min-width:768px){.elementor-7647 .elementor-element.elementor-element-64665d9{--content-width:1350px;}.elementor-7647 .elementor-element.elementor-element-f1de03b{--width:35%;}.elementor-7647 .elementor-element.elementor-element-433291d{--width:100%;}}/* Start custom CSS for shortcode, class: .elementor-element-1315f7c *//* ============================================================
   WPF FILTER – MD3 PILL FINAL (DOT DENTRO + SIN ✓)
   ============================================================ */

/* CONTENEDOR */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_form{
  background:#f6f8f5 !important;
  padding:24px !important;
  border-radius:28px !important;
  border:1px solid #e2e6e0 !important;
}

/* TITULOS */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_item_name{
  font-size:14px !important;
  font-weight:700 !important;
  text-transform:uppercase !important;
  letter-spacing:.5px !important;
  color:#1b1f1b !important;
  margin-bottom:16px !important;
}

/* RESET */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
}

/* ============================================================
   CLAVE: GRID PARA QUE EL DOT SIEMPRE QUEDE CENTRADO
   (input y label comparten la misma “celda”, submenu va abajo)
   ============================================================ */

.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy > li,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li{
  display:grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  row-gap:10px !important;
  margin-bottom:12px !important;
  position:relative !important;
}

/* INPUT + LABEL EN LA MISMA CELDA */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy > li > input[type="checkbox"],
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li > input[type="checkbox"]{
  grid-column:1 !important;
  grid-row:1 !important;
  align-self:center !important;
  justify-self:start !important;

  appearance:none !important;
  width:14px !important;
  height:14px !important;
  border-radius:50% !important;
  border:2px solid #508a50 !important;
  background:transparent !important;
  cursor:pointer !important;

  /* posición “dentro del pill” */
  margin-left:16px !important;
  z-index:2 !important;
}

/* DOT ACTIVO (SIN ✓, SOLO RELLENO) */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy > li > input[type="checkbox"]:checked,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li > input[type="checkbox"]:checked{
  background:#508a50 !important;
}

/* PILL */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy > li > label,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li > label{
  grid-column:1 !important;
  grid-row:1 !important;

  display:block !important;
  padding:10px 16px 10px 44px !important; /* deja lugar al dot */
  border-radius:999px !important;
  background:#ffffff !important;
  border:1px solid #e0e4df !important;

  font-size:14px !important;
  font-weight:500 !important;
  color:#3b403b !important;

  cursor:pointer !important;
  transition: background .2s ease, border-color .2s ease, color .2s ease !important;

  /* NO 2 LINEAS */
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

/* SUBCATS UN POCO MÁS CHICAS */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li > label{
  font-size:13px !important;
  padding:8px 14px 8px 42px !important;
}

/* HOVER */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy > li > label:hover,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li > label:hover{
  background:#eef4ee !important;
  border-color:#508a50 !important;
}

/* ACTIVO */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy > li > input[type="checkbox"]:checked + label,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li > input[type="checkbox"]:checked + label{
  background:#508a50 !important;
  color:#ffffff !important;
  border-color:#508a50 !important;
}

/* ============================================================
   MATAR EL ✓ / ICONOS QUE METE EL PLUGIN/TEMA EN EL LABEL
   (esto es lo que te está ensuciando el pill)
   ============================================================ */

.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy label::before,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy label::after,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu label::before,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu label::after{
  content:none !important;
  display:none !important;
  background:none !important;
}

/* por si el plugin mete el ✓ solo cuando está checked */
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy input[type="checkbox"]:checked + label::before,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy input[type="checkbox"]:checked + label::after,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu input[type="checkbox"]:checked + label::before,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu input[type="checkbox"]:checked + label::after{
  content:none !important;
  display:none !important;
}

/* ============================================================
   SUBMENU (SIEMPRE ABAJO)
   ============================================================ */

.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_hierachy > li > .wpf_submenu,
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_submenu > li > .wpf_submenu{
  grid-column:1 !important;
  grid-row:2 !important;

  display:block !important;
  margin-left:24px !important;
  padding-left:14px !important;
  border-left:2px dashed #d8ddd6 !important;
}

/* ============================================================
   SLIDER PRECIO
   ============================================================ */

.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_item_price{ margin-top:24px !important; }

.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf_slider.ui-slider{
  height:4px !important;
  background:#dfe4dd !important;
  border-radius:6px !important;
  border:none !important;
  margin:18px 6px !important;
}
.elementor-7647 .elementor-element.elementor-element-1315f7c .ui-slider-range{ background:#508a50 !important; }
.elementor-7647 .elementor-element.elementor-element-1315f7c .ui-slider-handle{
  width:16px !important;
  height:16px !important;
  background:#508a50 !important;
  border:3px solid #ffffff !important;
  border-radius:50% !important;
  top:-6px !important;
  box-shadow:0 2px 6px rgba(0,0,0,.15) !important;
}
.elementor-7647 .elementor-element.elementor-element-1315f7c .wpf-slider-label{
  text-align:center !important;
  font-weight:600 !important;
  font-size:14px !important;
  color:#508a50 !important;
  margin-top:12px !important;
}/* End custom CSS */
/* Start custom CSS for woocommerce-etheme_archive_products, class: .elementor-element-05299f7 *//* ============================================================
   1. TARJETA: HOVER EN EL BORDE Y ESTRUCTURA (BASE)
   ============================================================ */
.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-item {
    background: #ffffff !important;
    border-radius: 20px !important;
    border: 1px solid #e0e4df !important; /* Borde base sutil */
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    overflow: hidden !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
}

/* Efecto Hover en el borde */
.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-item:hover {
    border-color: #508a50 !important;
    box-shadow: 0 8px 25px rgba(80, 138, 80, 0.12) !important;
    transform: translateY(-2px) !important;
}

/* ============================================================
   2. IMAGEN: DIFERENCIA VISUAL MARCADA
   ============================================================ */
.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-image {
    background-color: #f3f5f2 !important; /* Fondo tonal */
    aspect-ratio: 1 / 1 !important; 
    margin: 10px !important; /* Margen original Desktop */
    border-radius: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* Sombras y borde interno */
    border: 1px solid rgba(0,0,0,0.03) !important;
    box-shadow: inset 0 0 10px rgba(0,0,0,0.02) !important;
}

.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-image img {
    max-height: 90% !important;
    width: auto !important;
    object-fit: contain !important;
    border-radius: 8px !important;
}

/* ============================================================
   3. CONTENIDO Y PRECIOS
   ============================================================ */
.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-content {
    padding: 5px 15px 15px 15px !important;
    text-align: center !important;
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

/* Estilo del Precio Desktop */
.elementor-7647 .elementor-element.elementor-element-05299f7 .price {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
    flex-wrap: nowrap !important;
}

.elementor-7647 .elementor-element.elementor-element-05299f7 .price .amount {
    color: #508a50 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

.elementor-7647 .elementor-element.elementor-element-05299f7 .price del .amount {
    color: #a3a7a0 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    text-decoration: line-through !important;
}

.elementor-7647 .elementor-element.elementor-element-05299f7 .price ins {
    text-decoration: none !important;
}

/* Título (Aseguramos que no rompa) */
.elementor-7647 .elementor-element.elementor-element-05299f7 .product-title a {
    font-size: 15px !important;
    line-height: 1.3 !important;
}

/* ============================================================
   4. BOTÓN Y FILTROS
   ============================================================ */
.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-button {
    background-color: #f3f5f2 !important;
    color: #508a50 !important;
    border-radius: 12px !important;
    padding: 10px 15px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-top: auto !important;
    border: none !important;
    transition: all 0.2s ease !important;
    width: 100% !important;
    /* Base Desktop: texto en una línea */
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-button:hover {
    background-color: #508a50 !important;
    color: #ffffff !important;
}

/* Checkbox (MD3) */
.elementor-7647 .elementor-element.elementor-element-05299f7 input[type="checkbox"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid #508a50 !important;
    border-radius: 4px !important;
    margin: 0 14px 0 0 !important;
    cursor: pointer !important;
}

/* ============================================================
   5. AJUSTES RESPONSIVE (MÓVIL - 2 COLUMNAS)
   Aquí arreglamos que el botón se salga y el precio no quepa
   ============================================================ */
@media (max-width: 768px) {
    
    /* Ganar espacio reduciendo el margen de la foto */
    .elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-image {
        margin: 5px !important; 
        border-radius: 12px !important;
    }

    /* Reducir padding lateral del contenido */
    .elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-content {
        padding: 5px 6px 10px 6px !important;
    }

    /* Título un poco más pequeño */
    .elementor-7647 .elementor-element.elementor-element-05299f7 .product-title a {
        font-size: 13px !important;
    }

    /* PRECIO: Apilar verticalmente para que quepa */
    .elementor-7647 .elementor-element.elementor-element-05299f7 .price {
        flex-direction: column !important; /* Uno abajo del otro */
        gap: 2px !important;
        margin-bottom: 8px !important;
        flex-wrap: wrap !important;
    }
    
    .elementor-7647 .elementor-element.elementor-element-05299f7 .price .amount {
        font-size: 15px !important;
    }

    /* BOTÓN: Permitir que el texto baje a 2 líneas y reducir tamaño */
    .elementor-7647 .elementor-element.elementor-element-05299f7 .etheme-product-grid-button {
        padding: 6px 2px !important; /* Padding mínimo */
        font-size: 10px !important; /* Letra pequeña */
        white-space: normal !important; /* Permitir salto de línea */
        line-height: 1.1 !important;
        min-height: 32px !important; /* Altura mínima para asegurar clic */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .elementor-7647 .elementor-element.elementor-element-05299f7 input[type="checkbox"] {
        margin: 0 8px 0 0 !important; /* Ajuste checkbox móvil */
    }
}/* End custom CSS */