/**
 * Partial: News archive — Separator
 *
 * Styles for parts/news/separator.php. Replicates the dotted line from
 * blocks/seperator/style.css using the BEM root .separator-news so it can
 * evolve independently. The line carries 48px above/below to space it from
 * the partial sections it sits between.
 *
 * Auto-enqueued from /assets/css/parts/ on the frontend and inside the
 * block editor — see nkt_get_part_stylesheets() in functions.php.
 */

:where(.separator-news) {
    padding-block: 0;
}

.separator-news__inner {
    display: flex;
    align-items: center;
    margin-block: 48px;
}

.separator-news__line {
    --dot-size: 3px;
    --dot-gap: 12px;
    --dot-color: var(--wp--preset--color--br-blue-200);

    flex: 1;
    display: block;
    height: var(--dot-size);
    background-image: radial-gradient(circle,
            var(--dot-color) 50%,
            transparent 51%);
    background-size: var(--dot-gap) var(--dot-size);
    background-repeat: repeat-x;
    background-position: left center;
}