
.priorities_list_view_content
{
    padding: 20px;
    display: flex;
    flex-direction: row;
    width: 100%;
    overflow-y: scroll;
    /* margin-bottom: 100px; -- does not work as it overlaps the content */


    .priorities_list
    {
        width: 500px;
    }


    h1
    {
        padding: 10px;
        // This is a quick hack to ensure the column width does not reduce when no entries in it
        // todo: copy the css from .action_list_view_content .action_list which uses min-width
        min-width: 370px;
    }


    .goals, .prioritisations
    {
        flex: 1;
        padding: 40px;
    }

    .goals
    {
        border-right: thin solid #aaa;
    }
}


.priorities_list_view_content .goals > div, .prioritisations_list > div
{
    margin-bottom: 20px;
}


.priorities_list_view_content .side_panel_padding
{
    // Keep 0.25s in sync with App.tsx -> use_styles -> content_with_open_side_panel -> transition -> duration
    transition: min-width 0.25s linear;
}
