/* ── List Style Extension ─────────────────────────────────────────────────── */

/* Shared: suppress default bullets — padding inherits so text aligns with default list */
.oi-list--no-bullets,
.oi-list--checklist,
.oi-list--icon-list {
    list-style: none;
}

.oi-list--no-bullets li,
.oi-list--checklist li,
.oi-list--icon-list li {
    list-style: none;
}

.oi-list--no-bullets li::marker,
.oi-list--checklist li::marker,
.oi-list--icon-list li::marker {
    content: none;
}

/* ── Checklist + Icon List: flex layout ───────────────────────────────────── */

.oi-list--checklist li,
.oi-list--icon-list li {
    display: flex;
    align-items: center;
    padding: 5px 0;
}

/* ── Icon span ────────────────────────────────────────────────────────────── */
/*
 * Negative margin-left = icon width (1em) + gap (0.4em) = -1.4em
 * This pulls the icon back into the <ul> padding area so the text
 * starts at the same x position as default bullet text.
 */
.oi-list--checklist .oi-list-icon,
.oi-list--icon-list .oi-list-icon {
    flex-shrink: 0;
    margin-left: -1.4em;
    margin-right: 0.4em;
    color: var(--wp--preset--color--palette-1);
    line-height: 0;
}

.oi-list--checklist .oi-list-icon svg,
.oi-list--icon-list .oi-list-icon svg {
    width: 1em;
    height: 1em;
    display: block;
    fill: currentColor;
}
