/*#region root*/
:root {
    --theme-color: #0094d5;
}
/*#endregion*/

/*#region theme*/
html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
    font-family: "Segoe UI", "Open Sans", sans-serif;
}

.btn-theme {
    background: linear-gradient(90deg, #005AA9 0%, #002443 100%);
    border: none;
    color:#ffffff;
}
    .btn-theme:hover {
        opacity: .9;
        color: #ffffff;
    }

.btn-pill {
    border-radius: 1.5rem !important;
}

.btn-icon {
    padding: .375rem .5rem !important;
}
    .btn-icon.btn-sm {
        padding: .25rem .375rem !important;
    }
    .btn-icon.btn-lg {
        padding: .5rem .675rem !important;
    }

.btn {
    border-radius: .25rem;
}

pre {
    font-size: 10px;
    background-color: #ffffff !important;
    border: solid 1px #d8d8d8;
    border-radius: 5px;
    padding: 5px;
    max-width: 100%;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.no-focus-border {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}
    .no-focus-border:focus,
    .no-focus-border:focus-visible,
    .no-focus-border:active,
    .no-focus-border:focus:not(:focus-visible) {
        outline: none !important;
        box-shadow: none !important;
        border: none !important;
    }

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}
/*#endregion*/

/*#region layout*/
.layout-header-logo {
    height: 60px;
    margin-left: 1rem;
    display:none;
}

.layout-header-icon {
    width: 2.5rem;
    margin-left: 1rem;
}

.header-nav .nav-profile .img {
    height: 36px;
    width: 36px;
    background-color: var(--theme-color);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    border-radius: 100rem;
}

.sidebar-nav .nav-link.collapsed svg {
    color: #899bbd;
}
.sidebar-nav .nav-link svg {
    font-size: 16px;
    margin-right: 10px;
    color: #4154f1;
}

.sidebar-nav .nav-content a {
    font-weight: 400;
}
    .sidebar-nav .nav-content a svg {
        font-size: 6px;
        margin-right: 8px;
        line-height: 0;
        border-radius: 50%;
    }
    .sidebar-nav .nav-content a.active {
        font-weight: 600;
    }

.sidebar-nav .nav-heading-sub {
    padding: .5rem;
    border-bottom: 1px solid #dee2e6;
}

.sidebar-logo {
    text-align: center;
    border-bottom: 1px solid #e1e1e1;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}
    .sidebar-logo img {
        width: 30%;
    }

.sidebar {
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
    .sidebar::-webkit-scrollbar {
        display: none;
    }

/*Mobile*/
@media only screen and (max-width: 720px) {
    .layout-header-logo {
        display: none !important;
    }

    .toggle-sidebar-btn {
        padding-left: 0px;
    }
}

/*Desktop*/
@media only screen and (min-width: 720px) {
    .layout-header-icon {
        display: none !important;
    }
}
/*#endregion*/

/*#region form-elements*/
.card-container .card-body {
    margin-top: 1rem;
}
.card-container .card {
    box-shadow:none;
}
    .card-container .card-body .form-group {
        margin-bottom: 1rem;
    }
        .card-container .card-body .form-group label[for] {
            font-weight: 600;
            margin-bottom: .5rem;
        }

.card-container .card-body .card-section {
    padding: 1rem;
}
    .card-container .card-body .card-section .card-section-title {
        color: var(--theme-color);
        background-color: #f6f9ff;
        font-weight: 600;
        font-size: 1.25rem;
        padding: .75rem 0rem .75rem 0rem;
        margin-bottom: 1rem;
        padding-left: .75rem;
        border-radius: .5rem;
        display: flex;
        align-items: center;
    }

.card-container .card-body #document-content .container-item {
    border-radius: .5rem;
    margin: 1rem;
}

.selected-label-for {
    color: #4154f1;
}

.form-switch {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-left: 0;
}
    .form-switch .form-check-input {
        width: 3em;
        height: 1.75em;
        margin-left: 0;
    }
    .form-switch label[for] {
        font-weight: 600;
        margin-left: .4rem;
    }

.form-check {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding-left: 0;
}
    .form-check .form-check-input {
        width: 1.5em;
        height: 1.5em;
        margin-left: 0;
    }
    .form-check label[for] {
        font-weight: 600;
        margin-left: .4rem;
    }

.form-check-sm {
}
    .form-check-sm .form-check-input {
        width: 1em;
        height: 1em;
    }
    .form-check-sm label[for] {
        font-size: 90%;
    }

.form-check-md {
}
    .form-check-md .form-check-input {
        width: 1.25em;
        height: 1.25em;
    }
    .form-check-md label[for] {
        font-size: 100%;
    }

.form-check-lg {
}

    .form-check-lg .form-check-input {
        width: 1.5em;
        height: 1.5em;
    }

    .form-check-lg label[for] {
        font-size: 100%;
    }

.card-container .card-header {
    min-height: 4rem;
    align-items: center;
    display: flex;
    margin-bottom: 1.25rem;
    border-radius: 0.25rem;
    background-color: #ffffff;
}

    .card-container .card-header span.title {
        font-size: 1.5rem;
        color: #798eb3;
    }
    .card-container .card-header a.title {
        font-size: 1.5rem;
        color: #798eb3;
    }
        .card-container .card-header a.title:hover {
            color: #175fa6;
        }

    .card-container .card-header .items {
        display: initial;
    }

    .card-container .card-header .search-container {
        width: 25%;
        display: flex;
        align-items: center;
        position: relative;
        margin-right: 0.5rem;
        float: right;
    }
        .card-container .card-header .search-container a {
            right: 0rem;
            position: absolute;
            cursor: pointer;
            background-color: #f2f2f2;
            border-radius: 0rem .25rem .25rem 0rem;
            width: 2.5rem;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            border: 1px solid #ced4da;
            border-left: none;
            color: #969696;
        }
            .card-container .card-header .search-container a:hover {
                background-color: #ebeaea;
                color: #0d6efd;
            }

.card-container .card-footer {
    display: flex;
}

.ms-options-wrap {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
    .ms-options-wrap button {
        border:none !important;
        padding:0 !important;
    }
        .ms-options-wrap button span {
            color: var(--bs-body-color);
        }
    .ms-options-wrap .ms-options {
        margin-top: .5rem !important;
        border-radius: var(--bs-border-radius);
    }

.form-control:disabled {
    background-color: #f6f6f6;
}

.table-total {
    padding: .5rem;
    border-radius: 100px;
    background-color: #f6f9ff;
    color: #4154f1;
    font-weight: 600;
    font-size: .7rem;
    margin-left: .25rem;
}

/*Mobile*/
@media only screen and (max-width: 720px) {
    .card-container .card-header .items {
        display: flow-root;
        width: 100%;
        padding: 1rem 0.25rem 0.25rem 0.25rem;
        margin-top: 1rem;
        border-top: 1px solid #dadbdb;
    }
        .card-container .card-header .items .search-container {
            width: 85%;
            float: left !important;
            margin-right: 0;
        }
            .card-container .card-header .items .search-container.mw-50 {
                width: 50%;
            }
            .card-container .card-header .items .search-container.mw-55 {
                width: 55%;
            }
            .card-container .card-header .items .search-container.mw-60 {
                width: 60%;
            }
            .card-container .card-header .items .search-container.mw-65 {
                width: 65%;
            }
            .card-container .card-header .items .search-container.mw-70 {
                width: 70%;
            }
            .card-container .card-header .items .search-container.mw-75 {
                width: 75%;
            }
            .card-container .card-header .items .search-container.mw-80 {
                width: 80%;
            }
            .card-container .card-header .items .search-container.mw-85 {
                width: 85%;
            }
            .card-container .card-header .items .search-container.mw-90 {
                width: 90%;
            }
            .card-container .card-header .items .search-container.mw-95 {
                width: 95%;
            }
            .card-container .card-header .items .search-container.mw-100 {
                width: 100%;
            }

    .card-container .card-body #document-content .container-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/*Desktop*/
@media only screen and (min-width: 720px) {
    .card-container .card-body #document-content .container-item {
        width: 30%;
    }
}
/*#endregion*/

/*#region tables*/
.table-hover > tbody > tr:hover > * {
    --bs-table-bg-state: #f7f7f7;
}

.table td, .table th {
    vertical-align: middle;
}
    table.dataTable > tbody > tr > th,
    table.dataTable > tbody > tr > td,
    .table th
    .table td {
        padding: .75rem;
    }

/*filter*/
.table-filter .modal-dialog {
    position: fixed;
    margin: 0 auto;
    width: 35%;
    height: 100%;
    right: 0px;
    max-width: none;
}
.table-filter .modal-content {
    height: 100%;
    overflow-y: scroll;
    box-shadow: 0px 8px 21px 7px #00000080 !important;
}

/*Mobile*/
@media only screen and (max-width: 720px) {
    .table-filter .modal-dialog {
        position: relative;
        margin: .5rem;
        width: auto;
        height: auto;
    }

    #table-grid + .no-records {
        padding: 2rem !important;
        font-size:1.75rem !important;
    }
}

/*Desktop*/
@media only screen and (min-width: 720px) {

}


/*pagination*/
.pagination {
    justify-content: center;
}
    .pagination .page-link {
        color: var(--theme-color);
    }
        .pagination .page-link:first-child {
            border-top-left-radius: .25rem;
            border-bottom-left-radius: .25rem;
        }
        .pagination .page-link:last-child {
            border-top-right-radius: .25rem;
            border-bottom-right-radius: .25rem;
        }
        .pagination .page-link.disabled {
            background-color: #f5f5f5;
        }
    .pagination .active {
        background-color: var(--theme-color);
        color: #ffffff;
    }

/*isActive*/
.table-isactive {
    padding: .25rem;
    font-weight: 600;
    font-size: .75rem;
    border-radius: 1rem;
    width: 4.5rem;
    display: block;
    text-align: center;
}
    .table-isactive[active] {
        color: #0075ff;
        background-color: #e6f6fc;
    }
    .table-isactive[passive] {
        color: #21253d;
        background-color: #f0f0f0;
    }
/*#endregion*/

/*#region modals*/
.modal-headerBAK {
    color: #ffffff;
    background-color: var(--theme-color);
    border: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    min-height: 5rem;
}

.modal-closeBAK {
    position: absolute;
    color: #fff;
    right: 1rem;
    font-size: 1.75rem;
    cursor: pointer;
}
    .modal-closeBAK:hover {
        color: #c3cff3;
    }

.modal-header {
    color: #484747;
    background-color: #f5f5f5;
    border: none;
    border-radius: 0;
    display: flex;
    align-items: center;
    min-height: 5rem;
}
    .modal-header .modal-title {
        font-size: 1.5rem !important;
    }
    .modal-header .modal-close {
        position: absolute;
        color: #484747;
        right: 1rem;
        font-size: 1.75rem;
        cursor: pointer;
    }
        .modal-header .modal-close:hover {
            color: #a3a3a4;
        }



.modal-content {
    border: none;
    border-radius: 0;
}

.modal-backdrop.show {
    opacity: 0.85;
}
.modal-content .form-group {
    margin-bottom: 1rem;
}
    .modal-content .form-group label[for] {
        font-weight: 600;
        margin-bottom: .5rem;
    }

/*Mobile*/
@media only screen and (max-width: 720px) {
    .table-filter .modal-dialog {
        position: relative;
        margin: .5rem;
        width: auto;
        height: auto;
    }
}

/*Desktop*/
@media only screen and (min-width: 720px) {
    .modal-xxl {
        max-width: 95vw;
    }
}
/*#endregion*/

/*#region accordion-menu*/
.accordion-menu {
}
    .accordion-menu .accordion-item {
        margin-bottom: .75rem;
        border-radius: var(--bs-accordion-border-radius);
    }

    .accordion-menu label[for] {
        font-size: 1rem !important;
        font-weight: 600 !important;
        margin-bottom: .5rem;
    }

    .accordion-menu .accordion-header span {
        margin-left: .5rem;
        font-size: 1rem;
        font-weight: 600;
    }

        .accordion-menu .accordion-header span svg {
            color: #cac6c8;
            margin-right: .25rem;
            width: 1rem;
        }

    .accordion-menu .accordion-item .form-group {
        margin-bottom: 1rem;
    }
    .accordion-menu .accordion-item label[for] {
        font-size: 1rem !important;
        font-weight: 600 !important;
        margin-bottom: .5rem;
    }

    .accordion-menu .accordion-button {
        height: 4rem;
    }
        .accordion-menu .accordion-button:not(.collapsed),
        .accordion-menu .accordion-button:not(.collapsed) svg {
            color: var(--theme-color);
        }

    .accordion-menu .accordion-button:not(.collapsed) {
        background-color: #ffffff;
        box-shadow: none;
        border-bottom: 1px solid #dee2e6;
    }

    .accordion-menu .accordion-item:has(.accordion-button:not(.collapsed)) {
        box-shadow: 0px 0px 7px #0129701a;
    }

    .accordion-menu .accordion-item:not(:first-of-type) {
        border-top: 1px solid #ebeef4;
    }
/*#endregion*/

/*#region tab-menu*/
.nav-tabs {

}
    .nav-tabs .nav-link {
        color: inherit;
    }
        .nav-tabs .nav-link.active {
            font-weight: 600;
            color: var(--theme-color);
        }
            .nav-tabs .nav-link.active::before {
                font-weight: bold;
                color: var(--theme-color);
            }
/*#endregion*/

/*#region candidate-card*/
#modal-candidateCard .tab-content {
    max-height: 75vh;
    overflow-y: scroll;
}

#modal-candidateCard .card-section {
}

    #modal-candidateCard .card-section .card-section-title {
        color: var(--theme-color);
        background-color: #f6f9ff;
        font-weight: 600;
        font-size: 1.1rem;
        padding: .75rem 0rem .75rem 0rem;
        margin-top: 1.25rem;
        margin-bottom: .5rem;
        padding-left: .75rem;
        border-radius: .5rem;
        display: flex;
        align-items: center;
    }

    #modal-candidateCard .card-section .table-card tbody tr td:first-child {
        width: 25%;
        font-weight: 600;
    }
