@media (max-width: 1180px) {

    .toolbar {

        grid-template-columns: repeat(3, minmax(140px, 1fr));

    }

    .dashboard-content {

        grid-template-columns: 1fr;

    }

}

@media (max-width: 780px) {

    #app {

        display: flex;

        flex-direction: column;

        height: auto;

        min-height: 100vh;

    }

    #sidebar {

        position: sticky;

        top: 0;

        z-index: 3;

        flex-direction: row;

        align-items: center;

        overflow-x: auto;

    }

    .logo {

        min-width: 120px;

        margin: 0 8px 0 0;

    }

    .menu-button {

        min-width: 135px;

    }

    #workspace {

        padding: 18px;

    }

    .cards,
    .toolbar {

        grid-template-columns: 1fr;

    }

    .candidate-list {

        overflow-x: auto;

    }

    .candidate-row {

        min-width: 760px;

    }

    .detail-grid,
    .action-grid {

        grid-template-columns: 1fr;

    }

}
