/* Keep Bootstrap controls in EMR aligned with the application's configured theme. */
.emr-theme {
    --bs-primary: var(--primary-color);
    --bs-primary-rgb: var(--primary-rgb);
    --bs-link-color: var(--primary-color);
    --bs-link-hover-color: var(--primary-hover);
    --bs-primary-text-emphasis: var(--primary-color);
    --bs-primary-bg-subtle: rgba(var(--primary-rgb), 0.08);
    --bs-primary-border-subtle: rgba(var(--primary-rgb), 0.25);
}

.emr-theme .text-primary,
.emr-theme .text-primary-emphasis {
    color: var(--primary-color) !important;
}

.emr-theme .bg-primary {
    background-color: var(--primary-color) !important;
}

.emr-theme .bg-primary-subtle {
    background-color: rgba(var(--primary-rgb), 0.08) !important;
}

.emr-theme .border-primary {
    border-color: var(--primary-color) !important;
}

.emr-theme .border-primary-subtle {
    border-color: rgba(var(--primary-rgb), 0.25) !important;
}

.emr-theme .btn-primary,
.emr-theme .btn-outline-primary {
    --bs-btn-color: var(--primary-color);
    --bs-btn-border-color: var(--primary-color);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary-hover);
    --bs-btn-hover-border-color: var(--primary-hover);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--primary-hover);
    --bs-btn-active-border-color: var(--primary-hover);
    --bs-btn-focus-shadow-rgb: var(--primary-rgb);
    --bs-btn-disabled-color: var(--primary-color);
    --bs-btn-disabled-border-color: var(--primary-color);
}

.emr-theme .btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--primary-color);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--primary-color);
}

.emr-theme .list-group {
    --bs-list-group-active-color: var(--primary-color);
    --bs-list-group-active-bg: rgba(var(--primary-rgb), 0.1);
    --bs-list-group-active-border-color: rgba(var(--primary-rgb), 0.25);
}

.emr-theme .nav-pills .nav-link.active,
.emr-theme .page-item.active .page-link,
.emr-theme .form-check-input:checked {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.emr-theme .emr-score-summary {
    background: linear-gradient(135deg, rgba(var(--primary-rgb), 0.04), rgba(var(--primary-rgb), 0.12));
    border-left: 5px solid var(--primary-color) !important;
}

.emr-theme .emr-document-option {
    border-left: 3px solid transparent;
    color: #213f52;
    background-color: #fff;
}

.emr-theme .emr-document-option:hover {
    background-color: rgba(var(--primary-rgb), 0.04);
}

.emr-theme .emr-document-option.active,
.emr-theme .emr-document-option.active:hover,
.emr-theme .emr-document-option.active:focus {
    color: var(--primary-color);
    background-color: rgba(var(--primary-rgb), 0.1);
    border-color: rgba(var(--primary-rgb), 0.25);
    border-left-color: var(--primary-color);
}

.emr-theme .emr-document-option:focus-visible {
    outline: 2px solid var(--primary-color) !important;
    outline-offset: -3px;
}

.emr-document-option__title {
    min-width: 0;
    flex: 1;
    white-space: normal;
    overflow-wrap: anywhere;
}

.emr-document-option__icon {
    color: var(--primary-color);
}

.emr-document-option__code {
    min-width: 0;
    color: #536b78;
    font-size: 0.75rem;
    overflow-wrap: anywhere;
}

.emr-document-option.active .emr-document-option__code {
    color: var(--primary-color);
}