/*#endregion*/

/*#region incidentForm-card*/
#modal-incidentFormCard .tab-content {
    max-height: 75vh;
    overflow-y: scroll;
}

#modal-incidentFormCard .card-section {
}

    #modal-incidentFormCard .card-section .card-section-title {
        color: var(--theme-color);
        background-color: #f6f9ff;
        font-weight: 600;
        font-size: 1.1rem;
        padding: .75rem 0rem .75rem 0rem;
        margin-top: 1.25rem;
        margin-bottom: .5rem;
        padding-left: .75rem;
        border-radius: .5rem;
        display: flex;
        align-items: center;
    }

    #modal-incidentFormCard .card-section .table-card tbody tr td:first-child {
        width: 25%;
        font-weight: 600;
    }
/*#endregion*/

/*#region tooltip*/
.tooltip-text-start .tooltip-inner {
    text-align: start;
}
.tooltip-text-nowrap .tooltip-inner {
    white-space: nowrap;
}
.tooltip-w-auto .tooltip-inner {
    max-width: none !important;
}
/*#endregion*/

/*#region validation*/
.field-validation-error {
    background-color: #f13030;
    color: #ffffff;
    padding: 3px 7px 3px 7px;
    font-size: 12px;
    border-radius: 4px;
    float: right;
    margin-top: -28px;
    margin-right: 5px;
}

