:root {
  --main-bg: #ffffff;        
  --main-text-color: #292a2e;    
  --secondary-bg: #85a7f7;
  --secondary-bg-opacity: rgba(135, 169, 247, 0.3);
  --secondary-text-color: #504e4e;
  
  --menu-text-color: #6a97ff;     
  
  --highlight-color: #e7e964;     

  --white-color: #ffffff;
  --black-color: #2e2e2e;
  --danger: #6a97ff;              
}


/* Start::oid-style */
.oid-main-color {
    color: var(--main-text-color) !important;
}

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

.oid-main-bg {
    color: var(--main-bg) !important;
}

.oid-d-flex {
    display: flex;
}

.oid-flex-row {
    flex-direction: row;
}

.oid-flex-column {
    flex-direction: column;
}

.oid-flex-row-reverse {
    flex-direction: row-reverse;
}

.oid-flex-column-reverse {
    flex-direction: column-reverse;
}

.oid-flex-wrap {
    flex-wrap: wrap;
}

.oid-flex-nowrap {
    flex-wrap: nowrap;
}

.oid-justify-start {
    justify-content: start;
}

.oid-justify-end {
    justify-content: end;
}

.oid-justify-center {
    justify-content: center;
}

.oid-justify-space-evenly {
    justify-content: space-evenly;
}

.oid-justify-between {
    justify-content: space-between;
}

.oid-align-items-start {
    align-items: start;
}

.oid-align-items-center {
    align-items: center;
}

.oid-align-items-end {
    align-items: end;
}

.oid-align-content-start {
    align-content: start;
}

.oid-align-content-center {
    align-content: center;
}

.oid-align-content-end {
    align-content: end;
}

.oid-align-self-start {
    align-self: start;
}

.oid-align-self-center {
    align-self: center;
}

.oid-align-self-end {
    align-self: end;
}

.oid-gap-1 {
    gap: 1em;
}

.oid-gap-2 {
    gap: 2em;
}

.oid-gap-3 {
    gap: 3em;
}

.oid-gap-4 {
    gap: 4em;
}

.oid-gap-5 {
    gap: 5em;
}

.oid-gap-6 {
    gap: 6em;
}

.oid-gap-7 {
    gap: 7em;
}

.oid-gap-8 {
    gap: 8em;
}

.oid-gap-9 {
    gap: 9em;
}

.oid-gap-10 {
    gap: 10em;
}

.oid-gap-11 {
    gap: 11em;
}

.oid-w-100 {
    width: 100%;
}

.oid-w-90 {
    width: 90%;
}

.oid-w-80 {
    width: 80%;
}

.oid-w-70 {
    width: 70%;
}

.oid-w-60 {
    width: 60%;
}

.oid-w-50 {
    width: 50%;
}

.oid-w-48 {
    width: 48%;
}

.oid-w-40 {
    width: 40%;
}

.oid-w-30 {
    width: 30%;
}

.oid-w-25 {
    width: 25%;
}

.oid-w-20 {
    width: 20%;
}

.oid-w-15 {
    width: 15%;
}

.oid-w-10 {
    width: 10%;
}

/* End::oid-style */

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

.badge-primary {
    color: var(--white-color);
    background-color: var(--secondary-bg);
}

.badge-light-primary {
    color: var(--menu-text-color);
    background-color: var(--secondary-bg-opacity);
}

.oid-badge-light {
    color: var(--secondary-text-color);
    background-color: var(--main-bg);
}

.nav-line-tabs .nav-item .nav-link.active,
.nav-line-tabs .nav-item .nav-link:hover:not(.disabled),
.nav-line-tabs .nav-item.show .nav-link {
    border-bottom: 1px solid var(--main-text-color);
}

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

.scrolltop {
    background-color: var(--main-bg) !important;
    box-shadow: var(--main-bg) !important;
}

.aside {
    background-color: var(--main-bg);
}

.aside .aside-menu .menu .menu-item.show>.menu-link .menu-icon,
.aside .aside-menu .menu .menu-item.show>.menu-link .menu-icon .svg-icon,
.aside .aside-menu .menu .menu-item.show>.menu-link .menu-icon i {
    color: var(--secondary-color) !important;
}

.aside .aside-menu .menu .menu-item.here>.menu-link .menu-icon,
.aside .aside-menu .menu .menu-item.here>.menu-link .menu-icon .svg-icon,
.aside .aside-menu .menu .menu-item.here>.menu-link .menu-icon i {
    color: var(--secondary-color) !important;
}

