/* ── List Style Extension ─────────────────────────────────────────────────── */
/*
 * Legacy is-style-* selectors (old register_block_style presets) are kept as
 * aliases alongside the oi-list--* classes so lists saved on old framework
 * versions render correctly even if the render filter is bypassed.
 */

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

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

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

.oi-list--no-bullets li,
.is-style-nounderline li {
    padding: 5px 0;
}

/* ── Left indent ──────────────────────────────────────────────────────────── */
/*
 * The icon sits IN FLOW (no negative margins), so it can never escape the
 * list's box. The 1.1em gutter puts the icon where a native bullet sits;
 * icon (1em) + gap (0.4em) lands the text at 2.5em — the UA-default text
 * position — so mixed default/checked lists align. ul/ol-qualified selectors
 * (0,1,1) + physical fallback beat theme and global-styles list resets.
 */
ul.oi-list--checklist,
ol.oi-list--checklist,
ul.oi-list--icon-list,
ol.oi-list--icon-list,
ul.oi-list--custom-list,
ol.oi-list--custom-list,
ul.is-style-checklist,
ol.is-style-checklist,
ul.is-style-custom-list,
ol.is-style-custom-list {
    padding-left: 1.1em;
    padding-inline-start: 1.1em;
}

/* No Bullets is flush left (v1-faithful — the point is a plain unindented list). */
.oi-list--no-bullets,
.is-style-nounderline {
    padding-inline-start: 0;
}

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

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

/* ── Checklist: pure-CSS checkmark ─────────────────────────────────────────── */
/*
 * Drawn as a data-URI mask so it needs no icon files and no FA Kit —
 * renders on every site. Colored via background-color (palette-1).
 * In flow, no negative margin: gutter (1.1em) + icon (1em) + gap (0.4em)
 * puts the text at 2.5em, aligned with default list text.
 */
.oi-list--checklist li::before,
.is-style-checklist li::before {
    content: "";
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    margin-right: 0.4em;
    background-color: var(--wp--preset--color--palette-1);
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.5 6.5 12.5 13.5 3.5' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.5 6.5 12.5 13.5 3.5' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

/* Icon List injects its own icon span — suppress the checklist ::before there. */
.oi-list--icon-list li::before {
    content: none;
}

/* ── Icon span (Icon List — injected FA Kit <i> tag) ──────────────────────── */

.oi-list--checklist .oi-list-icon,
.oi-list--icon-list .oi-list-icon {
    flex-shrink: 0;
    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;
}

.oi-list--checklist .oi-list-icon i,
.oi-list--icon-list .oi-list-icon i {
    font-size: 1em;
    line-height: 1;
    display: block;
}

/* ── Custom List (legacy preset): author-supplied inline icons ─────────────── */

.oi-list--custom-list li,
.is-style-custom-list li {
    padding: 5px 0;
    align-items: center;
}

.oi-list--custom-list li svg,
.is-style-custom-list li svg {
    height: 1em;
    width: 1em;
    fill: var(--wp--preset--color--palette-1);
}

.oi-list--custom-list li i,
.is-style-custom-list li i {
    margin-right: 10px;
    color: var(--wp--preset--color--palette-1);
}