/**
 * CDSWerx WYSIWYG content — shared list/marker base styles.
 *
 * Handle: cdswerx-wysiwyg-content
 * Owner:  traits/trait-wysiwyg-list-styles.php (WYSIWYG_List_Styles_Trait)
 * Issue:  #87
 *
 * This is the ONE copy of the base CSS behind the trait's "List & Link Styles"
 * controls. Every widget that calls register_list_style_controls() gets these
 * rules automatically: its stylesheet declares this handle as a dependency in
 * cdswerx-widget-library.php, and its render() stamps the `cds-wysiwyg` hook
 * family via the trait's get_list_text_classes() / inject_list_markers().
 *
 * DO NOT copy these rules into a widget stylesheet under the widget's own BEM
 * prefix. That is exactly how 9 of 16 adopters ended up with missing/partial
 * copies before #87. If a widget genuinely needs a deviation, override it in
 * the widget stylesheet AFTER this one loads (dependency order guarantees that)
 * — don't fork the baseline.
 *
 * Specificity is (0,1,1) on purpose — identical to the legacy per-widget rules
 * (`.cdswerx-section__description ul`) so the cascade outcome against theme /
 * global styles is unchanged. Not `:where()`: that would silently change who
 * wins against a theme's `ul {}` rules.
 *
 * Elementor control CSS for List Padding / List Margin lands at (0,2,1)
 * (`{{WRAPPER}} .x ul`) and therefore always overrides this baseline. Those two
 * controls deliberately have no `default`: the baseline lives HERE, controls are
 * overrides on top (same model as Elementor core).
 */

/* ── Base list defaults ────────────────────────────────────────────────────
   Outside position with a left indent so wrapped text aligns flush with the
   first line, not under the bullet. Resets browser margin. Users override via
   the List Margin / List Padding controls. */
.cds-wysiwyg ul,
.cds-wysiwyg ol {
    margin: 0;
    padding: 0 0 0 1.5em;
    list-style-position: outside;
}

/* ── List Style: None — hide markers, keep ul/li tags ─────────────────────── */
.cds-wysiwyg--marker-none ul,
.cds-wysiwyg--marker-none ol {
    list-style: none;
}

/* ── List Style: Numbers — force decimal counters on both ul and ol ───────── */
.cds-wysiwyg--marker-numbers ul,
.cds-wysiwyg--marker-numbers ol {
    list-style-type: decimal;
    padding-left: 1.5em;
}

/* ── List Style: Bullets — list-style-type is written by the Bullet Style
   control's selector (`{{WRAPPER}} .{bem}--marker-bullets ul`); this block only
   guarantees the indent. ─────────────────────────────────────────────────── */
.cds-wysiwyg--marker-bullets ul,
.cds-wysiwyg--marker-bullets ol {
    padding-left: 1.5em;
}

/* ── List Style: Icon — remove native markers, the trait injects a span ────── */
.cds-wysiwyg--icon-marker ul,
.cds-wysiwyg--icon-marker ol {
    list-style: none;
    padding-left: 0;
}

.cds-wysiwyg--icon-marker li {
    display: flex;
    align-items: baseline;
}

/* Injected marker span (icon mode). Size / spacing / colour come from the
   Marker Size, Icon Spacing and Marker Color controls (widget BEM selector). */
.cds-wysiwyg__list-marker {
    flex-shrink: 0;
    line-height: 1;
    display: inline-flex;
    align-items: center;
}

.cds-wysiwyg__list-marker svg {
    fill: currentColor;
    width: 1em;
    height: 1em;
}

/* ── List Style Position: Inside — markers flush-left with surrounding text ─ */
.cds-wysiwyg--list-inside ul,
.cds-wysiwyg--list-inside ol {
    list-style-position: inside;
    padding-left: 0;
}

/* ── List Hover Underline — animated underline on li a hover ──────────────── */
.cds-wysiwyg--list-underline li a {
    background-image: linear-gradient(transparent calc(100% - 1px), currentColor 1px);
    background-size: 0 100%;
    background-repeat: no-repeat;
    transition: background-size 0.55s cubic-bezier(0.32, 0.32, 0.15, 1.17);
    text-decoration: none;
}

.cds-wysiwyg--list-underline li a:hover {
    background-size: 100% 100%;
}
