/* data-layout ="vertical"
data-sidebar="blue"
data-sidebar-size="lg"
data-sidebar-image="none"
data-preloader="disable"
data-topbar="light"
data-sidebar-visibility="show"
data-layout-style="default"
data-bs-theme="light"
data-layout-width="fluid"
data-layout-position="fixed" */
/* Global Spacing Variables */
:root {
  --spacer-1: 0.25rem;
  --spacer-2: 0.5rem;
  --spacer-3: 1rem;
  --spacer-4: 1.5rem;
  --spacer-5: 3rem;
}

/* Responsive Margin Utilities */

@media (min-width: 576px) {
  /* sm */
  .m-sm-1 {
    margin: var(--spacer-1) !important;
  }
  .m-sm-2 {
    margin: var(--spacer-2) !important;
  }
  .m-sm-3 {
    margin: var(--spacer-3) !important;
  }
  .m-sm-4 {
    margin: var(--spacer-4) !important;
  }
  .m-sm-5 {
    margin: var(--spacer-5) !important;
  }

  .mt-sm-1 {
    margin-top: var(--spacer-1) !important;
  }
  .mt-sm-2 {
    margin-top: var(--spacer-2) !important;
  }
  .mt-sm-3 {
    margin-top: var(--spacer-3) !important;
  }
  .mt-sm-4 {
    margin-top: var(--spacer-4) !important;
  }
  .mt-sm-5 {
    margin-top: var(--spacer-5) !important;
  }

  .mb-sm-1 {
    margin-bottom: var(--spacer-1) !important;
  }
  .mb-sm-2 {
    margin-bottom: var(--spacer-2) !important;
  }
  .mb-sm-3 {
    margin-bottom: var(--spacer-3) !important;
  }
  .mb-sm-4 {
    margin-bottom: var(--spacer-4) !important;
  }
  .mb-sm-5 {
    margin-bottom: var(--spacer-5) !important;
  }

  .ms-sm-1 {
    margin-left: var(--spacer-1) !important;
  }
  .ms-sm-2 {
    margin-left: var(--spacer-2) !important;
  }
  .ms-sm-3 {
    margin-left: var(--spacer-3) !important;
  }
  .ms-sm-4 {
    margin-left: var(--spacer-4) !important;
  }
  .ms-sm-5 {
    margin-left: var(--spacer-5) !important;
  }

  .me-sm-1 {
    margin-right: var(--spacer-1) !important;
  }
  .me-sm-2 {
    margin-right: var(--spacer-2) !important;
  }
  .me-sm-3 {
    margin-right: var(--spacer-3) !important;
  }
  .me-sm-4 {
    margin-right: var(--spacer-4) !important;
  }
  .me-sm-5 {
    margin-right: var(--spacer-5) !important;
  }

  .mx-sm-1 {
    margin-left: var(--spacer-1) !important;
    margin-right: var(--spacer-1) !important;
  }
  .mx-sm-2 {
    margin-left: var(--spacer-2) !important;
    margin-right: var(--spacer-2) !important;
  }
  .mx-sm-3 {
    margin-left: var(--spacer-3) !important;
    margin-right: var(--spacer-3) !important;
  }
  .mx-sm-4 {
    margin-left: var(--spacer-4) !important;
    margin-right: var(--spacer-4) !important;
  }
  .mx-sm-5 {
    margin-left: var(--spacer-5) !important;
    margin-right: var(--spacer-5) !important;
  }

  .my-sm-1 {
    margin-top: var(--spacer-1) !important;
    margin-bottom: var(--spacer-1) !important;
  }
  .my-sm-2 {
    margin-top: var(--spacer-2) !important;
    margin-bottom: var(--spacer-2) !important;
  }
  .my-sm-3 {
    margin-top: var(--spacer-3) !important;
    margin-bottom: var(--spacer-3) !important;
  }
  .my-sm-4 {
    margin-top: var(--spacer-4) !important;
    margin-bottom: var(--spacer-4) !important;
  }
  .my-sm-5 {
    margin-top: var(--spacer-5) !important;
    margin-bottom: var(--spacer-5) !important;
  }
}

