.login .form-side {
    background-color: #333681;
}

.login .form-side .input-container input[type="submit"] {
    background-color: rgb(134, 140, 202) !important;
}

.owl-theme .owl-dots .owl-dot span {
    background-color: transparent;
    border: 1px solid #D6D6D6;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background-color: #868cca;
}

.btn.purple,
input[type="submit"].purple {
    background-color: rgb(134, 140, 202) !important;
}

.modal .modal-header button {
    background-color: rgba(134, 140, 202, 0.5);
}

.modal-body .multi-forms .heading .form-title.active {
    border-top: 4px solid #868cca;
    color: #868cca;
}

.side-bar .nav-pills .nav-item .nav-link.show::before,
.side-bar .nav-pills .nav-item .nav-link:hover::before {
    background-color: #868cca;
}

.side-bar .nav-pills .nav-item .nav-link.show .svg-inline--fa,
.side-bar .nav-pills .nav-item .nav-link:hover .svg-inline--fa {
    color: #868cca;
}

table.table-bordered .thead {
    background-color: rgba(134, 140, 202, 0.2) !important;
}

.modal .modal-header .blue {
    color: #868cca !important;
}

.side-bar .badge,
.main-content .modal .heading .badge {
    background-color: #868cca;
}

.modal .modal-header {
    border-color: #868cca;
}

.btn.purple:hover,
input[type="submit"].purple:hover {
    color: #868cca !important;
    border: 1px solid #868cca !important;
}

.widget-header::before {
    background-color: #868cca;
}

.dropdown-menu .dropdown-title {
    color: #868cca;
    border-color: #868cca;
}

.light-orange {
    background-color: #868cca42 !important;
}

.widget-header:has(.widget-title.color-orange)::before {
    background-color: #868cca;
}

.color-orange {
    color: #868cca !important;
    border-color: #868cca;
    stop-color: #868cca;
}

.orange,
.btn.orange,
input[type='submit'].orange {
    background-color: #868cca !important;
}

.light-yellow {
    background-color: #c0c0c0 !important;
}

.yellow {
    background-color: #323335 !important;
}

.light-blue,
.light-purple {
    background-color: #3336814a !important;
}

.widget-header:has(.widget-title.color-blue)::before {
    background-color: #333681;
}

.color-blue,
.color-purple {
    color: #333681 !important;
    border-color: #333681;
    stop-color: #333681;
}

.blue,
.purple {
    background-color: #333681 !important;
}

.light-navy {
    background-color: #dbe5e6 !important;
}

.color-navy {
    color: #97b8bd !important;
    border-color: #97b8bd;
    stop-color: #97b8bd;
}

.widget-header:has(.widget-title.color-navy)::before {
    background-color: #97b8bd;
}

.navy {
    background-color: #97b8bd !important;
}

table.table-bordered :is(a, th) {
    color: #333681;
}


button.btn.purple-outline,
input[type="submit"].purple-outline {
    color: #868cca !important;
    border: 1px solid #868cca !important;
}

.color-yellow {
    color: #444 !important;
    border-color: #444;
    stop-color: #444;
}

.widget-header:has(.widget-title.color-yellow)::before {
    background-color: #444;
}

.employee-file .tab-container .tab-buttons svg,
.tab button.active {
    color: #333681;
}

.employee-file {
    background-color: #868cca;
}

.employee-file .tab-container .tab-buttons .tablinks:hover {
    background-color: #333681 !important;
}

.breadcrumb.breadcrumb-custom .breadcrumb-item {
    background-color: #868cca;
}

html:dir(rtl) .breadcrumb.breadcrumb-custom .breadcrumb-item a::before {
    border-right-color: #868cca !important;
}

html:dir(ltr) .breadcrumb.breadcrumb-custom .breadcrumb-item a::before {
    border-left-color: #868cca !important;
}