/* 
============================================
            Dashboard Components 
============================================
*/

#dashboardContainer {
    display: grid;
    width: 100%;
}

#dashboardContainer > .dashboardComponents {
    min-width: 0;
    width: 100%;
    border: 2px solid #969696;
    border-radius: 10px;
}

@media (max-width: 768px) {
    #dashboardContainer {
        grid-template-columns: 1fr !important;
    }

    #dashboardContainer > .dashboardComponents {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    #dashboardContainer > .dashboardComponents > * {
        min-width: 0;
        max-width: 100%;
    }
}

.dashboardComponent {
    padding: 1rem;
    width: 100%;
}

#transactieOverzicht {
    overflow-y: auto;
    max-height: 50vh;
}

#balanceComponent {
    max-height: 5vh;
}

.dropzoneUserSetting {
    border: 1px dashed #000000;
    border-radius: 5px;
    display: none;
}

.transaction-entry{
    cursor: pointer;
}


/*  
============================================
            Transaction Components 
============================================
*/
.topUpContainter {
    width: 50rem;
}