@media (min-width: 768px) {
  /* md */
  .m-md-1 {
    margin: var(--spacer-1) !important;
  }
  .m-md-2 {
    margin: var(--spacer-2) !important;
  }
  .m-md-3 {
    margin: var(--spacer-3) !important;
  }
  .m-md-4 {
    margin: var(--spacer-4) !important;
  }
  .m-md-5 {
    margin: var(--spacer-5) !important;
  }

  .mt-md-1 {
    margin-top: var(--spacer-1) !important;
  }
  .mt-md-2 {
    margin-top: var(--spacer-2) !important;
  }
  .mt-md-3 {
    margin-top: var(--spacer-3) !important;
  }
  .mt-md-4 {
    margin-top: var(--spacer-4) !important;
  }
  .mt-md-5 {
    margin-top: var(--spacer-5) !important;
  }

  .mb-md-1 {
    margin-bottom: var(--spacer-1) !important;
  }
  .mb-md-2 {
    margin-bottom: var(--spacer-2) !important;
  }
  .mb-md-3 {
    margin-bottom: var(--spacer-3) !important;
  }
  .mb-md-4 {
    margin-bottom: var(--spacer-4) !important;
  }
  .mb-md-5 {
    margin-bottom: var(--spacer-5) !important;
  }

  .ms-md-1 {
    margin-left: var(--spacer-1) !important;
  }
  .ms-md-2 {
    margin-left: var(--spacer-2) !important;
  }
  .ms-md-3 {
    margin-left: var(--spacer-3) !important;
  }
  .ms-md-4 {
    margin-left: var(--spacer-4) !important;
  }
  .ms-md-5 {
    margin-left: var(--spacer-5) !important;
  }

  .me-md-1 {
    margin-right: var(--spacer-1) !important;
  }
  .me-md-2 {
    margin-right: var(--spacer-2) !important;
  }
  .me-md-3 {
    margin-right: var(--spacer-3) !important;
  }
  .me-md-4 {
    margin-right: var(--spacer-4) !important;
  }
  .me-md-5 {
    margin-right: var(--spacer-5) !important;
  }

  .mx-md-1 {
    margin-left: var(--spacer-1) !important;
    margin-right: var(--spacer-1) !important;
  }
  .mx-md-2 {
    margin-left: var(--spacer-2) !important;
    margin-right: var(--spacer-2) !important;
  }
  .mx-md-3 {
    margin-left: var(--spacer-3) !important;
    margin-right: var(--spacer-3) !important;
  }
  .mx-md-4 {
    margin-left: var(--spacer-4) !important;
    margin-right: var(--spacer-4) !important;
  }
  .mx-md-5 {
    margin-left: var(--spacer-5) !important;
    margin-right: var(--spacer-5) !important;
  }

  .my-md-1 {
    margin-top: var(--spacer-1) !important;
    margin-bottom: var(--spacer-1) !important;
  }
  .my-md-2 {
    margin-top: var(--spacer-2) !important;
    margin-bottom: var(--spacer-2) !important;
  }
  .my-md-3 {
    margin-top: var(--spacer-3) !important;
    margin-bottom: var(--spacer-3) !important;
  }
  .my-md-4 {
    margin-top: var(--spacer-4) !important;
    margin-bottom: var(--spacer-4) !important;
  }
  .my-md-5 {
    margin-top: var(--spacer-5) !important;
    margin-bottom: var(--spacer-5) !important;
  }
}

@media (min-width: 992px) {
  /* lg */
  .m-lg-1 {
    margin: var(--spacer-1) !important;
  }
  .m-lg-2 {
    margin: var(--spacer-2) !important;
  }
  .m-lg-3 {
    margin: var(--spacer-3) !important;
  }
  .m-lg-4 {
    margin: var(--spacer-4) !important;
  }
  .m-lg-5 {
    margin: var(--spacer-5) !important;
  }

  .mt-lg-1 {
    margin-top: var(--spacer-1) !important;
  }
  .mt-lg-2 {
    margin-top: var(--spacer-2) !important;
  }
  .mt-lg-3 {
    margin-top: var(--spacer-3) !important;
  }
  .mt-lg-4 {
    margin-top: var(--spacer-4) !important;
  }
  .mt-lg-5 {
    margin-top: var(--spacer-5) !important;
  }

  .mb-lg-1 {
    margin-bottom: var(--spacer-1) !important;
  }
  .mb-lg-2 {
    margin-bottom: var(--spacer-2) !important;
  }
  .mb-lg-3 {
    margin-bottom: var(--spacer-3) !important;
  }
  .mb-lg-4 {
    margin-bottom: var(--spacer-4) !important;
  }
  .mb-lg-5 {
    margin-bottom: var(--spacer-5) !important;
  }

  .ms-lg-1 {
    margin-left: var(--spacer-1) !important;
  }
  .ms-lg-2 {
    margin-left: var(--spacer-2) !important;
  }
  .ms-lg-3 {
    margin-left: var(--spacer-3) !important;
  }
  .ms-lg-4 {
    margin-left: var(--spacer-4) !important;
  }
  .ms-lg-5 {
    margin-left: var(--spacer-5) !important;
  }

  .me-lg-1 {
    margin-right: var(--spacer-1) !important;
  }
  .me-lg-2 {
    margin-right: var(--spacer-2) !important;
  }
  .me-lg-3 {
    margin-right: var(--spacer-3) !important;
  }
  .me-lg-4 {
    margin-right: var(--spacer-4) !important;
  }
  .me-lg-5 {
    margin-right: var(--spacer-5) !important;
  }

  .mx-lg-1 {
    margin-left: var(--spacer-1) !important;
    margin-right: var(--spacer-1) !important;
  }
  .mx-lg-2 {
    margin-left: var(--spacer-2) !important;
    margin-right: var(--spacer-2) !important;
  }
  .mx-lg-3 {
    margin-left: var(--spacer-3) !important;
    margin-right: var(--spacer-3) !important;
  }
  .mx-lg-4 {
    margin-left: var(--spacer-4) !important;
    margin-right: var(--spacer-4) !important;
  }
  .mx-lg-5 {
    margin-left: var(--spacer-5) !important;
    margin-right: var(--spacer-5) !important;
  }

  .my-lg-1 {
    margin-top: var(--spacer-1) !important;
    margin-bottom: var(--spacer-1) !important;
  }
  .my-lg-2 {
    margin-top: var(--spacer-2) !important;
    margin-bottom: var(--spacer-2) !important;
  }
  .my-lg-3 {
    margin-top: var(--spacer-3) !important;
    margin-bottom: var(--spacer-3) !important;
  }
  .my-lg-4 {
    margin-top: var(--spacer-4) !important;
    margin-bottom: var(--spacer-4) !important;
  }
  .my-lg-5 {
    margin-top: var(--spacer-5) !important;
    margin-bottom: var(--spacer-5) !important;
  }
}

