/* Medrooms theme: teal / slate-navy (colors from main) */

/* 1 - primary teal */
.custom-1-bg,
.custom-1-bg-hover:active {
    background-color: #2bb0af !important;
}

.custom-1-bg-hover:hover {
    background-color: #40b0bf !important;
}

.custom-1-txt {
    color: #2bb0af !important;
}

.custom-1-br {
    border-color: #2bb0af !important;
}

/* 2 - chrome surface (sidebar, topbar, auth header bar, call panel) */
.custom-2-bg {
    background-color: #2a3042 !important;
}

.custom-2-txt {
    color: #2a3042 !important;
}

.custom-2-br {
    border-color: #2a3042 !important;
}

/* 3 - dark accent */
.custom-3-bg {
    background-color: #1b5859 !important;
}

.custom-3-txt {
    color: #1b5859 !important;
}

.custom-3-br {
    border-color: #1b5859 !important;
}

/* 4 - light border */
.custom-4-bg {
    background-color: #ced4da !important;
}

.custom-4-txt {
    color: #ced4da !important;
}

.custom-4-br {
    border-color: #ced4da !important;
}

/* 5 - secondary actions */
.custom-5-bg {
    background-color: #485371 !important;
}

.custom-5-txt {
    color: #2bb0af !important;
}

.custom-5-br {
    border-color: #485371 !important;
}

/* @note where a custom-N class sits next to a legacy color class, main used the legacy color */
.mr-sc-dark-blue-bg.custom-1-bg,
.mr-control-icons.custom-1-bg,
.mr-bg-row.custom-1-bg {
    background-color: #2a3042 !important;
}

.mr-sc-dark-grey-bg.custom-1-bg,
.mr-sc-dark-grey-bg.custom-5-bg {
    background-color: #4e5771 !important;
}

.btn-primary.custom-1-bg {
    background-color: #40b0bf !important;
}

.mr-sc-grey-bg.custom-2-bg {
    background-color: #eff0f5 !important;
}

.mr-white-tx.custom-1-txt {
    color: #ffffff !important;
}

/* @note markup swaps on production that main colored differently */
.card.mr-white-bg:has(> .mr-round-borders-top.custom-2-bg) {
    background-color: #eff0f5 !important;
}

.modal-header.custom-1-bg h5.modal-title {
    color: #2bb0af !important;
}

.mr-dash-room-list-actions .btn.btn-primary,
.mr-dash-room-list-actions .btn-primary,
.mr-dash-room-list-actions button.btn-primary:active,
.mr-dash-room-list-actions button.btn-primary:focus {
    background-color: #485371 !important;
}

input[switch]:checked+label {
    background-color: #2bb0af !important;
}

.lds-ellipsis div {
    background: #2bb0af;
}

.logo-img {
    max-width: 160px;
}