.aside .aside-menu .menu .menu-item .menu-link .menu-title {
    color: var(--secondary-text-color) !important;
}

.aside .aside-menu .menu .menu-item .menu-link.active .menu-title {
    color: var(--black-color) !important;
}

.form-check-custom.form-check-solid .form-check-input:checked {
    background-color: var(--highlight-color) !important;
}

.aside .aside-menu .menu .menu-item.here>.menu-link .menu-arrow:after,
.aside .aside-menu .menu .menu-item.show>.menu-link .menu-arrow:after {
    background-color: var(--secondary-text-color) !important;
}

.aside .aside-menu .menu .menu-item .menu-link.active {
    background-color: var(--highlight-color) !important;
}

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

.btn:hover {
    color: var(--white-color) !important;
    background-color: var(--menu-text-color) !important;
}

.btn.btn-light-primary{
    color: var(--menu-text-color) !important;
    background-color: var(--secondary-bg-opacity) !important;
}

.btn.btn-light-primary .svg-icon {
  color: var(--menu-text-color);
}

.btn-check:active+.btn.btn-light-primary,
.btn-check:active+.btn.btn-light-primary .svg-icon,
.btn-check:checked+.btn.btn-light-primary,
.btn.btn-light-primary.active,
.btn.btn-light-primary.show,
.btn-active-color-primary:hover i,
.btn.btn-light-primary:active:not(.btn-active),
.btn.btn-light-primary:focus:not(.btn-active),
.btn.btn-light-primary:hover:not(.btn-active),
.show>.btn.btn-light-primary {
    color: var(--white-color) !important;
    background-color: var(--menu-text-color) !important;
}

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

.btn-check:active+.btn.btn-active-light-primary,
.btn-check:checked+.btn.btn-active-light-primary,
.btn.btn-active-light-primary.active,
.btn.btn-active-light-primary.show,
.btn.btn-active-light-primary:active:not(.btn-active),
.btn.btn-active-light-primary:focus:not(.btn-active),
.show>.btn.btn-active-light-primary {
    color: var(--white-color) !important;
    background-color: var(--danger) !important;
}

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

.btn-check:active+.btn.btn-primary .svg-icon,
.btn-check:active+.btn.btn-primary i,
.btn-check:checked+.btn.btn-primary .svg-icon,
.btn-check:checked+.btn.btn-primary i,
.btn.btn-primary.active .svg-icon,
.btn.btn-primary.active i,
.btn.btn-primary.show .svg-icon,
.btn.btn-primary.show i,
.btn.btn-primary:active:not(.btn-active) .svg-icon,
.btn.btn-primary:active:not(.btn-active) i,
.btn.btn-primary:focus:not(.btn-active) .svg-icon,
.btn.btn-primary:focus:not(.btn-active) i,
.btn.btn-primary:hover:not(.btn-active) .svg-icon,
.btn.btn-primary:hover:not(.btn-active) i,
.show>.btn.btn-primary .svg-icon,
.show>.btn.btn-primary i {
    color: var(--white-color) !important;
}

.page-item.active .page-link {
    color: var(--menu-text-color) !important;
    background-color: var(--secondary-bg-opacity) !important;
}

.active>.page-link,
.page-link.active {
    color: var(--white-color) !important;
    background-color: var(--main-bg) !important;
    border-color: var(--main-bg) !important;
}

.page-item:hover:not(.active):not(.offset):not(.disabled) .page-link .previous,
.page-item:hover:not(.active):not(.offset):not(.disabled) .page-link .next {
    background-color: var(--main-text-color) !important;
}

li:not(.active) .page-link:focus,
li:not(.active) .page-link:hover {
    color: var(--main-text-color) !important;
    background-color: var(--secondary-bg) !important;
    border-color: var(--secondary-bg) !important;
}

.menu-state-color .menu-item.hover:not(.here)>.menu-link:not(.disabled):not(.active):not(.here),
.menu-state-color .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) {
    color: var(--main-text-color);
}

.dropzone {
    border: 1px dashed var(--main-bg);
    background-color: transparent !important;
}

.pulse-custom {
    border-color: var(--main-bg);
    top: -8px;
    left: -13px;
}

.toastr-top-right {
    top: 2rem !important;
}

@media (min-width: 992px) {
    .aside {
        left: 0 !important;
        top: 71px !important;
        bottom: 0 !important;
        border-radius: 0 !important;
    }
}

@media (max-width: 766px) {
    .pulse-custom {
        top: -11px;
        left: -14px;
    }
}