@import "/UI/Theme.scss";

EffectsProperties
{
    background-color: rgba( 9, 21, 31, 0.88 );
    backdrop-filter: blur( 8px );
    border: 1px solid rgba( white, 0.06 );
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba( black, 0.5 );
    flex-direction: column;
    overflow: hidden;

    .header
    {
        padding: 10px 14px;
        flex-shrink: 0;

        h2
        {
            gap: 0.5rem;
            align-items: center;
            font-size: 14px;
            font-weight: 650;
            font-family: $subtitle-font;
            color: $menu-color;
        }
    }

    .empty-state
    {
        font-family: $subtitle-font;
        padding: 16px 12px;
        text-align: center;
        color: $menu-text;
        flex-grow: 1;
        align-items: center;
        justify-content: center;
    }

    ControlSheet
    {
        padding: 6px 0;
        flex-grow: 1;
        overflow-y: scroll;
    }
}