.note-block {
    border: .5px solid #ced4da;
    background-color: #d9d9d9;
    color: #000;
}

div.note-header {
    background-color: var(--note-header-bg-color);
}

span.note-header {
    color: var(--note-header-text-color);
}

.note-note-text {
    color: var(--note-text-color);
}

body {
    background: var(--content-bg-color);
}

p {
    color: var(--p-text-color);
}

h1,h2,h3,h4,h5,h6 {
  color: var(--h-text-color);
}


.footer {
    color: var(--panel-text-color);
    background-color: var(--primary-color);
}

#portal_navbar {
    color: var(--panel-text-color);
    background-color: var(--primary-color);
}

div#sidebar_brand_image {
    background-image: var(--company-brand-image);
    background-image: var(--company-brand-image-webp);
    height: 80px;
    width: 200px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/******************************************
            Sidebar styles
*******************************************/

#sidebar {
    background: var(--primary-color);
    color: var(--panel-text-color);
}

#sidebar .sidebar-header {
    background: var(--primary-color);
}

/* #sidebar ul p {
    color: #fff;
} */

#sidebar ul li a:hover {
    color: var(--sidebar-li-text-color-hover);
    background: var(--sidebar-li-bg-color-hover);
}

#sidebar .nav-tabs .nav-link.active {
    background-color: var(--sidebar-li-bg-color-active);
    color: var(--sidebar-li-text-color-active);
}

#sidebar ul li a {
  background-color: var(--sidebar-li-bg-color);
  color: var(--sidebar-li-text-color);
}

#sidebar .nave-tabs .nav-link {
  border-bottom: .5px solid var(--sidebar-li-bottom-border-color);
}

#companycontact-info h5{
    color: var(--panel-text-color);
}

/******************************************
            Content styles
*******************************************/

#content {
    color: var(--primary-color);
}

#content label {
  color: var(--content-label-text-color);
}

ul ul a {
    background: var(--primary-color);
}

#recording_script {
    border: .5px solid var(--primary-color);
    background-color: #fff;
}

/******************************************
            .nav styles for tabs
*******************************************/

.nav-tabs .nav-link.active {
    color: var(--nav-tabs-text-color-active);
    background-color: var(--nav-tabs-color-active);
    border-color: var(--nav-tabs-color-active);
}

.nav-tabs .nav-link {
    border-bottom: .5px solid var(--nav-tabs-bottom-border-color);
    color: var(--nav-tabs-text-color);
}

/******************************************
    Custom Bootstrap styles and overrides
*******************************************/

.btn-primary {
    background-color: var(--primary-btn-bg-color);
    border-color: transparent;
    color: var(--primary-btn-text-color);
}

.btn-primary:hover {
    background-color: var(--primary-btn-bg-color-hover);
    border-color: transparent;
    color: var(--primary-btn-text-color-hover);
}

.btn-link {
    color: var(--primary-color);
}

.btn-logout {
    background-color: var(--logout-btn-bg-color);
    color: var(--logout-btn-text-color);
}

.btn-logout:hover {
  background-color: var(--logout-btn-bg-color-hover);
  color: var(--logout-btn-text-color-hover);
}

hr {
    color: var(--primary-color);
}

.table-active,
.table-active > td,
.table-active > th {
    background-color: rgba(0, 0, 0, 0);
}

.table-active {
    background-color: var(--table-selected-background-color);
}

.table tbody tr:hover {
    background-color: var(--table-selected-background-color);
}

.table-hover .table-active:hover {
    background-color: var(--table-hover-background-color);
}

thead {
    background-color: var(--table-header-background-color);
    color: var(--table-header-text-color);
}

.page-item.active .page-link {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.page-item .page-link {
    color: var(--primary-color);
    background-color: #fff;
}

.recording-input-text-display {
    color: var(--content-label-text-color);
}

#recording_script {
    background-color: var(--content-bg-color);
    color: var(--content-label-text-color);
}