@media (min-width: 1200px) {
  /* xl */
  .m-xl-1 {
    margin: var(--spacer-1) !important;
  }
  .m-xl-2 {
    margin: var(--spacer-2) !important;
  }
  .m-xl-3 {
    margin: var(--spacer-3) !important;
  }
  .m-xl-4 {
    margin: var(--spacer-4) !important;
  }
  .m-xl-5 {
    margin: var(--spacer-5) !important;
  }

  .mt-xl-1 {
    margin-top: var(--spacer-1) !important;
  }
  .mt-xl-2 {
    margin-top: var(--spacer-2) !important;
  }
  .mt-xl-3 {
    margin-top: var(--spacer-3) !important;
  }
  .mt-xl-4 {
    margin-top: var(--spacer-4) !important;
  }
  .mt-xl-5 {
    margin-top: var(--spacer-5) !important;
  }

  .mb-xl-1 {
    margin-bottom: var(--spacer-1) !important;
  }
  .mb-xl-2 {
    margin-bottom: var(--spacer-2) !important;
  }
  .mb-xl-3 {
    margin-bottom: var(--spacer-3) !important;
  }
  .mb-xl-4 {
    margin-bottom: var(--spacer-4) !important;
  }
  .mb-xl-5 {
    margin-bottom: var(--spacer-5) !important;
  }

  .ms-xl-1 {
    margin-left: var(--spacer-1) !important;
  }
  .ms-xl-2 {
    margin-left: var(--spacer-2) !important;
  }
  .ms-xl-3 {
    margin-left: var(--spacer-3) !important;
  }
  .ms-xl-4 {
    margin-left: var(--spacer-4) !important;
  }
  .ms-xl-5 {
    margin-left: var(--spacer-5) !important;
  }

  .me-xl-1 {
    margin-right: var(--spacer-1) !important;
  }
  .me-xl-2 {
    margin-right: var(--spacer-2) !important;
  }
  .me-xl-3 {
    margin-right: var(--spacer-3) !important;
  }
  .me-xl-4 {
    margin-right: var(--spacer-4) !important;
  }
  .me-xl-5 {
    margin-right: var(--spacer-5) !important;
  }

  .mx-xl-1 {
    margin-left: var(--spacer-1) !important;
    margin-right: var(--spacer-1) !important;
  }
  .mx-xl-2 {
    margin-left: var(--spacer-2) !important;
    margin-right: var(--spacer-2) !important;
  }
  .mx-xl-3 {
    margin-left: var(--spacer-3) !important;
    margin-right: var(--spacer-3) !important;
  }
  .mx-xl-4 {
    margin-left: var(--spacer-4) !important;
    margin-right: var(--spacer-4) !important;
  }
  .mx-xl-5 {
    margin-left: var(--spacer-5) !important;
    margin-right: var(--spacer-5) !important;
  }

  .my-xl-1 {
    margin-top: var(--spacer-1) !important;
    margin-bottom: var(--spacer-1) !important;
  }
  .my-xl-2 {
    margin-top: var(--spacer-2) !important;
    margin-bottom: var(--spacer-2) !important;
  }
  .my-xl-3 {
    margin-top: var(--spacer-3) !important;
    margin-bottom: var(--spacer-3) !important;
  }
  .my-xl-4 {
    margin-top: var(--spacer-4) !important;
    margin-bottom: var(--spacer-4) !important;
  }
  .my-xl-5 {
    margin-top: var(--spacer-5) !important;
    margin-bottom: var(--spacer-5) !important;
  }
}

.fs-7 {
  font-size: 0.75rem !important;
}
.fs-8 {
  font-size: 0.65rem !important;
}

#page-topbar[data-bs-theme="light"] {
  background-color: #fff !important;
}
.navbar-menu {
  box-shadow: 1px 1px 1px #0f223a1f;
}

a.nav-link.active {
  font-weight: 800 !important;
}
[data-bs-theme="light"] .nav-link:focus,
[data-bs-theme="light"] .nav-link:hover {
  color: var(--vz-nav-link-hover-color) !important;
}
[data-bs-theme="dark"] .nav-link:focus,
[data-bs-theme="dark"] .nav-link:hover {
  color: #fff !important;
}
[data-bs-theme="dark"] .nav-link:not(.active) {
  color: #fff !important;
}
[data-bs-theme="light"] .nav-link:not(.active) {
  color: var(--vz-heading-color) !important;
}
.col-height-match {
  display: flex;
  flex-direction: column;
}

.col-height-match .card {
  flex: 1;
}
[data-bs-theme="light"] .card {
  box-shadow:
    rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,
    rgba(0, 0, 0, 0.08) 0px 0px 0px 1px !important;
  --vz-card-border-radius: 0.4rem !important;
  overflow: hidden;
}
[data-bs-theme="dark"] .card {
  box-shadow: 0px 0px 0px 1px rgb(56 65 74 / 50%) !important;
}