.field-validation-warning {
    background-color: #f9a937;
    color: #ffffff;
    padding: 3px 7px 3px 7px;
    font-size: 12px;
    border-radius: 4px;
    float: right;
    margin-top: -28px;
    margin-right: 5px;
}

input[type=text][data-val-required],
input[type=file][data-val-required],
input[type=date][data-val-required],
input[type=time][data-val-required],
input[type=week][data-val-required],
input[type=datetime][data-val-required],
input[type=datetime-local][data-val-required],
input[type=password][data-val-required],
textarea[data-val-required],
select[data-val-required],
.select2-selection[data-val-required],
.ms-options-wrap button[data-val-required] {
    background-image: url(../../../img/shared/input-required-icon.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - 20px) center;
    background-size: .5rem;
}
.ms-options-wrap button[data-val-required] {
    background-position: calc(100% - 9px) center;
}

.validation-summary-errors {
    border: none !important;
    color: #ffffff;
    background-color: #ec3744;
    margin-top: 10px;
    border-radius: 3px;
    padding: 5px;
}

    .validation-summary-errors > ul {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }
/*#endregion validation*/

/*#region browser*/
::-webkit-scrollbar {
    display: none;
}

::placeholder {
    color: #919aa3 !important;
}

::-webkit-input-placeholder {
    color: #919aa3 !important;
}

