// EB block icons are drawn in a fixed brand purple (#6C3BFF) instead of
// currentColor. Where core paints a solid background behind a block icon and
// sets the icon colour to white, the purple icon disappears: the selected row
// of the "/" slash inserter and List View (admin theme colour, contrast 1.01:1)
// and the drag chip (#1e1e1e, 2.9:1). Follow the icon colour there only; icons
// stay purple everywhere else.
$eb-selected-icon: ".block-editor-autocompleters__block[aria-selected=true] .block-editor-block-icon svg, .block-editor-list-view-leaf.is-selected .block-editor-block-icon svg, .block-editor-block-draggable-chip .block-editor-block-icon svg";

// Background behind the icon, used for the knocked-out white details. Set on
// the element that paints it so the nearest one wins: List View renders a drag
// chip inside each selected row.
.block-editor-autocompleters__block[aria-selected=true],
.block-editor-list-view-leaf.is-selected {
    --eb-icon-knockout: var(--wp-admin-theme-color, #3858e9);
}

.block-editor-list-view-leaf.is-selected.is-synced {
    --eb-icon-knockout: var(--wp-block-synced-color, #7a00df);
}

.block-editor-block-draggable-chip {
    --eb-icon-knockout: #1e1e1e;
}

#{$eb-selected-icon} {
    [fill="#6C3BFF" i] {
        fill: currentColor;
    }

    [stroke="#6C3BFF" i] {
        stroke: currentColor;
    }

    // Post Carousel's light-purple accent.
    [fill="#C5B1FF" i] {
        fill: currentColor;
        fill-opacity: 0.6;
    }

    // White details drawn over the purple (Product Price's coin) would merge
    // into the now-white icon, so paint them in the background colour. Direct
    // children only: clipPath/mask rects inside <defs> stay untouched.
    > [fill="white" i],
    > [fill="#fff" i],
    > [fill="#ffffff" i] {
        fill: var(--eb-icon-knockout);
    }
}

// With Pro inactive, the Pro placeholder blocks (pro-block-register.js) draw
// their icon as an <img> of the SVG file, which the fill rules above cannot
// reach. Turn the whole image white instead. White details inside it merge
// into the icon here, as no CSS can recolour them through an <img>.
.block-editor-autocompleters__block[aria-selected=true],
.block-editor-list-view-leaf.is-selected,
.block-editor-block-draggable-chip {
    .block-editor-block-icon .eb-pro-icon-wrapper > img {
        filter: brightness(0) invert(1);
    }
}