/**
 * zz-preise-check-icon-align.css — /de/preise-und-tarife (page-id 236585)
 *
 * The pricing section's check icons don't sit on the same horizontal line as
 * their feature text:
 *
 *   1. Main tariff table (.pricetable2-list) — jp-154 already lays each row out
 *      as a flex line, but the check glyph (a unicode ✓ rendered via ::before at
 *      18px inside a 24px line) is top-aligned, so it floats above the 16px text.
 *      Fix: make the icon a fixed-height (24px = text line-height) inline-flex box
 *      and centre the glyph in it, so it optically aligns with the first text line.
 *
 *   2. Feature detail panels (.list-icons / .list-icons-sm) — these use the
 *      theme's legacy `float:left; margin-left:-2em` hanging-icon mechanism, which
 *      leaves the small (0.75em) check vertically offset from the text. Fix:
 *      convert each row to a flex line with the icon aligned to the first line.
 *
 * Loads after jp-154-preise-tarife.css (alphabetical), so these win. Scoped to
 * the page id so nothing else is touched.
 */

/* ── 1a. Top feature list (.pricetable2-list, jp-154 flex rows) — centre the ✓
   on the first text line instead of top-aligning it. ── */
body.page-id-236585 .pricetable2-list li {
    align-items: flex-start !important;
    gap: 10px !important;           /* tighten: was 12px slot + 18px icon = ~28px visual gap */
}
body.page-id-236585 .pricetable2-list-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 24px !important;        /* == feature-row line-height (first line) */
    line-height: 1 !important;
    flex: 0 0 auto !important;       /* hug the glyph instead of a wide 18px slot */
    width: auto !important;
    min-width: 12px !important;
    margin-right: 0 !important;
}
/* ── 1b. Bottom package list (.pricetable2-bottom-list) — jp-517 hangs the icon
   absolutely at a fixed top:4px, which leaves it high. Same specificity (0,4,2)
   but loads later, so we win: make the absolute icon a full first-line box and
   centre the ✓ in it. ── */
body.page-id-236585 .pricetable2-list.pricetable2-bottom-list li {
    padding-left: 20px !important;   /* was 28px — tighten check↔text gap */
}
body.page-id-236585 .pricetable2-list.pricetable2-bottom-list li .pricetable2-list-icon {
    top: 0 !important;
    height: 24px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ── 2. Feature-panel lists — replace the float hang with a clean flex line ── */
body.page-id-236585 .list-icons,
body.page-id-236585 .list-icons-sm {
    padding-left: 0 !important;
    list-style: none !important;
}
body.page-id-236585 .list-icons > li {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
}
body.page-id-236585 .list-icons > li .list-icon {
    float: none !important;
    margin-left: 0 !important;
    position: relative !important;
    top: 0 !important;
    flex: 0 0 auto !important;
    width: 1.25em !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 24px !important;         /* match the feature text line-height */
    line-height: 24px !important;
}