::-moz-placeholder {
    color: #919aa3 !important;
}

:-ms-input-placeholder {
    color: #919aa3 !important;
}

input[type=date]::-webkit-calendar-picker-indicator,
input[type=time]::-webkit-calendar-picker-indicator,
input[type=datetime-local]::-webkit-calendar-picker-indicator {
    width: 20px;
    height: 20px;
    position: absolute;
    cursor: pointer;
}

input[type=date]::-webkit-datetime-edit {
    margin-left: 30px;
}

input[type=time]::-webkit-datetime-edit {
    margin-left: 40px;
}

input[type=datetime-local]::-webkit-datetime-edit {
    margin-left: 30px;
}

input[type="time" i] {
    /*font-family: monospace;*/
    padding-inline-start: 1px;
    cursor: default;
}
/*#endregion browser*/

/*#region select2*/
.select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: .25rem;
}

.select2-container {
    width: 100% !important;
}

    .select2-container .select2-selection {
        width: 100% !important;
        height: calc(1.5em + .75rem + 2px);
        padding: .375rem .75rem;
        border: 1px solid #ced4da;
        border-radius: .25rem;
        display: flex;
        align-items: center;
    }
        .select2-container .select2-selection .select2-selection__arrow {
            display: none;
        }

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: none;
    border-bottom: 1px solid #ced4da;
    color: #939090;
}

