/* =========================================================
   JetSmartFilters UX
   - Active Filters
   - Active Tags
   - Remove Filters
   - Sidebar spacing / selects
========================================================= */

/* ===== CONTENEDORES GENERALES ===== */

.jet-smart-filters-active,
.jet-smart-filters-active-tags{
  margin: 6px 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* =========================================================
   ACTIVE FILTERS
========================================================= */

.jet-smart-filters-active .jet-active-filters__list,
.jet-smart-filters-active__list{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.jet-smart-filters-active .jet-active-filters__title{
  flex: 0 0 100% !important;
  margin: 0 0 3px 0 !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Cada bloque activo */
.jet-smart-filters-active .jet-active-filter,
.jet-smart-filters-active__item{
  display: inline-flex !important;
  align-items: flex-start !important;
  gap: 6px !important;
  padding: 5px 8px !important;
  border: 1px solid rgba(0,0,0,.25) !important;
  border-radius: 6px !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  font-size: 12px !important;
}

/* Texto */
.jet-smart-filters-active .jet-active-filter__label,
.jet-smart-filters-active .jet-active-filter__val,
.jet-smart-filters-active__label,
.jet-smart-filters-active__val{
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  min-width: 0 !important;
  max-width: 100% !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Label más prolijo */
.jet-smart-filters-active .jet-active-filter__label{
  display: block !important;
  font-weight: 600 !important;
  margin-bottom: 2px !important;
}

/* X */
.jet-smart-filters-active .jet-active-filter__remove,
.jet-smart-filters-active__remove,
.jet-smart-filters-active__remove-button,
.jet-smart-filters-active__remove-filter{
  position: static !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
  order: -1 !important;

  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(0,0,0,.25) !important;
  border-radius: 4px !important;
  background: transparent !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  line-height: 1 !important;
  font-size: 12px !important;
}

/* =========================================================
   ACTIVE TAGS
========================================================= */

.jet-smart-filters-active-tags .jet-active-tags__list,
.jet-smart-filters-active-tags__list,
.jet-active-tags{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Si existe título del widget */
.jet-smart-filters-active-tags .jet-active-tags__title,
.jet-smart-filters-active-tags__title{
  flex: 0 0 100% !important;
  margin: 0 0 3px 0 !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Cada tag */
.jet-smart-filters-active-tags .jet-active-tag,
.jet-smart-filters-active-tags__item,
.jet-active-tags .jet-active-tag{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 8px !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;

  border: 1px solid rgba(0,0,0,.25) !important;
  border-radius: 6px !important;
  line-height: 1.2 !important;
  background: transparent !important;
  font-size: 12px !important;
}

/* Texto del tag */
.jet-smart-filters-active-tags .jet-active-tag__label,
.jet-smart-filters-active-tags .jet-active-tag__val,
.jet-smart-filters-active-tags .jet-active-tag__text,
.jet-smart-filters-active-tags__label,
.jet-smart-filters-active-tags__val,
.jet-active-tags .jet-active-tag__label,
.jet-active-tags .jet-active-tag__val,
.jet-active-tags .jet-active-tag__text{
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  min-width: 0 !important;
  max-width: 100% !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* X del tag */
.jet-smart-filters-active-tags .jet-active-tag__remove,
.jet-smart-filters-active-tags .jet-active-tag__delete,
.jet-smart-filters-active-tags__remove,
.jet-active-tags .jet-active-tag__remove,
.jet-active-tags .jet-active-tag__delete{
  position: static !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
  order: -1 !important;

  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(0,0,0,.25) !important;
  border-radius: 4px !important;
  background: transparent !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  line-height: 1 !important;
  font-size: 12px !important;
}

/* =========================================================
   REMOVE FILTERS
========================================================= */

.jet-smart-filters-remove-filters{
  margin-top: 5px !important;
}

.jet-smart-filters-remove-filters__button,
.jet-remove-filters__button,
.jet-smart-filters-remove-filters button,
.jet-smart-filters-remove-filters a{
  display: block !important;
  width: 100% !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(0,0,0,.35) !important;
  border-radius: 6px !important;
  background: transparent !important;
  text-align: center !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* =========================================================
   FOCUS
========================================================= */

.jet-smart-filters-active .jet-active-filter__remove:focus-visible,
.jet-smart-filters-active__remove:focus-visible,
.jet-smart-filters-active__remove-button:focus-visible,
.jet-smart-filters-active__remove-filter:focus-visible,
.jet-smart-filters-active-tags .jet-active-tag__remove:focus-visible,
.jet-smart-filters-active-tags .jet-active-tag__delete:focus-visible,
.jet-smart-filters-active-tags__remove:focus-visible,
.jet-smart-filters-remove-filters__button:focus-visible{
  outline: 2px solid currentColor !important;
  outline-offset: 2px !important;
}

/* =========================================================
   SIDEBAR FILTROS
========================================================= */

/* Menos espacio vertical entre selects */
.jet-smart-filters-select,
.jet-smart-filters-select *[data-smart-filter="select"],
.jet-smart-filters-select .jet-filter,
.jet-smart-filters-select .jet-filter-row,
.jet-smart-filters-select .jet-select{
  margin-bottom: 6px !important;
}

.jet-smart-filters-select .jet-filter-row:last-child{
  margin-bottom: 0 !important;
}

/* Selects al 100% */
.jet-smart-filters-select .jet-select,
.jet-smart-filters-select .jet-select__control,
.jet-smart-filters-select select{
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.jet-smart-filters-select .jet-select__control{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Labels */
.jet-filter-label{
  margin: 8px 0 5px !important;
  line-height: 1.2 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}

.jet-checkboxes-list{
  margin-top: 0 !important;
}

/* =========================================================
   SIDEBAR FILTROS - TIPOGRAFIA COMPACTA
========================================================= */

/* Texto principal de los selects */
.jet-smart-filters-select,
.jet-smart-filters-select select,
.jet-smart-filters-select .jet-select,
.jet-smart-filters-select .jet-select__control,
.jet-smart-filters-select .jet-select__label,
.jet-smart-filters-select .jet-select__selected-value,
.jet-smart-filters-select .jet-select__placeholder{
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

/* Opciones internas del desplegable */
.jet-smart-filters-select option{
  font-size: 12px !important;
  font-weight: 400 !important;
}

/* Labels de filtros tipo checkbox / radio / jerarquicos */
.jet-filter-label,
.jet-checkboxes-list__label,
.jet-radio-list__label,
.jet-color-image-list__label,
.jet-rating-list__label{
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
}

/* Texto dentro de filtros desplegables tipo acordeon */
.jet-smart-filters-select .jet-filter-label,
.jet-filter-items-dropdown__label,
.jet-filter-items-dropdown__active{
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

/* Items dentro de dropdowns / checkboxes */
.jet-filter-items-dropdown__item,
.jet-checkboxes-list__item,
.jet-radio-list__item{
  font-size: 12px !important;
  line-height: 1.25 !important;
}

/* =========================================================
   SIDEBAR FILTROS - CAMPOS MAS COMPACTOS
========================================================= */

/* Menos alto y menos aire interno en selects */
.jet-smart-filters-select .jet-select__control,
.jet-smart-filters-select select{
  min-height: 36px !important;
  height: 36px !important;
  padding: 5px 12px !important;
  line-height: 1.2 !important;
}

/* Texto dentro del select mejor alineado */
.jet-smart-filters-select .jet-select__selected-value,
.jet-smart-filters-select .jet-select__placeholder,
.jet-smart-filters-select .jet-select__label{
  line-height: 1.2 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Dropdowns rectangulares mas compactos */
.jet-filter-items-dropdown,
.jet-filter-items-dropdown__label,
.jet-filter-items-dropdown__active{
  min-height: 36px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  line-height: 1.2 !important;
}

/* Items internos de dropdowns / checkboxes */
.jet-filter-items-dropdown__item,
.jet-checkboxes-list__item,
.jet-radio-list__item{
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

/* =========================================================
   SIDEBAR FILTROS - AJUSTE VISUAL GENERAL
========================================================= */

/* Reduce aire exterior de cada widget de filtro */
.jet-smart-filters-wrap,
.jet-smart-filters-select,
.jet-smart-filters-checkboxes,
.jet-smart-filters-radio,
.jet-smart-filters-range{
  margin-top: 0 !important;
}

/* Evita que algunos filtros hereden letras grandes del theme */
.jet-smart-filters-wrap,
.jet-smart-filters-wrap *,
.jet-smart-filters-select *,
.jet-filter-items-dropdown *{
  letter-spacing: normal !important;
}

/* Flecha/icono del select más proporcionado */
.jet-smart-filters-select .jet-select__control svg,
.jet-filter-items-dropdown__label svg,
.jet-filter-items-dropdown__active svg{
  width: 10px !important;
  height: 10px !important;
}

/* En mobile dejamos un poco más cómodo para tocar */
@media (max-width: 767px){
  .jet-smart-filters-select .jet-select__control,
  .jet-smart-filters-select select,
  .jet-filter-items-dropdown,
  .jet-filter-items-dropdown__label,
  .jet-filter-items-dropdown__active{
    min-height: 38px !important;
    height: 38px !important;
  }
}