:root {
  --vz-primary: #2548fa !important;
  --vz-secondary: #00aed6 !important;
  --vz-success: #47a447 !important;
  --vz-danger: #d2322d !important;
  --vz-warning: #ed9c28 !important;

  --vz-primary-bg-subtle: rgba(var(--vz-primary-rgb), 0.15);
  --vz-secondary-bg-subtle: rgba(var(--vz-secondary-rgb), 0.15);
  --vz-success-bg-subtle: rgba(var(--vz-success-rgb), 0.15);
  --vz-danger-bg-subtle: rgba(var(--vz-danger-rgb), 0.15);
  --vz-warning-bg-subtle: rgba(var(--vz-warning-rgb), 0.15);

  --vz-primary-text-emphasis: #1a32af !important;
  --vz-secondary-text-emphasis: #007f9c !important;
  --vz-success-text-emphasis: #2f6f2f !important;
  --vz-warning-text-emphasis: #b07d12 !important;
  --vz-danger-text-emphasis: #a12622 !important;

  --vz-primary-border-subtle: #99c9bf;
  --vz-secondary-border-subtle: #b3e7f3;
  --vz-success-border-subtle: #b3e6b3;
  --vz-warning-border-subtle: #ffd699;
  --vz-danger-border-subtle: #f5b5b2;

  --vz-primary-rgb: 37, 72, 250;
  --vz-secondary-rgb: 0, 174, 214;
  --vz-success-rgb: 71, 164, 71;
  --vz-danger-rgb: 210, 50, 45;
  --vz-warning-rgb: 237, 156, 40;

  --vz-link-color: var(--vz-primary);
  --vz-link-color-rgb: var(--vz-primary-rgb);
  --vz-link-decoration: none;
  --vz-link-hover-color: #1a32af; /* primary lebih gelap */
  --vz-link-hover-color-rgb: 0, 47, 41;

  --vz-primary-hover: #3556fa !important;

  --color-2240321: hsl(0, 70%, 50%); /* red */
  --color-221106508: hsl(30, 70%, 50%); /* orange */
  --color-225073297: hsl(60, 70%, 50%); /* yellow */
  --color-2070946: hsl(90, 70%, 40%); /* green */
  --color-218010441: hsl(120, 70%, 40%); /* green */
  --color-220040338: hsl(150, 70%, 40%); /* teal */
  --color-2230038: hsl(180, 70%, 45%); /* cyan */
  --color-2230033: hsl(200, 70%, 45%); /* turquoise */
  --color-2112403: hsl(280, 70%, 60%); /* purple */
  --color-2250007: hsl(300, 70%, 60%); /* magenta */
  --color-2082208: hsl(330, 70%, 55%); /* pink */
  --color-222053949: hsl(20, 70%, 45%); /* reddish-orange */
  --color-222116621: hsl(50, 70%, 45%); /* mustard */
  --color-217120101: hsl(100, 70%, 40%); /* greenish */
  --color-2230003: hsl(140, 70%, 40%); /* sea green */
  --color-217080431: hsl(160, 70%, 40%); /* aquamarine */
  --color-221129612: hsl(190, 70%, 45%); /* cyan */
  --color-2170145: hsl(260, 70%, 60%); /* violet */
  --color-2140007: hsl(290, 70%, 60%); /* purple-pink */
  --color-2140021: hsl(10, 70%, 45%); /* red-orange */
  --color-225073296: hsl(70, 70%, 45%); /* lime */
  --color-218070448: hsl(110, 70%, 40%); /* jade */
  --color-2070961: hsl(170, 70%, 40%); /* aqua green */
}
.badge {
  font-size: 12px !important;
  line-height: 1 !important;
}
.link-primary {
  color: var(--vz-primary) !important;
}
.link-primary:focus,
.link-primary:hover {
  color: var(--vz-primary-hover) !important;
}
.bg-primary {
  background-color: var(--vz-primary) !important;
}
.bg-danger {
  background-color: var(--vz-danger) !important;
}
.bg-warning {
  background-color: var(--vz-warning) !important;
}
.bg-success {
  background-color: var(--vz-success) !important;
}
.bg-secondary {
  background-color: var(--vz-secondary) !important;
}
.bg-secondary-subtle {
  background-color: var(--vz-secondary-bg-subtle) !important;
}
.btn-gray {
  --vz-btn-bg: #7d8186 !important;
  --vz-btn-border-color: #7d8186 !important;
  --vz-btn-hover-bg: #64696e !important;
  --vz-btn-hover-border-color: #64696e !important;
  --vz-btn-active-bg: #7d8186 !important;
  --vz-btn-active-border-color: #7d8186 !important;
  --vz-btn-disabled-bg: #7d8186 !important;
  --vz-btn-disabled-border-color: #7d8186 !important;
}
.btn-primary {
  --vz-btn-bg: var(--vz-primary);
  --vz-btn-border-color: var(--vz-primary);
  --vz-btn-hover-bg: var(--vz-primary-text-emphasis);
  --vz-btn-hover-border-color: var(--vz-primary-text-emphasis);
  --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb);
  --vz-btn-active-bg: var(--vz-primary-text-emphasis);
  --vz-btn-active-border-color: var(--vz-primary-text-emphasis);
  --vz-btn-disabled-bg: var(--vz-primary);
  --vz-btn-disabled-border-color: var(--vz-primary);
}
.btn-soft-primary {
  --vz-btn-color: var(--vz-primary);
  --vz-btn-bg: var(--vz-primary-bg-subtle);
  --vz-btn-border-color: transparent;
  --vz-btn-hover-bg: var(--vz-primary);
  --vz-btn-hover-border-color: transparent;
  --vz-btn-focus-shadow-rgb: var(--vz-primary-rgb);
  --vz-btn-active-bg: var(--vz-primary);
  --vz-btn-active-border-color: transparent;
}
.btn-secondary {
  --vz-btn-bg: var(--vz-secondary);
  --vz-btn-border-color: var(--vz-secondary);
  --vz-btn-hover-bg: var(--vz-secondary-text-emphasis);
  --vz-btn-hover-border-color: var(--vz-secondary-text-emphasis);
  --vz-btn-focus-shadow-rgb: var(--vz-secondary-rgb);
  --vz-btn-active-bg: var(--vz-secondary-text-emphasis);
  --vz-btn-active-border-color: var(--vz-secondary-text-emphasis);
  --vz-btn-disabled-bg: var(--vz-secondary);
  --vz-btn-disabled-border-color: var(--vz-secondary);
}
.btn-soft-secondary {
  --vz-btn-color: var(--vz-secondary);
  --vz-btn-bg: var(--vz-secondary-bg-subtle);
  --vz-btn-border-color: transparent;
  --vz-btn-hover-bg: var(--vz-secondary);
  --vz-btn-hover-border-color: transparent;
  --vz-btn-focus-shadow-rgb: var(--vz-secondary-rgb);
  --vz-btn-active-bg: var(--vz-secondary);
  --vz-btn-active-border-color: transparent;
}
.btn-success {
  --vz-btn-bg: var(--vz-success);
  --vz-btn-border-color: var(--vz-success);
  --vz-btn-hover-bg: var(--vz-success-text-emphasis);
  --vz-btn-hover-border-color: var(--vz-success-text-emphasis);
  --vz-btn-focus-shadow-rgb: var(--vz-success-rgb);
  --vz-btn-active-bg: var(--vz-success-text-emphasis);
  --vz-btn-active-border-color: var(--vz-success-text-emphasis);
  --vz-btn-disabled-bg: var(--vz-success);
  --vz-btn-disabled-border-color: var(--vz-success);
}
.btn-soft-success {
  --vz-btn-color: var(--vz-success);
  --vz-btn-bg: var(--vz-success-bg-subtle);
  --vz-btn-border-color: transparent;
  --vz-btn-hover-bg: var(--vz-success);
  --vz-btn-hover-border-color: transparent;
  --vz-btn-focus-shadow-rgb: var(--vz-success-rgb);
  --vz-btn-active-bg: var(--vz-success);
  --vz-btn-active-border-color: transparent;
}
.btn-danger {
  --vz-btn-bg: var(--vz-danger);
  --vz-btn-border-color: var(--vz-danger);
  --vz-btn-hover-bg: var(--vz-danger-text-emphasis);
  --vz-btn-hover-border-color: var(--vz-danger-text-emphasis);
  --vz-btn-focus-shadow-rgb: var(--vz-danger-rgb);
  --vz-btn-active-bg: var(--vz-danger-text-emphasis);
  --vz-btn-active-border-color: var(--vz-danger-text-emphasis);
  --vz-btn-disabled-bg: var(--vz-danger);
  --vz-btn-disabled-border-color: var(--vz-danger);
}
.btn-soft-danger {
  --vz-btn-color: var(--vz-danger);
  --vz-btn-bg: var(--vz-danger-bg-subtle);
  --vz-btn-border-color: transparent;
  --vz-btn-hover-bg: var(--vz-danger);
  --vz-btn-hover-border-color: transparent;
  --vz-btn-focus-shadow-rgb: var(--vz-danger-rgb);
  --vz-btn-active-bg: var(--vz-danger);
  --vz-btn-active-border-color: transparent;
}
.btn-warning {
  --vz-btn-bg: var(--vz-warning);
  --vz-btn-border-color: var(--vz-warning);
  --vz-btn-hover-bg: var(--vz-warning-text-emphasis);
  --vz-btn-hover-border-color: var(--vz-warning-text-emphasis);
  --vz-btn-focus-shadow-rgb: var(--vz-warning-rgb);
  --vz-btn-active-bg: var(--vz-warning-text-emphasis);
  --vz-btn-active-border-color: var(--vz-warning-text-emphasis);
  --vz-btn-disabled-bg: var(--vz-warning);
  --vz-btn-disabled-border-color: var(--vz-warning);
}
.btn-soft-warning {
  --vz-btn-color: var(--vz-warning);
  --vz-btn-bg: var(--vz-warning-bg-subtle);
  --vz-btn-border-color: transparent;
  --vz-btn-hover-bg: var(--vz-warning);
  --vz-btn-hover-border-color: transparent;
  --vz-btn-focus-shadow-rgb: var(--vz-warning-rgb);
  --vz-btn-active-bg: var(--vz-warning);
  --vz-btn-active-border-color: transparent;
}

