:root, [data-bs-theme=white] {
    --bs-body-bg: rgba(255,255,255,0.85);
    --bs-body-color: black;
    --bs-btn-color: white;
    --bs-btn-bg: #337ab7;
    --bs-btn-border-color: #2e6da4;
    --bs-btn-background-image: none;
    --bs-btn-border: 1px solid transparent;
    --bs-btn-border-radius: 4px;
    --bs-btn-bg-active: #286090;
    --bs-btn-border-color-active: #204d74;
    --bs-btn-border-color-focus: #122b40;
    --bs-btn-cargo-color: #F8F8F8;
    --bs-btn-cargo-bg: #56575C;
    --bs-btn-cargo-border-color: #606167;
    --bs-link-color: black;
    --bs-link-hover: #302f2f;
}

[data-bs-theme=black] {
    --bs-body-bg: rgba(0,0,0,1);
    --bs-body-color: white;
    --bs-btn-color: white;
    --bs-btn-bg: #ef561a;
    --bs-btn-border-color: #F16F3B;
    --bs-btn-background-image: none;
    --bs-btn-border: 1px solid transparent;
    --bs-btn-border-radius: 0;
    --bs-btn-bg-active: #F16F3B;
    --bs-btn-border-color-active: #F16F3B;
    --bs-btn-border-color-focus: #F16F3B;
    --bs-btn-cargo-color: white;
    --bs-btn-cargo-bg: #ef561a;
    --bs-btn-cargo-border-color: #F16F3B;
    --bs-link-color: white;
    --bs-link-hover: #ddd;
}

.loginMode {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
}

.lblMode {
    color: var(--bs-body-color);
}

.link {
    color: var(--bs-link-color) !important;
    text-decoration: underline !important;
}

a.link:hover {
    color: var(--bs-link-hover) !important;
    text-decoration: underline !important;
}

.link:visited {
    color: var(--bs-link-color) !important;
    text-decoration: underline !important;
}


.btn-button {
    color: var(--bs-btn-color);
    background-color: var(--bs-btn-bg);
    border-color: var(--bs-btn-border-color);
    border-radius: var(--bs-btn-border-radius);
}

.btn-button.focus,
.btn-button:focus {
    color: var(--bs-btn-color);
    background-color: var(--bs-btn-bg-active);
    border-color: var(--bs-btn-border-color-focus);
}

.btn-button:hover {
    color: var(--bs-btn-color);
    background-color: var(--bs-btn-bg-active);
    border-color: var(--bs-btn-border-color-active);
}

.btn-button.active,
.btn-button:active,
.open > .dropdown-toggle.btn-button {
    color: var(--bs-btn-color);
    background-color: var(--bs-btn-bg-active);
    border-color: var(--bs-btn-border-color-active);
}

.btn-button.active.focus,
.btn-button.active:focus,
.btn-button.active:hover,
.btn-button:active.focus,
.btn-button:active:focus,
.btn-button:active:hover,
.open > .dropdown-toggle.btn-button.focus,
.open > .dropdown-toggle.btn-button:focus,
.open > .dropdown-toggle.btn-button:hover {
    color: var(--bs-btn-color);
    background-color: var(--bs-btn-border-color-active);
    border-color: var(--bs-btn-border-color-focus);
}

.btn-button.active,
.btn-button:active,
.open > .dropdown-toggle.btn-button {
    background-image: var(--bs-btn-background-image);
}

.btn-button.disabled.focus,
.btn-btn-button.disabled:focus,
.btn-btn-button.disabled:hover,
.btn-btn-button[disabled].focus,
.btn-btn-button[disabled]:focus,
.btn-btn-button[disabled]:hover,
fieldset[disabled] .btn-btn-button.focus,
fieldset[disabled] .btn-btn-button:focus,
fieldset[disabled] .btn-btn-button:hover {
    background-color: var(--bs-btn-bg);
    border-color: var(--bs-btn-border-color);
}


.btn-cargo {
    color: var(--bs-btn-cargo-color);
    background-color: var(--bs-btn-cargo-bg);
    border-color: var(--bs-btn-cargo-border-color);
    border-radius: var(--bs-btn-border-radius);
}

.btn-cargo.focus,
.btn-cargo:focus {
    color: var(--bs-btn-cargo-color);
    background-color: var(--bs-btn-cargo-border-color);
    border-color: var(--bs-btn-cargo-border-color);
}

.btn-cargo:hover {
    color: var(--bs-btn-cargo-color);
    background-color: var(--bs-btn-cargo-border-color);
    border-color: var(--bs-btn-cargo-border-color);
}

.btn-cargo.active,
.btn-cargo:active,
.open > .dropdown-toggle.btn-cargo {
    color: var(--bs-btn-cargo-color);
    background-color: var(--bs-btn-cargo-border-color);
    border-color: var(--bs-btn-cargo-border-color);
}

.btn-cargo.active.focus,
.btn-cargo.active:focus,
.btn-cargo.active:hover,
.btn-cargo:active.focus,
.btn-cargo:active:focus,
.btn-cargo:active:hover,
.open > .dropdown-toggle.btn-cargo.focus,
.open > .dropdown-toggle.btn-cargo:focus,
.open > .dropdown-toggle.btn-cargo:hover {
    color: var(--bs-btn-cargo-color);
    background-color: var(--bs-btn-cargo-border-color);
    border-color: var(--bs-btn-cargo-border-color);
}

.btn-cargo.active,
.btn-cargo:active,
.open > .dropdown-toggle.btn-cargo {
    background-image: var(--bs-btn-background-image);
}

.btn-cargo.disabled.focus,
.btn-btn-cargo.disabled:focus,
.btn-btn-cargo.disabled:hover,
.btn-btn-cargo[disabled].focus,
.btn-btn-cargo[disabled]:focus,
.btn-btn-cargo[disabled]:hover,
fieldset[disabled] .btn-btn-cargo.focus,
fieldset[disabled] .btn-btn-cargo:focus,
fieldset[disabled] .btn-btn-cargo:hover {
    background-color: var(--bs-btn-cargo-bg);
    border-color: var(--bs-btn-cargo-border-color);
}