body {
    background-color: #F0F0EE;
}

:root {
    --primary: #696D58 !important;
    --primary-light: #CCBFA6 !important;
    --primary-bg: #F0F0EE !important;
    --primary-dark: #2C2E25 !important;
}

.bg-primary,
.btn-primary,
.card-header {
    background-color: var(--primary) !important;
    color: #fff !important;
}

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

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

.primary-img {
    filter: invert(44%) sepia(55%) saturate(1428%) hue-rotate(107deg) brightness(93%) contrast(101%);
}

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

.my-shadow {
    box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.10);
}

.bg-pending,
.bg-started {
    background-color: #FF8B35 !important;
}

.bg-accepted,
.bg-completed {
    background-color: #00B140 !important;
}

.bg-rejected,
.bg-cancelled {
    background-color: #FF0000 !important;
}

.text-primary {
    color: var(--primary) !important;
}

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

.bg-primary-dark {
    background-color: #16281C !important;
}

.form-control,
.form-select {
    height: 45px;
}

.w3-border-gray {
    border-color: #CFCFCF !important;
}


.btn-check:checked+.btn,
.btn.active,
.btn.show,
.btn:first-child:active,
:not(.btn-check)+.btn:active {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.btn-check+.btn:hover {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.btn-outline-primary {
    border-color: var(--primary) !important;
    color: var(--primary) !important;
}


.active-item-sidebar {
    border-left: 5px solid var(--primary) !important;
}

.rtl .active-item-sidebar {
    border-left: none !important;
    border-right: 5px solid var(--primary) !important;
}


.active>.page-link,
.page-link.active {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}

.notify-btn:hover,
.notify-btn:focus {
    background-color: transparent !important;
    border: none !important;
}

.text-primary {
    color: #CCBFA6 !important;
}