:root {
    --bs-primary: #5C7457;
    --bs-primary-rgb: 92, 116, 87;
    --primary-color: #5C7457;
    --primary-hover-color: #4D6248;
    --secondary-color: #FFFFFF;
    --light-bg: #FFFFFF;
    --dark-text: #1A0F0B;
    --gray-text: #3C3C3C;
    --disabled-text: #9A8F88;
    --gray-bg: #FFFFFF;
    --accent-color: #6D8767;
    --secondary-btn-bg: #3C3C3C;
    --primary-text-color: #FFFFFF;
    --gradient-primary: linear-gradient(310deg, var(--primary-color) 0%, var(--primary-color) 0%);
    --gradient-accent: linear-gradient(310deg, var(--primary-color), var(--accent-color));
    --gradient-update: linear-gradient(90deg, var(--primary-color), var(--accent-color));
}

body {
    background-color: var(--light-bg);
    color: var(--dark-text);
}

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

a:hover {
    color: var(--primary-hover-color);
}

.navbar-vertical.navbar-expand-xs .navbar-collapse {
    height: 100% !important;
}

.navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item .nav-link:before,
.navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item .nav-link:before {
    content: unset !important;
}

.bg-gradient-primary,
.bg-gradient-success,
.bg-gradient-info {
    background-image: var(--gradient-primary) !important;
    color: #fff !important;
}


.card .card-title,
.card h3 {
    color: var(--dark-text) !important;
}

.navbar-vertical .navbar-nav > .nav-item .nav-link.active .icon {
    background-image: linear-gradient(310deg, var(--primary-color) 0%, var(--primary-color) 100%) !important;
}

.text-gradient.text-info,
.text-gradient.text-primary {
    background-image: var(--gradient-accent);
}

.main-content,
.container-fluid.py-4 {
    background-color: var(--gray-bg) !important;
}

.your-element-selector {
    background-color: var(--light-bg) !important;
}

h2,
h6 {
    color: var(--dark-text);
}

#chart-bars,
#chart-line {
    background-color: var(--light-bg);
}

.navbar-vertical .navbar-nav > .nav-item .nav-link.active {
    color: var(--gray-text);
    background-color: var(--light-bg);
}

.navbar-vertical .navbar-nav .nav-item .collapse .nav .nav-item .nav-link.active,
.navbar-vertical .navbar-nav .nav-item .collapsing .nav .nav-item .nav-link.active {
    color: var(--gray-text);
}

.btn-primary,
.btn.bg-gradient-primary,
.badge.bg-gradient-primary,
.page-item.active .page-link,
.form-check-input:checked,
.nav-pills .nav-link.active,
.dropdown-item:active {
    background: var(--gradient-primary) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn.bg-gradient-primary:hover,
.btn.bg-gradient-primary:focus,
.btn.bg-gradient-primary:active {
    background: var(--primary-hover-color) !important;
    border-color: var(--primary-hover-color) !important;
    color: #fff !important;
}

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

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
}

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

svg.text-primary .color-foreground,
svg.text-primary .color-background {
    fill: var(--primary-color) !important;
}

.shadow-primary {
    box-shadow: 0 8px 20px rgba(92, 116, 87, 0.24) !important;
}

a.mx-3 i.fas.fa-user-edit,
a.mx-3 i.fa-solid.fa-pencil {
    color: var(--primary-color) !important;
}

a[title*="Add"]:hover,
a[title*="Back"]:hover,
a[title*="Add"]:hover i,
a[title*="Back"]:hover i {
    color: var(--primary-color) !important;
    text-decoration: none;
}

.btn-update,
button[type="submit"].btn-update,
button[type="submit"]:not([disabled]) {
    background: var(--gradient-update) !important;
    border-color: var(--primary-color) !important;
    color: #fff !important;
    transition: background-color 0.3s ease;
}
.btn-back,
.btn-secondary {
    background-color: var(--secondary-btn-bg) !important;
    border-color: var(--secondary-btn-bg) !important;
    color: #fff !important;
    transition: background-color 0.3s ease;
}
.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.table-bordered th,
.table-bordered td {
    border: 1px solid #dee2e6 !important;
    vertical-align: top;
    padding: 8px;
}
.table-bordered thead th {
    background-color: #f8f9fa;
    font-weight: 600;
}
.bg-light {
    background-color: var(--light-bg) !important;
    color: var(--dark-text) !important;
}

/*!*invoice*!*/

/*.receipt {*/
/*    font-family: monospace;*/
/*    font-size: 14px;*/
/*    color: black;*/
/*    width: 100%;*/
/*}*/

/*.receipt .center {*/
/*    text-align: center;*/
/*    margin-bottom: 10px;*/
/*}*/

/*.receipt .line {*/
/*    border-bottom: 1px dashed #000;*/
/*    margin: 10px 0;*/
/*}*/

/*.receipt .table {*/
/*    width: 100%;*/
/*    border-collapse: collapse;*/
/*}*/

/*.receipt .table td {*/
/*    padding: 4px 0;*/
/*}*/

/*.receipt .amount {*/
/*    text-align: right;*/
/*}*/

/*.receipt .footer {*/
/*    text-align: center;*/
/*    margin-top: 20px;*/
/*    font-size: 13px;*/
/*}*/


.main-content,.container-fluid.py-4 {
    position: relative;

    height: 100%; /* Ensure it covers the full height */
    z-index: 0;

}
.main-content::before,.container-fluid.py-4::before {
    content: none !important;
}


.sidenav{
    background: #ffffff!important;
}

.navbar-vertical.navbar-expand-xs .navbar-collapse {
    overflow: hidden!important;
}