/*
|--------------------------------------------------------------------------
| Base
|--------------------------------------------------------------------------
*/

body {
    background: #f5f6f8;
    overflow-x: hidden;
    font-size: 14px;
}

/*
|--------------------------------------------------------------------------
| Navbar
|--------------------------------------------------------------------------
*/

.navbar {
    height: 64px;
}

.navbar-brand {
    font-size: 16px;
}

/*
|--------------------------------------------------------------------------
| Sidebar
|--------------------------------------------------------------------------
*/

.offcanvas {
    width: 260px;
    max-width: 85%;
}

.offcanvas .nav-link {
    color: rgba(255,255,255,0.85);
    border-radius: 12px;
    padding: 12px 14px;
    transition: 0.2s;
}

.offcanvas .nav-link:hover {
    background: rgba(255,255,255,0.08);
    color: #fff;
}

.offcanvas .nav-link.active {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

/*
|--------------------------------------------------------------------------
| Cards
|--------------------------------------------------------------------------
*/

.card {
    border: 0;
    border-radius: 18px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

/*
|--------------------------------------------------------------------------
| Tables
|--------------------------------------------------------------------------
*/

table th {
    font-size: 13px;
    white-space: nowrap;
}

table td {
    vertical-align: middle;
    white-space: nowrap;
}

.table-responsive {
    overflow-x: auto;
}

/*
|--------------------------------------------------------------------------
| Forms
|--------------------------------------------------------------------------
*/

.form-label {
    font-weight: 500;
}

.form-check-input {
    cursor: pointer;
}

/*
|--------------------------------------------------------------------------
| Modal
|--------------------------------------------------------------------------
*/

.modal-body {
    overflow-y: auto;
}

/*
|--------------------------------------------------------------------------
| Buttons
|--------------------------------------------------------------------------
*/

.btn-sm {
    border-radius: 10px;
}

/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 991px) {

    body {
        font-size: 13px;
    }

    .card {
        border-radius: 14px;
    }

    .table {
        font-size: 13px;
    }

    h2 {
        font-size: 24px;
    }

    h3 {
        font-size: 22px;
    }
}