/****************************
* BUTTONS
****************************/
.btn-theme-primary,
.btn.btn-theme-primary {
    background-color: var(--theme-secondary);
    color: #fff;
}

.btn-theme-primary:hover,
.btn.btn-theme-primary:hover {
    background-color: var(--theme-secondary-hover);
    color: #fff;
}

.btn-theme-light-primary,
.btn.btn-theme-light-primary {
    background-color: #fff;
    color: var(--theme-secondary);
}

/* .btn-theme-light-primary:hover {
    background-color: #fff;
    color: var(--theme-secondary-hover);
} */

.btn-theme-light-primary:hover,
.btn.btn-theme-light-primary:hover {
    background-color: var(--theme-secondary);
    color: #fff;
    /* border: solid 1px var(--theme-secondary-hover) !important; */
}

.btn-theme-light-primary:hover .svg-icon,
.btn.btn-theme-light-primary:hover .svg-icon {
    color: var(--theme-light) !important;
    /* border: solid 1px var(--theme-secondary-hover) !important; */
}

.btn-theme-secondary,
.btn.btn-theme-secondary {
    background-color: var(--theme-primary);
    color: #fff;
}

.btn-theme-secondary:hover,
.btn.btn-theme-secondary:hover {
    background-color: var(--theme-primary-hover);
    color: #fff;
}

.btn-theme-light-secondary,
.btn.btn-theme-light-secondary {
    background-color: #fff;
    color: var(--theme-primary);
}

.btn-theme-light-secondary:hover,
.btn.btn-theme-light-secondary:hover {
    background-color: #fff;
    color: var(--theme-primary-hover);
}

.btn-theme-tertiary,
.btn.btn-theme-tertiary {
    background-color: var(--theme-tertiary);
    color: var(--theme-secondary);
}

.btn-theme-light-tertiary,
.btn.btn-theme-light-tertiary {
    background-color: var(--theme-tertiary);
    color: var(--theme-primary);
}

.btn-check:active+.btn.btn-secondary,
.btn-check:checked+.btn.btn-secondary,
.btn.btn-secondary.active,
.btn.btn-secondary.show,
.btn.btn-secondary:active:not(.btn-active),
.btn.btn-secondary:focus:not(.btn-active),
.btn.btn-secondary:hover:not(.btn-active),
.show>.btn.btn-secondary {
    background-color: var(--theme-secondary) !important;
}

.btn-check:active+.btn.btn-secondary,
.btn-check:checked+.btn.btn-secondary,
.btn.btn-secondary.active,
.btn.btn-secondary.show,
.btn.btn-secondary:active:not(.btn-active),
.btn.btn-secondary:focus:not(.btn-active),
.btn.btn-secondary:hover:not(.btn-active),
.show>.btn.btn-secondary {
    color: var(--theme-light);
}

.btn-check:active+.btn.btn-secondary.dropdown-toggle::after,
.btn-check:checked+.btn.btn-secondary.dropdown-toggle::after,
.btn.btn-secondary.active.dropdown-toggle::after,
.btn.btn-secondary.show.dropdown-toggle::after,
.btn.btn-secondary:active:not(.btn-active).dropdown-toggle::after,
.btn.btn-secondary:focus:not(.btn-active).dropdown-toggle::after,
.btn.btn-secondary:hover:not(.btn-active).dropdown-toggle::after,
.show>.btn.btn-secondary.dropdown-toggle::after {
    color: var(--theme-light);
}



/****************************
* BACKGROUND COLORS
****************************/
.bg-theme-primary {
    background-color: var(--theme-primary) !important;
}

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

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



/****************************
* TEXTS COLORS
****************************/
.text-theme-primary {
    color: var(--theme-primary) !important;
}

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

a.text-theme-secondary:hover,
a.text-theme-secondary:active {
    color: var(--theme-secondary-hover) !important;
}

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

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

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

.text-theme-secondary .dropdown-item.active,
.text-theme-secondary .dropdown-item:active {
    color: var(--theme-secondary) !important;
}



/****************************
* SVG ICONS COLORS
****************************/
.btn.btn-secondary.dropdown-toggle::after {
    color: var(--theme-secondary);
}



/****************************
* DATATABLES
****************************/
table.dataTable tr th {
    text-transform: uppercase !important;
}



/****************************
* CHECKBOXES
****************************/
.form-check.form-check-theme-primary .form-check-input:checked {
    background-color: var(--theme-primary);
}

.form-check.form-check-theme-secondary .form-check-input:checked {
    background-color: var(--theme-secondary);
}



.usermenu {
    background-color: var(--theme-tertiary) !important;
    color: var(--theme-secondary);
    padding: 5px;
    border-radius: 8px;
}



/****************************
* STEPPER
****************************/
.stepper.stepper-pills .stepper-item.current .stepper-icon {
    background-color: var(--theme-secondary);
}

.stepper.stepper-pills .stepper-item .stepper-icon .stepper-number {
    color: var(--theme-secondary);
}
.stepper.stepper-pills .stepper-item .stepper-icon {
	background-color: var(--theme-light);
}
.stepper.stepper-pills {
	--bs-stepper-icon-bg-color-completed: var(--theme-light);
}
.stepper.stepper-pills .stepper-item.completed .stepper-icon .stepper-check, .stepper.stepper-pills .stepper-item.current.mark-completed:last-child .stepper-icon .stepper-check {
	color: var(--theme-secondary);
}