.activity-selector {
    position: relative;
    display: inline-block;

    .activity-menu-popover {
        position: fixed;
        bottom: calc(100% + 0.5rem);
        top: auto;
        right: 0;
        left: auto;

        z-index: 1000;
        min-width: 150px;
        padding: 0;
        margin: 0;
        background: white;
        border: 1px solid #dee2e6;
        border-radius: 0.375rem;
        box-shadow: 0 2px 8px rgba(0,0,0,0.1);

        &::backdrop { background: transparent; }

        &[popover]:not(:popover-open) { display: none; }

        @media (min-width: 50em) {
            bottom: auto;
            top: calc(100% + 0.5rem);
            left: 0;
            right: auto;
            min-width: 200px;
        }

        @supports (bottom: anchor(top)) {
            position: fixed;
            inset: auto;

            bottom: anchor(top);
            right: anchor(right);
            margin-bottom: 0.5rem;

            @media (min-width: 50em) {
                bottom: auto;
                top: anchor(bottom);
                left: anchor(left);
                right: auto;
                margin-top: 0.5rem;
                margin-bottom: 0;
            }
        }
    }
}

.activity-menu-items {
    list-style: none;
    margin: 0;
    padding: 0.5rem 0;

    li {
        margin: 0;
        padding: 0;
    }

    a {
        display: block;
        padding: 0.5rem 1rem;
        color: #212529;
        text-decoration: none;
        font-size: 0.875rem;
        transition: background-color 0.2s;

        :hover { background-color: #f8f9fa; }
    }
}