/**
 * Custom Icon List Widget – Estilos base
 * Los valores numéricos son defaults que Elementor sobreescribe
 * con sus propios selectores generados en el panel.
 */

/* ── Contenedor principal (ul) ─────────────────────── */
.custom-icon-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Layout horizontal (inline) */
.custom-icon-list--layout-inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

/* ── Cada ítem (li) ────────────────────────────────── */
.custom-icon-list-item {
    display: flex;
    align-items: center;
    /* flex-direction se controla desde el panel:
       row          → ícono a la izquierda
       row-reverse  → ícono a la derecha   */
    flex-direction: row;
}

/* Enlace que envuelve todo el ítem */
.custom-icon-list-item > a {
    display: flex;
    align-items: center;
    width: 100%;
    text-decoration: none;
    color: inherit;
    /* Hereda la dirección del <li> */
    flex-direction: inherit;
}

/* ── Span del ícono ────────────────────────────────── */
.custom-icon-list-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    /* El gap ícono ↔ texto se aplica vía el panel (margin-right / margin-left) */
    margin-right: 8px;
}

/* Cuando el ícono está a la derecha, el panel cambia los márgenes,
   pero garantizamos que el valor heredado sea correcto */
.custom-icon-list--icon-right .custom-icon-list-icon {
    margin-right: 0;
    margin-left: 8px;
}

/* ── Span del texto ────────────────────────────────── */
.custom-icon-list-text {
    flex: 1; /* Ocupa el espacio restante */
    min-width: 0; /* Evita overflow en textos largos */
}

/* ── Divisor generado con ::after en el <li> ──────── */
.custom-icon-list-item:not(:last-child):after {
    display: block;
    width: 100%;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #ddd;
    margin-top: 0.5px;
    /* El switcher "Divisor" del panel activa/desactiva content */
}