body {
    margin: 50px 0 0 0;
    padding: 20px;
}

body.dark {
    background-color: #000;
    color: #fff;
}

a {
    color: inherit;
    text-decoration: none;
}

body.dark a {
    color: #fff;
}

a:hover, a:focus, a:active {
    color: #0d6efd !important;
    text-decoration: none;
}

.content {
    margin-top: 20px;
}

.version-tooltip {
    --bs-tooltip-max-width: auto;
}

/* Cards */

body.dark .card {
    background-color: #212529;
    color: #fff !important;
}

.card:hover, .card:focus, .card:active {
    border-color: #0d6efd;
}

.card:hover .card-title, .card:focus .card-title, .card:active .card-title {
    color: #0d6efd;
}

.card-header {
    padding: 0;
}

.card-header > .background {
    position: relative;
    margin: 0;
    padding: 0;
    height: 150px;
    background-repeat: no-repeat;
    background-position: top;
    background-size: 150px;
    border-radius: inherit;
}

/* Tables */

.table + .table, .table + h3 {
    margin-top: 50px;
}

.table.table-sticky-top {
    border-collapse: collapse;
}

.table.table-sticky-top thead th {
    position: sticky;
    top: 50px;
    z-index: 2;
}

body.dark .table {
    --bs-table-color: #fff;
    --bs-table-bg: #212529;
    --bs-table-border-color: #4d5154;
    --bs-table-striped-bg: #2c3034;
    --bs-table-striped-color: #fff;
    --bs-table-active-bg: #373b3e;
    --bs-table-active-color: #fff;
    --bs-table-hover-bg: #323539;
    --bs-table-hover-color: #fff;
}

/* Breadcrumb */

body.dark .breadcrumb {
    --bs-breadcrumb-divider-color: #fff
}

/* Modal */

body.dark .modal {
    --bs-modal-color: #fff;
    --bs-modal-bg: #212529;
    --bs-modal-header-border-color: #fff;
    --bs-modal-footer-border-color: #fff;
}

/* Navbar */

.navbar {
    border-bottom: 2px solid #0d6efd;
}

.navbar a {
    color: #fff;
}

body.dark .navbar {
    --bs-navbar-brand-color: #fff;
    --bs-navbar-brand-hover-color: #0d6efd;
}