/* Overlay the column menu icon on top of the header so it takes up no layout space */
.e-grid .e-headercell {
    position: relative;
}

    .e-grid .e-headercell .e-columnmenu {
        position: absolute;
        top: 50%;
        right: 0px;
        padding 2px;
        transform: translateY(-50%);
        visibility: hidden;
        opacity: 0;
        z-index: 2;
        transition: opacity 0.2s ease-in-out;
    }

    /* Show the column menu icon when hovering/focusing the column header */
    .e-grid .e-headercell:hover .e-columnmenu,
    .e-grid .e-headercell:focus-within .e-columnmenu {
        visibility: visible;
        opacity: 1;
    }

    /* Keep header text clear of the icon while preserving compact column width */
    .e-grid .e-headercell .e-sortfilterdiv {
        width: auto;
        padding-right: 6px;
    }

    /* Keep default header content flow so no space is reserved for the menu icon */
    .e-grid .e-headercell .e-header-celldiv {
        display: block;
    }

    /* Show the column menu icon when hovering/focusing the column header */
    .e-grid .e-headercell .e-columnmenu .e-filtered {
        visibility: visible;
        opacity: 1;
    }

    .e-grid .e-headercell .e-filtered {
        visibility: visible !important;
        opacity: 1 !important;
    }

        .e-grid .e-headercell .e-filtered::before {
            content: "\e7f7" !important;
            color: rgb(var(--bs-danger-rgb)) !important;
        }