// Expenses
// -------------------------

.expenses {

    .header-button-container {
        // display: block;
    }

    .collapse-button-container {
        display: none;

        .collapse-button {
            width: 100%;
            display: flex;
            justify-content: center;
        }

    }

    .notes {
        overflow: hidden;
        width: 200px;

        .note {
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
        }
    }

}

@media(max-width: $x-small-breakpoint ) {

    .expenses {

        .page-actions {
            position: relative;
            -webkit-transform: none;
            -ms-transform: none;
            -o-transform: none;
            transform: none;
            display: flex;
            flex-wrap: wrap;

            button {
                margin-bottom: 10px;
            }

        }

        .page-header {
            margin-bottom: 5px;
        }

        .table-actions {
            margin-top: 0px !important;
        }

        .header-button-container {
            display: none;
        }

        .collapse-button-container {
            margin-top: 8px;
            display: block;
        }

    }

}