/* =========================================================
ICON LIST SYSTEM — FLOW + UI GAP VERSION (Elementor scoped)

PRINZIP:
- il-*        = vertikaler Abstand (Content Flow via --flow-*)
- il-ig-*     = horizontaler Abstand Icon↔Text (UI Gap via --ui-gap-*)
- keine festen em-Werte

TOKENS:
- Vertikal:   --flow-*
- Horizontal: --ui-gap-*
========================================================= */


/* =========================================================
1) BASE
========================================================= */

.elementor .elementor-widget-icon-list[class*=" il-"],
.elementor .elementor-widget-icon-list[class^="il-"]{
  --il-gap-y: var(--flow-m);
  --il-gap-x: var(--ui-gap-s);
  --il-lh: 1.4;
}


/* =========================================================
2) LIST RESET
========================================================= */

.elementor .elementor-widget-icon-list[class*=" il-"] .elementor-icon-list-items,
.elementor .elementor-widget-icon-list[class^="il-"] .elementor-icon-list-items{
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}


/* =========================================================
3) VERTICAL FLOW SPACING
========================================================= */

.elementor .elementor-widget-icon-list[class*=" il-"]:not(.elementor-icon-list--layout-inline) .elementor-icon-list-item,
.elementor .elementor-widget-icon-list[class^="il-"]:not(.elementor-icon-list--layout-inline) .elementor-icon-list-item{
  margin-block-end: var(--il-gap-y);
}

.elementor .elementor-widget-icon-list[class*=" il-"]:not(.elementor-icon-list--layout-inline) .elementor-icon-list-item:last-child,
.elementor .elementor-widget-icon-list[class^="il-"]:not(.elementor-icon-list--layout-inline) .elementor-icon-list-item:last-child{
  margin-block-end: 0;
}


/* =========================================================
4) ITEM STRUCTURE
========================================================= */

.elementor .elementor-widget-icon-list[class*=" il-"] .elementor-icon-list-item,
.elementor .elementor-widget-icon-list[class^="il-"] .elementor-icon-list-item{
  gap: 0 !important;
}


/* =========================================================
5) ICON
========================================================= */

.elementor .elementor-widget-icon-list[class*=" il-"] .elementor-icon-list-icon,
.elementor .elementor-widget-icon-list[class^="il-"] .elementor-icon-list-icon{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin: 0 !important;
  padding: 0 !important;

  margin-inline-end: var(--il-gap-x) !important;
}


/* =========================================================
6) TEXT
========================================================= */

.elementor .elementor-widget-icon-list[class*=" il-"] .elementor-icon-list-text,
.elementor .elementor-widget-icon-list[class^="il-"] .elementor-icon-list-text{
  line-height: var(--il-lh) !important;
  color: var(--c-text);
}


/* =========================================================
7) FLOW SCALE (VERTICAL)
========================================================= */

.elementor .elementor-widget-icon-list.il-xxs{ --il-gap-y: var(--flow-xxs); }
.elementor .elementor-widget-icon-list.il-xs { --il-gap-y: var(--flow-xs);  }
.elementor .elementor-widget-icon-list.il-s  { --il-gap-y: var(--flow-s);   }
.elementor .elementor-widget-icon-list.il-m  { --il-gap-y: var(--flow-m);   }
.elementor .elementor-widget-icon-list.il-l  { --il-gap-y: var(--flow-l);   }
.elementor .elementor-widget-icon-list.il-xl { --il-gap-y: var(--flow-xl);  }
.elementor .elementor-widget-icon-list.il-xxl{ --il-gap-y: var(--flow-xxl); }


/* =========================================================
8) UI GAP SCALE (HORIZONTAL)
========================================================= */

.elementor .elementor-widget-icon-list.il-ig-xxs{ --il-gap-x: var(--ui-gap-xxs); }
.elementor .elementor-widget-icon-list.il-ig-xs { --il-gap-x: var(--ui-gap-xs);  }
.elementor .elementor-widget-icon-list.il-ig-s  { --il-gap-x: var(--ui-gap-s);   }
.elementor .elementor-widget-icon-list.il-ig-m  { --il-gap-x: var(--ui-gap-m);   }
.elementor .elementor-widget-icon-list.il-ig-l  { --il-gap-x: var(--ui-gap-l);   }
.elementor .elementor-widget-icon-list.il-ig-xl { --il-gap-x: var(--ui-gap-xl);  }


/* =========================================================
9) MODIFIERS
========================================================= */

/* kompakter Text */
.elementor .elementor-widget-icon-list.il-tight{
  --il-lh: 1.25;
}

/* muted */
.elementor .elementor-widget-icon-list.il-muted .elementor-icon-list-text{
  color: var(--c-muted) !important;
}

/* Separator */
.elementor .elementor-widget-icon-list.il-sep .elementor-icon-list-item{
  padding-bottom: var(--il-gap-y);
  border-bottom: 1px solid var(--c-border);
}

.elementor .elementor-widget-icon-list.il-sep .elementor-icon-list-item:last-child{
  padding-bottom: 0;
  border-bottom: 0;
}