.card-primary {
  background-color: var(--vz-primary) !important;
  color: #fff !important;
}
.card-secondary {
  background-color: var(--vz-secondary) !important;
  color: #fff !important;
}
.card-success {
  background-color: var(--vz-success) !important;
  color: #fff !important;
}
.card-danger {
  background-color: var(--vz-danger) !important;
  color: #fff !important;
}
.card-warning {
  background-color: var(--vz-warning) !important;
  color: #fff !important;
}
.choices__list--multiple .choices__item {
  background-color: var(--vz-primary) !important;
  border: 1px solid var(--vz-primary) !important;
}
.active > .page-link,
.page-link.active {
  color: var(--vz-pagination-active-color);
  background-color: var(--vz-primary) !important;
  border-color: var(--vz-primary) !important;
}

[data-bs-theme="light"][data-sidebar="blue"] .navbar-header {
  background: #fff;
}
[data-bs-theme="dark"][data-sidebar="dark"] .navbar-header {
  background: #292e32;
}
[data-bs-theme="light"][data-sidebar="blue"] {
  --vz-body-bg: #fbfaf8 !important;
  --vz-topbar-user-bg: #fff !important;
  --vz-topbar-search-bg: #fbfaf8 !important;
  --vz-heading-color: #313131 !important;
  --vz-body-color: #414141 !important;
  --vz-secondary-color: #414141 !important;
  --vz-header-item-sub-color: #414141 !important;
}
[data-bs-theme="dark"][data-sidebar="dark"] {
  --vz-topbar-user-bg: #292e32 !important;
}
[data-bs-theme="light"][data-sidebar="blue"] .card {
  --vz-card-cap-bg: #fff !important;
  --vz-card-bg: #fff !important;
}
[data-bs-theme="dark"][data-sidebar="dark"] {
  --vz-heading-color: #cecece !important;
}
:root[data-layout="twocolumn"][data-sidebar="blue"][data-bs-theme="light"] {
  /* --vz-vertical-menu-bg: linear-gradient(to bottom, #FBFAF8, #2279f21c,#c061ff13,#FBFAF8);
    --vz-vertical-menu-border: linear-gradient(to bottom, #FBFAF8, #2279f21c,#c061ff13,#FBFAF8); */
  --vz-vertical-menu-bg: #fff !important;
  --vz-vertical-menu-border: #fff !important;
  --vz-twocolumn-menu-iconview-bg: #313131;
  --vz-vertical-menu-iconview-bg: #313131;
}
:root[data-layout="twocolumn"][data-bs-theme="light"][data-sidebar="blue"] {
  --vz-vertical-menu-item-color: #fff;
  --vz-vertical-menu-item-hover-color: #252525;
  --vz-vertical-menu-item-active-color: #252525;
  --vz-vertical-menu-sub-item-color: #313131;
  --vz-vertical-menu-sub-item-hover-color: #252525;
  --vz-vertical-menu-sub-item-active-color: #252525;
  --vz-vertical-menu-title-color: #313131;
  --vz-vertical-menu-box-shadow: 0 2px 4px rgba(15, 34, 58, 0.12);
  --vz-vertical-menu-dropdown-box-shadow: 0 2px 4px rgba(15, 34, 58, 0.12);
}
:root[data-layout="vertical"][data-bs-theme="light"][data-sidebar="blue"] {
  --vz-vertical-menu-item-color: #fff;
  --vz-vertical-menu-item-hover-color: #252525;
  --vz-vertical-menu-item-active-color: #252525;
  --vz-vertical-menu-sub-item-color: #313131;
  --vz-vertical-menu-sub-item-hover-color: #252525;
  --vz-vertical-menu-sub-item-active-color: #252525;
  --vz-vertical-menu-title-color: #313131;
  --vz-vertical-menu-box-shadow: 0 2px 4px rgba(15, 34, 58, 0.12);
  --vz-vertical-menu-dropdown-box-shadow: 0 2px 4px rgba(15, 34, 58, 0.12);
}
[data-layout="twocolumn"][data-bs-theme="dark"][data-sidebar="dark"] {
  --vz-vertical-menu-bg: #272b30;
  --vz-vertical-menu-border: #272b30;
  --vz-vertical-menu-item-color: #b3b3b3;
  --vz-vertical-menu-item-bg: rgba(255, 255, 255, 0.15);
  --vz-vertical-menu-item-hover-color: #fff;
  --vz-vertical-menu-item-active-color: #fff;
  --vz-vertical-menu-item-active-bg: rgba(255, 255, 255, 0.15);
  --vz-vertical-menu-sub-item-color: #b3b3b3;
  --vz-vertical-menu-sub-item-hover-color: #fff;
  --vz-vertical-menu-sub-item-active-color: #fff;
  --vz-vertical-menu-title-color: #5f6270;
  --vz-twocolumn-menu-iconview-bg: #272b30;
  --vz-vertical-menu-iconview-bg: #272b30;
}
[data-layout="vertical"][data-bs-theme="dark"][data-sidebar="dark"] {
  --vz-vertical-menu-bg: #272b30;
  --vz-vertical-menu-border: #272b30;
  --vz-vertical-menu-item-color: #b3b3b3;
  --vz-vertical-menu-item-bg: rgba(255, 255, 255, 0.15);
  --vz-vertical-menu-item-hover-color: #fff;
  --vz-vertical-menu-item-active-color: #fff;
  --vz-vertical-menu-item-active-bg: rgba(255, 255, 255, 0.15);
  --vz-vertical-menu-sub-item-color: #b3b3b3;
  --vz-vertical-menu-sub-item-hover-color: #fff;
  --vz-vertical-menu-sub-item-active-color: #fff;
  --vz-vertical-menu-title-color: #5f6270;
  --vz-twocolumn-menu-iconview-bg: #272b30;
  --vz-vertical-menu-iconview-bg: #272b30;
}
.badge-label.bg-primary:before {
  border-left-color: var(--vz-primary);
}

