[data-element="iconsList"] .wtps-icons-list {
  max-width: 100%;
  display: flex;
  flex-direction: var(--iconslistdirection, column);
  flex-wrap: wrap;
  gap: var(--iconslistgap, 12px);
  justify-content: var(--iconslistjustify, start);
  align-items: var(--iconslistalign, start);
}

.wtps-icons-item {
  width: 100%;
  display: flex;
  flex-direction: var(--iconslistitemdirection, row);
  align-items: var(--iconslistitemalign, center);
  justify-content: var(--iconslistitemjustify, center);
  gap: var(--iconslistitemgap, 6px);
  text-decoration: none;
  color: var(--iconslistitemcolor, var(--bodycolortext));
  background: var(--iconslistitembgcolor, transparent);
  padding: var(--iconslistitempadding, 8px);
  border-radius: var(--iconslistitemborderradius, 8px);
  border-width: var(--iconslistitemborderwidth, 0px);
  border-color: var(--iconslistitembordercolor, var(--bodycolorprimary));
  border-style: var(--iconslistitemborderstyle, solid);
  font-size: var(--iconslistitemfontsize, 16px);
  cursor: pointer;
  transition: opacity 0.2s ease;
}

/* Fallback defensivo: el icono dentro de Lista Iconos debe mantener su wrapper
   en fit-content incluso si la regla dinámica del wrapper no se rehidrata. */
[data-element="iconsList"] .wtps-icons-item > .wrapper {
  width: fit-content;
  flex: 0 0 auto;
}

[data-element="iconsList"] .wtps-icons-item:hover {
  opacity: 0.75;
}

.wtps-icons-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--iconslisticoncolor, currentColor) !important;
  background: var(--iconslisticonbgcolor, rgba(0, 0, 0, 0)) !important;
  border-radius: var(--iconslisticonborderradius, 0px) !important;
  border-width: var(--iconslisticonborderwidth, 0px) !important;
  border-color: var(--iconslisticonbordercolor, var(--bodycolorprimary)) !important;
  border-style: var(--iconslisticonborderstyle, solid) !important;
  padding: var(--iconslisticonpadding, 0px) !important;
}

[data-element="iconsList"] .wtps-icons-icon svg,
[data-element="iconsList"] .wtps-icons-icon img {
  display: block;
  object-fit: contain;
  width: var(--iconslisticonsize, 28px);
  height: var(--iconslisticonsize, 28px);
}