.elementor-1193 .elementor-element.elementor-element-957ebfe{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:200px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-1193 .elementor-element.elementor-element-3bfed52{width:var( --container-widget-width, 70.089% );max-width:70.089%;--container-widget-width:70.089%;--container-widget-flex-grow:0;}.elementor-1193 .elementor-element.elementor-element-3bfed52.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-1193 .elementor-element.elementor-element-d82ceea{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}/* Start custom CSS for html, class: .elementor-element-3bfed52 *//* ========== JOLET SEARCH – CSS COMPLETO (versión final) ========== */

/* ---------- Layout del formulario ---------- */
.jolet-search{
  display:flex;               /* barra + chips en la misma línea */
  flex-wrap:wrap;             /* se parte en 2 filas en pantallas estrechas */
  align-items:center;
  gap:16px;
}

/* ---------- Barra de búsqueda ---------- */
.jolet-search .search-wrap{
  position:relative;
  flex:1 1 420px;             /* ancho flexible, mínimo ~420 px */
  max-width:600px;
  overflow:visible;           /* deja salir la lupa por encima del borde */
}
.jolet-search .search-input{
  width:100%;
  padding:12px 54px 12px 20px;/* hueco a la derecha para la lupa */
  font-size:18px;
  font-weight:600;            /* texto algo más grueso */
  border:2px solid #e6e6e6;
  border-radius:40px;
  outline:none;
}

/* Oculta la cruz azul nativa de los inputs search (Chrome / Edge) */
.jolet-search .search-input::-webkit-search-cancel-button,
.jolet-search .search-input::-webkit-search-decoration,
.jolet-search .search-input::-webkit-search-results-button,
.jolet-search .search-input::-webkit-search-results-decoration{
  display:none;
}
.jolet-search .search-input::-ms-clear{display:none;width:0;height:0;}

/* ---------- Botón / icono de lupa ---------- */
.jolet-search .search-btn{
  position:absolute;
  top:50%; right:14px;
  transform:translateY(-50%) scale(1);   /* centrado + escala normal */
  width:36px; height:36px;
  display:flex; align-items:center; justify-content:center;
  border:0; background:none;
  border-radius:50%;
  font-size:20px;             /* tamaño del icono */
  color:#323232;
  z-index:3;                  /* por encima del borde del input */
  cursor:pointer;
  transition:transform .15s ease, background-color .15s ease;
}
.jolet-search .search-btn svg,
.jolet-search .search-btn i{  /* tanto si usas SVG como icon-font */
  stroke:#323232;
  color:#323232;
}

/* Hover / focus: círculo lila + agrandar */
.jolet-search .search-btn:hover,
.jolet-search .search-btn:focus{
  background:#C9A3D2;                /* círculo lila claro */
  transform:translateY(-50%) scale(1.15);
}

/* Al hacer clic vuelve al tamaño normal (rebote) */
.jolet-search .search-btn:active{
  transform:translateY(-50%) scale(1);
}

/* ---------- Chips ---------- */
.jolet-search .chip-list{
  display:flex;
  margin:0; padding:0;
  list-style:none;
  gap:6px;
}
.jolet-search .chip{
  display:inline-block;
  padding:6px 18px;
  border:1px solid #dcdcdc;
  border-radius:22px;
  background:#f6f6f6;
  font-size:14px;
  font-weight:600;            /* texto más grueso */
  cursor:pointer;
  transition:.2s;
  user-select:none;
}
.jolet-search .chip.active{
  background:#111;
  color:#fff;
  border-color:#111;
  font-weight:700;            /* chip seleccionado aún más fuerte */
}/* End custom CSS */