.badge-label.bg-secondary:before {
  border-left-color: var(--vz-secondary);
}

.badge-label.bg-success:before {
  border-left-color: var(--vz-success);
}

.badge-label.bg-danger:before {
  border-left-color: var(--vz-danger);
}
.badge-label.bg-warning:before {
  border-left-color: var(--vz-warning);
}

[data-layout="twocolumn"][data-sidebar="blue"][data-bs-theme="light"]
  .twocolumn-iconview,
[data-layout="vertical"][data-sidebar="blue"][data-bs-theme="light"]
  .twocolumn-iconview {
  background: #2548fa !important;
}
[data-layout="twocolumn"][data-sidebar="blue"][data-bs-theme="light"]
  .twocolumn-iconview
  .nav-icon.active,
[data-layout="vertical"][data-sidebar="blue"][data-bs-theme="light"]
  .twocolumn-iconview
  .nav-icon.active {
  background-color: #fff !important;
  box-shadow:
    rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,
    rgba(0, 0, 0, 0.08) 0px 0px 0px 1px !important;
  color: #2548fa !important;
}
[data-layout="twocolumn"][data-sidebar="dark"][data-bs-theme="dark"]
  .twocolumn-iconview
  .nav-icon.active,
[data-layout="vertical"][data-sidebar="dark"][data-bs-theme="dark"]
  .twocolumn-iconview
  .nav-icon.active {
  background-color: #2548fa !important;
  box-shadow:
    rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,
    rgba(0, 0, 0, 0.08) 0px 0px 0px 1px !important;
  color: #fff !important;
}
[data-bs-theme="light"] .nav-link.active {
  color: var(--vz-primary) !important;
  border-top-color: var(--vz-primary) !important;
}
[data-bs-theme="dark"] .nav-link.active {
  color: #fff !important;
  border-top-color: var(--vz-primary) !important;
}
.datepicker table tr td span.active,
.datepicker table tr td span:hover,
.datepicker table tr td span.focused {
  background-image: linear-gradient(to bottom, #2548fa, #2548fa) !important;
  color: #fff !important;
}
/* [data-bs-theme=light] .flatpickr-months .flatpickr-next-month svg path,
[data-bs-theme=light] .flatpickr-months .flatpickr-prev-month svg path {
    fill : #414141 !important;
} */
/* STYLING SCROLLBAR */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background-color: #ececec;
}
::-webkit-scrollbar-thumb {
  background-color: #0040ae5d;
  border-radius: 0.5rem;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #2548fa;
}

