/* ==========================================================================
   UXD Icon List Widget
   ========================================================================== */

.uxdwfe-icons-list-wrapper { width: 100%; }

/* ── List container ────────────────────────────────────────────────────────── */
.uxdwfe-icons-list-items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ── Single item ───────────────────────────────────────────────────────────── */
.uxdwfe-icons-list-item {
    display: flex;
    align-items: center;
    gap: 3px;
    position: relative;
    transition: transform 0.22s ease;
}

/* Items with a link wrap in <a> — make it inherit the flex layout */
.uxdwfe-icons-list-item > a {
    display: flex;
    align-items: center;
    gap: inherit;
    text-decoration: none;
    width: 100%;
    color: inherit;
}

/* ── Icon ──────────────────────────────────────────────────────────────────── */
.uxdwfe-icons-list-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
    color: #667eea; /* default — overridden by Elementor control */
    transition: color 0.22s ease;
    padding: 10px;
    border-radius: 7px;
}
.uxdwfe-icons-list-icon i,
.uxdwfe-icons-list-icon svg { display: block; }

/* ── Number badge ──────────────────────────────────────────────────────────── */
.uxdwfe-list-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.75em;
    height: 1.75em;
    border-radius: 50%;
    font-weight: 700;
    font-size: 0.82em;
    line-height: 1;
    /* CSS-driven defaults — overridden via Elementor controls */
    background-color: var(--uxd-il-num-bg, #667eea);
    color: var(--uxd-il-num-color, #ffffff);
    transition: background-color 0.22s ease, color 0.22s ease;
}

/* ── Text ──────────────────────────────────────────────────────────────────── */
.uxdwfe-icons-list-text {
    flex: 1;
    line-height: 1.6;
    color: #333333; /* default — overridden by Elementor control */
    transition: color 0.22s ease;
}

/* ── Icon position: right ──────────────────────────────────────────────────── */
.uxdwfe-icons-position-right .uxdwfe-icons-list-item,
.uxdwfe-icons-position-right .uxdwfe-icons-list-item > a { flex-direction: row-reverse; }

/* ── Horizontal layout ─────────────────────────────────────────────────────── */
.uxdwfe-layout-horizontal .uxdwfe-icons-list-items {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
}
.uxdwfe-layout-horizontal .uxdwfe-icons-list-item { width: auto; }

/* In horizontal layout disable the slide hover */
.uxdwfe-layout-vertical .uxdwfe-icons-list-item:hover { transform: translateX(4px); }
.uxdwfe-layout-vertical.uxdwfe-icons-position-right .uxdwfe-icons-list-item:hover { transform: translateX(-4px); }
.uxdwfe-layout-horizontal .uxdwfe-icons-list-item:hover { transform: translateY(-2px); }