.select2-container [type=search] {
    outline-offset: inherit;
    outline: unset;
    padding-left: .75rem;
}

.select2-results__message {
    font-size: .85rem;
    font-weight: bold;
    padding-left: 1rem;
}

.select2-results__option:hover {
    background-color: #f5f5f5;
}

.select2-dropdown {
    border: 1px solid #ced4da;
}

.select2-selection--multiple {
    height: auto !important;
    display: block !important;
}

    .select2-selection--multiple [type=search] {
        width: auto !important;
    }

    .select2-selection--multiple .select2-selection__choice {
        width: 100% !important;
        border: none !important;
        background-color: #f3f3f3 !important;
        margin-left: 0 !important;
        padding: 5px !important;
        padding-left: 22px !important;
    }

        .select2-selection--multiple .select2-selection__choice span {
            padding: 5px !important;
            color: #ff0000 !important;
            border: none !important;
        }

            .select2-selection--multiple .select2-selection__choice span:hover {
                background-color: #ffe8e8 !important;
            }

.select2-results__options[aria-multiselectable=true] [aria-selected=true] {
    display: none;
}
/*#endregion*/

/*#region select2*/
.map-marker-label {
    background-color: #fff !important;
    border: 1px solid #353535 !important;
    padding: 2px 4px !important;
    border-radius: 4px !important;
    white-space: nowrap;
}
/*#endregion*/
/*#region select-checklist*/
.ms-options-wrap label {
    text-align: left;
    padding: 1rem !important;
    padding-left: 2.75rem !important;
    display: flex !important;
    align-items: center !important;
    border: none !important;
}
    .ms-options-wrap label input[type=checkbox] {
        -ms-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -webkit-transform: scale(1.5);
        -o-transform: scale(1.5);
        max-width: 25px;
        margin-top: 0.8rem;
        left: 1rem !important;
        top: auto !important;
    }