.card.card-dashboard-info {
  min-height: 85px;
  margin-bottom: 0.75rem !important;
}
[data-bs-theme="light"] .card {
  margin-bottom: 0.75rem;
  background-color: #fff !important;
}
[data-bs-theme="dark"] .card {
  margin-bottom: 0.75rem;
}
.table-sm > :not(caption) > * > * {
  padding: 0.17rem 0.5rem;
}
[data-bs-theme="light"] .table-light {
  --vz-table-bg: #e2ebfb !important;
  --vz-table-border-color: #e2ebfb !important;
}
.btn-soft-primary {
  --vz-primary-bg-subtle: #e2ebfb !important;
}
[data-bs-theme="light"] .form-control:disabled {
  background-color: #f5f5f5 !important;
}
[data-bs-theme="dark"] .form-control:disabled {
  background-color: #2f343a !important;
}

html .mb-3 {
  margin-bottom: 0.75rem !important;
}
.g-3,
.gx-3 {
  --vz-gutter-x: 0.75rem !important;
}
.flatpickr-months {
  background-color: #2548fa !important;
}
.flatpickr-calendar {
  line-height: 14px !important;
}
.flatpickr-monthSelect-month.selected,
.flatpickr-monthSelect-month.startRange,
.flatpickr-monthSelect-month.endRange {
  background-color: #2548fa !important;
  border-color: #2548fa !important;
}
.flatpickr-day.endRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.endRange.nextMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.endRange:focus,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected,
.flatpickr-day.selected.inRange,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.selected:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.startRange:focus,
.flatpickr-day.startRange:hover {
  background: #2548fa !important;
  border-color: #2548fa !important;
}
.flatpickr-weekdays {
  background-color: #2548fa !important;
}
span.flatpickr-weekday {
  background: #2548fa !important;
}
.flatpickr-day.today:focus,
.flatpickr-day.today:hover {
  background-color: #e2ebfb !important;
  border-color: #2548fa !important;
}
.p-3 {
  padding: 0.75rem !important;
}
.pt-0 {
  padding-top: 0 !important;
}
.pros-title {
  font-size: 1rem !important;
}
[data-bs-theme="dark"] .flatpickr-monthSelect-month {
  color: #ced4da !important;
}
[data-bs-theme="dark"] .flatpickr-monthSelect-month.inRange,
[data-bs-theme="dark"] .flatpickr-monthSelect-month.inRange.today,
[data-bs-theme="dark"] .flatpickr-monthSelect-month:hover,
[data-bs-theme="dark"] .flatpickr-monthSelect-month:focus {
  background-color: #272b30 !important;
  border: #272b30 !important;
}
.navbar-menu .navbar-nav .nav-sm .nav-link {
  padding: 0.3rem 1.5rem !important ;
}
footer.footer {
  padding: 0.3rem 1.5rem !important ;
  align-content: center !important;
  height: 40px !important;
}
.page-content {
  padding: calc(70px + 1.5rem) calc(1.5rem * 0.5) 40px calc(1.5rem * 0.5) !important;
}
.select2-container--default
  .select2-selection--multiple
  .select2-selection__choice__remove {
  position: relative !important;
}
.navbar-menu .navbar-nav .nav-sm .nav-sm .nav-link:before {
  top: 12px !important;
}
.navbar-menu .navbar-nav .nav-sm .nav-link:before {
  top: 14px !important;
}
html[data-layout="vertical"][data-bs-theme="light"] .nav-link {
  color: #252525 !important;
}
.border-primary {
  border-color: #2548fa !important;
}
[data-bs-theme="dark"] .text-data {
  color: white !important;
}
/* [data-bs-theme="light"] .card-header.signal-factory {
    border-color: #d5d5d5 !important;
} */
[data-bs-theme="light"] .progress.bg-dark-subtle {
  background-color: #d5d5d5 !important;
}
/* TOASTR */
.toast-error {
  background-color: #d2322d !important;
}
#toast-container > div {
  opacity: 1 !important;
  border-radius: 0.5rem !important;
  margin: 6px 0 6px !important;
}
.page-title-box {
  z-index: 1000;
  position: relative;
}
.flatpickr-day.today:focus,
.flatpickr-day.today:hover {
  background-color: #3d78e3 !important;
  border-color: #3d78e3 !important;
}
@media (min-width: 1200px) and (max-width: 1600px) {
  .fs-3 {
    font-size: 1.3rem !important;
  }
  .fs-4 {
    font-size: 1.15rem !important;
  }
}
body > .skiptranslate,
.goog-logo-link,
.gskiptranslate,
.goog-te-gadget span,
.goog-te-banner-frame,
#goog-gt-tt,
.goog-te-balloon-frame,
div#goog-gt-tt {
  display: none !important;
}

