/*
 * Bootstrap 4 class aliases for markup that still uses Bootstrap 4 names.
 * Visual rules that the Skydash theme defines itself are left to style.css.
 */

.form-group {
    margin-bottom: 1rem;
}

.form-inline {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
}

.btn-block {
    display: block;
    width: 100%;
}

.font-weight-light { font-weight: 300 !important; }
.font-weight-normal { font-weight: 400 !important; }
.font-weight-medium { font-weight: 500 !important; }
.font-weight-bold { font-weight: 700 !important; }

.text-left { text-align: left !important; }
.text-right { text-align: right !important; }

.float-left { float: left !important; }
.float-right { float: right !important; }

.ml-0 { margin-left: 0 !important; }
.ml-1 { margin-left: 0.25rem !important; }
.ml-2 { margin-left: 0.5rem !important; }
.ml-3 { margin-left: 1rem !important; }
.ml-4 { margin-left: 1.5rem !important; }
.ml-5 { margin-left: 3rem !important; }
.ml-auto { margin-left: auto !important; }

.mr-0 { margin-right: 0 !important; }
.mr-1 { margin-right: 0.25rem !important; }
.mr-2 { margin-right: 0.5rem !important; }
.mr-3 { margin-right: 1rem !important; }
.mr-4 { margin-right: 1.5rem !important; }
.mr-5 { margin-right: 3rem !important; }
.mr-auto { margin-right: auto !important; }

.pl-0 { padding-left: 0 !important; }
.pl-1 { padding-left: 0.25rem !important; }
.pl-2 { padding-left: 0.5rem !important; }
.pl-3 { padding-left: 1rem !important; }
.pl-4 { padding-left: 1.5rem !important; }
.pl-5 { padding-left: 3rem !important; }

.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: 0.25rem !important; }
.pr-2 { padding-right: 0.5rem !important; }
.pr-3 { padding-right: 1rem !important; }
.pr-4 { padding-right: 1.5rem !important; }
.pr-5 { padding-right: 3rem !important; }

.dropdown-menu-right {
    right: 0;
    left: auto;
}

.dropdown-menu-left {
    right: auto;
    left: 0;
}

.input-group-prepend,
.input-group-append {
    display: flex;
}

.input-group-prepend .input-group-text {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group-append .input-group-text {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group > .input-group-prepend + .form-control {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.close {
    float: right;
    background: transparent;
    border: 0;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.5;
    padding: 0;
}

.close:hover {
    opacity: 0.75;
}

.badge-primary { background-color: var(--bs-primary); color: #fff; }
.badge-secondary { background-color: var(--bs-secondary); color: #fff; }
.badge-success { background-color: var(--bs-success); color: #fff; }
.badge-danger { background-color: var(--bs-danger); color: #fff; }
.badge-warning { background-color: var(--bs-warning); color: #212529; }
.badge-info { background-color: var(--bs-info); color: #000; }
.badge-light { background-color: var(--bs-light); color: #212529; }
.badge-dark { background-color: var(--bs-dark); color: #fff; }

.custom-select {
    display: inline-block;
    width: 100%;
    padding: 0.375rem 2.25rem 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
