/**
 * KO-02 Liste
 */

/* Core's list-style control is reachable by no support and no filter, so its inline
   `list-style-type` is beaten here — and it has to be the frontend's rule, because
   logged-in users are exempt from the CSP that would block that style. `ol` only, so
   a nested `ul` keeps core's markers. */
ol.wp-block-list {
    list-style-type: decimal !important;
}

.wp-block-list {
    font-weight: var(--sav-font-weight-light);
    /* Reset the tracking the Light cut inherits from the base body copy. */
    letter-spacing: normal;

    /* The item carries the indent, so the browser's own one goes. */
    padding-inline-start: 0;

    /* A list sits in the running text's line rhythm, like stacked paragraphs. */
    margin-block: var(--sav-text-m-line);

    /* The item draws its own marker: a hanging one sits left of the text, where the
       browser gives a number more room than the indent has, so it was cut off at the
       edge of the page. This one sits on the edge the text starts from, as in the
       styleguide, and stays inside the block at any type size. */
    & > li {
        position: relative;

        /* 33px at the Text M size, kept in em so the indent scales with the type. */
        padding-inline-start: 1.5em;

        /* The browser's own marker is shrunk away, not switched off: `list-style-type:
           none` costs the list its semantics in WebKit, and an emptied `content` is
           ignored in the editor, where the marker then shows up twice. */
        &::marker {
            font-size: 0;

            /* WebKit keeps a line box for the shrunken marker, which makes an item's
               first line taller than the ones below it. */
            line-height: 0;
        }

        &::before {
            position: absolute;
            inset-inline-start: 0;
        }
    }

    /* Emphasis is one weight step up to Regular, not bold. */
    & :is(strong, b) {
        font-weight: var(--sav-font-weight-regular);
        letter-spacing: var(--sav-text-m-tracking);
    }

    & a {
        color: inherit;
        font-weight: var(--sav-font-weight-regular);
        letter-spacing: var(--sav-text-m-tracking);
        text-decoration-line: underline;
        text-decoration-thickness: from-font;
        text-decoration-skip-ink: none;
        text-underline-position: from-font;

        &:hover {
            color: var(--sav-color-dunkelblau-hover);
        }

        &:focus-visible {
            outline: 2px solid var(--sav-color-dunkelblau);
            outline-offset: 2px;
        }
    }

    /* A nested list sits directly under its item, not in the block rhythm. */
    & .wp-block-list {
        margin-block: 0;
    }
}

ul.wp-block-list > li::before {
    content: '–';
}

/* The list item counter, not one of this rule's own: it follows the `start` and
   `reversed` the editorial team sets, which a counter of our own would not. */
ol.wp-block-list > li::before {
    content: counter(list-item) '.';
}