.ms-options-wrap > .ms-options > ul li.selected label,
.ms-options-wrap > .ms-options > ul label:hover {
    background-color: #f6f9ff !important;
    color: #4154f1 !important;
    font-weight:600;
}

.ms-options-wrap > .ms-options > ul label.focused{
    background-color:#ffffff !important;
}

.ms-options-wrap > button:after {
    content: none !important;
}
/*#endregion*/

/*#region variables*/
.cursor-pointer {
    cursor: pointer;
}
.cursor-default {
    cursor: default;
}
.fw-100 {
    font-weight: 100 !important;
}

.fw-200 {
    font-weight: 200 !important;
}

.fw-300 {
    font-weight: 300 !important;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.fw-600 {
    font-weight: 600 !important;
}


.fs-0-75 {
    font-size: .75rem !important;
}
.fs-0-80 {
    font-size: .80rem !important;
}
.fs-0-85 {
    font-size: .85rem !important;
}
.fs-0-90 {
    font-size: .90rem !important;
}
.fs-0-95 {
    font-size: .95rem !important;
}
.fs-1{
    font-size: 1rem !important;
}
.fs-1-25 {
    font-size: 1.25rem !important;
}
.fs-1-50 {
    font-size: 1.5rem !important;
}
.fs-1-75 {
    font-size: 1.75rem !important;
}
.fs-2 {
    font-size: 2rem !important;
}

.w-0 {
    width: 0px !important;
}
.w-5 {
    width:5% !important;
}
.w-15 {
    width: 15% !important;
}
.w-20 {
    width: 20% !important;
}
.w-25 {
    width: 25% !important;
}
.w-30 {
    width: 30% !important;
}
.w-35 {
    width: 35% !important;
}
.w-40 {
    width: 40% !important;
}
.w-45 {
    width: 45% !important;
}
.w-50 {
    width: 50% !important;
}
.w-55 {
    width: 55% !important;
}
.w-60 {
    width: 60% !important;
}
.w-65 {
    width: 65% !important;
}
.w-70 {
    width: 70% !important;
}
.w-75 {
    width: 75% !important;
}
.w-80 {
    width: 80% !important;
}
.w-85 {
    width: 85% !important;
}
.w-90 {
    width: 90% !important;
}
.w-95 {
    width: 95% !important;
}
.w-100 {
    width: 100% !important;
}

.right-0{
    right:0;
}
.right-0-25 {
    right: .25rem;
}
.right-0-50 {
    right: .5rem;
}
.right-0-75 {
    right: .75rem;
}
.right-1 {
    right: 1rem;
}
.right-2 {
    right: 2rem;
}
.right-3 {
    right: 3rem;
}
.right-4 {
    right: 4rem;
}
.right-5 {
    right: 5rem;
}

.badge-soft {
    font-size: 0.8rem;
    padding: 0.4em 0.7em;
    border-radius: 1rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.bg-soft-blue { background-color: #e0f0ff; color: #007bff; }
.bg-soft-green { background-color: #e6f4ea; color: #198754; }
.bg-soft-yellow { background-color: #fff9db; color: #ffc107; }
.bg-soft-gray { background-color: #f1f1f1; color: #6c757d; }
.bg-soft-pink { background-color: #fde8f0; color: #d63384; }
.bg-soft-teal { background-color: #e0f7fa; color: #16a6c3; }
.bg-soft-dark { background-color: #e5e5e5; color: #343a40; }
/*#endregion*/