.goog-te-gadget {
  color: transparent !important;
  font-size: 0px;
}

.goog-text-highlight {
  background: transparent !important;
  box-shadow: transparent !important;
}

#google_translate_element select {
  background: #2b1a12;
  color: #fff4e4;
  border: none;
  font-weight: bold;
  border-radius: 3px;
  padding: 8px 12px;
}
@media (max-width: 1180px) {
  @keyframes marquee-scroll {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(-100%);
    }
  }

  .marquee-sm {
    overflow: hidden;
    white-space: nowrap;
    max-width: 100%;
  }

  .marquee-sm .marquee-inner {
    display: inline-block;
    padding-left: 30%;
    padding-right: 30%;
    white-space: nowrap;
    animation: marquee-scroll 8s linear infinite;
  }

  @media (min-width: 1200px) {
    .marquee-sm .marquee-inner {
      animation: none !important;
      padding-left: 0;
      transform: none;
    }
  }
}
/*      CUSTOM ICON SIDEBAR       */
.navbar-menu .navbar-nav .nav-sm > .nav-item > .nav-link:before {
  height: 2px;
}
[data-bs-theme="light"]
  .navbar-menu
  .navbar-nav
  .nav-sm
  .nav-item
  .nav-sm
  > .nav-item
  > .nav-link:before {
  width: 6px;
  height: 6px;
  background: #252525;
}
[data-bs-theme="dark"]
  .navbar-menu
  .navbar-nav
  .nav-sm
  .nav-item
  .nav-sm
  > .nav-item
  > .nav-link:before {
  width: 6px;
  height: 6px;
  background: #b3b3b3;
}
[data-bs-theme="light"]
  .navbar-menu
  .navbar-nav
  .nav-sm
  .nav-item
  .nav-sm
  .nav-item
  .nav-sm
  > .nav-item
  > .nav-link:before {
  width: 6px;
  height: 6px;
  background: #92929200;
}
[data-bs-theme="dark"]
  .navbar-menu
  .navbar-nav
  .nav-sm
  .nav-item
  .nav-sm
  .nav-item
  .nav-sm
  > .nav-item
  > .nav-link:before {
  width: 6px;
  height: 6px;
  background: #cdcdcd71;
}
[data-bs-theme="light"]
  .navbar-menu
  .navbar-nav
  .nav-sm
  .nav-item
  .nav-sm
  .nav-item
  .nav-sm
  .nav-item
  .nav-sm
  > .nav-item
  > .nav-link:before {
  width: 4px;
  height: 4px;
  background: #92929200;
}
[data-bs-theme="dark"]
  .navbar-menu
  .navbar-nav
  .nav-sm
  .nav-item
  .nav-sm
  .nav-item
  .nav-sm
  .nav-item
  .nav-sm
  > .nav-item
  > .nav-link:before {
  width: 4px;
  height: 4px;
  background: #e7e7e700;
}

div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) {
  background-color: #2548fa !important;
  font-size: 14px !important;
}
:is(.btn-primary, .btn-outline-primary, .btn-soft-primary).btn-border {
  border-bottom: 2px solid var(--vz-primary) !important;
}
:is(.btn-secondary, .btn-outline-secondary, .btn-soft-secondary).btn-border {
  border-bottom: 2px solid var(--vz-secondary) !important;
}
:is(.btn-success, .btn-outline-success, .btn-soft-success).btn-border {
  border-bottom: 2px solid var(--vz-success) !important;
}
:is(.btn-danger, .btn-outline-danger, .btn-soft-danger).btn-border {
  border-bottom: 2px solid var(--vz-danger) !important;
}
:is(.btn-warning, .btn-outline-warning, .btn-soft-warning).btn-border {
  border-bottom: 2px solid var(--vz-warning) !important;
}
.card-border-primary {
  border-color: var(--vz-primary) !important;
}
.card-border-secondary {
  border-color: var(--vz-secondary) !important;
}
.card-border-success {
  border-color: var(--vz-success) !important;
}
.card-border-danger {
  border-color: var(--vz-danger) !important;
}
.card-border-warning {
  border-color: var(--vz-warning) !important;
}
.card-border-primary .card-footer,
.card-border-primary .card-header {
  border-color: var(--vz-primary-bg-subtle) !important;
}
.card-border-secondary .card-footer,
.card-border-secondary .card-header {
  border-color: var(--vz-secondary-bg-subtle) !important;
}
.card-border-success .card-footer,
.card-border-success .card-header {
  border-color: var(--vz-success-bg-subtle) !important;
}
.card-border-danger .card-footer,
.card-border-danger .card-header {
  border-color: var(--vz-danger-bg-subtle) !important;
}
.card-border-warning .card-footer,
.card-border-warning .card-header {
  border-color: var(--vz-warning-bg-subtle) !important;
}
[data-bs-theme="dark"] .btn-outline-primary {
  color: #fff;
}

[data-bs-theme="dark"] .btn-outline-secondary {
  color: #fff;
}

[data-bs-theme="dark"] .btn-outline-success {
  color: #fff;
}

[data-bs-theme="dark"] .btn-outline-warning {
  color: #fff;
}

[data-bs-theme="dark"] .btn-outline-danger {
  color: #fff;
}
@media (min-width: 577px) {
  #btn-toggle-backhome {
    display: none !important;
  }
}
@media (max-width: 576px) {
  .navbar-header {
    background: #2548fa !important;
  }

  #btn-toggle-theme,
  #langDropdown,
  #btn-toggle-backhome {
    color: #ffffff !important;
  }

  #topnav-hamburger-icon .hamburger-icon span {
    background-color: #ffffff !important;
  }
}