@import"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap";
@import"https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap";

.bg-orange-subtle {
	background-color: var(--dx-orange-bg-subtle) !important
}

.border-orange-subtle {
	border-color: var(--dx-orange-border-subtle) !important
}

.text-orange-emphasis {
	color: var(--dx-orange-text-emphasis) !important
}

.bg-indigo-subtle {
	background-color: var(--dx-indigo-bg-subtle) !important
}

.border-indigo-subtle {
	border-color: var(--dx-indigo-border-subtle) !important
}

.text-indigo-emphasis {
	color: var(--dx-indigo-text-emphasis) !important
}

.bg-pink-subtle {
	background-color: var(--dx-pink-bg-subtle) !important
}

.border-pink-subtle {
	border-color: var(--dx-pink-border-subtle) !important
}

.text-pink-emphasis {
	color: var(--dx-pink-text-emphasis) !important
}

:root {
	--dx-indigo-text-emphasis: #a657e5;
	--dx-pink-text-emphasis: #ec5680;
	--dx-orange-text-emphasis: #f28100;
	--dx-indigo-bg-subtle: rgba(var(--dx-indigo-rgb), .15);
	--dx-pink-bg-subtle: rgba(var(--dx-pink-rgb), .15);
	--dx-orange-bg-subtle: rgba(var(--dx-orange-rgb), .15);
	--dx-indigo-border-subtle: rgba(var(--dx-indigo-rgb), .3);
	--dx-pink-border-subtle: rgba(var(--dx-pink-rgb), .3);
	--dx-orange-border-subtle: rgba(var(--dx-orange-rgb), .3);
	--dx-link-color: var(--dx-primary);
	--dx-link-color-rgb: var(--dx-primary-rgb);
	--dx-link-hover-color: var(--dx-primary);
	--dx-link-hover-color-rgb: var(--dx-primary-rgb);
	--dx-primary-text-emphasis: color-mix(in srgb, var(--dx-primary) 75%, black 25%);
	--dx-primary-bg-subtle: color-mix(in srgb, var(--dx-primary) 10%, transparent);
	--dx-primary-border-subtle: color-mix(in srgb, var(--dx-primary) 30%, transparent);
	--dx-sidebar: 15.5rem;
	--dx-sidebar-md: 10rem;
	--dx-sidebar-sm: 4.6875rem;
	--dx-sidebar-padding-y: .625rem;
	--dx-sidebar-padding-x: 1rem;
	--dx-sidebar-font-size: 15px;
	--dx-topbar: 4.6875rem;
	--dx-topbar-bg: var(--dx-secondary-bg);
	--dx-semibox-width: .75rem
}

:root[data-colors=blue] {
	--dx-primary: #2563eb;
	--dx-primary-rgb: 37, 99, 235
}

:root[data-colors=purple] {
	--dx-primary: #bd38c9;
	--dx-primary-rgb: 189, 56, 201
}

:root[data-colors=cyan] {
	--dx-primary: #13a5c9;
	--dx-primary-rgb: 19, 165, 201
}

:root[data-colors=orange] {
	--dx-primary: #f1893d;
	--dx-primary-rgb: 241, 137, 61
}

:root[data-colors=crimson] {
	--dx-primary: #ea3939;
	--dx-primary-rgb: 234, 57, 57
}

:root[data-colors=emerald] {
	--dx-primary: #20c08e;
	--dx-primary-rgb: 32, 192, 142
}

:root[data-colors=gold] {
	--dx-primary: #ca8a04;
	--dx-primary-rgb: 202, 138, 4
}

:root[data-sidebar-colors=dark] {
	--dx-sidebar-bg: #1b1e1d
}

:root[data-sidebar-colors=green] {
	--dx-sidebar-bg: #146c43
}

:root[data-sidebar-colors=blue] {
	--dx-sidebar-bg: #425089
}

:root[data-sidebar-colors=purple] {
	--dx-sidebar-bg: #83327a
}

:root[data-sidebar-colors=light] {
	--dx-sidebar-bg: #eff1f6;
	--dx-sidebar-border: #e5e7eb;
	--dx-sidebar-menu-title: var(--dx-secondary-color);
	--dx-sidebar-link-color: var(--dx-secondary-color);
	--dx-sidebar-dropdown-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);
	--dx-sidebar-link-hover-color: var(--dx-primary);
	--dx-sidebar-link-bg-hover-color: sidebar-link-bg-hover-color;
	--dx-sidebar-link-active-color: var(--dx-primary);
	--dx-sidebar-link-bg-active-color: sidebar-link-bg-hover-color;
	--dx-sidebar-link-sub-color: var(--dx-secondary-color);
	--dx-sidebar-link-sub-hover-color: var(--dx-primary);
	--dx-sidebar-link-sub-active-color: var(--dx-primary);
	--dx-sidebar-link-sub-effect-color: sidebar-link-sub-effect-color
}

:root:is([data-sidebar-colors=dark], [data-sidebar-colors=green], [data-sidebar-colors=blue], [data-sidebar-colors=purple]) {
	--dx-sidebar-border: var(--dx-sidebar-bg);
	--dx-sidebar-menu-title: color-mix(in srgb, var(--dx-sidebar-bg) 100%, white 95%);
	--dx-sidebar-link-color: color-mix(in srgb, var(--dx-sidebar-bg) 100%, white 95%);
	--dx-sidebar-dropdown-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);
	--dx-sidebar-link-hover-color: white;
	--dx-sidebar-link-bg-hover-color: color-mix(in srgb, var(--dx-sidebar-bg) 100%, white 5%);
	--dx-sidebar-link-active-color: white;
	--dx-sidebar-link-bg-active-color: color-mix(in srgb, var(--dx-sidebar-bg) 100%, white 5%);
	--dx-sidebar-link-sub-color: color-mix(in srgb, var(--dx-sidebar-bg) 100%, white 95%);
	--dx-sidebar-link-sub-hover-color: white;
	--dx-sidebar-link-sub-active-color: white;
	--dx-sidebar-link-sub-effect-color: color-mix(in srgb, var(--dx-sidebar-bg) 100%, white 3.5%)
}

:root:is([data-sidebar-colors=dark], [data-sidebar-colors=green], [data-sidebar-colors=blue], [data-sidebar-colors=purple]) .simplebar-scrollbar:before {
	background-color: color-mix(in srgb, var(--dx-sidebar-bg) 100%, white 80%) !important
}

:root {
	--dx-topbar-bg: var(--dx-secondary-bg);
	--dx-topbar-border: var(--dx-border-color);
	--dx-topbar-color: var(--dx-secondary-color);
	--dx-topbar-hover-color: var(--dx-primary)
}

:root[data-topbar-colors=dark] {
	--dx-topbar-bg: #282e2c;
	--dx-topbar-border: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 10%);
	--dx-topbar-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 50%);
	--dx-topbar-hover-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 100%)
}

:root[data-topbar-colors=green] {
	--dx-topbar-bg: #146c43;
	--dx-topbar-border: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 10%);
	--dx-topbar-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 50%);
	--dx-topbar-hover-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 100%)
}

:root[data-topbar-colors=blue] {
	--dx-topbar-bg: #425089;
	--dx-topbar-border: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 10%);
	--dx-topbar-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 50%);
	--dx-topbar-hover-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 100%)
}

:root[data-topbar-colors=purple] {
	--dx-topbar-bg: #83327a;
	--dx-topbar-border: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 10%);
	--dx-topbar-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 50%);
	--dx-topbar-hover-color: color-mix(in srgb, var(--dx-topbar-bg) 100%, white 100%)
}

:root[data-bs-theme=dark] {
	--dx-indigo-text-emphasis: #a657e5;
	--dx-pink-text-emphasis: #ec5680;
	--dx-orange-text-emphasis: #f28100;
	--dx-indigo-bg-subtle: rgba(var(--dx-indigo-rgb), .15);
	--dx-pink-bg-subtle: rgba(var(--dx-pink-rgb), .15);
	--dx-orange-bg-subtle: rgba(var(--dx-orange-rgb), .15);
	--dx-indigo-border-subtle: rgba(var(--dx-indigo-rgb), .3);
	--dx-pink-border-subtle: rgba(var(--dx-pink-rgb), .3);
	--dx-orange-border-subtle: rgba(var(--dx-orange-rgb), .3);
	--dx-light: #252928;
	--dx-light-rgb: 37, 41, 40;
	--dx-box-shadow: 0 3px 11px -3px #161816, 0 0 12px -4px #1f2322;
	--dx-dark: #414948;
	--dx-btn-close-filter: none
}

:root[data-bs-theme=dark] .btn-dark {
	--dx-btn-hover-bg: color-mix(in srgb, var(--dx-dark) 80%, black 15%);
	--dx-btn-hover-border-color: color-mix(in srgb, var(--dx-dark) 80%, black 15%);
	--dx-btn-active-bg: color-mix(in srgb, var(--dx-dark) 80%, black 15%);
	--dx-btn-active-border-color: color-mix(in srgb, var(--dx-dark) 80%, black 15%)
}

:root[data-bs-theme=dark] .modal {
	--dx-modal-box-shadow: 0 3px 11px -3px #161816, 0 0 12px -4px #1f2322;
	--dx-modal-border-color: var(--dx-border-color)
}

:root[data-bs-theme=dark] .offcanvas {
	--dx-offcanvas-box-shadow: 0 3px 11px -3px #161816, 0 0 12px -4px #1f2322;
	--dx-offcanvas-border-color: var(--dx-border-color)
}

:root[data-bs-theme=dark] .dropdown-menu {
	--dx-dropdown-border-width: 1px;
	--dx-dropdown-box-shadow: 0 3px 11px -3px #161816, 0 0 12px -4px #1f2322
}

.font-base {
	font-family: Inter, sans-serif
}

.cursor-pointer {
	cursor: pointer
}

.top-24 {
	top: 6rem
}

h6 {
	line-height: 1.5
}

.modal .btn-close,
.offcanvas .btn-close {
	padding: 0 !important;
	margin-right: calc(-.1 * var(--dx-modal-header-padding-x));
	height: 25px;
	width: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--dx-border-color);
	border-radius: 50rem
}

.modal .btn-close:after,
.offcanvas .btn-close:after {
	font-size: 17px !important
}

.logos .logo-light {
	display: none
}

.logos .logo-dark,
[data-bs-theme=dark] .logos .logo-light {
	display: inline-block
}

[data-bs-theme=dark] .logos .logo-dark {
	display: none
}

.custom-container {
	max-width: 1350px
}

.opacity-10 {
	opacity: .1
}

.profile-active {
	position: relative;
	display: inline-block
}

.profile-active .dot {
	position: absolute;
	border: 2px solid var(--dx-secondary-bg);
	border-radius: 50rem;
	right: 5px;
	bottom: 5px
}

.modal-gradient-bg {
	background: linear-gradient(to right, rgba(var(--dx-info-rgb), .2), rgba(var(--dx-pink-rgb), .2), rgba(var(--dx-success-rgb), .2))
}

.modal-backdrop,
.offcanvas-backdrop {
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px)
}

.jvm-tooltip {
	display: none
}

.accordion-primary,
.accordion-primary.accordion-boxed {
	--dx-accordion-active-color: var(--dx-primary);
	--dx-accordion-active-bg: var(--dx-primary-bg-subtle)
}

.accordion-primary.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-primary-border-subtle)
}

.accordion-solid-primary {
	--dx-accordion-active-bg: var(--dx-primary);
	--dx-accordion-active-color: #fff
}

.accordion-solid-primary [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-primary)
}

.accordion-secondary,
.accordion-secondary.accordion-boxed {
	--dx-accordion-active-color: var(--dx-secondary);
	--dx-accordion-active-bg: var(--dx-secondary-bg-subtle)
}

.accordion-secondary.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-secondary-border-subtle)
}

.accordion-solid-secondary {
	--dx-accordion-active-bg: var(--dx-secondary);
	--dx-accordion-active-color: #fff
}

.accordion-solid-secondary [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-secondary)
}

.accordion-success,
.accordion-success.accordion-boxed {
	--dx-accordion-active-color: var(--dx-success);
	--dx-accordion-active-bg: var(--dx-success-bg-subtle)
}

.accordion-success.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-success-border-subtle)
}

.accordion-solid-success {
	--dx-accordion-active-bg: var(--dx-success);
	--dx-accordion-active-color: #fff
}

.accordion-solid-success [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-success)
}

.accordion-info,
.accordion-info.accordion-boxed {
	--dx-accordion-active-color: var(--dx-info);
	--dx-accordion-active-bg: var(--dx-info-bg-subtle)
}

.accordion-info.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-info-border-subtle)
}

.accordion-solid-info {
	--dx-accordion-active-bg: var(--dx-info);
	--dx-accordion-active-color: #fff
}

.accordion-solid-info [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-info)
}

.accordion-warning,
.accordion-warning.accordion-boxed {
	--dx-accordion-active-color: var(--dx-warning);
	--dx-accordion-active-bg: var(--dx-warning-bg-subtle)
}

.accordion-warning.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-warning-border-subtle)
}

.accordion-solid-warning {
	--dx-accordion-active-bg: var(--dx-warning);
	--dx-accordion-active-color: #fff
}

.accordion-solid-warning [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-warning)
}

.accordion-danger,
.accordion-danger.accordion-boxed {
	--dx-accordion-active-color: var(--dx-danger);
	--dx-accordion-active-bg: var(--dx-danger-bg-subtle)
}

.accordion-danger.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-danger-border-subtle)
}

.accordion-solid-danger {
	--dx-accordion-active-bg: var(--dx-danger);
	--dx-accordion-active-color: #fff
}

.accordion-solid-danger [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-danger)
}

.accordion-light,
.accordion-light.accordion-boxed {
	--dx-accordion-active-color: var(--dx-secondary-color);
	--dx-accordion-active-bg: var(--dx-light)
}

.accordion-light.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-border-color)
}

.accordion-solid-light {
	--dx-accordion-active-bg: var(--dx-light);
	--dx-accordion-active-color: #0e0f0f
}

.accordion-solid-light [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-light)
}

.accordion-dark,
.accordion-dark.accordion-boxed {
	--dx-accordion-active-color: var(--dx-dark);
	--dx-accordion-active-bg: var(--dx-dark-bg-subtle)
}

.accordion-dark.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-dark-border-subtle)
}

.accordion-solid-dark {
	--dx-accordion-active-bg: var(--dx-dark);
	--dx-accordion-active-color: #fff
}

.accordion-solid-dark [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-dark)
}

.accordion-pink,
.accordion-pink.accordion-boxed {
	--dx-accordion-active-color: var(--dx-pink);
	--dx-accordion-active-bg: var(--dx-pink-bg-subtle)
}

.accordion-pink.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-pink-border-subtle)
}

.accordion-solid-pink {
	--dx-accordion-active-bg: var(--dx-pink);
	--dx-accordion-active-color: #fff
}

.accordion-solid-pink [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-pink)
}

.accordion-orange,
.accordion-orange.accordion-boxed {
	--dx-accordion-active-color: var(--dx-orange);
	--dx-accordion-active-bg: var(--dx-orange-bg-subtle)
}

.accordion-orange.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-orange-border-subtle)
}

.accordion-solid-orange {
	--dx-accordion-active-bg: var(--dx-orange);
	--dx-accordion-active-color: #fff
}

.accordion-solid-orange [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-orange)
}

.accordion-indigo,
.accordion-indigo.accordion-boxed {
	--dx-accordion-active-color: var(--dx-indigo);
	--dx-accordion-active-bg: var(--dx-indigo-bg-subtle)
}

.accordion-indigo.accordion-boxed [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-indigo-border-subtle)
}

.accordion-solid-indigo {
	--dx-accordion-active-bg: var(--dx-indigo);
	--dx-accordion-active-color: #fff
}

.accordion-solid-indigo [aria-expanded=true] {
	--dx-accordion-border-color: var(--dx-indigo)
}

.btn-primary {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-primary);
	--dx-btn-border-color: var(--dx-primary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-primary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-primary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-primary-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-primary-text-emphasis)
}

.btn-outline-primary {
	--dx-btn-color: var(--dx-primary);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-primary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-primary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-primary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-primary-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-primary-text-emphasis)
}

.btn-outline-primary .btn-primary {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-primary);
	--dx-btn-border-color: var(--dx-primary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-primary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-primary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-primary-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-primary-border-subtle)
}

.btn-sub-primary {
	--dx-btn-color: var(--dx-primary);
	--dx-btn-bg: var(--dx-primary-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-primary);
	--dx-btn-hover-bg: var(--dx-primary-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-primary);
	--dx-btn-active-bg: var(--dx-primary-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-primary);
	--dx-btn-disabled-bg: var(--dx-primary-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-primary {
	--dx-btn-color: var(--dx-primary);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-primary);
	--dx-btn-hover-color: var(--dx-primary);
	--dx-btn-hover-bg: var(--dx-primary-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-primary);
	--dx-btn-active-color: var(--dx-primary);
	--dx-btn-active-bg: var(--dx-primary-bg-subtle);
	--dx-btn-active-border-color: var(--dx-primary);
	--dx-btn-disabled-color: var(--dx-primary);
	--dx-btn-disabled-bg: var(--dx-primary-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-primary)
}

.btn-active-primary {
	--dx-btn-color: var(--dx-primary);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-primary);
	--dx-btn-hover-bg: var(--dx-primary-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-primary);
	--dx-btn-active-bg: var(--dx-primary-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-primary);
	--dx-btn-disabled-bg: var(--dx-primary-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-primary {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-primary);
	--dx-btn-border-color: var(--dx-primary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-primary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-primary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-primary-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-primary-text-emphasis);
	--dx-btn-shadow-color: var(--dx-primary-text-emphasis)
}

.navigation-primary a:is(:hover, .active) {
	color: var(--dx-primary)
}

.navigation-primary.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-primary)
}

.navigation-primary.navigation-border-animation a:before {
	background-color: var(--dx-primary)
}

.btn-secondary {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-secondary);
	--dx-btn-border-color: var(--dx-secondary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-secondary-text-emphasis)
}

.btn-outline-secondary {
	--dx-btn-color: var(--dx-secondary);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-secondary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-secondary-text-emphasis)
}

.btn-outline-secondary .btn-secondary {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-secondary);
	--dx-btn-border-color: var(--dx-secondary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-secondary-border-subtle)
}

.btn-sub-secondary {
	--dx-btn-color: var(--dx-secondary);
	--dx-btn-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-secondary);
	--dx-btn-hover-bg: var(--dx-secondary-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-secondary);
	--dx-btn-active-bg: var(--dx-secondary-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-secondary);
	--dx-btn-disabled-bg: var(--dx-secondary-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-secondary {
	--dx-btn-color: var(--dx-secondary);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-secondary);
	--dx-btn-hover-color: var(--dx-secondary);
	--dx-btn-hover-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-secondary);
	--dx-btn-active-color: var(--dx-secondary);
	--dx-btn-active-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-active-border-color: var(--dx-secondary);
	--dx-btn-disabled-color: var(--dx-secondary);
	--dx-btn-disabled-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-secondary)
}

.btn-active-secondary {
	--dx-btn-color: var(--dx-secondary);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-secondary);
	--dx-btn-hover-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-secondary);
	--dx-btn-active-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-secondary);
	--dx-btn-disabled-bg: var(--dx-secondary-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-secondary {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-secondary);
	--dx-btn-border-color: var(--dx-secondary);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-active-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-secondary-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-secondary-text-emphasis);
	--dx-btn-shadow-color: var(--dx-secondary-text-emphasis)
}

.navigation-secondary a:is(:hover, .active) {
	color: var(--dx-secondary)
}

.navigation-secondary.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-secondary)
}

.navigation-secondary.navigation-border-animation a:before {
	background-color: var(--dx-secondary)
}

.btn-success {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-success);
	--dx-btn-border-color: var(--dx-success);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-success-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-success-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-success-text-emphasis);
	--dx-btn-active-border-color: var(--dx-success-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-success-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-success-text-emphasis)
}

.btn-outline-success {
	--dx-btn-color: var(--dx-success);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-success);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-success-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-success-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-success-text-emphasis);
	--dx-btn-active-border-color: var(--dx-success-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-success-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-success-text-emphasis)
}

.btn-outline-success .btn-success {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-success);
	--dx-btn-border-color: var(--dx-success);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-success-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-success-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-success-text-emphasis);
	--dx-btn-active-border-color: var(--dx-success-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-success-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-success-border-subtle)
}

.btn-sub-success {
	--dx-btn-color: var(--dx-success);
	--dx-btn-bg: var(--dx-success-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-success);
	--dx-btn-hover-bg: var(--dx-success-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-success);
	--dx-btn-active-bg: var(--dx-success-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-success);
	--dx-btn-disabled-bg: var(--dx-success-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-success {
	--dx-btn-color: var(--dx-success);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-success);
	--dx-btn-hover-color: var(--dx-success);
	--dx-btn-hover-bg: var(--dx-success-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-success);
	--dx-btn-active-color: var(--dx-success);
	--dx-btn-active-bg: var(--dx-success-bg-subtle);
	--dx-btn-active-border-color: var(--dx-success);
	--dx-btn-disabled-color: var(--dx-success);
	--dx-btn-disabled-bg: var(--dx-success-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-success)
}

.btn-active-success {
	--dx-btn-color: var(--dx-success);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-success);
	--dx-btn-hover-bg: var(--dx-success-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-success);
	--dx-btn-active-bg: var(--dx-success-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-success);
	--dx-btn-disabled-bg: var(--dx-success-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-success {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-success);
	--dx-btn-border-color: var(--dx-success);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-success-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-success-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-success-text-emphasis);
	--dx-btn-active-border-color: var(--dx-success-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-success-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-success-text-emphasis);
	--dx-btn-shadow-color: var(--dx-success-text-emphasis)
}

.navigation-success a:is(:hover, .active) {
	color: var(--dx-success)
}

.navigation-success.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-success)
}

.navigation-success.navigation-border-animation a:before {
	background-color: var(--dx-success)
}

.btn-info {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-info);
	--dx-btn-border-color: var(--dx-info);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-info-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-info-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-info-text-emphasis);
	--dx-btn-active-border-color: var(--dx-info-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-info-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-info-text-emphasis)
}

.btn-outline-info {
	--dx-btn-color: var(--dx-info);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-info);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-info-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-info-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-info-text-emphasis);
	--dx-btn-active-border-color: var(--dx-info-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-info-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-info-text-emphasis)
}

.btn-outline-info .btn-info {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-info);
	--dx-btn-border-color: var(--dx-info);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-info-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-info-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-info-text-emphasis);
	--dx-btn-active-border-color: var(--dx-info-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-info-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-info-border-subtle)
}

.btn-sub-info {
	--dx-btn-color: var(--dx-info);
	--dx-btn-bg: var(--dx-info-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-info);
	--dx-btn-hover-bg: var(--dx-info-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-info);
	--dx-btn-active-bg: var(--dx-info-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-info);
	--dx-btn-disabled-bg: var(--dx-info-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-info {
	--dx-btn-color: var(--dx-info);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-info);
	--dx-btn-hover-color: var(--dx-info);
	--dx-btn-hover-bg: var(--dx-info-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-info);
	--dx-btn-active-color: var(--dx-info);
	--dx-btn-active-bg: var(--dx-info-bg-subtle);
	--dx-btn-active-border-color: var(--dx-info);
	--dx-btn-disabled-color: var(--dx-info);
	--dx-btn-disabled-bg: var(--dx-info-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-info)
}

.btn-active-info {
	--dx-btn-color: var(--dx-info);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-info);
	--dx-btn-hover-bg: var(--dx-info-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-info);
	--dx-btn-active-bg: var(--dx-info-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-info);
	--dx-btn-disabled-bg: var(--dx-info-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-info {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-info);
	--dx-btn-border-color: var(--dx-info);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-info-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-info-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-info-text-emphasis);
	--dx-btn-active-border-color: var(--dx-info-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-info-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-info-text-emphasis);
	--dx-btn-shadow-color: var(--dx-info-text-emphasis)
}

.navigation-info a:is(:hover, .active) {
	color: var(--dx-info)
}

.navigation-info.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-info)
}

.navigation-info.navigation-border-animation a:before {
	background-color: var(--dx-info)
}

.btn-warning {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-warning);
	--dx-btn-border-color: var(--dx-warning);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-warning-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-warning-text-emphasis);
	--dx-btn-active-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-warning-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-warning-text-emphasis)
}

.btn-outline-warning {
	--dx-btn-color: var(--dx-warning);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-warning);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-warning-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-warning-text-emphasis);
	--dx-btn-active-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-warning-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-warning-text-emphasis)
}

.btn-outline-warning .btn-warning {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-warning);
	--dx-btn-border-color: var(--dx-warning);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-warning-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-warning-text-emphasis);
	--dx-btn-active-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-warning-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-warning-border-subtle)
}

.btn-sub-warning {
	--dx-btn-color: var(--dx-warning);
	--dx-btn-bg: var(--dx-warning-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-warning);
	--dx-btn-hover-bg: var(--dx-warning-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-warning);
	--dx-btn-active-bg: var(--dx-warning-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-warning);
	--dx-btn-disabled-bg: var(--dx-warning-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-warning {
	--dx-btn-color: var(--dx-warning);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-warning);
	--dx-btn-hover-color: var(--dx-warning);
	--dx-btn-hover-bg: var(--dx-warning-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-warning);
	--dx-btn-active-color: var(--dx-warning);
	--dx-btn-active-bg: var(--dx-warning-bg-subtle);
	--dx-btn-active-border-color: var(--dx-warning);
	--dx-btn-disabled-color: var(--dx-warning);
	--dx-btn-disabled-bg: var(--dx-warning-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-warning)
}

.btn-active-warning {
	--dx-btn-color: var(--dx-warning);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-warning);
	--dx-btn-hover-bg: var(--dx-warning-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-warning);
	--dx-btn-active-bg: var(--dx-warning-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-warning);
	--dx-btn-disabled-bg: var(--dx-warning-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-warning {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-warning);
	--dx-btn-border-color: var(--dx-warning);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-warning-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-warning-text-emphasis);
	--dx-btn-active-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-warning-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-warning-text-emphasis);
	--dx-btn-shadow-color: var(--dx-warning-text-emphasis)
}

.navigation-warning a:is(:hover, .active) {
	color: var(--dx-warning)
}

.navigation-warning.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-warning)
}

.navigation-warning.navigation-border-animation a:before {
	background-color: var(--dx-warning)
}

.btn-danger {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-danger);
	--dx-btn-border-color: var(--dx-danger);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-danger-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-danger-text-emphasis);
	--dx-btn-active-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-danger-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-danger-text-emphasis)
}

.btn-outline-danger {
	--dx-btn-color: var(--dx-danger);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-danger);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-danger-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-danger-text-emphasis);
	--dx-btn-active-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-danger-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-danger-text-emphasis)
}

.btn-outline-danger .btn-danger {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-danger);
	--dx-btn-border-color: var(--dx-danger);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-danger-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-danger-text-emphasis);
	--dx-btn-active-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-danger-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-danger-border-subtle)
}

.btn-sub-danger {
	--dx-btn-color: var(--dx-danger);
	--dx-btn-bg: var(--dx-danger-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-danger);
	--dx-btn-hover-bg: var(--dx-danger-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-danger);
	--dx-btn-active-bg: var(--dx-danger-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-danger);
	--dx-btn-disabled-bg: var(--dx-danger-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-danger {
	--dx-btn-color: var(--dx-danger);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-danger);
	--dx-btn-hover-color: var(--dx-danger);
	--dx-btn-hover-bg: var(--dx-danger-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-danger);
	--dx-btn-active-color: var(--dx-danger);
	--dx-btn-active-bg: var(--dx-danger-bg-subtle);
	--dx-btn-active-border-color: var(--dx-danger);
	--dx-btn-disabled-color: var(--dx-danger);
	--dx-btn-disabled-bg: var(--dx-danger-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-danger)
}

.btn-active-danger {
	--dx-btn-color: var(--dx-danger);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-danger);
	--dx-btn-hover-bg: var(--dx-danger-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-danger);
	--dx-btn-active-bg: var(--dx-danger-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-danger);
	--dx-btn-disabled-bg: var(--dx-danger-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-danger {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-danger);
	--dx-btn-border-color: var(--dx-danger);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-danger-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-danger-text-emphasis);
	--dx-btn-active-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-danger-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-danger-text-emphasis);
	--dx-btn-shadow-color: var(--dx-danger-text-emphasis)
}

.navigation-danger a:is(:hover, .active) {
	color: var(--dx-danger)
}

.navigation-danger.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-danger)
}

.navigation-danger.navigation-border-animation a:before {
	background-color: var(--dx-danger)
}

.btn-light {
	--dx-btn-color: var(--dx-secondary-color);
	--dx-btn-bg: var(--dx-light);
	--dx-btn-border-color: var(--dx-light);
	--dx-btn-hover-color: var(--dx-body-color);
	--dx-btn-hover-bg: var(--dx-tertiary-bg);
	--dx-btn-hover-border-color: var(--dx-tertiary-bg);
	--dx-btn-active-color: var(--dx-body-color);
	--dx-btn-active-bg: var(--dx-tertiary-bg);
	--dx-btn-active-border-color: var(--dx-tertiary-bg);
	--dx-btn-disabled-color: var(--dx-secondary-color);
	--dx-btn-disabled-bg: var(--dx-light);
	--dx-btn-disabled-border-color: var(--dx-light)
}

.btn-outline-light {
	--dx-btn-color: var(--dx-secondary-color);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-light);
	--dx-btn-hover-color: var(--dx-body-color);
	--dx-btn-hover-bg: var(--dx-tertiary-bg);
	--dx-btn-hover-border-color: var(--dx-tertiary-bg);
	--dx-btn-active-color: var(--dx-body-color);
	--dx-btn-active-bg: var(--dx-tertiary-bg);
	--dx-btn-active-border-color: var(--dx-tertiary-bg);
	--dx-btn-disabled-color: var(--dx-secondary-color);
	--dx-btn-disabled-bg: var(--dx-light);
	--dx-btn-disabled-border-color: var(--dx-light)
}

.btn-outline-light .btn-light {
	--dx-btn-color: var(--dx-secondary-color);
	--dx-btn-bg: var(--dx-light);
	--dx-btn-border-color: var(--dx-light);
	--dx-btn-hover-color: var(--dx-body-color);
	--dx-btn-hover-bg: var(--dx-tertiary-bg);
	--dx-btn-hover-border-color: var(--dx-tertiary-bg);
	--dx-btn-active-color: var(--dx-body-color);
	--dx-btn-active-bg: var(--dx-tertiary-bg);
	--dx-btn-active-border-color: var(--dx-tertiary-bg);
	--dx-btn-disabled-color: var(--dx-secondary-color);
	--dx-btn-disabled-bg: var(--dx-light);
	--dx-btn-disabled-border-color: var(--dx-light)
}

.navigation-light a:is(:hover, .active) {
	color: var(--dx-light)
}

.navigation-light.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-light)
}

.navigation-light.navigation-border-animation a:before {
	background-color: var(--dx-light)
}

.btn-dark {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-dark);
	--dx-btn-border-color: var(--dx-dark);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-dark-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-dark-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-dark-text-emphasis);
	--dx-btn-active-border-color: var(--dx-dark-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-dark-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-dark-text-emphasis)
}

.btn-outline-dark {
	--dx-btn-color: var(--dx-dark);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-dark);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-dark);
	--dx-btn-hover-border-color: var(--dx-dark);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-dark);
	--dx-btn-active-border-color: var(--dx-dark);
	--dx-btn-disabled-color: var(--dx-secondary-color);
	--dx-btn-disabled-bg: var(--dx-dark);
	--dx-btn-disabled-border-color: var(--dx-dark)
}

.btn-outline-dark .btn-dark {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-dark);
	--dx-btn-border-color: var(--dx-dark);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-dark-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-dark-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-dark-text-emphasis);
	--dx-btn-active-border-color: var(--dx-dark-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-dark-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-dark-border-subtle)
}

.btn-sub-dark {
	--dx-btn-color: var(--dx-dark);
	--dx-btn-bg: var(--dx-light);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-dark);
	--dx-btn-hover-bg: var(--dx-dark-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-dark);
	--dx-btn-active-bg: var(--dx-dark-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-dark);
	--dx-btn-disabled-bg: var(--dx-dark-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-dark {
	--dx-btn-color: var(--dx-dark);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-border-color);
	--dx-btn-hover-color: var(--dx-dark);
	--dx-btn-hover-bg: var(--dx-tertiary-bg);
	--dx-btn-hover-border-color: var(--dx-border-color);
	--dx-btn-active-color: var(--dx-dark);
	--dx-btn-active-bg: var(--dx-tertiary-bg);
	--dx-btn-active-border-color: var(--dx-border-color);
	--dx-btn-disabled-color: var(--dx-dark);
	--dx-btn-disabled-bg: var(--dx-tertiary-bg);
	--dx-btn-disabled-border-color: var(--dx-border-color)
}

.btn-active-dark {
	--dx-btn-color: var(--dx-dark);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-dark);
	--dx-btn-hover-bg: var(--dx-tertiary-bg);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-dark);
	--dx-btn-active-bg: var(--dx-tertiary-bg);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-dark);
	--dx-btn-disabled-bg: var(--dx-tertiary-bg);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-dark {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-dark);
	--dx-btn-border-color: var(--dx-dark);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-dark);
	--dx-btn-hover-border-color: var(--dx-dark);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-dark);
	--dx-btn-active-border-color: var(--dx-dark);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-dark);
	--dx-btn-disabled-border-color: var(--dx-dark)
}

.navigation-dark a:is(:hover, .active) {
	color: var(--dx-dark)
}

.navigation-dark.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-dark)
}

.navigation-dark.navigation-border-animation a:before {
	background-color: var(--dx-dark)
}

.btn-pink {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-pink);
	--dx-btn-border-color: var(--dx-pink);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-pink-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-pink-text-emphasis);
	--dx-btn-active-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-pink-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-pink-text-emphasis)
}

.btn-outline-pink {
	--dx-btn-color: var(--dx-pink);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-pink);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-pink-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-pink-text-emphasis);
	--dx-btn-active-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-pink-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-pink-text-emphasis)
}

.btn-outline-pink .btn-pink {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-pink);
	--dx-btn-border-color: var(--dx-pink);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-pink-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-pink-text-emphasis);
	--dx-btn-active-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-pink-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-pink-border-subtle)
}

.btn-sub-pink {
	--dx-btn-color: var(--dx-pink);
	--dx-btn-bg: var(--dx-pink-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-pink);
	--dx-btn-hover-bg: var(--dx-pink-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-pink);
	--dx-btn-active-bg: var(--dx-pink-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-pink);
	--dx-btn-disabled-bg: var(--dx-pink-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-pink {
	--dx-btn-color: var(--dx-pink);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-pink);
	--dx-btn-hover-color: var(--dx-pink);
	--dx-btn-hover-bg: var(--dx-pink-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-pink);
	--dx-btn-active-color: var(--dx-pink);
	--dx-btn-active-bg: var(--dx-pink-bg-subtle);
	--dx-btn-active-border-color: var(--dx-pink);
	--dx-btn-disabled-color: var(--dx-pink);
	--dx-btn-disabled-bg: var(--dx-pink-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-pink)
}

.btn-active-pink {
	--dx-btn-color: var(--dx-pink);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-pink);
	--dx-btn-hover-bg: var(--dx-pink-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-pink);
	--dx-btn-active-bg: var(--dx-pink-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-pink);
	--dx-btn-disabled-bg: var(--dx-pink-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-pink {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-pink);
	--dx-btn-border-color: var(--dx-pink);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-pink-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-pink-text-emphasis);
	--dx-btn-active-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-pink-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-pink-text-emphasis);
	--dx-btn-shadow-color: var(--dx-pink-text-emphasis)
}

.navigation-pink a:is(:hover, .active) {
	color: var(--dx-pink)
}

.navigation-pink.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-pink)
}

.navigation-pink.navigation-border-animation a:before {
	background-color: var(--dx-pink)
}

.btn-orange {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-orange);
	--dx-btn-border-color: var(--dx-orange);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-orange-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-orange-text-emphasis);
	--dx-btn-active-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-orange-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-orange-text-emphasis)
}

.btn-outline-orange {
	--dx-btn-color: var(--dx-orange);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-orange);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-orange-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-orange-text-emphasis);
	--dx-btn-active-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-orange-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-orange-text-emphasis)
}

.btn-outline-orange .btn-orange {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-orange);
	--dx-btn-border-color: var(--dx-orange);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-orange-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-orange-text-emphasis);
	--dx-btn-active-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-orange-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-orange-border-subtle)
}

.btn-sub-orange {
	--dx-btn-color: var(--dx-orange);
	--dx-btn-bg: var(--dx-orange-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-orange);
	--dx-btn-hover-bg: var(--dx-orange-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-orange);
	--dx-btn-active-bg: var(--dx-orange-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-orange);
	--dx-btn-disabled-bg: var(--dx-orange-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-orange {
	--dx-btn-color: var(--dx-orange);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-orange);
	--dx-btn-hover-color: var(--dx-orange);
	--dx-btn-hover-bg: var(--dx-orange-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-orange);
	--dx-btn-active-color: var(--dx-orange);
	--dx-btn-active-bg: var(--dx-orange-bg-subtle);
	--dx-btn-active-border-color: var(--dx-orange);
	--dx-btn-disabled-color: var(--dx-orange);
	--dx-btn-disabled-bg: var(--dx-orange-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-orange)
}

.btn-active-orange {
	--dx-btn-color: var(--dx-orange);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-orange);
	--dx-btn-hover-bg: var(--dx-orange-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-orange);
	--dx-btn-active-bg: var(--dx-orange-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-orange);
	--dx-btn-disabled-bg: var(--dx-orange-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-orange {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-orange);
	--dx-btn-border-color: var(--dx-orange);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-orange-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-orange-text-emphasis);
	--dx-btn-active-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-orange-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-orange-text-emphasis);
	--dx-btn-shadow-color: var(--dx-orange-text-emphasis)
}

.navigation-orange a:is(:hover, .active) {
	color: var(--dx-orange)
}

.navigation-orange.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-orange)
}

.navigation-orange.navigation-border-animation a:before {
	background-color: var(--dx-orange)
}

.btn-indigo {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-indigo);
	--dx-btn-border-color: var(--dx-indigo);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-active-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-indigo-text-emphasis)
}

.btn-outline-indigo {
	--dx-btn-color: var(--dx-indigo);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-indigo);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-active-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-indigo-text-emphasis)
}

.btn-outline-indigo .btn-indigo {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-indigo);
	--dx-btn-border-color: var(--dx-indigo);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-active-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-indigo-border-subtle)
}

.btn-sub-indigo {
	--dx-btn-color: var(--dx-indigo);
	--dx-btn-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-indigo);
	--dx-btn-hover-bg: var(--dx-indigo-border-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-indigo);
	--dx-btn-active-bg: var(--dx-indigo-border-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-indigo);
	--dx-btn-disabled-bg: var(--dx-indigo-border-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-dashed-indigo {
	--dx-btn-color: var(--dx-indigo);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: var(--dx-indigo);
	--dx-btn-hover-color: var(--dx-indigo);
	--dx-btn-hover-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-hover-border-color: var(--dx-indigo);
	--dx-btn-active-color: var(--dx-indigo);
	--dx-btn-active-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-active-border-color: var(--dx-indigo);
	--dx-btn-disabled-color: var(--dx-indigo);
	--dx-btn-disabled-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-disabled-border-color: var(--dx-indigo)
}

.btn-active-indigo {
	--dx-btn-color: var(--dx-indigo);
	--dx-btn-bg: transparent;
	--dx-btn-border-color: transparent;
	--dx-btn-hover-color: var(--dx-indigo);
	--dx-btn-hover-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-hover-border-color: transparent;
	--dx-btn-active-color: var(--dx-indigo);
	--dx-btn-active-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-active-border-color: transparent;
	--dx-btn-disabled-color: var(--dx-indigo);
	--dx-btn-disabled-bg: var(--dx-indigo-bg-subtle);
	--dx-btn-disabled-border-color: transparent
}

.btn-3d-indigo {
	--dx-btn-color: var(--dx-white);
	--dx-btn-bg: var(--dx-indigo);
	--dx-btn-border-color: var(--dx-indigo);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-hover-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-hover-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-active-color: var(--dx-white);
	--dx-btn-active-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-active-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-disabled-color: var(--dx-white);
	--dx-btn-disabled-bg: var(--dx-indigo-text-emphasis);
	--dx-btn-disabled-border-color: var(--dx-indigo-text-emphasis);
	--dx-btn-shadow-color: var(--dx-indigo-text-emphasis)
}

.navigation-indigo a:is(:hover, .active) {
	color: var(--dx-indigo)
}

.navigation-indigo.navigation-bottom-animation a:is(:hover, .active):before {
	background-color: var(--dx-indigo)
}

.navigation-indigo.navigation-border-animation a:before {
	background-color: var(--dx-indigo)
}

.alert-outline-primary {
	--dx-alert-color: var(--dx-primary);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-primary);
	--dx-alert-link-color: var(--dx-primary)
}

.alert-sub-primary {
	--dx-alert-color: var(--dx-primary-text-emphasis);
	--dx-alert-bg: var(--dx-primary-bg-subtle);
	--dx-alert-link-color: var(--dx-primary)
}

.alert-solid-primary {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-primary);
	--dx-alert-border-color: var(--dx-primary);
	--dx-alert-link-color: var(--dx-primary-bg-subtle)
}

.icon-alert-primary {
	border-left: 3px solid var(--dx-primary) !important
}

.icon-alert-primary .icon {
	background-color: var(--dx-primary-bg-subtle)
}

.alert-outline-secondary {
	--dx-alert-color: var(--dx-secondary);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-secondary);
	--dx-alert-link-color: var(--dx-secondary)
}

.alert-sub-secondary {
	--dx-alert-color: var(--dx-secondary-text-emphasis);
	--dx-alert-bg: var(--dx-secondary-bg-subtle);
	--dx-alert-link-color: var(--dx-secondary)
}

.alert-solid-secondary {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-secondary);
	--dx-alert-border-color: var(--dx-secondary);
	--dx-alert-link-color: var(--dx-secondary-bg-subtle)
}

.icon-alert-secondary {
	border-left: 3px solid var(--dx-secondary) !important
}

.icon-alert-secondary .icon {
	background-color: var(--dx-secondary-bg-subtle)
}

.alert-outline-success {
	--dx-alert-color: var(--dx-success);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-success);
	--dx-alert-link-color: var(--dx-success)
}

.alert-sub-success {
	--dx-alert-color: var(--dx-success-text-emphasis);
	--dx-alert-bg: var(--dx-success-bg-subtle);
	--dx-alert-link-color: var(--dx-success)
}

.alert-solid-success {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-success);
	--dx-alert-border-color: var(--dx-success);
	--dx-alert-link-color: var(--dx-success-bg-subtle)
}

.icon-alert-success {
	border-left: 3px solid var(--dx-success) !important
}

.icon-alert-success .icon {
	background-color: var(--dx-success-bg-subtle)
}

.alert-outline-info {
	--dx-alert-color: var(--dx-info);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-info);
	--dx-alert-link-color: var(--dx-info)
}

.alert-sub-info {
	--dx-alert-color: var(--dx-info-text-emphasis);
	--dx-alert-bg: var(--dx-info-bg-subtle);
	--dx-alert-link-color: var(--dx-info)
}

.alert-solid-info {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-info);
	--dx-alert-border-color: var(--dx-info);
	--dx-alert-link-color: var(--dx-info-bg-subtle)
}

.icon-alert-info {
	border-left: 3px solid var(--dx-info) !important
}

.icon-alert-info .icon {
	background-color: var(--dx-info-bg-subtle)
}

.alert-outline-warning {
	--dx-alert-color: var(--dx-warning);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-warning);
	--dx-alert-link-color: var(--dx-warning)
}

.alert-sub-warning {
	--dx-alert-color: var(--dx-warning-text-emphasis);
	--dx-alert-bg: var(--dx-warning-bg-subtle);
	--dx-alert-link-color: var(--dx-warning)
}

.alert-solid-warning {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-warning);
	--dx-alert-border-color: var(--dx-warning);
	--dx-alert-link-color: var(--dx-warning-bg-subtle)
}

.icon-alert-warning {
	border-left: 3px solid var(--dx-warning) !important
}

.icon-alert-warning .icon {
	background-color: var(--dx-warning-bg-subtle)
}

.alert-outline-danger {
	--dx-alert-color: var(--dx-danger);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-danger);
	--dx-alert-link-color: var(--dx-danger)
}

.alert-sub-danger {
	--dx-alert-color: var(--dx-danger-text-emphasis);
	--dx-alert-bg: var(--dx-danger-bg-subtle);
	--dx-alert-link-color: var(--dx-danger)
}

.alert-solid-danger {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-danger);
	--dx-alert-border-color: var(--dx-danger);
	--dx-alert-link-color: var(--dx-danger-bg-subtle)
}

.icon-alert-danger {
	border-left: 3px solid var(--dx-danger) !important
}

.icon-alert-danger .icon {
	background-color: var(--dx-danger-bg-subtle)
}

.icon-alert-light {
	border-left: 3px solid var(--dx-light) !important
}

.icon-alert-light .icon {
	background-color: var(--dx-light-bg-subtle)
}

.alert-outline-dark {
	--dx-alert-color: var(--dx-dark);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-border-color);
	--dx-alert-link-color: var(--dx-dark)
}

.alert-sub-dark {
	--dx-alert-color: var(--dx-secondary-color);
	--dx-alert-bg: var(--dx-tertiary-bg);
	--dx-alert-link-color: var(--dx-dark)
}

.alert-solid-dark {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-dark);
	--dx-alert-border-color: var(--dx-dark);
	--dx-alert-link-color: var(--dx-dark-bg-subtle)
}

.icon-alert-dark {
	border-left: 3px solid var(--dx-dark) !important
}

.icon-alert-dark .icon {
	background-color: var(--dx-dark-bg-subtle)
}

.alert-outline-pink {
	--dx-alert-color: var(--dx-pink);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-pink);
	--dx-alert-link-color: var(--dx-pink)
}

.alert-sub-pink {
	--dx-alert-color: var(--dx-pink-text-emphasis);
	--dx-alert-bg: var(--dx-pink-bg-subtle);
	--dx-alert-link-color: var(--dx-pink)
}

.alert-solid-pink {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-pink);
	--dx-alert-border-color: var(--dx-pink);
	--dx-alert-link-color: var(--dx-pink-bg-subtle)
}

.icon-alert-pink {
	border-left: 3px solid var(--dx-pink) !important
}

.icon-alert-pink .icon {
	background-color: var(--dx-pink-bg-subtle)
}

.alert-outline-orange {
	--dx-alert-color: var(--dx-orange);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-orange);
	--dx-alert-link-color: var(--dx-orange)
}

.alert-sub-orange {
	--dx-alert-color: var(--dx-orange-text-emphasis);
	--dx-alert-bg: var(--dx-orange-bg-subtle);
	--dx-alert-link-color: var(--dx-orange)
}

.alert-solid-orange {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-orange);
	--dx-alert-border-color: var(--dx-orange);
	--dx-alert-link-color: var(--dx-orange-bg-subtle)
}

.icon-alert-orange {
	border-left: 3px solid var(--dx-orange) !important
}

.icon-alert-orange .icon {
	background-color: var(--dx-orange-bg-subtle)
}

.alert-outline-indigo {
	--dx-alert-color: var(--dx-indigo);
	--dx-alert-bg: var(--dx-secondary-bg);
	--dx-alert-border-color: var(--dx-indigo);
	--dx-alert-link-color: var(--dx-indigo)
}

.alert-sub-indigo {
	--dx-alert-color: var(--dx-indigo-text-emphasis);
	--dx-alert-bg: var(--dx-indigo-bg-subtle);
	--dx-alert-link-color: var(--dx-indigo)
}

.alert-solid-indigo {
	--dx-alert-color: #fff;
	--dx-alert-bg: var(--dx-indigo);
	--dx-alert-border-color: var(--dx-indigo);
	--dx-alert-link-color: var(--dx-indigo-bg-subtle)
}

.icon-alert-indigo {
	border-left: 3px solid var(--dx-indigo) !important
}

.icon-alert-indigo .icon {
	background-color: var(--dx-indigo-bg-subtle)
}

.card-border-primary {
	--dx-card-border-color: var(--dx-primary-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-primary-bg-subtle), 0 4px 6px -4px var(--dx-primary-bg-subtle);
	--dx-link-color-rgb: var(--dx-primary-rgb);
	--prefixlink-hover-color-rgb: var(--dx-primary-rgb)
}

.card-primary {
	--dx-link-color-rgb: var(--dx-primary-rgb)
}

.card-primary .icon-bg {
	background-color: var(--dx-primary);
	color: #fff
}

.card-primary:hover {
	--dx-card-border-color: var(--dx-primary-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-primary:hover .icon-bg {
	background-color: #ffffff25
}

.card-primary:hover .icon-hover-bg {
	background-color: var(--dx-primary)
}

.card-sub-primary {
	--dx-link-color-rgb: var(--dx-primary-rgb)
}

.card-sub-primary .icon-bg {
	background-color: var(--dx-primary-bg-subtle);
	color: var(--dx-primary)
}

.card-sub-primary:hover {
	color: var(--dx-primary);
	--dx-card-border-color: var(--dx-primary-border-subtle)
}

.card-sub-primary:hover .icon-hover-bg {
	background-color: rgba(var(--dx-primary-rgb), .08)
}

.card-hover-primary {
	--dx-link-color-rgb: var(--dx-primary-rgb)
}

.card-hover-primary .icon-bg {
	background-color: var(--dx-primary-bg-subtle);
	color: var(--dx-primary)
}

.card-border-secondary {
	--dx-card-border-color: var(--dx-secondary-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-secondary-bg-subtle), 0 4px 6px -4px var(--dx-secondary-bg-subtle);
	--dx-link-color-rgb: var(--dx-secondary-rgb);
	--prefixlink-hover-color-rgb: var(--dx-secondary-rgb)
}

.card-secondary {
	--dx-link-color-rgb: var(--dx-secondary-rgb)
}

.card-secondary .icon-bg {
	background-color: var(--dx-secondary);
	color: #fff
}

.card-secondary:hover {
	--dx-card-border-color: var(--dx-secondary-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-secondary:hover .icon-bg {
	background-color: #ffffff25
}

.card-secondary:hover .icon-hover-bg {
	background-color: var(--dx-secondary)
}

.card-sub-secondary {
	--dx-link-color-rgb: var(--dx-secondary-rgb)
}

.card-sub-secondary .icon-bg {
	background-color: var(--dx-secondary-bg-subtle);
	color: var(--dx-secondary)
}

.card-sub-secondary:hover {
	color: var(--dx-secondary);
	--dx-card-border-color: var(--dx-secondary-border-subtle)
}

.card-sub-secondary:hover .icon-hover-bg {
	background-color: rgba(var(--dx-secondary-rgb), .08)
}

.card-hover-secondary {
	--dx-link-color-rgb: var(--dx-secondary-rgb)
}

.card-hover-secondary .icon-bg {
	background-color: var(--dx-secondary-bg-subtle);
	color: var(--dx-secondary)
}

.card-border-success {
	--dx-card-border-color: var(--dx-success-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-success-bg-subtle), 0 4px 6px -4px var(--dx-success-bg-subtle);
	--dx-link-color-rgb: var(--dx-success-rgb);
	--prefixlink-hover-color-rgb: var(--dx-success-rgb)
}

.card-success {
	--dx-link-color-rgb: var(--dx-success-rgb)
}

.card-success .icon-bg {
	background-color: var(--dx-success);
	color: #fff
}

.card-success:hover {
	--dx-card-border-color: var(--dx-success-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-success:hover .icon-bg {
	background-color: #ffffff25
}

.card-success:hover .icon-hover-bg {
	background-color: var(--dx-success)
}

.card-sub-success {
	--dx-link-color-rgb: var(--dx-success-rgb)
}

.card-sub-success .icon-bg {
	background-color: var(--dx-success-bg-subtle);
	color: var(--dx-success)
}

.card-sub-success:hover {
	color: var(--dx-success);
	--dx-card-border-color: var(--dx-success-border-subtle)
}

.card-sub-success:hover .icon-hover-bg {
	background-color: rgba(var(--dx-success-rgb), .08)
}

.card-hover-success {
	--dx-link-color-rgb: var(--dx-success-rgb)
}

.card-hover-success .icon-bg {
	background-color: var(--dx-success-bg-subtle);
	color: var(--dx-success)
}

.card-border-info {
	--dx-card-border-color: var(--dx-info-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-info-bg-subtle), 0 4px 6px -4px var(--dx-info-bg-subtle);
	--dx-link-color-rgb: var(--dx-info-rgb);
	--prefixlink-hover-color-rgb: var(--dx-info-rgb)
}

.card-info {
	--dx-link-color-rgb: var(--dx-info-rgb)
}

.card-info .icon-bg {
	background-color: var(--dx-info);
	color: #fff
}

.card-info:hover {
	--dx-card-border-color: var(--dx-info-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-info:hover .icon-bg {
	background-color: #ffffff25
}

.card-info:hover .icon-hover-bg {
	background-color: var(--dx-info)
}

.card-sub-info {
	--dx-link-color-rgb: var(--dx-info-rgb)
}

.card-sub-info .icon-bg {
	background-color: var(--dx-info-bg-subtle);
	color: var(--dx-info)
}

.card-sub-info:hover {
	color: var(--dx-info);
	--dx-card-border-color: var(--dx-info-border-subtle)
}

.card-sub-info:hover .icon-hover-bg {
	background-color: rgba(var(--dx-info-rgb), .08)
}

.card-hover-info {
	--dx-link-color-rgb: var(--dx-info-rgb)
}

.card-hover-info .icon-bg {
	background-color: var(--dx-info-bg-subtle);
	color: var(--dx-info)
}

.card-border-warning {
	--dx-card-border-color: var(--dx-warning-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-warning-bg-subtle), 0 4px 6px -4px var(--dx-warning-bg-subtle);
	--dx-link-color-rgb: var(--dx-warning-rgb);
	--prefixlink-hover-color-rgb: var(--dx-warning-rgb)
}

.card-warning {
	--dx-link-color-rgb: var(--dx-warning-rgb)
}

.card-warning .icon-bg {
	background-color: var(--dx-warning);
	color: #fff
}

.card-warning:hover {
	--dx-card-border-color: var(--dx-warning-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-warning:hover .icon-bg {
	background-color: #ffffff25
}

.card-warning:hover .icon-hover-bg {
	background-color: var(--dx-warning)
}

.card-sub-warning {
	--dx-link-color-rgb: var(--dx-warning-rgb)
}

.card-sub-warning .icon-bg {
	background-color: var(--dx-warning-bg-subtle);
	color: var(--dx-warning)
}

.card-sub-warning:hover {
	color: var(--dx-warning);
	--dx-card-border-color: var(--dx-warning-border-subtle)
}

.card-sub-warning:hover .icon-hover-bg {
	background-color: rgba(var(--dx-warning-rgb), .08)
}

.card-hover-warning {
	--dx-link-color-rgb: var(--dx-warning-rgb)
}

.card-hover-warning .icon-bg {
	background-color: var(--dx-warning-bg-subtle);
	color: var(--dx-warning)
}

.card-border-danger {
	--dx-card-border-color: var(--dx-danger-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-danger-bg-subtle), 0 4px 6px -4px var(--dx-danger-bg-subtle);
	--dx-link-color-rgb: var(--dx-danger-rgb);
	--prefixlink-hover-color-rgb: var(--dx-danger-rgb)
}

.card-danger {
	--dx-link-color-rgb: var(--dx-danger-rgb)
}

.card-danger .icon-bg {
	background-color: var(--dx-danger);
	color: #fff
}

.card-danger:hover {
	--dx-card-border-color: var(--dx-danger-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-danger:hover .icon-bg {
	background-color: #ffffff25
}

.card-danger:hover .icon-hover-bg {
	background-color: var(--dx-danger)
}

.card-sub-danger {
	--dx-link-color-rgb: var(--dx-danger-rgb)
}

.card-sub-danger .icon-bg {
	background-color: var(--dx-danger-bg-subtle);
	color: var(--dx-danger)
}

.card-sub-danger:hover {
	color: var(--dx-danger);
	--dx-card-border-color: var(--dx-danger-border-subtle)
}

.card-sub-danger:hover .icon-hover-bg {
	background-color: rgba(var(--dx-danger-rgb), .08)
}

.card-hover-danger {
	--dx-link-color-rgb: var(--dx-danger-rgb)
}

.card-hover-danger .icon-bg {
	background-color: var(--dx-danger-bg-subtle);
	color: var(--dx-danger)
}

.card-border-light {
	--dx-card-border-color: var(--dx-light-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-light-bg-subtle), 0 4px 6px -4px var(--dx-light-bg-subtle);
	--dx-link-color-rgb: var(--dx-light-rgb);
	--prefixlink-hover-color-rgb: var(--dx-light-rgb)
}

.card-light {
	--dx-link-color-rgb: var(--dx-light-rgb)
}

.card-light .icon-bg {
	background-color: var(--dx-light);
	color: #0e0f0f
}

.card-light:hover {
	--dx-card-border-color: var(--dx-light-border-subtle);
	color: #0e0f0f;
	--dx-link-color-rgb: #0e0f0f
}

.card-light:hover .icon-bg {
	background-color: #ffffff25
}

.card-light:hover .icon-hover-bg {
	background-color: var(--dx-light)
}

.card-sub-light {
	--dx-link-color-rgb: var(--dx-light-rgb)
}

.card-sub-light .icon-bg {
	background-color: var(--dx-light-bg-subtle);
	color: var(--dx-light)
}

.card-sub-light:hover {
	color: var(--dx-light);
	--dx-card-border-color: var(--dx-light-border-subtle)
}

.card-sub-light:hover .icon-hover-bg {
	background-color: rgba(var(--dx-light-rgb), .08)
}

.card-hover-light {
	--dx-link-color-rgb: var(--dx-light-rgb)
}

.card-hover-light .icon-bg {
	background-color: var(--dx-light-bg-subtle);
	color: var(--dx-light)
}

.card-border-dark {
	--dx-card-border-color: var(--dx-dark-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-dark-bg-subtle), 0 4px 6px -4px var(--dx-dark-bg-subtle);
	--dx-link-color-rgb: var(--dx-dark-rgb);
	--prefixlink-hover-color-rgb: var(--dx-dark-rgb)
}

.card-dark {
	--dx-link-color-rgb: var(--dx-dark-rgb)
}

.card-dark .icon-bg {
	background-color: var(--dx-dark);
	color: #fff
}

.card-dark:hover {
	--dx-card-border-color: var(--dx-dark-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-dark:hover .icon-bg {
	background-color: #ffffff25
}

.card-dark:hover .icon-hover-bg {
	background-color: var(--dx-dark)
}

.card-sub-dark {
	--dx-link-color-rgb: var(--dx-dark-rgb)
}

.card-sub-dark .icon-bg {
	background-color: var(--dx-dark-bg-subtle);
	color: var(--dx-dark)
}

.card-sub-dark:hover {
	color: var(--dx-dark);
	--dx-card-border-color: var(--dx-dark-border-subtle)
}

.card-sub-dark:hover .icon-hover-bg {
	background-color: rgba(var(--dx-dark-rgb), .08)
}

.card-hover-dark {
	--dx-link-color-rgb: var(--dx-dark-rgb)
}

.card-hover-dark .icon-bg {
	background-color: var(--dx-dark-bg-subtle);
	color: var(--dx-dark)
}

.card-border-pink {
	--dx-card-border-color: var(--dx-pink-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-pink-bg-subtle), 0 4px 6px -4px var(--dx-pink-bg-subtle);
	--dx-link-color-rgb: var(--dx-pink-rgb);
	--prefixlink-hover-color-rgb: var(--dx-pink-rgb)
}

.card-pink {
	--dx-link-color-rgb: var(--dx-pink-rgb)
}

.card-pink .icon-bg {
	background-color: var(--dx-pink);
	color: #fff
}

.card-pink:hover {
	--dx-card-border-color: var(--dx-pink-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-pink:hover .icon-bg {
	background-color: #ffffff25
}

.card-pink:hover .icon-hover-bg {
	background-color: var(--dx-pink)
}

.card-sub-pink {
	--dx-link-color-rgb: var(--dx-pink-rgb)
}

.card-sub-pink .icon-bg {
	background-color: var(--dx-pink-bg-subtle);
	color: var(--dx-pink)
}

.card-sub-pink:hover {
	color: var(--dx-pink);
	--dx-card-border-color: var(--dx-pink-border-subtle)
}

.card-sub-pink:hover .icon-hover-bg {
	background-color: rgba(var(--dx-pink-rgb), .08)
}

.card-hover-pink {
	--dx-link-color-rgb: var(--dx-pink-rgb)
}

.card-hover-pink .icon-bg {
	background-color: var(--dx-pink-bg-subtle);
	color: var(--dx-pink)
}

.card-border-orange {
	--dx-card-border-color: var(--dx-orange-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-orange-bg-subtle), 0 4px 6px -4px var(--dx-orange-bg-subtle);
	--dx-link-color-rgb: var(--dx-orange-rgb);
	--prefixlink-hover-color-rgb: var(--dx-orange-rgb)
}

.card-orange {
	--dx-link-color-rgb: var(--dx-orange-rgb)
}

.card-orange .icon-bg {
	background-color: var(--dx-orange);
	color: #fff
}

.card-orange:hover {
	--dx-card-border-color: var(--dx-orange-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-orange:hover .icon-bg {
	background-color: #ffffff25
}

.card-orange:hover .icon-hover-bg {
	background-color: var(--dx-orange)
}

.card-sub-orange {
	--dx-link-color-rgb: var(--dx-orange-rgb)
}

.card-sub-orange .icon-bg {
	background-color: var(--dx-orange-bg-subtle);
	color: var(--dx-orange)
}

.card-sub-orange:hover {
	color: var(--dx-orange);
	--dx-card-border-color: var(--dx-orange-border-subtle)
}

.card-sub-orange:hover .icon-hover-bg {
	background-color: rgba(var(--dx-orange-rgb), .08)
}

.card-hover-orange {
	--dx-link-color-rgb: var(--dx-orange-rgb)
}

.card-hover-orange .icon-bg {
	background-color: var(--dx-orange-bg-subtle);
	color: var(--dx-orange)
}

.card-border-indigo {
	--dx-card-border-color: var(--dx-indigo-border-subtle);
	box-shadow: 0 10px 15px -3px var(--dx-indigo-bg-subtle), 0 4px 6px -4px var(--dx-indigo-bg-subtle);
	--dx-link-color-rgb: var(--dx-indigo-rgb);
	--prefixlink-hover-color-rgb: var(--dx-indigo-rgb)
}

.card-indigo {
	--dx-link-color-rgb: var(--dx-indigo-rgb)
}

.card-indigo .icon-bg {
	background-color: var(--dx-indigo);
	color: #fff
}

.card-indigo:hover {
	--dx-card-border-color: var(--dx-indigo-border-subtle);
	color: #fff;
	--dx-link-color-rgb: #fff
}

.card-indigo:hover .icon-bg {
	background-color: #ffffff25
}

.card-indigo:hover .icon-hover-bg {
	background-color: var(--dx-indigo)
}

.card-sub-indigo {
	--dx-link-color-rgb: var(--dx-indigo-rgb)
}

.card-sub-indigo .icon-bg {
	background-color: var(--dx-indigo-bg-subtle);
	color: var(--dx-indigo)
}

.card-sub-indigo:hover {
	color: var(--dx-indigo);
	--dx-card-border-color: var(--dx-indigo-border-subtle)
}

.card-sub-indigo:hover .icon-hover-bg {
	background-color: rgba(var(--dx-indigo-rgb), .08)
}

.card-hover-indigo {
	--dx-link-color-rgb: var(--dx-indigo-rgb)
}

.card-hover-indigo .icon-bg {
	background-color: var(--dx-indigo-bg-subtle);
	color: var(--dx-indigo)
}

.dropdown-primary .dropdown-item:hover {
	color: var(--dx-primary);
	background-color: rgba(var(--dx-primary-rgb), .1)
}

.dropdown-secondary .dropdown-item:hover {
	color: var(--dx-secondary);
	background-color: rgba(var(--dx-secondary-rgb), .1)
}

.dropdown-success .dropdown-item:hover {
	color: var(--dx-success);
	background-color: rgba(var(--dx-success-rgb), .1)
}

.dropdown-info .dropdown-item:hover {
	color: var(--dx-info);
	background-color: rgba(var(--dx-info-rgb), .1)
}

.dropdown-warning .dropdown-item:hover {
	color: var(--dx-warning);
	background-color: rgba(var(--dx-warning-rgb), .1)
}

.dropdown-danger .dropdown-item:hover {
	color: var(--dx-danger);
	background-color: rgba(var(--dx-danger-rgb), .1)
}

.dropdown-light .dropdown-item:hover {
	color: var(--dx-light);
	background-color: rgba(var(--dx-light-rgb), .1)
}

.dropdown-dark .dropdown-item:hover {
	color: var(--dx-dark);
	background-color: rgba(var(--dx-dark-rgb), .1)
}

.dropdown-pink .dropdown-item:hover {
	color: var(--dx-pink);
	background-color: rgba(var(--dx-pink-rgb), .1)
}

.dropdown-orange .dropdown-item:hover {
	color: var(--dx-orange);
	background-color: rgba(var(--dx-orange-rgb), .1)
}

.dropdown-indigo .dropdown-item:hover {
	color: var(--dx-indigo);
	background-color: rgba(var(--dx-indigo-rgb), .1)
}

.nav-primary {
	--dx-nav-pills-link-active-bg: var(--dx-primary);
	--dx-nav-link-hover-color: var(--dx-primary);
	--dx-nav-underline-link-active-color: var(--dx-primary);
	--dx-nav-pills-link-active-color: #fff
}

.nav-secondary {
	--dx-nav-pills-link-active-bg: var(--dx-secondary);
	--dx-nav-link-hover-color: var(--dx-secondary);
	--dx-nav-underline-link-active-color: var(--dx-secondary);
	--dx-nav-pills-link-active-color: #fff
}

.nav-success {
	--dx-nav-pills-link-active-bg: var(--dx-success);
	--dx-nav-link-hover-color: var(--dx-success);
	--dx-nav-underline-link-active-color: var(--dx-success);
	--dx-nav-pills-link-active-color: #fff
}

.nav-info {
	--dx-nav-pills-link-active-bg: var(--dx-info);
	--dx-nav-link-hover-color: var(--dx-info);
	--dx-nav-underline-link-active-color: var(--dx-info);
	--dx-nav-pills-link-active-color: #fff
}

.nav-warning {
	--dx-nav-pills-link-active-bg: var(--dx-warning);
	--dx-nav-link-hover-color: var(--dx-warning);
	--dx-nav-underline-link-active-color: var(--dx-warning);
	--dx-nav-pills-link-active-color: #fff
}

.nav-danger {
	--dx-nav-pills-link-active-bg: var(--dx-danger);
	--dx-nav-link-hover-color: var(--dx-danger);
	--dx-nav-underline-link-active-color: var(--dx-danger);
	--dx-nav-pills-link-active-color: #fff
}

.nav-light {
	--dx-nav-pills-link-active-bg: var(--dx-light);
	--dx-nav-link-hover-color: var(--dx-light);
	--dx-nav-underline-link-active-color: var(--dx-light);
	--dx-nav-pills-link-active-color: #fff;
	--dx-nav-pills-link-active-color: var(--dx-body-color);
	--dx-nav-link-hover-color: var(--dx-body-color)
}

.nav-dark {
	--dx-nav-pills-link-active-bg: var(--dx-dark);
	--dx-nav-link-hover-color: var(--dx-dark);
	--dx-nav-underline-link-active-color: var(--dx-dark);
	--dx-nav-pills-link-active-color: #fff
}

.nav-pink {
	--dx-nav-pills-link-active-bg: var(--dx-pink);
	--dx-nav-link-hover-color: var(--dx-pink);
	--dx-nav-underline-link-active-color: var(--dx-pink);
	--dx-nav-pills-link-active-color: #fff
}

.nav-orange {
	--dx-nav-pills-link-active-bg: var(--dx-orange);
	--dx-nav-link-hover-color: var(--dx-orange);
	--dx-nav-underline-link-active-color: var(--dx-orange);
	--dx-nav-pills-link-active-color: #fff
}

.nav-indigo {
	--dx-nav-pills-link-active-bg: var(--dx-indigo);
	--dx-nav-link-hover-color: var(--dx-indigo);
	--dx-nav-underline-link-active-color: var(--dx-indigo);
	--dx-nav-pills-link-active-color: #fff
}

.pagination-primary {
	--dx-pagination-active-bg: var(--dx-primary);
	--dx-pagination-active-border-color: var(--dx-primary);
	--dx-pagination-focus-bg: var(--dx-primary);
	--dx-pagination-hover-bg: var(--dx-primary)
}

.pagination-primary.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-primary);
	--dx-pagination-active-color: var(--dx-primary);
	--dx-pagination-focus-color: var(--dx-primary)
}

.pagination-solid-primary .page-link {
	background-color: var(--dx-primary)
}

.pagination-secondary {
	--dx-pagination-active-bg: var(--dx-secondary);
	--dx-pagination-active-border-color: var(--dx-secondary);
	--dx-pagination-focus-bg: var(--dx-secondary);
	--dx-pagination-hover-bg: var(--dx-secondary)
}

.pagination-secondary.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-secondary);
	--dx-pagination-active-color: var(--dx-secondary);
	--dx-pagination-focus-color: var(--dx-secondary)
}

.pagination-solid-secondary .page-link {
	background-color: var(--dx-secondary)
}

.pagination-success {
	--dx-pagination-active-bg: var(--dx-success);
	--dx-pagination-active-border-color: var(--dx-success);
	--dx-pagination-focus-bg: var(--dx-success);
	--dx-pagination-hover-bg: var(--dx-success)
}

.pagination-success.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-success);
	--dx-pagination-active-color: var(--dx-success);
	--dx-pagination-focus-color: var(--dx-success)
}

.pagination-solid-success .page-link {
	background-color: var(--dx-success)
}

.pagination-info {
	--dx-pagination-active-bg: var(--dx-info);
	--dx-pagination-active-border-color: var(--dx-info);
	--dx-pagination-focus-bg: var(--dx-info);
	--dx-pagination-hover-bg: var(--dx-info)
}

.pagination-info.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-info);
	--dx-pagination-active-color: var(--dx-info);
	--dx-pagination-focus-color: var(--dx-info)
}

.pagination-solid-info .page-link {
	background-color: var(--dx-info)
}

.pagination-warning {
	--dx-pagination-active-bg: var(--dx-warning);
	--dx-pagination-active-border-color: var(--dx-warning);
	--dx-pagination-focus-bg: var(--dx-warning);
	--dx-pagination-hover-bg: var(--dx-warning)
}

.pagination-warning.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-warning);
	--dx-pagination-active-color: var(--dx-warning);
	--dx-pagination-focus-color: var(--dx-warning)
}

.pagination-solid-warning .page-link {
	background-color: var(--dx-warning)
}

.pagination-danger {
	--dx-pagination-active-bg: var(--dx-danger);
	--dx-pagination-active-border-color: var(--dx-danger);
	--dx-pagination-focus-bg: var(--dx-danger);
	--dx-pagination-hover-bg: var(--dx-danger)
}

.pagination-danger.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-danger);
	--dx-pagination-active-color: var(--dx-danger);
	--dx-pagination-focus-color: var(--dx-danger)
}

.pagination-solid-danger .page-link {
	background-color: var(--dx-danger)
}

.pagination-light {
	--dx-pagination-active-bg: var(--dx-light);
	--dx-pagination-active-border-color: var(--dx-light);
	--dx-pagination-focus-bg: var(--dx-light);
	--dx-pagination-hover-bg: var(--dx-light)
}

.pagination-light.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-light);
	--dx-pagination-active-color: var(--dx-light);
	--dx-pagination-focus-color: var(--dx-light)
}

.pagination-solid-light .page-link {
	background-color: var(--dx-light)
}

.pagination-dark {
	--dx-pagination-active-bg: var(--dx-dark);
	--dx-pagination-active-border-color: var(--dx-dark);
	--dx-pagination-focus-bg: var(--dx-dark);
	--dx-pagination-hover-bg: var(--dx-dark)
}

.pagination-dark.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-dark);
	--dx-pagination-active-color: var(--dx-dark);
	--dx-pagination-focus-color: var(--dx-dark)
}

.pagination-solid-dark .page-link {
	background-color: var(--dx-dark)
}

.pagination-pink {
	--dx-pagination-active-bg: var(--dx-pink);
	--dx-pagination-active-border-color: var(--dx-pink);
	--dx-pagination-focus-bg: var(--dx-pink);
	--dx-pagination-hover-bg: var(--dx-pink)
}

.pagination-pink.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-pink);
	--dx-pagination-active-color: var(--dx-pink);
	--dx-pagination-focus-color: var(--dx-pink)
}

.pagination-solid-pink .page-link {
	background-color: var(--dx-pink)
}

.pagination-orange {
	--dx-pagination-active-bg: var(--dx-orange);
	--dx-pagination-active-border-color: var(--dx-orange);
	--dx-pagination-focus-bg: var(--dx-orange);
	--dx-pagination-hover-bg: var(--dx-orange)
}

.pagination-orange.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-orange);
	--dx-pagination-active-color: var(--dx-orange);
	--dx-pagination-focus-color: var(--dx-orange)
}

.pagination-solid-orange .page-link {
	background-color: var(--dx-orange)
}

.pagination-indigo {
	--dx-pagination-active-bg: var(--dx-indigo);
	--dx-pagination-active-border-color: var(--dx-indigo);
	--dx-pagination-focus-bg: var(--dx-indigo);
	--dx-pagination-hover-bg: var(--dx-indigo)
}

.pagination-indigo.light-pagination .page-item:is(:first-child, :last-child) {
	--dx-pagination-hover-color: var(--dx-indigo);
	--dx-pagination-active-color: var(--dx-indigo);
	--dx-pagination-focus-color: var(--dx-indigo)
}

.pagination-solid-indigo .page-link {
	background-color: var(--dx-indigo)
}

.tooltip-primary {
	--dx-tooltip-bg: var(--dx-primary);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-secondary {
	--dx-tooltip-bg: var(--dx-secondary);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-success {
	--dx-tooltip-bg: var(--dx-success);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-info {
	--dx-tooltip-bg: var(--dx-info);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-warning {
	--dx-tooltip-bg: var(--dx-warning);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-danger {
	--dx-tooltip-bg: var(--dx-danger);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-light {
	--dx-tooltip-bg: var(--dx-light);
	--dx-tooltip-color: var(--dx-white);
	--dx-tooltip-color: #000
}

.tooltip-dark {
	--dx-tooltip-bg: var(--dx-dark);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-pink {
	--dx-tooltip-bg: var(--dx-pink);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-orange {
	--dx-tooltip-bg: var(--dx-orange);
	--dx-tooltip-color: var(--dx-white)
}

.tooltip-indigo {
	--dx-tooltip-bg: var(--dx-indigo);
	--dx-tooltip-color: var(--dx-white)
}

.link-primary {
	color: var(--dx-primary) !important
}

.link-primary:hover {
	color: var(--dx-primary-text-emphasis) !important
}

.link-custom-primary {
	color: var(--dx-secondary-color) !important
}

.link-custom-primary:hover {
	color: var(--dx-primary) !important
}

.link-secondary {
	color: var(--dx-secondary) !important
}

.link-secondary:hover {
	color: var(--dx-secondary-text-emphasis) !important
}

.link-custom-secondary {
	color: var(--dx-secondary-color) !important
}

.link-custom-secondary:hover {
	color: var(--dx-secondary) !important
}

.link-success {
	color: var(--dx-success) !important
}

.link-success:hover {
	color: var(--dx-success-text-emphasis) !important
}

.link-custom-success {
	color: var(--dx-secondary-color) !important
}

.link-custom-success:hover {
	color: var(--dx-success) !important
}

.link-info {
	color: var(--dx-info) !important
}

.link-info:hover {
	color: var(--dx-info-text-emphasis) !important
}

.link-custom-info {
	color: var(--dx-secondary-color) !important
}

.link-custom-info:hover {
	color: var(--dx-info) !important
}

.link-warning {
	color: var(--dx-warning) !important
}

.link-warning:hover {
	color: var(--dx-warning-text-emphasis) !important
}

.link-custom-warning {
	color: var(--dx-secondary-color) !important
}

.link-custom-warning:hover {
	color: var(--dx-warning) !important
}

.link-danger {
	color: var(--dx-danger) !important
}

.link-danger:hover {
	color: var(--dx-danger-text-emphasis) !important
}

.link-custom-danger {
	color: var(--dx-secondary-color) !important
}

.link-custom-danger:hover {
	color: var(--dx-danger) !important
}

.link-light {
	color: var(--dx-light) !important
}

.link-light:hover {
	color: var(--dx-light-text-emphasis) !important
}

.link-custom-light {
	color: var(--dx-secondary-color) !important
}

.link-custom-light:hover {
	color: var(--dx-light) !important
}

.link-dark {
	color: var(--dx-dark) !important
}

.link-dark:hover {
	color: var(--dx-dark-text-emphasis) !important
}

.link-custom-dark {
	color: var(--dx-secondary-color) !important
}

.link-custom-dark:hover {
	color: var(--dx-dark) !important
}

.link-pink {
	color: var(--dx-pink) !important
}

.link-pink:hover {
	color: var(--dx-pink-text-emphasis) !important
}

.link-custom-pink {
	color: var(--dx-secondary-color) !important
}

.link-custom-pink:hover {
	color: var(--dx-pink) !important
}

.link-orange {
	color: var(--dx-orange) !important
}

.link-orange:hover {
	color: var(--dx-orange-text-emphasis) !important
}

.link-custom-orange {
	color: var(--dx-secondary-color) !important
}

.link-custom-orange:hover {
	color: var(--dx-orange) !important
}

.link-indigo {
	color: var(--dx-indigo) !important
}

.link-indigo:hover {
	color: var(--dx-indigo-text-emphasis) !important
}

.link-custom-indigo {
	color: var(--dx-secondary-color) !important
}

.link-custom-indigo:hover {
	color: var(--dx-indigo) !important
}

.switch-outline-primary input:checked+label:after {
	background-color: var(--dx-primary)
}

.switch-soft-primary input:checked+label:after {
	background-color: var(--dx-primary)
}

.switch-light-primary input:checked+label {
	background: var(--dx-primary-bg-subtle);
	border: 1px solid var(--dx-primary-bg-subtle)
}

.switch-light-primary input:checked+label:after {
	background-color: var(--dx-primary)
}

.switch-solid-primary input:checked+label {
	background: var(--dx-primary);
	border: 1px solid var(--dx-primary)
}

.switch-effect-primary input:checked+label:after {
	background-color: var(--dx-primary)
}

.switch-outline-secondary input:checked+label:after {
	background-color: var(--dx-secondary)
}

.switch-soft-secondary input:checked+label:after {
	background-color: var(--dx-secondary)
}

.switch-light-secondary input:checked+label {
	background: var(--dx-secondary-bg-subtle);
	border: 1px solid var(--dx-secondary-bg-subtle)
}

.switch-light-secondary input:checked+label:after {
	background-color: var(--dx-secondary)
}

.switch-solid-secondary input:checked+label {
	background: var(--dx-secondary);
	border: 1px solid var(--dx-secondary)
}

.switch-effect-secondary input:checked+label:after {
	background-color: var(--dx-secondary)
}

.switch-outline-success input:checked+label:after {
	background-color: var(--dx-success)
}

.switch-soft-success input:checked+label:after {
	background-color: var(--dx-success)
}

.switch-light-success input:checked+label {
	background: var(--dx-success-bg-subtle);
	border: 1px solid var(--dx-success-bg-subtle)
}

.switch-light-success input:checked+label:after {
	background-color: var(--dx-success)
}

.switch-solid-success input:checked+label {
	background: var(--dx-success);
	border: 1px solid var(--dx-success)
}

.switch-effect-success input:checked+label:after {
	background-color: var(--dx-success)
}

.switch-outline-info input:checked+label:after {
	background-color: var(--dx-info)
}

.switch-soft-info input:checked+label:after {
	background-color: var(--dx-info)
}

.switch-light-info input:checked+label {
	background: var(--dx-info-bg-subtle);
	border: 1px solid var(--dx-info-bg-subtle)
}

.switch-light-info input:checked+label:after {
	background-color: var(--dx-info)
}

.switch-solid-info input:checked+label {
	background: var(--dx-info);
	border: 1px solid var(--dx-info)
}

.switch-effect-info input:checked+label:after {
	background-color: var(--dx-info)
}

.switch-outline-warning input:checked+label:after {
	background-color: var(--dx-warning)
}

.switch-soft-warning input:checked+label:after {
	background-color: var(--dx-warning)
}

.switch-light-warning input:checked+label {
	background: var(--dx-warning-bg-subtle);
	border: 1px solid var(--dx-warning-bg-subtle)
}

.switch-light-warning input:checked+label:after {
	background-color: var(--dx-warning)
}

.switch-solid-warning input:checked+label {
	background: var(--dx-warning);
	border: 1px solid var(--dx-warning)
}

.switch-effect-warning input:checked+label:after {
	background-color: var(--dx-warning)
}

.switch-outline-danger input:checked+label:after {
	background-color: var(--dx-danger)
}

.switch-soft-danger input:checked+label:after {
	background-color: var(--dx-danger)
}

.switch-light-danger input:checked+label {
	background: var(--dx-danger-bg-subtle);
	border: 1px solid var(--dx-danger-bg-subtle)
}

.switch-light-danger input:checked+label:after {
	background-color: var(--dx-danger)
}

.switch-solid-danger input:checked+label {
	background: var(--dx-danger);
	border: 1px solid var(--dx-danger)
}

.switch-effect-danger input:checked+label:after {
	background-color: var(--dx-danger)
}

.switch-outline-light input:checked+label:after {
	background-color: var(--dx-light)
}

.switch-soft-light input:checked+label:after {
	background-color: var(--dx-light)
}

.switch-light-light input:checked+label {
	background: var(--dx-light-bg-subtle);
	border: 1px solid var(--dx-light-bg-subtle)
}

.switch-light-light input:checked+label:after {
	background-color: var(--dx-light)
}

.switch-solid-light input:checked+label {
	background: var(--dx-light);
	border: 1px solid var(--dx-light)
}

.switch-effect-light input:checked+label:after {
	background-color: var(--dx-light)
}

.switch-outline-dark input:checked+label:after {
	background-color: var(--dx-dark)
}

.switch-soft-dark input:checked+label:after {
	background-color: var(--dx-dark)
}

.switch-light-dark input:checked+label {
	background: var(--dx-dark-bg-subtle);
	border: 1px solid var(--dx-dark-bg-subtle)
}

.switch-light-dark input:checked+label:after {
	background-color: var(--dx-dark)
}

.switch-solid-dark input:checked+label {
	background: var(--dx-dark);
	border: 1px solid var(--dx-dark)
}

.switch-effect-dark input:checked+label:after {
	background-color: var(--dx-dark)
}

.switch-outline-pink input:checked+label:after {
	background-color: var(--dx-pink)
}

.switch-soft-pink input:checked+label:after {
	background-color: var(--dx-pink)
}

.switch-light-pink input:checked+label {
	background: var(--dx-pink-bg-subtle);
	border: 1px solid var(--dx-pink-bg-subtle)
}

.switch-light-pink input:checked+label:after {
	background-color: var(--dx-pink)
}

.switch-solid-pink input:checked+label {
	background: var(--dx-pink);
	border: 1px solid var(--dx-pink)
}

.switch-effect-pink input:checked+label:after {
	background-color: var(--dx-pink)
}

.switch-outline-orange input:checked+label:after {
	background-color: var(--dx-orange)
}

.switch-soft-orange input:checked+label:after {
	background-color: var(--dx-orange)
}

.switch-light-orange input:checked+label {
	background: var(--dx-orange-bg-subtle);
	border: 1px solid var(--dx-orange-bg-subtle)
}

.switch-light-orange input:checked+label:after {
	background-color: var(--dx-orange)
}

.switch-solid-orange input:checked+label {
	background: var(--dx-orange);
	border: 1px solid var(--dx-orange)
}

.switch-effect-orange input:checked+label:after {
	background-color: var(--dx-orange)
}

.switch-outline-indigo input:checked+label:after {
	background-color: var(--dx-indigo)
}

.switch-soft-indigo input:checked+label:after {
	background-color: var(--dx-indigo)
}

.switch-light-indigo input:checked+label {
	background: var(--dx-indigo-bg-subtle);
	border: 1px solid var(--dx-indigo-bg-subtle)
}

.switch-light-indigo input:checked+label:after {
	background-color: var(--dx-indigo)
}

.switch-solid-indigo input:checked+label {
	background: var(--dx-indigo);
	border: 1px solid var(--dx-indigo)
}

.switch-effect-indigo input:checked+label:after {
	background-color: var(--dx-indigo)
}

.check-primary .form-check-input:checked {
	background-color: var(--dx-primary);
	border-color: var(--dx-primary)
}

.check-soft-primary .form-check-input {
	--dx-border-color: rgba(var(--dx-primary-rgb), .2);
	--dx-form-check-bg: var(--dx-primary-bg-subtle)
}

.check-soft-primary .form-check-input:checked {
	background-color: var(--dx-primary);
	border-color: var(--dx-primary)
}

.radio-primary .form-check-input:checked {
	background-color: var(--dx-primary);
	border-color: var(--dx-primary)
}

.radio-soft-primary .form-check-input {
	--dx-border-color: rgba(var(--dx-primary-rgb), .2);
	--dx-form-check-bg: var(--dx-primary-bg-subtle)
}

.radio-soft-primary .form-check-input:focus {
	box-shadow: none
}

.radio-soft-primary .form-check-input:checked {
	background-color: var(--dx-primary);
	border-color: var(--dx-primary)
}

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

.check-soft-secondary .form-check-input {
	--dx-border-color: rgba(var(--dx-secondary-rgb), .2);
	--dx-form-check-bg: var(--dx-secondary-bg-subtle)
}

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

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

.radio-soft-secondary .form-check-input {
	--dx-border-color: rgba(var(--dx-secondary-rgb), .2);
	--dx-form-check-bg: var(--dx-secondary-bg-subtle)
}

.radio-soft-secondary .form-check-input:focus {
	box-shadow: none
}

.radio-soft-secondary .form-check-input:checked {
	background-color: var(--dx-secondary);
	border-color: var(--dx-secondary)
}

.check-success .form-check-input:checked {
	background-color: var(--dx-success);
	border-color: var(--dx-success)
}

.check-soft-success .form-check-input {
	--dx-border-color: rgba(var(--dx-success-rgb), .2);
	--dx-form-check-bg: var(--dx-success-bg-subtle)
}

.check-soft-success .form-check-input:checked {
	background-color: var(--dx-success);
	border-color: var(--dx-success)
}

.radio-success .form-check-input:checked {
	background-color: var(--dx-success);
	border-color: var(--dx-success)
}

.radio-soft-success .form-check-input {
	--dx-border-color: rgba(var(--dx-success-rgb), .2);
	--dx-form-check-bg: var(--dx-success-bg-subtle)
}

.radio-soft-success .form-check-input:focus {
	box-shadow: none
}

.radio-soft-success .form-check-input:checked {
	background-color: var(--dx-success);
	border-color: var(--dx-success)
}

.check-info .form-check-input:checked {
	background-color: var(--dx-info);
	border-color: var(--dx-info)
}

.check-soft-info .form-check-input {
	--dx-border-color: rgba(var(--dx-info-rgb), .2);
	--dx-form-check-bg: var(--dx-info-bg-subtle)
}

.check-soft-info .form-check-input:checked {
	background-color: var(--dx-info);
	border-color: var(--dx-info)
}

.radio-info .form-check-input:checked {
	background-color: var(--dx-info);
	border-color: var(--dx-info)
}

.radio-soft-info .form-check-input {
	--dx-border-color: rgba(var(--dx-info-rgb), .2);
	--dx-form-check-bg: var(--dx-info-bg-subtle)
}

.radio-soft-info .form-check-input:focus {
	box-shadow: none
}

.radio-soft-info .form-check-input:checked {
	background-color: var(--dx-info);
	border-color: var(--dx-info)
}

.check-warning .form-check-input:checked {
	background-color: var(--dx-warning);
	border-color: var(--dx-warning)
}

.check-soft-warning .form-check-input {
	--dx-border-color: rgba(var(--dx-warning-rgb), .2);
	--dx-form-check-bg: var(--dx-warning-bg-subtle)
}

.check-soft-warning .form-check-input:checked {
	background-color: var(--dx-warning);
	border-color: var(--dx-warning)
}

.radio-warning .form-check-input:checked {
	background-color: var(--dx-warning);
	border-color: var(--dx-warning)
}

.radio-soft-warning .form-check-input {
	--dx-border-color: rgba(var(--dx-warning-rgb), .2);
	--dx-form-check-bg: var(--dx-warning-bg-subtle)
}

.radio-soft-warning .form-check-input:focus {
	box-shadow: none
}

.radio-soft-warning .form-check-input:checked {
	background-color: var(--dx-warning);
	border-color: var(--dx-warning)
}

.check-danger .form-check-input:checked {
	background-color: var(--dx-danger);
	border-color: var(--dx-danger)
}

.check-soft-danger .form-check-input {
	--dx-border-color: rgba(var(--dx-danger-rgb), .2);
	--dx-form-check-bg: var(--dx-danger-bg-subtle)
}

.check-soft-danger .form-check-input:checked {
	background-color: var(--dx-danger);
	border-color: var(--dx-danger)
}

.radio-danger .form-check-input:checked {
	background-color: var(--dx-danger);
	border-color: var(--dx-danger)
}

.radio-soft-danger .form-check-input {
	--dx-border-color: rgba(var(--dx-danger-rgb), .2);
	--dx-form-check-bg: var(--dx-danger-bg-subtle)
}

.radio-soft-danger .form-check-input:focus {
	box-shadow: none
}

.radio-soft-danger .form-check-input:checked {
	background-color: var(--dx-danger);
	border-color: var(--dx-danger)
}

.check-light .form-check-input:checked {
	background-color: var(--dx-light);
	border-color: var(--dx-light)
}

.check-soft-light .form-check-input {
	--dx-border-color: rgba(var(--dx-light-rgb), .2);
	--dx-form-check-bg: var(--dx-light-bg-subtle)
}

.check-soft-light .form-check-input:checked {
	background-color: var(--dx-light);
	border-color: var(--dx-light)
}

.radio-light .form-check-input:checked {
	background-color: var(--dx-light);
	border-color: var(--dx-light)
}

.radio-soft-light .form-check-input {
	--dx-border-color: rgba(var(--dx-light-rgb), .2);
	--dx-form-check-bg: var(--dx-light-bg-subtle)
}

.radio-soft-light .form-check-input:focus {
	box-shadow: none
}

.radio-soft-light .form-check-input:checked {
	background-color: var(--dx-light);
	border-color: var(--dx-light)
}

.check-dark .form-check-input:checked {
	background-color: var(--dx-dark);
	border-color: var(--dx-dark)
}

.check-soft-dark .form-check-input {
	--dx-border-color: rgba(var(--dx-dark-rgb), .2);
	--dx-form-check-bg: var(--dx-dark-bg-subtle)
}

.check-soft-dark .form-check-input:checked {
	background-color: var(--dx-dark);
	border-color: var(--dx-dark)
}

.radio-dark .form-check-input:checked {
	background-color: var(--dx-dark);
	border-color: var(--dx-dark)
}

.radio-soft-dark .form-check-input {
	--dx-border-color: rgba(var(--dx-dark-rgb), .2);
	--dx-form-check-bg: var(--dx-dark-bg-subtle)
}

.radio-soft-dark .form-check-input:focus {
	box-shadow: none
}

.radio-soft-dark .form-check-input:checked {
	background-color: var(--dx-dark);
	border-color: var(--dx-dark)
}

.check-pink .form-check-input:checked {
	background-color: var(--dx-pink);
	border-color: var(--dx-pink)
}

.check-soft-pink .form-check-input {
	--dx-border-color: rgba(var(--dx-pink-rgb), .2);
	--dx-form-check-bg: var(--dx-pink-bg-subtle)
}

.check-soft-pink .form-check-input:checked {
	background-color: var(--dx-pink);
	border-color: var(--dx-pink)
}

.radio-pink .form-check-input:checked {
	background-color: var(--dx-pink);
	border-color: var(--dx-pink)
}

.radio-soft-pink .form-check-input {
	--dx-border-color: rgba(var(--dx-pink-rgb), .2);
	--dx-form-check-bg: var(--dx-pink-bg-subtle)
}

.radio-soft-pink .form-check-input:focus {
	box-shadow: none
}

.radio-soft-pink .form-check-input:checked {
	background-color: var(--dx-pink);
	border-color: var(--dx-pink)
}

.check-orange .form-check-input:checked {
	background-color: var(--dx-orange);
	border-color: var(--dx-orange)
}

.check-soft-orange .form-check-input {
	--dx-border-color: rgba(var(--dx-orange-rgb), .2);
	--dx-form-check-bg: var(--dx-orange-bg-subtle)
}

.check-soft-orange .form-check-input:checked {
	background-color: var(--dx-orange);
	border-color: var(--dx-orange)
}

.radio-orange .form-check-input:checked {
	background-color: var(--dx-orange);
	border-color: var(--dx-orange)
}

.radio-soft-orange .form-check-input {
	--dx-border-color: rgba(var(--dx-orange-rgb), .2);
	--dx-form-check-bg: var(--dx-orange-bg-subtle)
}

.radio-soft-orange .form-check-input:focus {
	box-shadow: none
}

.radio-soft-orange .form-check-input:checked {
	background-color: var(--dx-orange);
	border-color: var(--dx-orange)
}

.check-indigo .form-check-input:checked {
	background-color: var(--dx-indigo);
	border-color: var(--dx-indigo)
}

.check-soft-indigo .form-check-input {
	--dx-border-color: rgba(var(--dx-indigo-rgb), .2);
	--dx-form-check-bg: var(--dx-indigo-bg-subtle)
}

.check-soft-indigo .form-check-input:checked {
	background-color: var(--dx-indigo);
	border-color: var(--dx-indigo)
}

.radio-indigo .form-check-input:checked {
	background-color: var(--dx-indigo);
	border-color: var(--dx-indigo)
}

.radio-soft-indigo .form-check-input {
	--dx-border-color: rgba(var(--dx-indigo-rgb), .2);
	--dx-form-check-bg: var(--dx-indigo-bg-subtle)
}

.radio-soft-indigo .form-check-input:focus {
	box-shadow: none
}

.radio-soft-indigo .form-check-input:checked {
	background-color: var(--dx-indigo);
	border-color: var(--dx-indigo)
}

.input-spin-primary button:hover svg {
	color: var(--dx-primary)
}

.input-solid-primary .input-spin-plus,
.input-solid-primary .input-spin-minus {
	background-color: var(--dx-primary) !important;
	color: #fff
}

.input-spin-secondary button:hover svg {
	color: var(--dx-secondary)
}

.input-solid-secondary .input-spin-plus,
.input-solid-secondary .input-spin-minus {
	background-color: var(--dx-secondary) !important;
	color: #fff
}

.input-spin-success button:hover svg {
	color: var(--dx-success)
}

.input-solid-success .input-spin-plus,
.input-solid-success .input-spin-minus {
	background-color: var(--dx-success) !important;
	color: #fff
}

.input-spin-info button:hover svg {
	color: var(--dx-info)
}

.input-solid-info .input-spin-plus,
.input-solid-info .input-spin-minus {
	background-color: var(--dx-info) !important;
	color: #fff
}

.input-spin-warning button:hover svg {
	color: var(--dx-warning)
}

.input-solid-warning .input-spin-plus,
.input-solid-warning .input-spin-minus {
	background-color: var(--dx-warning) !important;
	color: #fff
}

.input-spin-danger button:hover svg {
	color: var(--dx-danger)
}

.input-solid-danger .input-spin-plus,
.input-solid-danger .input-spin-minus {
	background-color: var(--dx-danger) !important;
	color: #fff
}

.input-spin-light button:hover svg {
	color: var(--dx-light)
}

.input-solid-light .input-spin-plus,
.input-solid-light .input-spin-minus {
	background-color: var(--dx-light) !important;
	color: #fff;
	color: var(--dx-secondary-color)
}

.input-spin-dark button:hover svg {
	color: var(--dx-dark)
}

.input-solid-dark .input-spin-plus,
.input-solid-dark .input-spin-minus {
	background-color: var(--dx-dark) !important;
	color: #fff
}

.input-spin-pink button:hover svg {
	color: var(--dx-pink)
}

.input-solid-pink .input-spin-plus,
.input-solid-pink .input-spin-minus {
	background-color: var(--dx-pink) !important;
	color: #fff
}

.input-spin-orange button:hover svg {
	color: var(--dx-orange)
}

.input-solid-orange .input-spin-plus,
.input-solid-orange .input-spin-minus {
	background-color: var(--dx-orange) !important;
	color: #fff
}

.input-spin-indigo button:hover svg {
	color: var(--dx-indigo)
}

.input-solid-indigo .input-spin-plus,
.input-solid-indigo .input-spin-minus {
	background-color: var(--dx-indigo) !important;
	color: #fff
}

.toast-primary {
	--dx-toast-bg: var(--dx-primary);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-primary);
	--dx-toast-border-color: var(--dx-primary);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-primary .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-secondary {
	--dx-toast-bg: var(--dx-secondary);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-secondary);
	--dx-toast-border-color: var(--dx-secondary);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-secondary .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-success {
	--dx-toast-bg: var(--dx-success);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-success);
	--dx-toast-border-color: var(--dx-success);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-success .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-info {
	--dx-toast-bg: var(--dx-info);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-info);
	--dx-toast-border-color: var(--dx-info);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-info .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-warning {
	--dx-toast-bg: var(--dx-warning);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-warning);
	--dx-toast-border-color: var(--dx-warning);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-warning .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-danger {
	--dx-toast-bg: var(--dx-danger);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-danger);
	--dx-toast-border-color: var(--dx-danger);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-danger .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-pink {
	--dx-toast-bg: var(--dx-pink);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-pink);
	--dx-toast-border-color: var(--dx-pink);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-pink .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-orange {
	--dx-toast-bg: var(--dx-orange);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-orange);
	--dx-toast-border-color: var(--dx-orange);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-orange .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.toast-indigo {
	--dx-toast-bg: var(--dx-indigo);
	--dx-toast-color: var(--dx-white);
	--dx-toast-header-bg: var(--dx-indigo);
	--dx-toast-border-color: var(--dx-indigo);
	--dx-toast-header-color: rgba(var(--dx-white-rgb), .75);
	--dx-toast-header-border-color: rgba(var(--dx-white-rgb), .15)
}

.toast-indigo .btn-close {
	--dx-btn-close-color: rgba(var(--dx-white-rgb), .75)
}

.page-wrapper {
	padding-inline: 4px;
	padding-bottom: 3.5rem;
	padding-block: calc(var(--dx-topbar) * 1.2) 3.5rem
}

@media (min-width: 992px) {
	.page-wrapper {
		margin-left: var(--dx-sidebar)
	}
}

@media (min-width: 1200px) {
	.page-wrapper {
		padding-inline: 5rem
	}
}

@media (min-width: 1536px) {
	.page-wrapper {
		padding-inline: 6.3rem
	}
}

@media (min-width: 992px) {
	[data-content-width=fluid] .page-wrapper {
		padding-inline: 15px
	}
}

.main-sidebar {
	position: fixed;
	bottom: 0;
	left: 0;
	transition: all .4s ease-in-out;
	z-index: 1005;
	top: var(--dx-topbar);
	width: var(--dx-sidebar);
	background-color: var(--dx-sidebar-bg);
	letter-spacing: .2px
}

@media (prefers-reduced-motion: reduce) {
	.main-sidebar {
		transition: none
	}
}

.main-sidebar .navbar-brand {
	display: none;
	align-items: center;
	justify-content: center;
	height: var(--dx-topbar);
	width: var(--dx-sidebar)
}

@media (max-width: 991.98px) {
	.main-sidebar {
		top: 0
	}
}

.profile-dropdown {
	display: none
}

.profile-dropdown .btn:active {
	border-color: transparent
}

.profile-dropdown .btn p {
	color: var(--dx-sidebar-link-color)
}

.profile-dropdown .profile-dropdown-menu .profile-link {
	display: block;
	transition: all .4s ease-in-out;
	padding: .5rem;
	color: var(--dx-secondary-color)
}

@media (prefers-reduced-motion: reduce) {
	.profile-dropdown .profile-dropdown-menu .profile-link {
		transition: none
	}
}

.profile-dropdown .profile-dropdown-menu .profile-link:hover {
	color: var(--dx-primary)
}

[data-profile-sidebar] .profile-dropdown {
	display: block
}

.navbar-menu {
	height: calc(100vh - 5rem)
}

[data-profile-sidebar] .navbar-menu {
	height: calc(100vh - 10rem)
}

@media (max-width: 991.98px) {
	.navbar-menu {
		height: calc(100vh - 6rem)
	}
}

.navbar-menu .simplebar-wrapper {
	margin: 0
}

.navbar-menu .simplebar-wrapper .simplebar-content {
	padding: 0 !important
}

.navbar-menu .nav-menu-title {
	padding: .375rem 1rem;
	font-size: .775rem;
	line-height: 1.25rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 2px;
	opacity: .6;
	color: var(--dx-sidebar-menu-title)
}

.navbar-menu .nav-item {
	margin: 2px 14px
}

.navbar-menu .nav-item .nav-link {
	display: flex;
	align-items: center;
	gap: .5rem;
	padding: var(--dx-sidebar-padding-y) calc(var(--dx-sidebar-padding-x) - .3125rem);
	font-size: var(--dx-sidebar-font-size);
	color: var(--dx-sidebar-link-color);
	transition: all .4s ease-in-out;
	border-radius: var(--dx-border-radius)
}

@media (prefers-reduced-motion: reduce) {
	.navbar-menu .nav-item .nav-link {
		transition: none
	}
}

.navbar-menu .nav-item .nav-link .icons {
	font-size: 20px;
	line-height: 0
}

.navbar-menu .nav-item .nav-link .icons svg {
	height: 1rem;
	width: 1rem
}

.navbar-menu .nav-item .nav-link .menu-arrow i {
	font-size: 13px
}

.navbar-menu .nav-item .nav-link[aria-expanded=true] .menu-arrow i {
	transform: rotate(180deg)
}

.navbar-menu .nav-item .nav-link:hover {
	color: var(--dx-sidebar-link-hover-color);
	background-color: var(--dx-sidebar-link-bg-hover-color)
}

.navbar-menu .nav-item .nav-link.active {
	color: var(--dx-sidebar-link-active-color);
	background-color: var(--dx-sidebar-link-bg-active-color)
}

.navbar-menu .nav-item .collapse {
	position: relative
}

.navbar-menu .nav-item .collapse:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 23.5px;
	width: 1px;
	transform: translateY(-50%);
	height: calc(100% - 30px);
	background-color: var(--dx-sidebar-link-color);
	opacity: .3
}

.navbar-menu .nav-item .nav-menu-sub {
	padding: 0;
	list-style-type: none;
	margin-left: 1.5rem;
	margin-top: .25rem
}

.navbar-menu .nav-item .nav-menu-sub .nav-link {
	padding: 7px 1rem;
	font-size: 14.5px;
	color: var(--dx-sidebar-link-sub-color);
	position: relative
}

.navbar-menu .nav-item .nav-menu-sub .nav-link[aria-expanded=true] .menu-arrow svg {
	transform: rotate(180deg)
}

.navbar-menu .nav-item .nav-menu-sub .nav-link span {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.navbar-menu .nav-item .nav-menu-sub .nav-link span {
		transition: none
	}
}

.navbar-menu .nav-item .nav-menu-sub .nav-link:before {
	content: "";
	position: absolute;
	top: 15px;
	z-index: 10;
	width: 4px;
	height: 4px;
	background-color: var(--dx-sidebar-link-color);
	box-shadow: 0 0 4px var(--dx-sidebar-link-color);
	border-radius: 50rem;
	left: -1.6px
}

.navbar-menu .nav-item .nav-menu-sub .nav-link:hover {
	color: var(--dx-sidebar-link-sub-hover-color);
	background-color: transparent
}

.navbar-menu .nav-item .nav-menu-sub .nav-link:hover span {
	transform: translate(4px)
}

.navbar-menu .nav-item .nav-menu-sub .nav-link:hover:before {
	background-color: var(--dx-sidebar-link-sub-hover-color)
}

.navbar-menu .nav-item .nav-menu-sub .nav-link.active {
	color: var(--dx-sidebar-link-sub-active-color);
	background-color: transparent
}

.navbar-menu .nav-item .nav-menu-sub .nav-link.active span {
	transform: translate(4px)
}

.navbar-menu .nav-item .nav-menu-sub .nav-link.active:before {
	outline-color: var(--dx-sidebar-link-sub-active-color)
}

.sidebar-backdrop {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: #2529281a;
	opacity: 1;
	z-index: 1004;
	display: none
}

@media (min-width: 768px) and (max-width: 1199.98px) {
	.sidebar-hidden .main-sidebar {
		left: calc(var(--dx-sidebar-sm) * -1.1)
	}

	.sidebar-hidden .main-topbar {
		left: 0 !important
	}

	.sidebar-hidden .page-wrapper {
		margin-left: 0 !important
	}
}

@media (max-width: 991.98px) {
	.sidebar-hidden .main-sidebar {
		left: calc(var(--dx-sidebar) * -1.1)
	}

	.sidebar-hidden .main-sidebar.show {
		left: 0
	}
}

[data-sidebar=medium] .main-sidebar,
[data-sidebar=medium] .main-sidebar .navbar-brand {
	width: var(--dx-sidebar-md)
}

[data-sidebar=medium] .profile-dropdown :is(.arrow) {
	display: none
}

[data-sidebar=medium] .navbar-menu .nav-menu-title {
	text-align: center
}

[data-sidebar=medium] .navbar-menu .nav-item {
	margin-inline: 0
}

[data-sidebar=medium] .navbar-menu .nav-item :is(.menu-arrow) {
	display: none
}

[data-sidebar=medium] .navbar-menu .nav-item .nav-link {
	flex-direction: column;
	text-align: center;
	gap: .75rem;
	width: calc(var(--dx-sidebar-md) - 24px);
	padding-block: .75rem;
	margin: .5rem .75rem
}

[data-sidebar=medium] .navbar-menu .nav-item .nav-link .icons svg {
	height: 1.25rem;
	width: 1.25rem
}

[data-sidebar=medium] .navbar-menu .nav-item .nav-link.active {
	background-color: var(--dx-sidebar-link-bg-active-color)
}

[data-sidebar=medium] .navbar-menu .nav-item .collapse:before {
	display: none
}

[data-sidebar=medium] .navbar-menu .nav-item .nav-menu-sub {
	margin-left: 0
}

[data-sidebar=medium] .navbar-menu .nav-item .nav-menu-sub .nav-link {
	margin: 0;
	padding: .5rem 1.5rem;
	width: 100%
}

[data-sidebar=medium] .navbar-menu .nav-item .nav-menu-sub .nav-link:before {
	display: none
}

[data-sidebar=medium] .navbar-menu .nav-item .nav-menu-sub .nav-link.active {
	background-color: transparent
}

@media (min-width: 992px) {
	[data-sidebar=medium] .page-wrapper {
		margin-left: var(--dx-sidebar-md)
	}
}

@media (min-width: 992px) {
	[data-sidebar=medium] .main-footer {
		left: var(--dx-sidebar-md)
	}
}

[data-sidebar=small] .main-sidebar,
[data-sidebar=small] .main-sidebar .navbar-brand {
	width: var(--dx-sidebar-sm)
}

[data-sidebar=small] .profile-dropdown :is(.content, .arrow) {
	display: none
}

[data-sidebar=small] .navbar-menu .nav-menu-title {
	display: none
}

[data-sidebar=small] .navbar-menu .nav-item :is(.content, .menu-arrow) {
	display: none
}

[data-sidebar=small] .navbar-menu .nav-item .nav-link {
	width: calc(var(--dx-sidebar-sm) - 24px);
	margin-inline: auto;
	padding-block: .75rem
}

[data-sidebar=small] .navbar-menu .nav-item .nav-link .icons svg {
	height: 1.25rem;
	width: 1.25rem
}

[data-sidebar=small] .navbar-menu .nav-item .nav-link.active {
	background-color: var(--dx-sidebar-link-bg-active-color)
}

[data-sidebar=small] .navbar-menu .nav-item .collapse:before {
	display: none
}

[data-sidebar=small] .navbar-menu .nav-item .nav-menu-sub {
	position: fixed;
	left: var(--dx-sidebar-sm);
	background-color: var(--dx-sidebar-bg);
	box-shadow: var(--dx-sidebar-dropdown-shadow);
	margin-left: 0;
	width: 12rem;
	padding: .5rem 0
}

[data-sidebar=small] .navbar-menu .nav-item .nav-menu-sub:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 19px;
	width: 1px;
	transform: translateY(-50%);
	height: calc(100% - 50px);
	background-color: var(--dx-sidebar-link-color);
	opacity: .3
}

[data-sidebar=small] .navbar-menu .nav-item .nav-menu-sub .menu-arrow {
	display: inline-block !important
}

[data-sidebar=small] .navbar-menu .nav-item .nav-menu-sub .nav-link {
	margin: 0;
	padding: .5rem 1.5rem .5rem 2.1875rem;
	width: 100%
}

[data-sidebar=small] .navbar-menu .nav-item .nav-menu-sub .nav-link:before {
	left: 18px
}

[data-sidebar=small] .navbar-menu .nav-item .nav-menu-sub .nav-link.active {
	background-color: transparent
}

@media (min-width: 992px) {
	[data-sidebar=small] .page-wrapper {
		margin-left: var(--dx-sidebar-sm)
	}
}

@media (min-width: 992px) {
	[data-sidebar=small] .main-footer {
		left: var(--dx-sidebar-sm)
	}
}

.main-topbar {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	height: var(--dx-topbar);
	display: flex;
	z-index: 1003;
	padding-right: 1rem;
	background-color: var(--dx-topbar-bg);
	border-bottom: 1px solid transparent;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.main-topbar {
		transition: none
	}
}

@media (min-width: 320px) {
	.main-topbar {
		padding-right: .5rem
	}
}

.main-topbar.nav-sticky {
	border-color: var(--dx-border-color)
}

.main-topbar .navbar-brand {
	height: var(--dx-topbar);
	display: flex;
	align-items: center;
	width: var(--dx-sidebar);
	padding-left: 1rem
}

.main-topbar .topbar-link {
	padding: 0;
	height: 2.25rem;
	width: 2.25rem;
	color: var(--dx-topbar-color);
	border: none;
	height: var(--dx-topbar)
}

.main-topbar .topbar-link:hover {
	color: var(--dx-topbar-hover-color)
}

.main-topbar .sidebar-toggle {
	display: flex;
	width: 2.25rem;
	height: 2.25rem;
	align-items: center;
	justify-content: center;
	border-radius: .375rem;
	border-width: 0;
	margin-left: .5rem;
	color: var(--dx-topbar-color)
}

@media (min-width: 425px) {
	.main-topbar .profile-dropdown {
		display: block
	}
}

[data-profile-sidebar] .main-topbar .profile-dropdown {
	display: none
}

.profile-dropdown-menu {
	width: 14rem
}

@media (max-width: 767.98px) {
	.profile-dropdown-menu {
		min-width: 18rem;
		width: auto
	}
}

.topbar-main-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 .5rem;
	height: 2.25rem;
	border: 1px solid var(--dx-topbar-border) !important;
	--dx-btn-border-color: var(--dx-topbar-border);
	--dx-btn-color: var(--dx-topbar-color);
	--dx-btn-hover-color: var(--dx-topbar-hover-color);
	--dx-btn-focus-color: var(--dx-topbar-hover-color);
	--dx-btn-active-color: var(--dx-topbar-hover-color)
}

.topbar-mode .light {
	display: none
}

[data-bs-theme=dark] .topbar-mode .light {
	display: inline-block
}

[data-bs-theme=dark] .topbar-mode .dark {
	display: none
}

.navbar-search .icon {
	position: absolute;
	top: .75rem;
	left: 15px;
	color: var(--dx-topbar-color)
}

.navbar-search .form-control {
	background-color: var(--dx-tertiary-bg);
	width: 15rem;
	padding-left: 41px;
	color: var(--dx-body-color)
}

.navbar-search .form-control::placeholder {
	color: var(--dx-topbar-color)
}

.dropdown-menu-topbar {
	max-height: calc(100vh - var(--dx-topbar) - 26px);
	overflow-y: auto
}

.notification-animate {
	position: absolute;
	top: -4px;
	right: -1px;
	height: 7px;
	width: 7px
}

.topbar-notification {
	max-height: calc(100vh - 170px)
}

.topbar-notification .notification-item {
	color: currentColor;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.topbar-notification .notification-item {
		transition: none
	}
}

.topbar-notification .notification-item:is(.unread, :hover) {
	background-color: var(--dx-tertiary-bg)
}

.tool-apps .form-check {
	position: relative;
	padding-left: 0
}

.tool-apps .form-check .form-check-input {
	right: -5px;
	top: -5px;
	position: absolute;
	background-color: var(--dx-secondary-bg)
}

.tool-apps .form-check .form-check-input:checked {
	background-color: var(--dx-primary)
}

.tool-apps .form-check .form-check-input:checked+.form-check-label {
	border-color: var(--dx-primary)
}

.tool-apps .form-check .form-check-label {
	font-weight: 600;
	border: 1px solid var(--dx-border-color);
	border-radius: .375rem;
	padding: 12px;
	display: flex;
	align-items: center;
	gap: .75rem;
	width: 100%
}

.tool-apps .form-check .form-check-label img {
	height: 28px
}

.dropdown-menu-md {
	width: 17rem
}

.dropdown-menu-lg {
	width: 24rem
}

@media (max-width: 767.98px) {
	.dropdown-menu-lg {
		min-width: 18rem;
		width: auto
	}
}

:is([data-topbar-colors=dark], [data-topbar-colors=green], [data-topbar-colors=blue], [data-topbar-colors=purple]) .logos .logo-light {
	display: block
}

:is([data-topbar-colors=dark], [data-topbar-colors=green], [data-topbar-colors=blue], [data-topbar-colors=purple]) .logos .logo-dark {
	display: none
}

:is([data-topbar-colors=dark], [data-topbar-colors=green], [data-topbar-colors=blue], [data-topbar-colors=purple]) .navbar-search .form-control {
	background-color: transparent
}

:is([data-topbar-colors=dark], [data-topbar-colors=green], [data-topbar-colors=blue], [data-topbar-colors=purple]) .profile-dropdown .pr-name {
	color: #fff
}

:is([data-topbar-colors=dark], [data-topbar-colors=green], [data-topbar-colors=blue], [data-topbar-colors=purple]) .profile-dropdown .pr-desc {
	color: #ffffffb3 !important
}

:is([data-topbar-colors=dark], [data-topbar-colors=green], [data-topbar-colors=blue], [data-topbar-colors=purple]) .profile-dropdown .dropdown-toggle:after {
	color: #fff
}

@media (min-width: 1200px) {
	:is([data-layout=modern]) .main-topbar:before {
		content: "";
		position: absolute;
		top: -4px;
		left: -4px;
		width: 23px;
		height: 23px;
		z-index: -1
	}
}

@media (min-width: 1200px) {
	:is([data-layout=modern])[data-nav-type=boxed] .main-topbar:before {
		display: none
	}
}

.main-footer {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	margin-inline: .9375rem;
	padding-inline: 1rem;
	height: 3.5rem;
	border-top: 1px solid var(--dx-border-color)
}

@media (min-width: 992px) {
	.main-footer {
		left: var(--dx-sidebar)
	}
}

@media (min-width: 1200px) {
	.main-footer {
		padding-inline: 1rem
	}
}

@media (min-width: 1536px) {
	.main-footer {
		margin-inline: 7rem
	}
}

[data-content-width=fluid] .main-footer {
	margin-inline: 1.25rem
}

[data-layout=modern][data-nav-type=floating] .main-topbar {
	position: absolute
}

[data-layout=modern][data-nav-type=boxed] .main-topbar {
	border: 1px solid var(--dx-topbar-border);
	margin: .75rem;
	border-radius: .375rem
}

[data-layout=modern][data-nav-type=boxed] .main-topbar.nav-sticky {
	margin-top: 0
}

[data-layout=modern][data-nav-type=boxed] .page-wrapper {
	padding-top: calc(var(--dx-topbar) * 1.3)
}

[data-layout=modern][data-nav-type=pattern] .sidebar-toggle {
	color: rgba(var(--dx-white-rgb), .75)
}

[data-layout=modern][data-nav-type=pattern] .main-topbar {
	border-color: rgba(var(--dx-white-rgb), .2);
	background-color: transparent
}

[data-layout=modern][data-nav-type=pattern] .main-topbar.nav-sticky {
	background-color: var(--dx-primary)
}

[data-layout=modern][data-nav-type=pattern] .main-topbar .topbar-link {
	color: rgba(var(--dx-white-rgb), .75)
}

[data-layout=modern][data-nav-type=pattern] .main-topbar .topbar-link:hover,
[data-layout=modern][data-nav-type=pattern] .profile-dropdown .pr-name {
	color: #fff
}

[data-layout=modern][data-nav-type=pattern] .profile-dropdown .pr-desc {
	color: #ffffffb3 !important
}

[data-layout=modern][data-nav-type=pattern] .profile-dropdown .dropdown-toggle:after {
	color: #fff
}

[data-layout=modern][data-nav-type=pattern] .topbar-main-btn {
	--dx-btn-border-color: rgba(var(--dx-white-rgb), .2) !important;
	--dx-btn-color: rgba(var(--dx-white-rgb), .75);
	--dx-btn-hover-color: var(--dx-white);
	--dx-btn-focus-color: var(--dx-white);
	--dx-btn-active-color: var(--dx-white)
}

[data-layout=modern][data-nav-type=pattern] .navbar-search .icon {
	color: rgba(var(--dx-white-rgb), .75)
}

[data-layout=modern][data-nav-type=pattern] .navbar-search .form-control {
	color: #fff;
	background-color: transparent
}

[data-layout=modern][data-nav-type=pattern] .navbar-search .form-control::placeholder {
	color: rgba(var(--dx-white-rgb), .75)
}

[data-layout=modern][data-nav-type=pattern] .nav-pattern {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: inline-block;
	height: 13rem;
	background-color: var(--dx-primary)
}

[data-layout=modern][data-nav-type=pattern] .nav-pattern svg {
	width: 100%;
	height: auto
}

[data-layout=modern][data-nav-type=pattern] .page-heading {
	color: #fff
}

[data-layout=modern][data-nav-type=pattern] .page-heading .breadcrumb {
	--dx-breadcrumb-divider-color: #fff;
	--dx-breadcrumb-item-active-color: #fff
}

[data-layout=modern][data-nav-type=pattern] .page-heading .breadcrumb .breadcrumb-item a {
	color: rgba(var(--dx-white-rgb), .75)
}

.nav-pattern {
	display: none
}

[data-layout=semibox] .main-sidebar {
	inset: var(--dx-semibox-width);
	top: var(--dx-semibox-width) !important;
	border: 1px solid var(--dx-sidebar-border);
	border-radius: .375rem
}

[data-layout=semibox] .main-topbar {
	border: 1px solid var(--dx-border-color);
	border-radius: .375rem;
	top: var(--dx-semibox-width);
	left: calc(var(--dx-sidebar) + var(--dx-semibox-width) + var(--dx-semibox-width)) !important;
	right: var(--dx-semibox-width)
}

[data-layout=semibox] .main-topbar.nav-sticky {
	top: 0;
	border-top-left-radius: 0;
	border-top-right-radius: 0
}

@media (max-width: 1199.98px) {
	[data-layout=semibox] .main-topbar {
		left: var(--dx-semibox-width) !important
	}
}

[data-layout=semibox] .page-wrapper {
	padding-top: calc(var(--dx-topbar) + var(--dx-semibox-width) + var(--dx-semibox-width))
}

[data-layout=semibox] .navbar-menu {
	height: calc(100vh - 7rem)
}

[data-layout=semibox][data-profile-sidebar=true] .navbar-menu {
	height: calc(100vh - 12rem)
}

@media (min-width: 992px) {
	[data-layout=semibox][data-sidebar=medium] .main-topbar {
		left: calc(var(--dx-sidebar-md) + var(--dx-semibox-width) + var(--dx-semibox-width)) !important
	}

	[data-layout=semibox][data-sidebar=small] .main-topbar {
		left: calc(var(--dx-sidebar-sm) + var(--dx-semibox-width) + var(--dx-semibox-width)) !important
	}
}

@media (min-width: 768px) and (max-width: 1199.98px) {
	[data-layout=semibox] .sidebar-hidden .main-sidebar {
		left: calc(var(--dx-sidebar-sm) * -1.1)
	}

	[data-layout=semibox] .sidebar-hidden .main-topbar {
		left: var(--dx-semibox-width) !important
	}

	[data-layout=semibox] .sidebar-hidden .page-wrapper {
		margin-left: 0 !important
	}
}

@media (max-width: 991.98px) {
	[data-layout=semibox] .sidebar-hidden .main-sidebar {
		left: calc(var(--dx-sidebar) * -1.1)
	}

	[data-layout=semibox] .sidebar-hidden .main-sidebar.show {
		display: block;
		left: 0
	}
}

[data-layout=horizontal] .main-sidebar {
	right: 0;
	width: 100%;
	bottom: auto;
	left: 0;
	border-bottom: 1px solid var(--dx-sidebar-border)
}

@media (max-width: 991.98px) {
	[data-layout=horizontal] .main-sidebar {
		top: -316px;
		left: 0
	}

	[data-layout=horizontal] .main-sidebar.show {
		display: block;
		top: var(--dx-topbar)
	}
}

[data-layout=horizontal] .navbar-menu {
	height: auto
}

[data-layout=horizontal] .navbar-menu .nav-menu-title {
	display: none
}

[data-layout=horizontal] .navbar-menu .navbar-nav-menu {
	display: flex;
	align-items: center;
	margin-bottom: 0
}

[data-layout=horizontal] .navbar-menu .navbar-nav-menu .collapse:before {
	display: none
}

[data-layout=horizontal] .navbar-menu .navbar-nav-menu .nav-menu-sub {
	position: fixed;
	background-color: var(--dx-sidebar-bg);
	box-shadow: var(--dx-sidebar-dropdown-shadow);
	margin-left: 0;
	width: 12rem;
	padding: .5rem 0;
	overflow-y: auto;
	max-height: calc(100vh - var(--dx-topbar) - var(--dx-topbar));
	margin-top: 0
}

[data-layout=horizontal] .navbar-menu .navbar-nav-menu .nav-menu-sub:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 19px;
	width: 1px;
	transform: translateY(-50%);
	height: calc(100% - 50px);
	background-color: var(--dx-sidebar-link-color);
	opacity: .3
}

[data-layout=horizontal] .navbar-menu .nav-item {
	flex-shrink: 0;
	margin-inline: 0
}

[data-layout=horizontal] .navbar-menu .nav-item .nav-link {
	background-color: transparent;
	padding-left: 35px
}

[data-layout=horizontal] .navbar-menu .nav-item .nav-link:before {
	left: 18px
}

[data-layout=horizontal] :is(.profile-dropdown, .main-topbar .sidebar-toggle) {
	display: none
}

[data-layout=horizontal] .main-topbar {
	z-index: 1006
}

@media (min-width: 992px) {
	[data-layout=horizontal] .page-wrapper {
		padding-top: calc(var(--dx-topbar) * 1.8)
	}
}

@media (min-width: 992px) and (min-width: 992px) {
	[data-layout=horizontal] .page-wrapper {
		margin-left: 0
	}
}

[data-layout=horizontal] .main-footer {
	left: 0
}

@media (max-width: 991.98px) {
	[data-layout=horizontal] .main-topbar .sidebar-toggle {
		display: flex
	}

	[data-layout=horizontal] .main-sidebar {
		height: 316px
	}

	[data-layout=horizontal] .navbar-menu {
		margin-top: 8px;
		height: 300px;
		margin-bottom: 8px
	}

	[data-layout=horizontal] .navbar-menu .nav-menu-title {
		display: none
	}

	[data-layout=horizontal] .navbar-menu .navbar-nav-menu {
		display: block
	}

	[data-layout=horizontal] .navbar-menu .navbar-nav-menu .nav-link {
		padding-left: 16px
	}

	[data-layout=horizontal] .navbar-menu .navbar-nav-menu .nav-menu-sub {
		position: static;
		box-shadow: none;
		background-color: transparent;
		width: 100%
	}

	[data-layout=horizontal] .navbar-menu .navbar-nav-menu .nav-menu-sub:before {
		display: none
	}

	[data-layout=horizontal] .navbar-menu .navbar-nav-menu .nav-menu-sub .nav-link:before {
		display: none
	}
}

[data-layout=horizontal][data-sidebar=medium] .navbar-menu .nav-item .nav-link {
	font-size: 14px
}

[data-layout=horizontal][data-sidebar=medium] .navbar-menu .nav-item .nav-link .icons svg {
	height: 1rem;
	width: 1rem
}

[data-layout=horizontal][data-sidebar=medium] .navbar-menu .nav-item .nav-menu-sub .nav-link {
	align-items: start
}

:is([data-layout=modern], [data-layout=semibox]) .main-sidebar {
	top: 0
}

:is([data-layout=modern], [data-layout=semibox]) .main-sidebar .navbar-brand {
	display: flex
}

:is([data-layout=modern], [data-layout=semibox]) .main-sidebar .navbar-brand .logo-lg .logo-light {
	display: none
}

:is([data-layout=modern], [data-layout=semibox]) .main-sidebar .navbar-brand .logo-sm {
	display: none
}

@media (min-width: 992px) {
	:is([data-layout=modern], [data-layout=semibox]) .main-topbar {
		left: var(--dx-sidebar)
	}

	:is([data-layout=modern], [data-layout=semibox]) .main-topbar .navbar-brand {
		width: auto
	}

	:is([data-layout=modern], [data-layout=semibox]) .main-topbar .navbar-brand .logos {
		display: none
	}
}

@media (min-width: 992px) {
	:is([data-layout=modern], [data-layout=semibox])[data-sidebar=medium] .main-topbar {
		left: var(--dx-sidebar-md)
	}
}

:is([data-layout=modern], [data-layout=semibox])[data-sidebar=small] .main-sidebar .navbar-brand {
	display: flex
}

:is([data-layout=modern], [data-layout=semibox])[data-sidebar=small] .main-sidebar .navbar-brand .logo-lg {
	display: none
}

:is([data-layout=modern], [data-layout=semibox])[data-sidebar=small] .main-sidebar .navbar-brand .logo-sm {
	display: block
}

:is([data-layout=modern], [data-layout=semibox])[data-sidebar=small] .main-sidebar .navbar-brand .logo-sm .logo-light {
	display: none
}

:is([data-layout=modern], [data-layout=semibox])[data-sidebar=small] .main-topbar {
	left: var(--dx-sidebar-sm)
}

:is([data-layout=modern], [data-layout=semibox]):is([data-sidebar-colors=dark], [data-sidebar-colors=green], [data-sidebar-colors=blue], [data-sidebar-colors=purple]) .navbar-brand .logo-lg .logo-light {
	display: block
}

:is([data-layout=modern], [data-layout=semibox]):is([data-sidebar-colors=dark], [data-sidebar-colors=green], [data-sidebar-colors=blue], [data-sidebar-colors=purple]) .navbar-brand .logo-lg .logo-dark {
	display: none
}

:is([data-layout=modern], [data-layout=semibox]):is([data-sidebar-colors=dark], [data-sidebar-colors=green], [data-sidebar-colors=blue], [data-sidebar-colors=purple]) .navbar-brand .logo-sm {
	display: none
}

:is([data-layout=modern], [data-layout=semibox]):is([data-sidebar-colors=dark], [data-sidebar-colors=green], [data-sidebar-colors=blue], [data-sidebar-colors=purple])[data-sidebar=small] .navbar-brand .logo-sm .logo-light {
	display: block
}

:is([data-layout=modern], [data-layout=semibox]):is([data-sidebar-colors=dark], [data-sidebar-colors=green], [data-sidebar-colors=blue], [data-sidebar-colors=purple])[data-sidebar=small] .navbar-brand .logo-sm .logo-dark {
	display: none
}

[data-bs-theme=black-white] {
	filter: grayscale(100%) !important
}

.page-heading {
	display: flex;
	align-items: center
}

@media (max-width: 767.98px) {
	.page-heading {
		align-items: start
	}
}

.page-heading .breadcrumb-item+.breadcrumb-item:before {
	content: "";
	font-family: remixicon
}

.setting-modal .setting-widget .setting-widget-wrapper {
	display: flex;
	gap: .25rem;
	padding: 6px 16px;
	background-color: var(--dx-tertiary-bg)
}

.setting-modal .setting-widget .setting-widget-wrapper span {
	height: 6px;
	width: 6px;
	display: inline-block;
	border-radius: 50rem
}

.setting-modal .setting-widget.setting-vertical-widget {
	display: block;
	overflow: hidden;
	height: 112px;
	cursor: pointer
}

.setting-modal .setting-widget.setting-vertical-widget .setting-widget-content {
	height: calc(100% - 8px)
}

.setting-modal .setting-widget.setting-vertical-widget .setting-widget-content .custom-height-element {
	height: .375rem
}

.setting-modal #navigationType .form-check-label {
	outline: none
}

.setting-modal .form-check {
	padding-left: 0
}

.setting-modal .form-check-label.system-mode:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 50%;
	background-color: var(--dx-black);
	width: 50%
}

.setting-modal input[type=radio]:checked+.form-check-label {
	outline: 1px solid var(--dx-primary)
}

.setting-modal input[type=radio]:checked+.form-check-label.outline-offset-2 {
	outline-offset: 2px
}

.setting-modal .grayscale {
	filter: grayscale(100%)
}

.setting-modal .custom-size-element {
	height: .375rem;
	width: .375rem
}

.setting-modal .sidebar-color-2 {
	background-color: #202322
}

.setting-modal .sidebar-color-3 {
	background-color: #146c43
}

.setting-modal .sidebar-color-4 {
	background-color: #425089
}

.setting-modal .sidebar-color-5 {
	background-color: #83327a
}

.setting-modal .theme-color-1 {
	background-color: #f01633
}

.setting-modal .theme-color-2 {
	background-color: #2563eb
}

.setting-modal .theme-color-3 {
	background-color: #bd38c9
}

.setting-modal .theme-color-4 {
	background-color: #f1893d
}

.setting-modal .theme-color-5 {
	background-color: #13a5c9
}

.setting-modal .theme-color-6 {
	background-color: #20c08e
}

.setting-modal .theme-color-7 {
	background-color: #ea3939
}

.setting-modal .theme-color-8 {
	background-color: #ca8a04
}

.btn-close:after {
	content: "" !important;
	font-size: 20px;
	line-height: 15px;
	color: var(--dx-btn-close-color);
	font-family: remixicon !important
}

.alert-live-backdrop {
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px)
}

.alert-dismissible .btn-close:after {
	color: var(--dx-alert-color)
}

.alert-icon {
	position: relative;
	display: flex;
	align-items: center;
	padding-left: 4rem
}

.alert-icon .icon {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	border-right: 1px solid var(--dx-alert-border-color)
}

.icon-alert {
	border-color: var(--dx-border-color);
	overflow: hidden
}

.icon-alert .icon {
	display: flex;
	align-items: center;
	justify-content: center
}

.info-gradient {
	background: linear-gradient(to right, var(--dx-info), color-mix(in srgb, var(--dx-info) 55%, black 55%))
}

.primary-gradient {
	background: linear-gradient(to right, var(--dx-primary), color-mix(in srgb, var(--dx-primary) 55%, black 40%))
}

.pink-gradient {
	background: linear-gradient(to right, color-mix(in srgb, var(--dx-pink), black 25%), color-mix(in srgb, var(--dx-secondary) 35%, black 65%))
}

.orange-gradient {
	background: linear-gradient(to right, var(--dx-orange), color-mix(in srgb, var(--dx-indigo) 25%, black 65%))
}

#liveAlert {
	position: fixed;
	top: 1.25rem;
	left: 50%;
	transform: translate(-50%);
	z-index: 1030
}

.basic-alert {
	display: flex;
	align-items: center;
	justify-content: center
}

.breadcrumb-item {
	font-weight: 500
}

.breadcrumb-item a {
	color: var(--dx-secondary-color)
}

:is(.double-arrow, .single-arrow, .dash-arrow) .breadcrumb-item+.breadcrumb-item:before {
	float: left;
	font-family: RemixIcon;
	color: var(--dx-breadcrumb-divider-color)
}

.double-arrow .breadcrumb-item+.breadcrumb-item:before {
	content: ""
}

.single-arrow .breadcrumb-item+.breadcrumb-item:before {
	content: ""
}

.dash-arrow .breadcrumb-item+.breadcrumb-item:before {
	content: ""
}

.multi-steps .breadcrumb-item {
	padding: .5625rem 1.5rem;
	background-color: var(--dx-primary);
	border-radius: .375rem;
	color: var(--dx-primary);
	margin-right: 30px;
	text-align: center;
	position: relative
}

.multi-steps .breadcrumb-item a {
	color: #fff
}

.multi-steps .breadcrumb-item:before {
	content: " ";
	width: 100%;
	height: 6px;
	position: absolute;
	top: 50%;
	left: 101%;
	transform: translateY(-50%) translate(-1px);
	background-color: var(--dx-primary)
}

.multi-steps .breadcrumb-item:nth-last-child(2):before {
	background-color: var(--dx-light)
}

.multi-steps .breadcrumb-item:last-child:before {
	display: none
}

.multi-steps .breadcrumb-item.active {
	background-color: var(--dx-light)
}

.btn-navigation {
	box-shadow: var(--dx-box-shadow);
	border: 1px solid var(--dx-border-color);
	background-color: var(--dx-secondary-bg);
	position: relative;
	display: flex;
	border-radius: .375rem
}

.btn-navigation a {
	color: var(--dx-secondary-color);
	padding: 1.5rem 1rem;
	position: relative;
	flex-grow: 1;
	text-align: center;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.btn-navigation a {
		transition: none
	}
}

.navigation-bottom-animation a:before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 6px;
	height: 6px;
	border-radius: 50rem;
	transform: translate(-50%);
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.navigation-bottom-animation a:before {
		transition: none
	}
}

.navigation-bottom-animation a:is(:hover, .active):before {
	bottom: 10px
}

.navigation-border-animation {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.navigation-border-animation {
		transition: none
	}
}

.navigation-border-animation a {
	position: relative
}

.navigation-border-animation a:before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: .125rem;
	transform: translate(-50%);
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.navigation-border-animation a:before {
		transition: none
	}
}

.navigation-border-animation a span {
	position: absolute;
	top: 50%;
	left: 42%;
	transform: translateY(-50%);
	opacity: 0;
	visibility: hidden;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.navigation-border-animation a span {
		transition: none
	}
}

.navigation-border-animation a svg {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.navigation-border-animation a svg {
		transition: none
	}
}

.navigation-border-animation a:is(:hover, .active):before {
	width: 100%
}

.navigation-border-animation a:is(:hover, .active) svg {
	transform: translate(-110%)
}

.navigation-border-animation a:is(:hover, .active) span {
	opacity: 1;
	visibility: visible;
	left: 51%
}

.navigation-border-animation.top-border a:before {
	position: absolute;
	top: 0;
	left: 50%
}

.notification {
	display: inline-flex;
	height: 22px;
	width: 22px;
	align-items: center;
	justify-content: center;
	border-width: 1px;
	font-size: .6875rem;
	padding: 0;
	border: 2px solid var(--dx-secondary-bg)
}

.notification.top-end {
	position: absolute;
	top: -8px;
	right: -8px
}

.notification.top-start {
	position: absolute;
	top: -8px;
	left: -8px
}

.notification.bottom-start {
	position: absolute;
	bottom: -8px;
	left: -8px
}

.notification.bottom-end {
	position: absolute;
	right: -8px;
	bottom: -8px
}

.notification.inside {
	position: static
}

.badge-square {
	display: inline-flex;
	height: 22px;
	width: 22px;
	align-items: center;
	justify-content: center;
	border-width: 1px;
	font-size: .6875rem;
	padding: 0
}

.spin {
	height: 2rem;
	width: 2rem;
	border-radius: 50rem
}

.modern-spinner {
	border: 2px solid;
	border-left-color: transparent !important;
	border-right-color: transparent !important
}

.gradient-loader .bg-gradient {
	border-color: var(--dx-primary) var(--dx-success) var(--dx-warning) var(--dx-danger) !important
}

.gradient-loader .bg-gradient2 {
	border-color: var(--dx-info) var(--dx-pink) var(--dx-secondary) var(--dx-primary) !important
}

.gradient-loader .bg-sub-gradient {
	border-color: var(--dx-primary-bg-subtle) var(--dx-success-bg-subtle) var(--dx-warning-bg-subtle) var(--dx-danger-bg-subtle) !important
}

.animation-button .circle {
	margin-top: -.25rem;
	margin-right: -.25rem
}

.animation-button .loader-button-animation {
	position: absolute;
	top: -.2188rem;
	right: -.2188rem
}

.animate-bounce {
	border: 2px solid var(--dx-border-color)
}

.accordion.accordion-boxed .accordion-item {
	border: none
}

.accordion.accordion-boxed .accordion-item:not(:last-child) {
	margin-bottom: .875rem
}

.accordion.accordion-boxed .accordion-button {
	border: 1px solid var(--dx-accordion-border-color);
	border-radius: .375rem
}

.accordion .accordion-button {
	padding-right: 1.6rem
}

.accordion .accordion-button:after {
	content: "";
	font-family: remixicon !important;
	position: absolute;
	top: 50%;
	right: .4rem;
	background: none;
	font-size: 22px;
	transform: translateY(-50%);
	line-height: 1;
	font-weight: 300
}

.accordion .accordion-button[aria-expanded=true]:after {
	transform: translateY(-50%) rotate(-180deg)
}

.accordion.accordion-with-plus .accordion-button:after {
	content: "";
	font-size: 18px
}

.accordion.accordion-with-plus .accordion-button:not(.collapsed):after {
	content: "";
	font-size: 18px
}

.modal {
	--dx-modal-box-shadow: 0 10px 15px -3px rgba(229, 231, 235, .3), 0 4px 6px -4px rgba(229, 231, 235, .3)
}

.modal .modal-header {
	padding-bottom: 0;
	display: flex;
	align-items: center
}

.modal-footer {
	padding: 1.25rem;
	padding-top: 0
}

.modal-dialog-start {
	margin-left: 1.25rem
}

.modal-dialog-end {
	margin-right: 1.25rem
}

.modal-dialog-bottom-end {
	position: absolute;
	right: 1.25rem;
	bottom: 0
}

.modal-dialog-bottom-start {
	position: absolute;
	left: 1.25rem;
	bottom: 0
}

.modal-xs {
	width: 20rem
}

.modal-2xl {
	max-width: 64rem
}

@media (max-width: 1024px) {
	.modal-2xl {
		max-width: 61.5rem
	}
}

@media (max-width: 768px) {
	.modal-2xl {
		max-width: 45.5rem
	}
}

@media (max-width: 575.98px) {

	.modal-xs,
	.modal-sm,
	.modal-lg,
	.modal-xl,
	.modal-2xl {
		max-width: 24.0625rem;
		margin-inline: auto
	}
}

.progress-bar {
	border-radius: 50rem
}

.progress-bar.progress-gradient {
	background: var(--dx-progress-bar-bg)
}

.progress-bar.progress-gradient-primary {
	--dx-progress-bar-bg: linear-gradient(90deg, var(--dx-primary), var(--dx-success))
}

.progress-bar.progress-gradient-info {
	--dx-progress-bar-bg: linear-gradient(90deg, var(--dx-primary), var(--dx-info-text-emphasis), var(--dx-info))
}

.progress-bar.progress-gradient-indigo {
	--dx-progress-bar-bg: linear-gradient(90deg, var(--dx-indigo), var(--dx-secondary))
}

.progress-1 {
	height: .5rem
}

.progress-2 {
	height: .625rem
}

.progress-3 {
	height: .75rem
}

.progress-4 {
	height: 1rem
}

.progress-5 {
	height: 1.25rem
}

.progress-6 {
	height: 1.5rem
}

.progress-7 {
	height: 2rem
}

.progress-circle {
	position: relative;
	display: inline-block
}

.progress-circle svg {
	transform: rotate(-90deg)
}

.progress-circle circle {
	fill: none;
	stroke-linecap: round
}

.progress-circle .progress-bg {
	stroke: var(--dx-tertiary-bg)
}

.progress-circle .progress-fill {
	transition: stroke-dashoffset 1s ease-in-out
}

.progress-circle .progress-text {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700
}

.progress-circle .progress-text-inner {
	text-align: center;
	line-height: 1.2
}

.progress-circle .animate-count {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.progress-circle .animate-count {
		transition: none
	}
}

.offcanvas .offcanvas-header {
	padding-bottom: 0
}

.offcanvas .offcanvas-footer {
	padding: 1.25rem;
	border-top: 1px solid var(--dx-offcanvas-border-color)
}

.offcanvas.offcanvas-small {
	width: 7rem
}

.offcanvas.offcanvas-large {
	width: 24rem
}

@media (min-width: 576px) {
	.offcanvas.offcanvas-half {
		width: 50%
	}
}

.toast-primary {
	--dx-toast-bg: rgba(var(--dx-primary-rgb))
}

.toast-secondary {
	--dx-toast-bg: rgba(var(--dx-secondary-rgb))
}

.toast-success {
	--dx-toast-bg: rgba(var(--dx-success-rgb))
}

.toast-info {
	--dx-toast-bg: rgba(var(--dx-info-rgb))
}

.toast-warning {
	--dx-toast-bg: rgba(var(--dx-warning-rgb))
}

.toast-danger {
	--dx-toast-bg: rgba(var(--dx-danger-rgb))
}

.toast-light {
	--dx-toast-bg: rgba(var(--dx-light-rgb))
}

.toast-dark {
	--dx-toast-bg: rgba(var(--dx-dark-rgb))
}

.toast-pink {
	--dx-toast-bg: rgba(var(--dx-pink-rgb))
}

.toast-orange {
	--dx-toast-bg: rgba(var(--dx-orange-rgb))
}

.toast-indigo {
	--dx-toast-bg: rgba(var(--dx-indigo-rgb))
}

.toast-content {
	--dx-toast-max-width: 24rem;
	--dx-toast-box-shadow: 0 10px 15px -3px #bdbdbd9f, 0 4px 6px -4px #bbbbbb41
}

.basic-gallery img {
	transition: transform 5s ease-in-out
}

.basic-gallery:hover>img {
	transform: scale(1.25)
}

@media (min-width: 992px) {
	.item-4 {
		margin-top: -9rem
	}

	.item-6 {
		margin-top: -7rem
	}

	.item-7 {
		margin-top: -17rem
	}
}

@media (min-width: 768px) and (max-width: 992px) {
	.item-3 {
		margin-top: -9rem
	}

	.item-5,
	.item-7 {
		margin-top: -3rem
	}
}

.goverlay {
	background: #000000d1;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px)
}

.glightbox-clean .gslide-media {
	box-shadow: none
}

.gslide-image img {
	border-radius: .375rem
}

.timeline {
	display: flex;
	flex-direction: column;
	position: relative;
	list-style: none
}

.timeline-basic {
	list-style: none;
	margin-bottom: 0;
	padding-left: 0
}

.timeline-basic .timeline-item {
	position: relative;
	padding-left: 1.25rem;
	padding-bottom: .75rem
}

.timeline-basic .timeline-item:not(:last-child):before {
	content: "";
	position: absolute;
	top: 9px;
	bottom: -.5rem;
	left: 2.4px;
	width: 2px;
	background-color: var(--dx-tertiary-bg)
}

.timeline-basic .timeline-item:after {
	content: "";
	position: absolute;
	top: .5rem;
	left: 0;
	width: 7px;
	height: 7px;
	border-radius: 999px;
	background-color: var(--dx-tertiary-bg)
}

.timeline-basic .timeline-item:is(.active) span:before {
	content: "";
	position: absolute;
	top: 4px;
	left: -4px;
	width: 15px;
	height: 15px;
	border-radius: 999px
}

.timeline-basic .timeline-item:last-child {
	padding-bottom: 0
}

.timeline-basic.timeline-square .timeline-item:after {
	border-radius: 2px
}

.timeline-basic.timeline-square .timeline-item span:before {
	border-radius: 3px
}

.timeline-primary .timeline-item.active:after,
.timeline-primary .timeline-item.active:before {
	background-color: var(--dx-primary)
}

.timeline-primary .timeline-item.active span:before {
	background-color: rgba(var(--dx-primary-rgb), .2)
}

.timeline-secondary .timeline-item.active:after,
.timeline-secondary .timeline-item.active:before {
	background-color: var(--dx-secondary)
}

.timeline-secondary .timeline-item.active span:before {
	background-color: rgba(var(--dx-secondary-rgb), .2)
}

.timeline-success .timeline-item.active:after,
.timeline-success .timeline-item.active:before {
	background-color: var(--dx-success)
}

.timeline-success .timeline-item.active span:before {
	background-color: rgba(var(--dx-success-rgb), .2)
}

.timeline-info .timeline-item.active:after,
.timeline-info .timeline-item.active:before {
	background-color: var(--dx-info)
}

.timeline-info .timeline-item.active span:before {
	background-color: rgba(var(--dx-info-rgb), .2)
}

.timeline-warning .timeline-item.active:after,
.timeline-warning .timeline-item.active:before {
	background-color: var(--dx-warning)
}

.timeline-warning .timeline-item.active span:before {
	background-color: rgba(var(--dx-warning-rgb), .2)
}

.timeline-danger .timeline-item.active:after,
.timeline-danger .timeline-item.active:before {
	background-color: var(--dx-danger)
}

.timeline-danger .timeline-item.active span:before {
	background-color: rgba(var(--dx-danger-rgb), .2)
}

.timeline-light .timeline-item.active:after,
.timeline-light .timeline-item.active:before {
	background-color: var(--dx-light)
}

.timeline-light .timeline-item.active span:before {
	background-color: rgba(var(--dx-light-rgb), .2)
}

.timeline-dark .timeline-item.active:after,
.timeline-dark .timeline-item.active:before {
	background-color: var(--dx-dark)
}

.timeline-dark .timeline-item.active span:before {
	background-color: rgba(var(--dx-dark-rgb), .2)
}

.timeline-pink .timeline-item.active:after,
.timeline-pink .timeline-item.active:before {
	background-color: var(--dx-pink)
}

.timeline-pink .timeline-item.active span:before {
	background-color: rgba(var(--dx-pink-rgb), .2)
}

.timeline-orange .timeline-item.active:after,
.timeline-orange .timeline-item.active:before {
	background-color: var(--dx-orange)
}

.timeline-orange .timeline-item.active span:before {
	background-color: rgba(var(--dx-orange-rgb), .2)
}

.timeline-indigo .timeline-item.active:after,
.timeline-indigo .timeline-item.active:before {
	background-color: var(--dx-indigo)
}

.timeline-indigo .timeline-item.active span:before {
	background-color: rgba(var(--dx-indigo-rgb), .2)
}

.changelog-timeline {
	position: relative;
	list-style: none;
	margin-bottom: 0;
	padding-left: 0
}

.changelog-timeline .timeline-item {
	position: relative;
	padding-bottom: 1.5rem;
	display: flex;
	justify-content: center
}

.changelog-timeline .timeline-item:before {
	content: "";
	position: absolute;
	top: .5rem;
	bottom: -.5rem;
	left: 1rem;
	width: .125rem;
	margin: 1.875rem 0 1rem;
	background-color: var(--dx-tertiary-bg)
}

.changelog-timeline .timeline-item:last-child {
	padding-bottom: 0
}

.changelog-timeline .timeline-item:last-child:before {
	display: none
}

.changelog-timeline .timeline-item .dot {
	position: absolute;
	height: 6px;
	width: 6px;
	top: 50%;
	transform: translateY(-50%)
}

.timeline-modern {
	list-style: none
}

.timeline-modern .timeline-item {
	position: relative
}

.timeline-modern .timeline-item:before {
	content: "";
	position: absolute;
	top: -1.3rem;
	bottom: -.5rem;
	left: 16px;
	width: .0625rem;
	background-color: var(--dx-tertiary-bg);
	z-index: -1
}

.timeline-modern .timeline-item:last-child:before {
	content: none
}

.pagination {
	display: flex;
	align-items: center;
	gap: .5rem;
	flex-wrap: wrap
}

.pagination .page-item:is(:first-child, :last-child) .page-link {
	display: flex;
	align-items: center;
	gap: .25rem;
	width: auto;
	padding: var(--dx-pagination-padding-y) var(--dx-pagination-padding-x)
}

[dir=ltr] .pagination .page-item:is(:last-child) .pagination-left {
	display: none
}

[dir=rtl] .pagination .page-item:is(:last-child) .pagination-right {
	display: none
}

[dir=ltr] .pagination .page-item:is(:first-child) .pagination-right {
	display: none
}

[dir=rtl] .pagination .page-item:is(:first-child) .pagination-left {
	display: none
}

.pagination .page-item .page-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: var(--dx-border-radius);
	padding: 0
}

.pagination.pagination-rounded .page-link {
	border-radius: 50rem
}

.pagination.pagination-modern {
	gap: 0
}

.pagination.pagination-modern .page-item .page-link {
	width: auto;
	padding: var(--dx-pagination-padding-y) var(--dx-pagination-padding-x);
	border-radius: 0;
	gap: .25rem
}

.pagination.pagination-modern .page-item:is(:first-child, :last-child) .page-link {
	width: 2.25rem;
	height: 2.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0
}

.pagination.pagination-modern .page-item:first-child .page-link {
	border-top-left-radius: var(--dx-pagination-border-radius);
	border-bottom-left-radius: var(--dx-pagination-border-radius)
}

.pagination.pagination-modern .page-item:first-child .page-link[dir=rtl] {
	border-bottom-right-radius: var(--dx-pagination-border-radius) !important;
	border-top-right-radius: var(--dx-pagination-border-radius) !important
}

.pagination.pagination-modern .page-item:last-child .page-link {
	border-top-right-radius: var(--dx-pagination-border-radius);
	border-bottom-right-radius: var(--dx-pagination-border-radius)
}

.pagination.pagination-modern.pagination-rounded .page-item:first-child .page-link {
	border-top-left-radius: 50rem;
	border-bottom-left-radius: 50rem
}

.pagination.pagination-modern.pagination-rounded .page-item:last-child .page-link {
	border-top-right-radius: 50rem;
	border-bottom-right-radius: 50rem
}

.pagination.pagination-flush .page-item .page-link {
	border: 0
}

.pagination.pagination-xs .page-item .page-link {
	width: 1.5rem;
	height: 1.5rem;
	font-size: .75rem;
	line-height: 1rem
}

.pagination.pagination-xs .page-item:is(:first-child, :last-child) .page-link {
	width: auto;
	height: 1.5rem;
	padding: .125rem .5rem
}

.pagination.pagination-sm .page-item .page-link {
	width: 1.75rem;
	height: 1.75rem;
	font-size: .75rem;
	line-height: 1rem
}

.pagination.pagination-sm .page-item:is(:first-child, :last-child) .page-link {
	width: auto;
	height: 1.75rem
}

.pagination.pagination-md .page-item .page-link {
	width: 2rem;
	height: 2rem
}

.pagination.pagination-md .page-item:is(:first-child, :last-child) .page-link {
	width: auto;
	height: 2rem
}

.pagination.pagination-lg .page-item .page-link {
	width: 2.5rem;
	height: 2.5rem;
	font-size: .9375rem
}

.pagination.pagination-lg .page-item:is(:first-child, :last-child) .page-link {
	width: auto;
	height: 2.5rem
}

.pagination.light-pagination .page-item:is(:first-child, :last-child) .page-link {
	background-color: var(--dx-light-bg-subtle)
}

.pagination.light-pagination .page-item.disabled .page-link {
	background-color: rgba(var(--dx-light-rgb), .7)
}

.link {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.link {
		transition: none
	}
}

.link.link-custom {
	color: var(--dx-body-color)
}

.link.link-custom:hover {
	color: var(--dx-primary)
}

.list-borderless {
	--dx-list-group-border-width: none;
	--dx-list-group-item-padding-x: 0px;
	--dx-list-group-item-padding-y: 4px
}

.list-arrow {
	list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAYBQTFRFAAAA2rcy8NNKxqEf5cI46MU55sQ46cc989hQwp0f3Lc06spIzKYl4r0507EuyaQj4Ls48tVSsogV2K4z6sRJyZ4n47o+8c5TvJEd3bM378xQs4Ya1KUy6L1Jxpgo4LM/881atokc2as37MJNn24P0Z8y5LVHwpAn3aw+7L5RtoQf1aQ357dKsX0dzpkz4q5HwIsn2KM87b1WtoIg0Zw257NM/t93rHccyJAw46xIuoMl1p476rVQrnkdzJU05q9LxYgr0Zc1voYpzpMzy5Ixsnshxoks0JY1u4Mnyo0s05o0v4koz5UxzJYxpnIZzJEu0po0toEkglIFzpYt058zwI0n0psxzZowo3MW0Zkw0p4yuIYj0Jwt1aUywJEl1qQxzp4up3kW06Av06MxvI4kcUoAz58q2awyvpMi2Koxz6Mss4kc1KUt1qkwuo4g1q0t2rIwuZIb3LQx17Ev3Lc13bQy168usowYyaUiwJ0evpob27Yt4b0y4r402rYusY4V3ki8agAAAIB0Uk5TAF88FqGnp6EiNcZBjctAWMkkIc1Pf6kTPdAuIMhYdLUOM8w8ErprZr0fLMFPGqp4Xr4kLL1UARWqfkzIKB/CWhW2glTRKB7RXBm6fmPSISzQVwEhw3FwxRk9yU0sxmh/thhBykgBK9JZja4ZSdQ4PdVHmsc2XtQqZD4XpKmppyKb5sQhAAAAaElEQVR4nGNkQAOMDIxQ8AMmwAkTeQ8VYBCCiTyDCjBIw0TuQgUYVGAiV6ACDLowEcZTEAEGc5jAQaiAA0xgB0TAE65lHVggGMZdCjE0Bi4/GyyQBuNOgjgsH8bvhDq9AspvhHkODQAAWEEOEWbiF0AAAAAASUVORK5CYII=)
}

.list-boxed .list-group-item {
	border: var(--dx-list-group-border-width) solid var(--dx-list-group-border-color);
	border-radius: .375rem
}

.list-boxed .list-group-item:not(:last-child) {
	margin-bottom: .5rem
}

.list-group-primary li::marker,
.list-group-primary li:before {
	color: var(--dx-primary)
}

.list-group-secondary li::marker,
.list-group-secondary li:before {
	color: var(--dx-secondary)
}

.list-group-success li::marker,
.list-group-success li:before {
	color: var(--dx-success)
}

.list-group-info li::marker,
.list-group-info li:before {
	color: var(--dx-info)
}

.list-group-warning li::marker,
.list-group-warning li:before {
	color: var(--dx-warning)
}

.list-group-danger li::marker,
.list-group-danger li:before {
	color: var(--dx-danger)
}

.list-group-light li::marker,
.list-group-light li:before {
	color: var(--dx-light)
}

.list-group-dark li::marker,
.list-group-dark li:before {
	color: var(--dx-dark)
}

.list-group-pink li::marker,
.list-group-pink li:before {
	color: var(--dx-pink)
}

.list-group-orange li::marker,
.list-group-orange li:before {
	color: var(--dx-orange)
}

.list-group-indigo li::marker,
.list-group-indigo li:before {
	color: var(--dx-indigo)
}

.nav-underline .nav-link {
	padding: .5rem 1rem;
	position: relative;
	border: 0
}

.nav-underline .nav-link:after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
	height: 1px;
	width: 0px;
	border-radius: 50rem;
	transition: all .4s ease-in-out;
	background-color: var(--dx-nav-underline-link-active-color)
}

@media (prefers-reduced-motion: reduce) {
	.nav-underline .nav-link:after {
		transition: none
	}
}

.nav-underline .nav-link:is(:hover, .active):after {
	width: 100%
}

.nav-underline .nav-link.active {
	font-weight: 500
}

.nav-icons .nav-link:hover svg,
.nav-icons .nav-link:hover i {
	animation: vibrate .3s
}

@keyframes vibrate {
	0% {
		transform: rotate(0)
	}

	30% {
		transform: rotate(15deg)
	}

	60% {
		transform: rotate(-15deg)
	}
}

.tabs-animation .nav-link {
	position: relative;
	overflow: hidden;
	height: 2.75rem;
	text-align: center;
	width: 8rem
}

.tabs-animation .nav-link .icon {
	transition: all .4s ease-in-out;
	margin-inline: auto;
	display: inline-block;
	width: 1rem;
	height: 1rem
}

@media (prefers-reduced-motion: reduce) {
	.tabs-animation .nav-link .icon {
		transition: none
	}
}

.tabs-animation .nav-link .content {
	transition: all .4s ease-in-out;
	display: block;
	transform: translateY(-3.5rem)
}

@media (prefers-reduced-motion: reduce) {
	.tabs-animation .nav-link .content {
		transition: none
	}
}

.tabs-animation .nav-link:hover .content {
	transform: translateY(-1.1rem)
}

.tabs-animation .nav-link:hover .icon {
	transform: translateY(2.5rem)
}

.nav-gradient .nav-link.active {
	background: conic-gradient(from 225deg at 50% 50%, #b06fff, #eec1fa, #6e89fe, #879ffb 270deg, #b0b7fa 300deg, #b06fff 360deg)
}

.custom-nav .nav-link.active {
	background-color: var(--dx-secondary-bg);
	color: var(--dx-body-color)
}

.modern-spinner {
	animation: spin 1s linear infinite
}

@keyframes spin {
	to {
		transform: rotate(360deg)
	}
}

:is(.animate-dot, .animate-bounce) {
	animation: bounce 1s infinite
}

:is(.animate-dot, .animate-bounce).delay-150 {
	animation-delay: -.3s
}

:is(.animate-dot, .animate-bounce).delay-300 {
	animation-delay: -.15s
}

@keyframes bounce {

	0%,
	to {
		transform: translateY(-25%);
		animation-timing-function: cubic-bezier(.8, 0, 1, 1)
	}

	50% {
		transform: none;
		animation-timing-function: cubic-bezier(0, 0, .2, 1)
	}
}

.animate-ping {
	animation: ping 1s cubic-bezier(0, 0, .2, 1) infinite
}

@keyframes ping {

	75%,
	to {
		content: var(--tw-content);
		transform: scale(2);
		opacity: 0
	}
}

.animate-pulse {
	animation: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite
}

@keyframes pulse {
	50% {
		opacity: .5
	}
}

@keyframes shimmer {
	to {
		transform: translate(0);
		opacity: 0
	}
}

.avatar {
	display: flex;
	align-items: center;
	justify-content: center
}

.avatar-group {
	display: flex;
	align-items: center
}

.avatar-group .avatar-group-item {
	position: relative;
	transition: z-index .3s ease
}

.avatar-group .avatar-group-item :is(img, div) {
	border: 2px solid var(--dx-secondary-bg);
	border-radius: 50rem
}

.avatar-group .avatar-group-item:not(:first-child) {
	margin-left: -10px
}

.avatar-group .avatar-group-item:hover {
	z-index: 10
}

:is(.btn.show) {
	border-color: transparent
}

[class*=btn-dashed-] {
	border-style: dashed
}

[class*=btn-3d-] {
	box-shadow: inset 0 2px 4px 0 var(--dx-btn-shadow-color)
}

.btn.btn-xs {
	padding: .125rem .5rem;
	font-size: .6875rem
}

.btn.btn-md {
	padding: .5rem 1rem;
	font-size: 12px
}

.btn.btn-lg {
	padding: .75rem 1.75rem;
	font-size: 1rem
}

.btn-icon-overlay {
	padding-left: 4rem
}

.btn-icon-overlay.right {
	padding-inline: 1.5rem 4rem
}

.btn-icon-overlay.right .icon {
	right: 0;
	left: auto
}

.btn-icon-overlay .icon {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.375rem;
	background-color: rgba(var(--dx-white-rgb), .1)
}

.btn.btn-icon {
	width: 2.5625rem;
	height: 2.5625rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, opacity .25s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.btn.btn-icon {
		transition: none
	}
}

.btn.btn-icon i {
	line-height: 2
}

.btn-modern .effect {
	background-image: radial-gradient(75% 100% at 50% 0%, #38f8b899, #38bdf800 75%);
	opacity: 0;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, opacity .25s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.btn-modern .effect {
		transition: none
	}
}

.btn-modern .effect:hover {
	opacity: 100
}

.btn-translate-up {
	transform: translateY(0);
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.btn-translate-up {
		transition: none
	}
}

.btn-translate-up:hover {
	transform: translateY(-.125rem)
}

.btn-translate-down {
	transform: translateY(0);
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.btn-translate-down {
		transition: none
	}
}

.btn-translate-down:hover {
	transform: translateY(.125rem)
}

.btn-scale {
	transform: scale(1);
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.btn-scale {
		transition: none
	}
}

.btn-scale:hover {
	transform: scale(1.1)
}

.card {
	margin-bottom: 1.25rem
}

.card.card-h-100 {
	height: calc(100% - 1.25rem)
}

.card .card-header {
	padding-bottom: 0;
	background-color: transparent
}

.card-title {
	font-size: .9375rem
}

.card-hover-animate {
	transition: transform .3s ease-in-out
}

.card-hover-animate:hover {
	transform: translateY(-.25rem)
}

.basic-card {
	overflow: hidden
}

.basic-card .card-img-left {
	height: 100%;
	object-fit: cover;
	width: 100%
}

.basic-card .img-avatar {
	top: 8%;
	left: 23%
}

.basic-card .img-avatar .user {
	height: 80px;
	width: 80px
}

.card-hover-effect {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.card-hover-effect {
		transition: none
	}
}

.card-hover-effect .icon-bg {
	height: 5rem;
	width: 5rem;
	display: flex;
	align-items: center;
	justify-content: center
}

.card-hover-effect .icon-hover-bg {
	position: absolute;
	top: 30px;
	left: 30px;
	transition: all .4s ease-in-out;
	height: 5rem;
	width: 5rem;
	border-radius: 50%
}

@media (prefers-reduced-motion: reduce) {
	.card-hover-effect .icon-hover-bg {
		transition: none
	}
}

.card-hover-effect:hover {
	box-shadow: 0 25px 50px -12px #00000040;
	transform: translateY(-6px)
}

.card-hover-effect:hover .icon-hover-bg {
	transform: scale(10);
	border-radius: 100%
}

.bg-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: #202322;
	opacity: .4
}

.bg-overlay-cards {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.bg-overlay-cards {
		transition: none
	}
}

.bg-overlay-cards img {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.bg-overlay-cards img {
		transition: none
	}
}

.bg-overlay-cards .main-title {
	transform: translateY(80px);
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.bg-overlay-cards .main-title {
		transition: none
	}
}

.bg-overlay-cards .transform-text {
	transform: translateY(100%);
	opacity: 0;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.bg-overlay-cards .transform-text {
		transition: none
	}
}

.bg-overlay-cards:hover img {
	transform: scale(1.1)
}

.bg-overlay-cards:hover .main-title {
	transform: translateY(0)
}

.bg-overlay-cards:hover .transform-text {
	transform: translateY(0);
	opacity: 1
}

.fancy-card {
	height: 400px
}

.hero-description-bk {
	border-radius: 25px;
	position: absolute;
	top: 55%;
	left: -7px;
	height: 65%;
	width: 108%;
	transform: skew(16deg, -9deg)
}

.dropdown-menu .dropdown-item {
	border-radius: .375rem;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.dropdown-menu .dropdown-item {
		transition: none
	}
}

:is(.dropdown .dropdown-toggle, .dropdown-toggle-split.dropdown-toggle):after {
	content: "";
	font-family: remixicon !important;
	border: none;
	font-size: 20px;
	line-height: .8;
	margin-top: 0;
	vertical-align: -.2rem
}

:is(.dropdown .dropdown-toggle, .dropdown-toggle-split.dropdown-toggle).show:after {
	transform: rotate(180deg)
}

.dropend .dropdown-toggle:after {
	content: "";
	font-family: remixicon !important;
	border: none !important;
	font-size: 20px;
	line-height: .8;
	margin-top: 3.2px;
	transform: rotate(-90deg)
}

.dropend .dropdown-toggle:hover:after {
	transform: rotate(-90deg)
}

.dropstart .dropdown-toggle:before {
	content: "";
	font-family: remixicon !important;
	border: none;
	font-size: 20px;
	line-height: .8;
	margin-top: 3.2px;
	transform: rotate(90deg)
}

.dropup .dropdown-toggle:after {
	content: "";
	font-family: remixicon !important;
	border: none;
	font-size: 20px;
	line-height: .8;
	margin-top: 3.2px;
	transform: rotate(180deg)
}

.square {
	height: 20rem;
	width: 20rem;
	background: linear-gradient(136deg, rgba(var(--dx-primary-rgb), .2), rgba(var(--dx-secondary-rgb), .2), rgba(var(--dx-info-rgb), .2));
	margin: 0 auto
}

.simplebar-scrollbar:before {
	background: var(--dx-border-color) !important
}

.simplebar-primary .simplebar-scrollbar:before {
	background-color: var(--dx-primary) !important
}

.simplebar-secondary .simplebar-scrollbar:before {
	background-color: var(--dx-secondary) !important
}

.simplebar-success .simplebar-scrollbar:before {
	background-color: var(--dx-success) !important
}

.simplebar-info .simplebar-scrollbar:before {
	background-color: var(--dx-info) !important
}

.simplebar-warning .simplebar-scrollbar:before {
	background-color: var(--dx-warning) !important
}

.simplebar-danger .simplebar-scrollbar:before {
	background-color: var(--dx-danger) !important
}

.simplebar-light .simplebar-scrollbar:before {
	background-color: var(--dx-light) !important
}

.simplebar-dark .simplebar-scrollbar:before {
	background-color: var(--dx-dark) !important
}

.simplebar-pink .simplebar-scrollbar:before {
	background-color: var(--dx-pink) !important
}

.simplebar-orange .simplebar-scrollbar:before {
	background-color: var(--dx-orange) !important
}

.simplebar-indigo .simplebar-scrollbar:before {
	background-color: var(--dx-indigo) !important
}

::-webkit-scrollbar-track {
	background-color: var(--dx-secondary-bg)
}

::-webkit-scrollbar {
	width: 10px;
	background-color: var(--dx-secondary-bg)
}

::-webkit-scrollbar-thumb {
	border-radius: 10px;
	background-color: var(--dx-border-color)
}

.swiper-primary .swiper-pagination-bullet {
	background: var(--dx-primary);
	height: .75rem;
	width: .75rem
}

.swiper-primary .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-primary)
}

.swiper-primary .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-primary)
}

.swiper-secondary .swiper-pagination-bullet {
	background: var(--dx-secondary);
	height: .75rem;
	width: .75rem
}

.swiper-secondary .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-secondary)
}

.swiper-secondary .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-secondary)
}

.swiper-success .swiper-pagination-bullet {
	background: var(--dx-success);
	height: .75rem;
	width: .75rem
}

.swiper-success .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-success)
}

.swiper-success .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-success)
}

.swiper-info .swiper-pagination-bullet {
	background: var(--dx-info);
	height: .75rem;
	width: .75rem
}

.swiper-info .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-info)
}

.swiper-info .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-info)
}

.swiper-warning .swiper-pagination-bullet {
	background: var(--dx-warning);
	height: .75rem;
	width: .75rem
}

.swiper-warning .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-warning)
}

.swiper-warning .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-warning)
}

.swiper-danger .swiper-pagination-bullet {
	background: var(--dx-danger);
	height: .75rem;
	width: .75rem
}

.swiper-danger .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-danger)
}

.swiper-danger .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-danger)
}

.swiper-light .swiper-pagination-bullet {
	background: var(--dx-light);
	height: .75rem;
	width: .75rem
}

.swiper-light .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-light)
}

.swiper-light .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-light)
}

.swiper-dark .swiper-pagination-bullet {
	background: var(--dx-dark);
	height: .75rem;
	width: .75rem
}

.swiper-dark .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-dark)
}

.swiper-dark .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-dark)
}

.swiper-pink .swiper-pagination-bullet {
	background: var(--dx-pink);
	height: .75rem;
	width: .75rem
}

.swiper-pink .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-pink)
}

.swiper-pink .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-pink)
}

.swiper-orange .swiper-pagination-bullet {
	background: var(--dx-orange);
	height: .75rem;
	width: .75rem
}

.swiper-orange .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-orange)
}

.swiper-orange .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-orange)
}

.swiper-indigo .swiper-pagination-bullet {
	background: var(--dx-indigo);
	height: .75rem;
	width: .75rem
}

.swiper-indigo .swiper-pagination-bullet-active {
	background: var(--dx-white);
	border: 3px solid var(--dx-indigo)
}

.swiper-indigo .custom-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background: var(--dx-indigo)
}

.swiper-button-prev:before {
	content: "";
	font-family: RemixIcon
}

.swiper-button-next:before {
	content: "";
	font-family: RemixIcon
}

:is(.swiper-button-prev, .swiper-button-next):after {
	display: none
}

.swiper-navigation-hover :is(.swiper-button-prev, .swiper-button-next) {
	opacity: 0;
	visibility: hidden;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.swiper-navigation-hover :is(.swiper-button-prev, .swiper-button-next) {
		transition: none
	}
}

.swiper-navigation-hover :is(.swiper-button-prev, .swiper-button-next):before {
	transition: all .4s ease-in-out;
	opacity: 0;
	visibility: hidden
}

@media (prefers-reduced-motion: reduce) {
	.swiper-navigation-hover :is(.swiper-button-prev, .swiper-button-next):before {
		transition: none
	}
}

.swiper-navigation-hover:hover :is(.swiper-button-prev, .swiper-button-next) {
	opacity: 1;
	visibility: visible
}

.swiper-navigation-hover:hover :is(.swiper-button-prev, .swiper-button-next):before {
	opacity: 1;
	visibility: visible
}

.basic-square {
	background: linear-gradient(136deg, var(--dx-primary), var(--dx-secondary), var(--dx-info))
}

.glare-square {
	background: linear-gradient(136deg, var(--dx-success), var(--dx-indigo), var(--dx-info))
}

.reverse-square {
	background: linear-gradient(136deg, var(--dx-info), var(--dx-info))
}

.floating-square {
	background: linear-gradient(136deg, var(--dx-primary), var(--dx-primary))
}

.annotation-dropdown {
	top: 40px;
	left: 50px
}

.annotation-dropdown .comment-content {
	max-height: 200px
}

.annotation-dropdown #comment-input {
	width: 100%;
	color: var(--dx-emphasis-color)
}

.annotation-dropdown #comment-input:focus {
	outline: none
}

.deckgo-highlight-code-carbon {
	--deckgo-highlight-code-carbon-background: #1a1c1b;
	--deckgo-highlight-code-carbon-color: #ffffff;
	--deckgo-highlight-code-token-atrule: #ec4899;
	--deckgo-highlight-code-token-function: #eab308;
	--deckgo-highlight-code-carbon-header-button-red-background: #ef4444;
	--deckgo-highlight-code-token-selector: #4ade80;
	--deckgo-highlight-code-font-size: .9063rem;
	--deckgo-highlight-code-carbon-header-button-width: .68rem;
	--deckgo-highlight-code-carbon-header-button-height: .68rem
}

.chatbot-one {
	background: linear-gradient(to top right, var(--dx-primary), var(--dx-secondary))
}

.chatbot-two {
	background: linear-gradient(to top right, var(--dx-pink), var(--dx-indigo))
}

.chatbot-three {
	background: linear-gradient(to bottom right, rgba(var(--dx-primary-rgb), .2), rgba(var(--dx-success-rgb), .2), rgba(var(--dx-secondary-rgb), .2))
}

.treeview-scrollable {
	max-height: 70vh
}

.treeview {
	-webkit-user-select: none;
	user-select: none
}

.treeview ul {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.treeview ul {
		transition: none
	}
}

.treeview ul.list-unstyled {
	margin-bottom: 0
}

.treeview ul:not(.d-none) {
	animation: slideDown .5s ease-in-out
}

.treeview li {
	position: relative
}

.treeview li:before {
	content: "";
	position: absolute;
	left: -.75rem;
	top: 0;
	width: 1px;
	height: 100%;
	background-color: var(--dx-border-color);
	z-index: 0
}

.treeview li:last-child:before {
	height: 1.5rem
}

.treeview li:last-child {
	margin-bottom: 0
}

.treeview li:before,
.treeview li>a:before {
	display: none
}

.treeview a {
	transition: all .4s ease-in-out;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-bottom: 5px
}

@media (prefers-reduced-motion: reduce) {
	.treeview a {
		transition: none
	}
}

.treeview a:hover,
.treeview a:active,
.treeview a:focus {
	color: var(--dx-primary) !important;
	background-color: var(--dx-primary-bg-subtle)
}

.treeview i {
	margin-right: .5rem;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.treeview i {
		transition: none
	}
}

.treeview [aria-expanded=true] {
	font-weight: 500;
	color: var(--dx-primary);
	background-color: var(--dx-light)
}

.treeview [data-node] {
	cursor: pointer
}

@keyframes slideDown {
	0% {
		opacity: 0;
		transform: translateY(-10px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

.icon-box {
	height: 2.5rem;
	width: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--dx-border-color);
	border-radius: .375rem
}

.stroke-1 {
	stroke-width: 1
}

.stroke-2 {
	stroke-width: 2
}

.stroke-3 {
	stroke-width: 3
}

.stroke-4 {
	stroke-width: 4
}

.size-2-5 {
	width: .625rem;
	height: .625rem
}

.size-3-5 {
	width: .875rem;
	height: .875rem
}

.icon-primary {
	fill: rgba(var(--dx-primary-rgb), .1);
	color: var(--dx-primary)
}

.icon-hover-primary {
	color: var(--dx-primary)
}

.icon-hover-primary:hover {
	fill: var(--dx-primary-bg-subtle)
}

.icon-secondary {
	fill: rgba(var(--dx-secondary-rgb), .1);
	color: var(--dx-secondary)
}

.icon-hover-secondary {
	color: var(--dx-secondary)
}

.icon-hover-secondary:hover {
	fill: var(--dx-secondary-bg-subtle)
}

.icon-success {
	fill: rgba(var(--dx-success-rgb), .1);
	color: var(--dx-success)
}

.icon-hover-success {
	color: var(--dx-success)
}

.icon-hover-success:hover {
	fill: var(--dx-success-bg-subtle)
}

.icon-info {
	fill: rgba(var(--dx-info-rgb), .1);
	color: var(--dx-info)
}

.icon-hover-info {
	color: var(--dx-info)
}

.icon-hover-info:hover {
	fill: var(--dx-info-bg-subtle)
}

.icon-warning {
	fill: rgba(var(--dx-warning-rgb), .1);
	color: var(--dx-warning)
}

.icon-hover-warning {
	color: var(--dx-warning)
}

.icon-hover-warning:hover {
	fill: var(--dx-warning-bg-subtle)
}

.icon-danger {
	fill: rgba(var(--dx-danger-rgb), .1);
	color: var(--dx-danger)
}

.icon-hover-danger {
	color: var(--dx-danger)
}

.icon-hover-danger:hover {
	fill: var(--dx-danger-bg-subtle)
}

.icon-light {
	fill: rgba(var(--dx-light-rgb), .1);
	color: var(--dx-light)
}

.icon-hover-light {
	color: var(--dx-light)
}

.icon-hover-light:hover {
	fill: var(--dx-light-bg-subtle)
}

.icon-dark {
	fill: rgba(var(--dx-dark-rgb), .1);
	color: var(--dx-dark)
}

.icon-hover-dark {
	color: var(--dx-dark)
}

.icon-hover-dark:hover {
	fill: var(--dx-dark-bg-subtle)
}

.icon-pink {
	fill: rgba(var(--dx-pink-rgb), .1);
	color: var(--dx-pink)
}

.icon-hover-pink {
	color: var(--dx-pink)
}

.icon-hover-pink:hover {
	fill: var(--dx-pink-bg-subtle)
}

.icon-orange {
	fill: rgba(var(--dx-orange-rgb), .1);
	color: var(--dx-orange)
}

.icon-hover-orange {
	color: var(--dx-orange)
}

.icon-hover-orange:hover {
	fill: var(--dx-orange-bg-subtle)
}

.icon-indigo {
	fill: rgba(var(--dx-indigo-rgb), .1);
	color: var(--dx-indigo)
}

.icon-hover-indigo {
	color: var(--dx-indigo)
}

.icon-hover-indigo:hover {
	fill: var(--dx-indigo-bg-subtle)
}

.fill-primary {
	fill: var(--dx-primary)
}

.fill-secondary {
	fill: var(--dx-secondary)
}

.fill-success {
	fill: var(--dx-success)
}

.fill-info {
	fill: var(--dx-info)
}

.fill-warning {
	fill: var(--dx-warning)
}

.fill-danger {
	fill: var(--dx-danger)
}

.fill-light {
	fill: var(--dx-light)
}

.fill-dark {
	fill: var(--dx-dark)
}

.fill-pink {
	fill: var(--dx-pink)
}

.fill-orange {
	fill: var(--dx-orange)
}

.fill-indigo {
	fill: var(--dx-indigo)
}

.form-label {
	font-weight: 500
}

.form-control:focus {
	box-shadow: none;
	border-color: var(--dx-primary)
}

.form-control-md {
	padding: .375rem .75rem;
	font-size: .875rem
}

.resize-none {
	resize: none
}

.form-control.fil-input:focus {
	border-color: var(--dx-gray-200)
}

#formFile::file-selector-button {
	background-color: var(--dx-light-bg-subtle);
	color: var(--dx-secondary-color)
}

#formFileDark::file-selector-button {
	background-color: var(--dx-gray-800);
	color: var(--dx-white)
}

#formFileSecondary::file-selector-button {
	background-color: var(--dx-secondary-bg-subtle);
	color: var(--dx-secondary);
	font-weight: 500;
	border-radius: 6px;
	border: none
}

.vscomp-ele {
	max-width: 100% !important
}

.vscomp-ele .vscomp-wrapper {
	color: var(--dx-body-color)
}

.vscomp-ele .vscomp-wrapper .vscomp-toggle-button {
	background-color: transparent;
	border: 1px solid var(--dx-border-color)
}

.vscomp-ele .vscomp-wrapper:focus .vscomp-toggle-button,
.vscomp-ele .vscomp-wrapper.focused .vscomp-toggle-button {
	border-color: var(--dx-primary);
	box-shadow: var(--dx-box-shadow) !important
}

.vscomp-ele .vscomp-wrapper:not(.has-value) .vscomp-value {
	opacity: 1;
	color: var(--dx-secondary-color)
}

.vscomp-ele .vscomp-wrapper .vscomp-arrow:after {
	margin-top: -3px;
	border-bottom-color: var(--dx-emphasis-color);
	border-right-color: var(--dx-emphasis-color);
	border-left-color: transparent
}

.vscomp-ele .vscomp-wrapper .checkbox-icon {
	margin-right: 10px;
	margin-left: 0
}

.vscomp-ele .vscomp-wrapper .checkbox-icon:after {
	border: 1px solid var(--dx-tertiary-bg)
}

.vscomp-ele .vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon:after {
	border: 1px solid var(--dx-primary);
	border-top-color: transparent !important;
	border-left-color: transparent !important
}

.vscomp-ele .vscomp-wrapper .vscomp-options,
.vscomp-ele .vscomp-wrapper .vscomp-no-search-results {
	background-color: var(--dx-secondary-bg)
}

.vscomp-ele .vscomp-wrapper .vscomp-options .vscomp-option,
.vscomp-ele .vscomp-wrapper .vscomp-no-search-results .vscomp-option {
	text-align: left
}

.vscomp-ele .vscomp-wrapper .vscomp-options .vscomp-option.selected,
.vscomp-ele .vscomp-wrapper .vscomp-options .vscomp-option.focused,
.vscomp-ele .vscomp-wrapper .vscomp-no-search-results .vscomp-option.selected,
.vscomp-ele .vscomp-wrapper .vscomp-no-search-results .vscomp-option.focused {
	background-color: var(--dx-tertiary-bg) !important
}

.vscomp-ele .vscomp-wrapper .vscomp-search-container {
	background-color: var(--dx-secondary-bg);
	border-bottom: 1px solid var(--dx-tertiary-bg)
}

.vscomp-ele .vscomp-wrapper .pop-comp-wrapper {
	box-shadow: 0 10px 15px -3px var(--dx-tertiary-bg), 0 4px 6px -4px var(--dx-tertiary-bg);
	color: var(--dx-emphasis-color)
}

.vscomp-ele .vscomp-wrapper .vscomp-search-wrapper {
	box-shadow: none !important
}

.vscomp-ele .vscomp-wrapper.has-clear-button .vscomp-toggle-button {
	padding-right: 3.375rem !important
}

.vscomp-ele .vscomp-wrapper .vscomp-dropbox-container {
	z-index: 9999 !important
}

.vscomp-ele .vscomp-wrapper.show-value-as-tags .vscomp-arrow {
	height: 100%
}

.vscomp-ele .vscomp-wrapper.show-value-as-tags .vscomp-value {
	min-height: 100%
}

.vscomp-ele .vscomp-wrapper.show-value-as-tags .vscomp-value-tag {
	padding: 2px 3px 2px 8px;
	border: 1px solid var(--dx-border-color)
}

.vscomp-ele .vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button {
	right: 2px;
	left: auto
}

.vscomp-ele .vscomp-search-input::placeholder {
	color: var(--dx-secondary-color)
}

.vscomp-ele .vscomp-toggle-button {
	padding: .5938rem 1.875rem .5938rem .625rem !important;
	border-radius: .375rem !important
}

.vscomp-ele .vscomp-clear-button {
	right: 30px;
	left: auto
}

.vscomp-ele .vscomp-arrow {
	right: 0;
	left: auto
}

.form-range.range-primary::-webkit-slider-thumb {
	background: var(--dx-primary)
}

.form-range.range-secondary::-webkit-slider-thumb {
	background: var(--dx-secondary)
}

.form-range.range-success::-webkit-slider-thumb {
	background: var(--dx-success)
}

.form-range.range-info::-webkit-slider-thumb {
	background: var(--dx-info)
}

.form-range.range-warning::-webkit-slider-thumb {
	background: var(--dx-warning)
}

.form-range.range-danger::-webkit-slider-thumb {
	background: var(--dx-danger)
}

.form-range.range-light::-webkit-slider-thumb {
	background: var(--dx-light)
}

.form-range.range-dark::-webkit-slider-thumb {
	background: var(--dx-dark)
}

.form-range.range-pink::-webkit-slider-thumb {
	background: var(--dx-pink)
}

.form-range.range-orange::-webkit-slider-thumb {
	background: var(--dx-orange)
}

.form-range.range-indigo::-webkit-slider-thumb {
	background: var(--dx-indigo)
}

.form-switch input[type=checkbox] {
	height: 0;
	width: 0;
	visibility: hidden
}

.form-switch input:checked+label:after {
	left: 1.4375rem
}

.form-switch label {
	cursor: pointer;
	width: 3rem;
	height: 1.75rem;
	border-radius: 6.25rem;
	position: relative
}

.form-switch label:after {
	content: "";
	position: absolute;
	top: .1875rem;
	left: .1875rem;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 5.625rem;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.form-switch label:after {
		transition: none
	}
}

[class*=switch-outline] label {
	border: 1px solid var(--dx-border-color)
}

[class*=switch-outline] label:after {
	background: var(--dx-border-color)
}

[class*=switch-outline] label .rounded {
	border-radius: 2px
}

[class*=switch-soft] label,
[class*=switch-light] label {
	background-color: var(--dx-border-color);
	border: 1px solid var(--dx-border-color)
}

[class*=switch-soft] label:after,
[class*=switch-light] label:after {
	background: var(--dx-secondary-bg)
}

[class*=switch-solid] input:checked+label:after {
	background-color: var(--dx-secondary-bg)
}

[class*=switch-solid] label {
	border: 1px solid var(--dx-border-color)
}

[class*=switch-solid] label:after {
	background: var(--dx-border-color)
}

[class*=switch-effect] label {
	box-shadow: inset 0 2px 4px 0 var(--dx-border-color);
	border: 1px solid var(--dx-border-color)
}

[class*=switch-effect] label:after {
	background: var(--dx-secondary-bg);
	box-shadow: 0 10px 15px -3px rgba(var(--dx-secondary-color-rgb), .5), 0 4px 6px -4px rgba(var(--dx-secondary-color-rgb), .5)
}

.switch-square label {
	border-radius: .375rem
}

.switch-square label:after {
	border-radius: .375rem
}

.switch-text label:after {
	content: "N";
	font-weight: 600;
	font-size: 12px;
	display: flex;
	align-items: center;
	justify-content: center
}

.switch-text input:checked+label:after {
	color: #fff
}

.switch-icon label:after {
	content: "";
	font-family: RemixIcon
}

.switch-icon input:checked+label:after {
	content: ""
}

.form-check {
	min-height: 1.5rem;
	margin-bottom: 0
}

.form-check .form-check-input {
	cursor: pointer
}

.form-check .form-check-input.circle {
	border-radius: 50px
}

.form-check .form-check-label {
	cursor: pointer
}

.form-check [type=checkbox]:checked {
	background-size: .65rem .65rem
}

.card-checkbox svg {
	width: 2.375rem
}

.card-checkbox.light-checkbox .form-check-selected:has(:checked) {
	background-color: var(--dx-light-bg-subtle);
	border-color: var(--dx-light-bg-subtle);
	color: var(--dx-body-color)
}

.card-checkbox .form-check-selected {
	display: flex;
	align-items: center;
	gap: .5rem;
	border: 1px solid transparent;
	cursor: pointer
}

.card-checkbox .form-check-selected:hover {
	background-color: var(--dx-tertiary-bg);
	transition: all .4s ease-in-out
}

.card-checkbox .form-check-selected:has(:checked) {
	background-color: var(--dx-primary-bg-subtle);
	border-color: var(--dx-primary-bg-subtle);
	color: var(--dx-primary)
}

#taskList .completed {
	text-decoration: line-through;
	color: var(--dx-secondary-color)
}

.input-spin-group {
	width: 8rem;
	display: flex;
	align-items: center;
	justify-content: center
}

.input-spin-group .input-spin {
	border-radius: 0;
	padding: 0;
	text-align: center
}

.input-spin-group .input-spin.form-control {
	display: block;
	height: 2.5rem;
	width: 100%;
	border: 1px solid var(--dx-border-color)
}

.input-spin-group .input-spin-plus,
.input-spin-group .input-spin-minus {
	display: flex;
	width: 2.5rem;
	height: 2.5rem;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--dx-border-color);
	background-color: transparent;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {

	.input-spin-group .input-spin-plus,
	.input-spin-group .input-spin-minus {
		transition: none
	}
}

.input-spin-group .input-spin-plus svg,
.input-spin-group .input-spin-minus svg {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {

	.input-spin-group .input-spin-plus svg,
	.input-spin-group .input-spin-minus svg {
		transition: none
	}
}

.input-spin-group .input-spin-minus:where([dir=ltr], [dir=ltr] *) {
	border-top-left-radius: .375rem;
	border-bottom-left-radius: .375rem;
	border-right-width: 0px
}

.input-spin-group .input-spin-plus:where([dir=ltr], [dir=ltr] *) {
	border-top-right-radius: .375rem;
	border-bottom-right-radius: .375rem;
	border-left-width: 0px
}

.ql-snow .ql-editor h2 {
	line-height: 2
}

.ql-container {
	height: 13rem !important
}

:is(.ql-toolbar, .ql-container) .ql-snow {
	border-color: var(--dx-border-color) !important
}

.ql-snow .ql-picker {
	color: var(--dx-body-color)
}

.ql-snow .ql-stroke {
	stroke: var(--dx-body-color)
}

.ql-snow .ql-picker-options {
	background-color: var(--dx-secondary-bg)
}

:is(.ql-toolbar, .ql-container).ql-snow {
	border-color: var(--dx-border-color)
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded :is(.ql-picker-label, .ql-picker-options) {
	border-color: var(--dx-border-color)
}

.codex-editor .codex-editor__redactor {
	padding-bottom: 0 !important
}

.codex-editor :is(.ce-toolbar__plus, .ce-toolbar__settings-btn) {
	color: var(--dx-body-color)
}

@media (hover: hover) {
	.codex-editor :is(.ce-toolbar__settings-btn, .ce-toolbar__plus):hover {
		background-color: var(--dx-tertiary-bg)
	}
}

.codex-editor .ce-block--selected .ce-block__content {
	background-color: var(--dx-primary-bg-subtle)
}

.codex-editor .ce-popover {
	--color-background: var(--dx-secondary-bg);
	--color-border: var(--dx-border-color);
	--color-text-primary: var(--dx-body-color);
	--color-text-secondary: var(--dx-secondary-color);
	--color-background-item-hover: var(--dx-tertiary-bg)
}

.codex-editor .cdx-marker {
	background-color: var(--dx-warning-bg-subtle)
}

.codex-editor .cdx-search-field {
	background-color: var(--dx-tertiary-bg);
	border-color: var(--dx-border-color)
}

.cdx-block .cdx-attaches {
	--color-line: var(--dx-border-color);
	--color-bg: var(--dx-secondary-bg);
	--color-bg-secondary: var(--dx-tertiary-bg);
	--color-bg-secondary--hover: var(--dx-tertiary-bg);
	--color-text-secondary: var(--dx-secondary-color)
}

@media (max-width: 650px) {
	:is(.ce-toolbar__settings-btn, .ce-toolbar__plus) {
		border-color: var(--dx-border-color);
		background-color: var(--dx-secondary-bg)
	}
}

th {
	font-weight: 500
}

.border-separate {
	border-collapse: separate
}

.border-separate tr :is(td, th) {
	border: 1px solid var(--dx-border-color)
}

.border-separate.border-spacing-2 {
	border-spacing: .25rem .25rem
}

.table-separate {
	border-collapse: separate !important;
	border-spacing: 0 8px !important
}

.table-separate td {
	border-top: 1px solid var(--dx-border-color);
	border-bottom: 1px solid var(--dx-border-color)
}

.table-separate td:first-child {
	border-top-left-radius: .375rem;
	border-bottom-left-radius: .375rem;
	border-left: 1px solid var(--dx-border-color)
}

.table-separate td:last-child {
	border-top-right-radius: .375rem;
	border-bottom-right-radius: .375rem;
	border-right: 1px solid var(--dx-border-color)
}

.table-striped-even>tbody>tr:nth-child(2n)>td {
	background-color: var(--dx-tertiary-bg)
}

.table-color-primary {
	--dx-table-striped-bg: var(--dx-primary-bg-subtle)
}

.table-primary {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-primary-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-primary-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-primary-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-primary-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-primary-rgb), .1)
}

.table-color-secondary {
	--dx-table-striped-bg: var(--dx-secondary-bg-subtle)
}

.table-secondary {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-secondary-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-secondary-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-secondary-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-secondary-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-secondary-rgb), .1)
}

.table-color-success {
	--dx-table-striped-bg: var(--dx-success-bg-subtle)
}

.table-success {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-success-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-success-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-success-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-success-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-success-rgb), .1)
}

.table-color-info {
	--dx-table-striped-bg: var(--dx-info-bg-subtle)
}

.table-info {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-info-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-info-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-info-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-info-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-info-rgb), .1)
}

.table-color-warning {
	--dx-table-striped-bg: var(--dx-warning-bg-subtle)
}

.table-warning {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-warning-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-warning-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-warning-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-warning-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-warning-rgb), .1)
}

.table-color-danger {
	--dx-table-striped-bg: var(--dx-danger-bg-subtle)
}

.table-danger {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-danger-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-danger-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-danger-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-danger-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-danger-rgb), .1)
}

.table-color-light {
	--dx-table-striped-bg: var(--dx-light-bg-subtle)
}

.table-light {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-light-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-light-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-light-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-light-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-light-rgb), .1)
}

.table-color-dark {
	--dx-table-striped-bg: var(--dx-dark-bg-subtle)
}

.table-dark {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-dark-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-dark-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-dark-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-dark-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-dark-rgb), .1)
}

.table-color-pink {
	--dx-table-striped-bg: var(--dx-pink-bg-subtle)
}

.table-pink {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-pink-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-pink-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-pink-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-pink-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-pink-rgb), .1)
}

.table-color-orange {
	--dx-table-striped-bg: var(--dx-orange-bg-subtle)
}

.table-orange {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-orange-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-orange-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-orange-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-orange-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-orange-rgb), .1)
}

.table-color-indigo {
	--dx-table-striped-bg: var(--dx-indigo-bg-subtle)
}

.table-indigo {
	--dx-table-color: var(--dx-body-color);
	--dx-table-bg: rgba(var(--dx-indigo-rgb), .15);
	--dx-table-border-color: rgba(var(--dx-indigo-rgb), .35);
	--dx-table-striped-bg: rgba(var(--dx-indigo-rgb), .1);
	--dx-table-active-bg: rgba(var(--dx-indigo-rgb), .1);
	--dx-table-hover-bg: rgba(var(--dx-indigo-rgb), .1)
}

.table-card {
	margin-left: -1.25rem;
	margin-right: -1.25rem
}

.table-card :is(th, td):first-child {
	padding-left: 1.25rem !important
}

.table-card :is(th, td):last-child {
	padding-right: 1.25rem !important
}

.apexcharts-tooltip.apexcharts-theme-light {
	border: 1px solid var(--dx-border-color) !important;
	background: var(--dx-secondary-bg) !important;
	border-radius: .375rem;
	box-shadow: var(--dx-box-shadow)
}

.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
	border-bottom: 0 !important;
	padding-bottom: 0 !important;
	background-color: var(--dx-secondary-bg) !important;
	font-weight: 600
}

.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-text {
	font-size: .75rem
}

.apexcharts-datalabel {
	font-family: var(--dx-font-sans-serif) !important
}

.apexcharts-text,
.apexcharts-title-text {
	font-family: var(--dx-font-sans-serif) !important;
	fill: var(--dx-body-color) !important
}

.apexcharts-legend-text {
	font-size: .75rem;
	color: var(--dx-body-color) !important
}

.apexcharts-tooltip-rangebar .category {
	color: var(--dx-secondary-color) !important
}

.apexcharts-xaxistooltip,
.apexcharts-yaxistooltip {
	font-size: .75rem;
	color: var(--dx-emphasis-color) !important;
	background-color: var(--dx-secondary-bg) !important;
	border: 1px solid var(--dx-border-color) !important
}

.apexcharts-xaxistooltip-bottom:before {
	border-bottom: 1px solid var(--dx-secondary-bg) !important
}

.apexcharts-gridline,
.apexcharts-xcrosshairs,
.apexcharts-xaxis-tick {
	stroke: var(--dx-border-color) !important
}

.apexcharts-xaxis line {
	stroke: var(--dx-light-bg-subtle)
}

.apexcharts-grid-borders line {
	stroke: var(--dx-light-bg-subtle)
}

.apexcharts-series-markers circle,
.apexcharts-series-markers path {
	stroke: var(--dx-secondary-bg)
}

.apexcharts-bar-series path {
	stroke: var(--dx-secondary-bg)
}

.apexcharts-boxPlot-series path {
	stroke: var(--dx-light-bg-subtle)
}

.apexcharts-heatmap rect,
.apexcharts-treemap rect {
	stroke: var(--dx-secondary-bg)
}

.apexcharts-pie-series path {
	stroke: var(--dx-secondary-bg)
}

.apexcharts-pie-label {
	fill: #fff !important
}

.apexcharts-pie line,
.apexcharts-pie circle {
	stroke: transparent
}

.apexcharts-radar-series polygon,
.apexcharts-radar-series line {
	stroke: var(--dx-light-bg-subtle)
}

.apexcharts-radialbar-track path {
	stroke: var(--dx-light-bg-subtle)
}

.apexcharts-data-labels rect {
	stroke: var(--dx-light-bg-subtle)
}

.apexcharts-menu {
	background-color: var(--dx-secondary-bg) !important;
	border-color: var(--dx-border-color) !important
}

.jvm-container path {
	fill: var(--dx-border-color)
}

.jvm-zoom-btn.jvm-zoomin {
	top: .625rem
}

.jvm-zoom-btn:where([dir=ltr], [dir=ltr] *) {
	left: .625rem
}

.jvm-zoom-btn.jvm-zoomout {
	top: 1.75rem
}

.jvm-zoom-btn {
	position: absolute;
	box-sizing: border-box;
	display: flex;
	width: .875rem;
	height: .875rem;
	cursor: pointer;
	align-items: center;
	justify-content: center;
	border-radius: .375rem;
	background-color: var(--dx-dark);
	line-height: 10px;
	color: #fff
}

.jvm-legend {
	display: inline-block;
	background-color: var(--dx-secondary-bg);
	padding: 10px;
	border-radius: 5px;
	box-shadow: 0 10px 15px -3px var(--dx-tertiary-bg), 0 4px 6px -4px var(--dx-tertiary-bg);
	float: inline-end
}

.jvm-legend .jvm-legend-title {
	margin-bottom: 9px
}

.jvm-legend .jvm-legend-tick {
	display: flex;
	align-items: center;
	gap: 7px;
	margin-top: 10px
}

.jvm-legend .jvm-legend-tick .jvm-legend-tick-sample {
	height: 14px;
	width: 14px;
	border-radius: 999px
}

.jvm-legend .jvm-legend-tick .jvm-legend-tick-text {
	font-size: 12px
}

#jvm-markers-labels-group .jvm-element {
	fill: var(--dx-secondary-color)
}

div.air-datepicker {
	--adp-color: var(--dx-secondary-color);
	--adp-font-family: var(--dx-body-font-family);
	--adp-background-color: var(--dx-secondary-bg);
	--adp-border-color-inline: var(--dx-border-color);
	--adp-border-color-inner: var(--dx-border-color);
	--adp-border-color: var(--dx-border-color);
	--adp-color-current-date: var(--dx-primary);
	--adp-accent-color: var(--dx-primary);
	--adp-btn-color: var(--dx-primary);
	--adp-cell-background-color-selected: var(--dx-primary);
	--adp-cell-background-color-selected-hover: var(--dx-primary);
	--adp-background-color-chover: var(--dx-tertiary-bg);
	--adp-background-color-hover: var(--dx-tertiary-bg);
	--adp-background-color-active: var(--dx-tertiary-bg);
	--adp-color-secondary: var(--dx-secondary-color);
	--adp-color-other-month: var(--dx-tertiary-color);
	--adp-day-name-color: var(--dx-secondary-color);
	--adp-time-track-color: var(--dx-secondary-color);
	--adp-time-track-color-hover: var(--dx-body-color);
	--adp-cell-background-color-in-range: var(--dx-primary-bg-subtle);
	--adp-cell-background-color-in-range-hover: var(--dx-primary-bg-subtle);
	direction: ltr
}

.air-datepicker {
	box-shadow: var(--dx-box-shadow) !important
}

.air-datepicker .air-datepicker-body--day-names {
	margin: 0 0 3px;
	padding: 3px 0;
	background-color: var(--dx-tertiary-bg);
	font-weight: 600
}

.air-datepicker .air-datepicker--pointer:after {
	background: var(--dx-secondary-bg)
}

.air-datepicker-global-container {
	z-index: 1055
}

html * {
	unicode-bidi: bidi-override
}

.filepond--panel-root,
.filepond--drip-blob {
	background: var(--dx-tertiary-bg) !important;
	border: 1px solid var(--dx-border-color)
}

.filepond--drop-label {
	cursor: pointer;
	color: var(--dx-secondary-color) !important
}

.filepond--drop-label.filepond--drop-label label {
	padding: .7rem !important
}

.filepond--file {
	color: var(--dx-body-color) !important
}

.filepond--file .filepond--image-preview {
	background: var(--dx-secondary-bg);
	border: 1px solid var(--dx-border-color);
	border-radius: .375rem;
	box-shadow: none
}

.filepond--file .filepond--image-preview-overlay {
	display: none
}

.filepond--file .filepond--file-action-button {
	background-color: var(--dx-tertiary-bg);
	color: var(--dx-secondary-color)
}

.filepond--item-panel {
	background-color: transparent !important
}

.filepond--item>.filepond--panel .filepond--panel-bottom {
	box-shadow: none !important
}

.file-upload-invoice .filepond--root,
.file-upload-invoice .filepond--root .filepond--drop-label {
	height: 152px !important
}

.file-upload-invoice .filepond--image-preview-wrapper {
	height: 120px !important
}

.gridjs-container {
	color: var(--dx-body-color)
}

.gridjs-container .gridjs-wrapper {
	box-shadow: none;
	border: 1px solid var(--dx-border-color);
	border-radius: 0
}

.gridjs-container th.gridjs-th {
	border-color: var(--dx-border-color);
	background-color: var(--dx-tertiary-bg);
	color: var(--dx-secondary-color);
	padding: .875rem .75rem
}

.gridjs-container td.gridjs-td {
	padding: .875rem .75rem;
	border-color: var(--dx-border-color)
}

.gridjs-container :is(.gridjs-tbody, td.gridjs-td) {
	background-color: var(--dx-secondary-bg)
}

.gridjs-container .gridjs-footer {
	box-shadow: none;
	border-radius: 0;
	background-color: var(--dx-secondary-bg);
	border: 1px solid var(--dx-border-color);
	border-top: none
}

.gridjs-container .gridjs-pagination {
	color: var(--dx-secondary-color)
}

.gridjs-container .gridjs-pagination .gridjs-pages {
	display: flex;
	align-items: center;
	gap: .5rem;
	flex-wrap: wrap
}

@media (max-width: 575.98px) {
	.gridjs-container .gridjs-pagination .gridjs-pages {
		margin-top: .75rem
	}
}

.gridjs-container .gridjs-pagination .gridjs-pages button {
	color: var(--dx-body-color);
	background-color: var(--dx-secondary-bg);
	border: 1px solid var(--dx-border-color);
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--dx-border-radius)
}

.gridjs-container .gridjs-pagination .gridjs-pages button:is(:last-child, :first-child) {
	width: auto;
	padding: 0 .79rem;
	border: 1px solid var(--dx-border-color)
}

.gridjs-container .gridjs-pagination .gridjs-pages button.gridjs-currentPage {
	color: #fff;
	background-color: var(--dx-primary);
	border-color: var(--dx-primary)
}

.gridjs-container .gridjs-pagination .gridjs-pages button:focus {
	box-shadow: none;
	border-color: var(--dx-border-color)
}

.gridjs-container .gridjs-pagination .gridjs-pages button:disabled,
.gridjs-container .gridjs-pagination .gridjs-pages button:hover:disabled,
.gridjs-container .gridjs-pagination .gridjs-pages button[disabled] {
	color: var(--dx-secondary-color);
	background-color: var(--dx-secondary-bg)
}

.gridjs-container input.gridjs-input {
	background-color: var(--dx-secondary-bg);
	border-color: var(--dx-border-color);
	padding: .594rem 1rem;
	font-size: .875rem
}

.gridjs-container input.gridjs-input:focus {
	box-shadow: none;
	border-color: var(--dx-primary)
}

.gridjs-container input.gridjs-input::placeholder {
	color: var(--dx-secondary-color)
}

:root {
	--swal2-background: var(--dx-secondary-bg);
	--swal2-color: var(--dx-body-color);
	--swal2-footer-border-color: var(--dx-border-color);
	--swal2-close-button-color: var(--dx-secondary-color)
}

div:where(.swal2-icon).swal2-success {
	border-color: var(--dx-success-border-subtle);
	color: var(--dx-success)
}

div:where(.swal2-icon).swal2-success .swal2-success-ring {
	border-color: var(--dx-success-border-subtle)
}

div:where(.swal2-icon).swal2-success [class^=swal2-success-line] {
	background-color: var(--dx-success)
}

div:where(.swal2-icon).swal2-error {
	color: var(--dx-danger);
	border-color: var(--dx-danger-border-subtle)
}

div:where(.swal2-icon).swal2-error [class^=swal2-x-mark-line] {
	background-color: var(--dx-danger)
}

div:where(.swal2-icon).swal2-warning {
	color: var(--dx-warning);
	border-color: var(--dx-warning-border-subtle)
}

div:where(.swal2-icon).swal2-info {
	color: var(--dx-info);
	border-color: var(--dx-info-border-subtle)
}

div:where(.swal2-icon).swal2-question {
	color: var(--dx-secondary);
	border-color: var(--dx-secondary-border-subtle)
}

div:where(.swal2-container) input:where(.swal2-input),
div:where(.swal2-container) input:where(.swal2-file),
div:where(.swal2-container) textarea:where(.swal2-textarea) {
	border-color: var(--dx-border-color);
	box-shadow: none;
	border-radius: var(--dx-border-radius);
	background: var(--dx-secondary-bg);
	font-size: .875rem;
	color: var(--dx-body-color)
}

div:where(.swal2-container) input:where(.swal2-input):focus,
div:where(.swal2-container) input:where(.swal2-file):focus,
div:where(.swal2-container) textarea:where(.swal2-textarea):focus {
	border-color: var(--dx-primary);
	box-shadow: none
}

div:where(.swal2-container) h2:where(.swal2-title) {
	font-size: 1.586025rem;
	margin-bottom: .5rem
}

div:where(.swal2-container).swal2-backdrop-show,
div:where(.swal2-container).swal2-noanimation {
	background-color: #2529281a;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px)
}

div:where(.swal2-container) div:where(.swal2-validation-message) {
	background-color: var(--dx-tertiary-bg);
	color: var(--dx-secondary-color)
}

div:where(.swal2-container) div:where(.swal2-validation-message):before {
	background-color: var(--dx-danger)
}

.noUi-connect {
	background-color: var(--dx-primary)
}

.noUi-horizontal {
	height: 12px;
	background: none;
	box-shadow: none;
	border-color: var(--dx-border-color)
}

.noUi-horizontal .noUi-handle {
	right: -.25rem;
	height: 1.5rem;
	width: .5rem;
	top: -8px
}

.noUi-handle {
	box-shadow: none
}

.noUi-handle:after {
	display: none
}

.noUi-handle:before {
	display: none
}

.noUi-marker {
	background-color: var(--dx-tertiary-bg)
}

.noUi-value-sub {
	color: var(--dx-text-muted)
}

.noUi-handle {
	border: 1px solid var(--dx-border-color);
	background: var(--dx-secondary-bg)
}

.noUi-pips {
	color: var(--dx-secondary-color)
}

.noUi-tooltip {
	border: 1px solid var(--dx-border-color);
	background: var(--dx-secondary-bg);
	color: var(--dx-emphasis-color)
}

.c-1-color {
	background: var(--dx-danger)
}

.c-2-color {
	background: var(--dx-warning)
}

.c-3-color {
	background: var(--dx-success)
}

.c-4-color {
	background: var(--dx-primary)
}

#slider-toggle {
	height: 50px
}

#slider-toggle.off .noUi-handle {
	background-color: var(--dx-danger);
	border-radius: .3125rem
}

.noUi-target {
	background: var(--dx-secondary-bg);
	border: 1px solid var(--dx-border-color);
	box-shadow: none
}

#red,
#green,
#blue {
	margin: 1.25rem;
	display: inline-block;
	height: 200px
}

#colorpicker {
	height: 240px;
	width: 310px;
	margin: 0 auto;
	padding: 10px;
	border: 1px solid #BFBFBF
}

#result {
	margin: 2.5rem;
	height: 128px;
	width: 128px;
	display: inline-block;
	vertical-align: top;
	color: #7f7f7f;
	background: #7f7f7f;
	border-radius: .375rem
}

#red .noUi-connect {
	background: var(--dx-danger)
}

#green .noUi-connect {
	background: var(--dx-success)
}

#blue .noUi-connect {
	background: var(--dx-info)
}

.tabulator {
	background-color: var(--dx-secondary-bg);
	font-size: .9063rem
}

.tabulator .tabulator-header {
	border-bottom: 1px solid var(--dx-border-color);
	border-top-color: var(--dx-border-color);
	color: var(--dx-body-color);
	font-weight: 600
}

.tabulator .tabulator-header .tabulator-col {
	background-color: var(--dx-secondary-bg);
	border-color: var(--dx-border-color)
}

.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter {
	color: var(--dx-secondary-color)
}

.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descending] .tabulator-col-content .tabulator-col-sorter {
	color: var(--dx-body-color)
}

.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter .tabulator-arrow,
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow {
	border-bottom-color: var(--dx-border-color)
}

.tabulator .tabulator-header .tabulator-col .tabulator-col-content {
	padding: 14px
}

@media (hover: hover) and (pointer: fine) {
	.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover {
		background-color: var(--dx-tertiary-bg)
	}
}

.tabulator .tabulator-row {
	background-color: var(--dx-secondary-bg);
	border-color: var(--dx-border-color)
}

.tabulator .tabulator-row .tabulator-cell {
	border-color: var(--dx-border-color)
}

.tabulator .tabulator-row.tabulator-row-even {
	background-color: var(--dx-tertiary-bg)
}

@media (hover: hover) and (pointer: fine) {
	.tabulator .tabulator-row.tabulator-selectable:hover {
		background-color: var(--dx-tertiary-bg);
		cursor: pointer
	}
}

.tabulator .tabulator-tableholder .tabulator-table {
	color: var(--dx-body-color)
}

.tabulator .tabulator-row .tabulator-cell .tabulator-data-tree-control {
	background-color: transparent;
	border-color: var(--dx-border-color)
}

.tabulator .tabulator-footer {
	padding-top: 12px;
	background-color: transparent;
	border: none;
	color: var(--dx-body-color)
}

@media (max-width: 991.98px) {
	.tabulator .tabulator-footer .tabulator-footer-contents {
		flex-direction: column;
		gap: 15px
	}
}

.tabulator .tabulator-footer .tabulator-paginator {
	color: var(--dx-body-color);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	flex-wrap: wrap
}

@media (min-width: 992px) {
	.tabulator .tabulator-footer .tabulator-paginator {
		justify-content: end
	}
}

.tabulator .tabulator-footer .tabulator-page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	height: 2.25rem;
	border-radius: var(--dx-border-radius);
	padding-top: 0;
	padding-bottom: 0;
	background-color: var(--dx-secondary-bg);
	border-color: var(--dx-border-color)
}

.tabulator .tabulator-footer .tabulator-page:disabled {
	color: var(--dx-tertiary-color);
	border-color: var(--dx-border-color);
	background-color: var(--dx-secondary-bg)
}

.tabulator .tabulator-footer .tabulator-page.active {
	background-color: var(--dx-primary);
	border-color: var(--dx-primary)
}

.tabulator .tabulator-footer .tabulator-page[data-page=last] {
	border-color: var(--dx-border-color)
}

@media (hover: hover) and (pointer: fine) {

	.tabulator .tabulator-footer .tabulator-page:not(.disabled):hover,
	.tabulator .tabulator-footer .tabulator-page:not(.active):hover {
		background: var(--dx-tertiary-bg);
		border-color: var(--dx-border-color);
		color: var(--dx-primary)
	}
}

.tabulator .tabulator-footer .tabulator-pages {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .5rem
}

.tabulator .tabulator-footer .tabulator-pages .tabulator-page {
	width: 2.25rem;
	padding: 0
}

.tabulator .tabulator-footer .tabulator-page-size {
	border-color: var(--dx-border-color);
	background-color: var(--dx-secondary-bg)
}

.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse:after,
.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand,
.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand:after {
	background-color: var(--dx-border-color)
}

.tabulator-cell svg {
	width: 16px;
	height: 16px
}

.tippy-box {
	background-color: var(--dx-body-color);
	font-size: .7930125rem;
	color: var(--dx-secondary-bg)
}

.tippy-arrow {
	color: var(--dx-body-color)
}

.vis-timeline,
.vis-panel.vis-bottom,
.vis-panel.vis-center,
.vis-panel.vis-left,
.vis-panel.vis-right,
.vis-panel.vis-top {
	border-color: var(--dx-border-color)
}

:is(.vis-labelset .vis-label, .vis-foreground .vis-group) {
	border-color: var(--dx-border-color)
}

.vis-item {
	color: var(--dx-body-color);
	background-color: var(--dx-primary-bg-subtle);
	border-color: rgba(var(--dx-primary-rgb), .4)
}

:is(.vis-time-axis .vis-text, .vis-labelset .vis-label) {
	color: var(--dx-secondary-color)
}

#visualization2 div.vis-readonly,
#visualization2 div.vis-readonly.vis-selected {
	background-color: var(--dx-danger-bg-subtle);
	border-color: rgba(var(--dx-danger-rgb), .4)
}

.vis-item.vis-selected {
	background-color: var(--dx-warning-bg-subtle)
}

.vis-time-axis .vis-grid.vis-minor {
	border-color: var(--dx-border-color)
}

.dt-container .dt-layout-table {
	margin-top: 20px !important
}

.dt-container .row {
	gap: 10px
}

.dt-container .pagination {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem
}

.dt-container .pagination .page-item:not(:first-child) .page-link {
	display: flex;
	width: 2.25rem;
	height: 2.25rem;
	align-items: center;
	justify-content: center;
	border-radius: .375rem;
	border-width: 1px
}

.dt-container .table-light {
	background-color: var(--dx-tertiary-bg)
}

.dt-container td.dt-type-numeric,
.dt-container table.dataTable td.dt-type-date,
.dt-container table.dataTable th.dt-type-numeric,
.dt-container table.dataTable th.dt-type-date,
.dt-container table.dataTable td.dt-empty {
	text-align: left !important
}

.dt-container table.dataTable thead:hover>tr>th.dt-orderable-asc:hover,
.dt-container table.dataTable thead>tr>th.dt-orderable-desc:hover {
	outline: none
}

.dt-container .table-striped-even>tbody>tr:nth-child(2n)>td {
	background-color: var(--dx-tertiary-bg)
}

.dt-container .table.hovered tr:hover {
	background-color: var(--dx-tertiary-bg)
}

.profile-widget {
	background-image: url(../images/user-profile.jpg);
	background-repeat: no-repeat;
	object-fit: cover;
	background-size: cover
}

.profile-avatar .profile-avatar-wrapper {
	position: relative;
	padding: 6px;
	border-radius: 2rem;
	background: rgba(var(--dx-secondary-bg-rgb), .2);
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px)
}

.profile-avatar .profile-avatar-img {
	border-radius: 2rem
}

.profile-avatar .profile-avatar-dot {
	border-radius: 50rem;
	border: 2px solid var(--dx-secondary-bg);
	position: absolute;
	right: .625rem;
	bottom: .625rem
}

.payment-gradient {
	background: linear-gradient(to bottom, rgba(var(--dx-info-rgb), .1), rgba(var(--dx-danger-rgb), .05), rgba(var(--dx-secondary-bg-rgb), 0));
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px)
}

.payment-gradient img {
	height: 2.5rem
}

.form-control.pattern-input {
	border: none
}

.form-control.pattern-input:focus {
	border: 1px solid var(--dx-primary);
	box-shadow: var(--dx-box-shadow);
	background-color: var(--dx-secondary-bg) !important
}

.img-scale-skew {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.img-scale-skew {
		transition: none
	}
}

.img-scale-skew:hover {
	transform: scale(1.05) skew(3deg)
}

.rounded-modern {
	border-radius: 50% 20% 70% 30%/30% 30% 50% 70%
}

.bg-gradient-b-primary {
	background-image: linear-gradient(to top, rgba(var(--dx-primary-rgb), .1), rgba(var(--dx-primary-rgb), 0))
}

.bg-gradient-b-secondary {
	background-image: linear-gradient(to top, rgba(var(--dx-secondary-rgb), .1), rgba(var(--dx-secondary-rgb), 0))
}

.bg-gradient-b-success {
	background-image: linear-gradient(to top, rgba(var(--dx-success-rgb), .1), rgba(var(--dx-success-rgb), 0))
}

.bg-gradient-b-info {
	background-image: linear-gradient(to top, rgba(var(--dx-info-rgb), .1), rgba(var(--dx-info-rgb), 0))
}

.bg-gradient-b-warning {
	background-image: linear-gradient(to top, rgba(var(--dx-warning-rgb), .1), rgba(var(--dx-warning-rgb), 0))
}

.bg-gradient-b-danger {
	background-image: linear-gradient(to top, rgba(var(--dx-danger-rgb), .1), rgba(var(--dx-danger-rgb), 0))
}

.bg-gradient-b-light {
	background-image: linear-gradient(to top, rgba(var(--dx-light-rgb), .1), rgba(var(--dx-light-rgb), 0))
}

.bg-gradient-b-dark {
	background-image: linear-gradient(to top, rgba(var(--dx-dark-rgb), .1), rgba(var(--dx-dark-rgb), 0))
}

.bg-gradient-b-pink {
	background-image: linear-gradient(to top, rgba(var(--dx-pink-rgb), .1), rgba(var(--dx-pink-rgb), 0))
}

.bg-gradient-b-orange {
	background-image: linear-gradient(to top, rgba(var(--dx-orange-rgb), .1), rgba(var(--dx-orange-rgb), 0))
}

.bg-gradient-b-indigo {
	background-image: linear-gradient(to top, rgba(var(--dx-indigo-rgb), .1), rgba(var(--dx-indigo-rgb), 0))
}

.line-clamp-5 {
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 5;
	-webkit-box-orient: vertical
}

.blur-2xl {
	filter: blur(40px)
}

.arrow-gradient {
	background: linear-gradient(to bottom, rgba(var(--dx-warning-rgb), .2), rgba(var(--dx-warning-rgb), 0))
}

.droplet-gradient {
	background: linear-gradient(to right, rgba(var(--dx-secondary-rgb), .2), rgba(var(--dx-secondary-rgb), 0))
}

.gem-gradient {
	background: linear-gradient(to left, rgba(var(--dx-danger-rgb), .2), rgba(var(--dx-danger-rgb), 0))
}

.pricing-tag {
	position: absolute;
	right: 1.25rem;
	top: 1.25rem
}

.pricing-card .avatar {
	transition: all .4s ease-in-out;
	transform: scaleX(1)
}

.pricing-card:hover .avatar {
	transform: scaleX(-1)
}

.border-gradient-top {
	position: relative;
	border: none !important
}

.border-gradient-top:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 2px;
	width: 100%;
	background: linear-gradient(90deg, transparent, var(--dx-primary), transparent);
	border-top-left-radius: inherit;
	border-top-right-radius: inherit
}

.pricing-widget {
	overflow: hidden;
	position: relative
}

.pricing-widget .shap-1 {
	position: absolute;
	top: -245px;
	left: -120px
}

.pricing-widget .shap-2 {
	position: absolute;
	top: -268px;
	right: -195px
}

.auth-wrapper {
	background: linear-gradient(to left, rgba(var(--dx-pink-rgb), .05), rgba(var(--dx-primary-rgb), .02), rgba(var(--dx-indigo-rgb), .05))
}

.contactUs-three .check-primary .form-check-input:checked+.form-check-label {
	background-color: var(--dx-primary-bg-subtle);
	border-color: rgba(var(--dx-primary-rgb), .5)
}

.contactUs-three .check-secondary .form-check-input:checked+.form-check-label {
	background-color: var(--dx-secondary-bg-subtle);
	border-color: rgba(var(--dx-secondary-rgb), .5)
}

.contactUs-three .check-success .form-check-input:checked+.form-check-label {
	background-color: var(--dx-success-bg-subtle);
	border-color: rgba(var(--dx-success-rgb), .5)
}

.contactUs-three .check-info .form-check-input:checked+.form-check-label {
	background-color: var(--dx-info-bg-subtle);
	border-color: rgba(var(--dx-info-rgb), .5)
}

.contactUs-three .check-warning .form-check-input:checked+.form-check-label {
	background-color: var(--dx-warning-bg-subtle);
	border-color: rgba(var(--dx-warning-rgb), .5)
}

.contactUs-three .check-danger .form-check-input:checked+.form-check-label {
	background-color: var(--dx-danger-bg-subtle);
	border-color: rgba(var(--dx-danger-rgb), .5)
}

.contactUs-three .check-light .form-check-input:checked+.form-check-label {
	background-color: var(--dx-light-bg-subtle);
	border-color: rgba(var(--dx-light-rgb), .5)
}

.contactUs-three .check-dark .form-check-input:checked+.form-check-label {
	background-color: var(--dx-dark-bg-subtle);
	border-color: rgba(var(--dx-dark-rgb), .5)
}

.contactUs-three .check-pink .form-check-input:checked+.form-check-label {
	background-color: var(--dx-pink-bg-subtle);
	border-color: rgba(var(--dx-pink-rgb), .5)
}

.contactUs-three .check-orange .form-check-input:checked+.form-check-label {
	background-color: var(--dx-orange-bg-subtle);
	border-color: rgba(var(--dx-orange-rgb), .5)
}

.contactUs-three .check-indigo .form-check-input:checked+.form-check-label {
	background-color: var(--dx-indigo-bg-subtle);
	border-color: rgba(var(--dx-indigo-rgb), .5)
}

.contactUs-three .form-check-label {
	background-color: var(--dx-secondary-bg);
	border: 1px solid var(--dx-border-color)
}

.bg-gradient-t-primary {
	background-image: linear-gradient(to bottom, rgba(var(--dx-primary-rgb), .1), rgba(var(--dx-primary-rgb), 0))
}

.bg-gradient-t-secondary {
	background-image: linear-gradient(to bottom, rgba(var(--dx-secondary-rgb), .1), rgba(var(--dx-secondary-rgb), 0))
}

.bg-gradient-t-success {
	background-image: linear-gradient(to bottom, rgba(var(--dx-success-rgb), .1), rgba(var(--dx-success-rgb), 0))
}

.bg-gradient-t-info {
	background-image: linear-gradient(to bottom, rgba(var(--dx-info-rgb), .1), rgba(var(--dx-info-rgb), 0))
}

.bg-gradient-t-warning {
	background-image: linear-gradient(to bottom, rgba(var(--dx-warning-rgb), .1), rgba(var(--dx-warning-rgb), 0))
}

.bg-gradient-t-danger {
	background-image: linear-gradient(to bottom, rgba(var(--dx-danger-rgb), .1), rgba(var(--dx-danger-rgb), 0))
}

.bg-gradient-t-light {
	background-image: linear-gradient(to bottom, rgba(var(--dx-light-rgb), .1), rgba(var(--dx-light-rgb), 0))
}

.bg-gradient-t-dark {
	background-image: linear-gradient(to bottom, rgba(var(--dx-dark-rgb), .1), rgba(var(--dx-dark-rgb), 0))
}

.bg-gradient-t-pink {
	background-image: linear-gradient(to bottom, rgba(var(--dx-pink-rgb), .1), rgba(var(--dx-pink-rgb), 0))
}

.bg-gradient-t-orange {
	background-image: linear-gradient(to bottom, rgba(var(--dx-orange-rgb), .1), rgba(var(--dx-orange-rgb), 0))
}

.bg-gradient-t-indigo {
	background-image: linear-gradient(to bottom, rgba(var(--dx-indigo-rgb), .1), rgba(var(--dx-indigo-rgb), 0))
}

.text-gradient {
	background: linear-gradient(90deg, var(--dx-secondary), var(--dx-primary));
	-webkit-background-clip: text;
	filter: drop-shadow(0 10px 8px rgba(0, 0, 0, .04)) drop-shadow(0 4px 3px rgba(0, 0, 0, .1));
	color: transparent
}

.coming-soon-input {
	max-width: 36rem;
	margin: 0 auto;
	position: relative
}

.coming-soon-input .form-control {
	padding-right: 126px;
	height: 48px
}

.coming-soon-input button {
	position: absolute;
	top: 50%;
	right: .1875rem;
	transform: translateY(-50%)
}

.help-center-tabs {
	height: calc(100vh - 30rem);
	overflow-y: auto
}

.help-center-tabs .nav .nav-item .nav-link {
	padding: 8px 16px;
	font-weight: 400;
	display: block
}

.help-center-tabs .nav .nav-item .nav-link.active {
	color: var(--dx-primary);
	background-color: rgba(var(--dx-primary-rgb), .1);
	outline-offset: 2px;
	outline: 1px solid rgba(var(--dx-primary-rgb), .15)
}

.ticket-content-wrapper {
	height: calc(100vh - 17rem)
}

.help-center-widget {
	position: relative;
	padding: .75rem 1rem;
	border-radius: .375rem
}

.help-center-widget button .bg-wrapper {
	background-image: radial-gradient(75% 100% at 50% 0%, #38bdf899, #38bdf800 75%);
	opacity: 0;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.help-center-widget button .bg-wrapper {
		transition: none
	}
}

.help-center-widget button .bg-wrapper:hover {
	opacity: 100
}

.ticket-list-wrapper {
	height: calc(100vh - 16.8rem)
}

.ticket-list-wrapper .line-clamp-2 {
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical
}

.card-slide {
	position: relative;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.card-slide {
		transition: none
	}
}

.card-slide:before {
	content: "";
	position: absolute;
	top: initial;
	bottom: 0;
	left: 0;
	width: 100%;
	height: .125rem;
	transition: height .5s ease-in-out
}

.card-slide a {
	color: var(--dx-secondary-color);
	border: 1px solid var(--dx-light-bg-subtle);
	transition: color .6s ease-in-out, border-color .6s ease-in-out
}

.card-slide:hover {
	color: #fff
}

.card-slide:hover:before {
	height: 100%;
	top: 0;
	bottom: initial
}

.card-slide:hover a {
	color: #fff;
	border-color: #ffffff42
}

[class*=icon-outline] {
	outline: 1px;
	outline-style: dashed;
	border: 2px solid var(--dx-light-border-subtle)
}

.card-slide-primary .badge {
	background-color: var(--dx-primary)
}

.card-slide-primary.card-slide:before {
	background-color: var(--dx-primary)
}

.card-slide-primary.card-slide .badge {
	background-color: var(--dx-primary-text-emphasis)
}

.icon-outline-primary {
	background-color: var(--dx-primary);
	outline-color: var(--dx-primary)
}

.card-slide-secondary .badge {
	background-color: var(--dx-secondary)
}

.card-slide-secondary.card-slide:before {
	background-color: var(--dx-secondary)
}

.card-slide-secondary.card-slide .badge {
	background-color: var(--dx-secondary-text-emphasis)
}

.icon-outline-secondary {
	background-color: var(--dx-secondary);
	outline-color: var(--dx-secondary)
}

.card-slide-success .badge {
	background-color: var(--dx-success)
}

.card-slide-success.card-slide:before {
	background-color: var(--dx-success)
}

.card-slide-success.card-slide .badge {
	background-color: var(--dx-success-text-emphasis)
}

.icon-outline-success {
	background-color: var(--dx-success);
	outline-color: var(--dx-success)
}

.card-slide-info .badge {
	background-color: var(--dx-info)
}

.card-slide-info.card-slide:before {
	background-color: var(--dx-info)
}

.card-slide-info.card-slide .badge {
	background-color: var(--dx-info-text-emphasis)
}

.icon-outline-info {
	background-color: var(--dx-info);
	outline-color: var(--dx-info)
}

.card-slide-warning .badge {
	background-color: var(--dx-warning)
}

.card-slide-warning.card-slide:before {
	background-color: var(--dx-warning)
}

.card-slide-warning.card-slide .badge {
	background-color: var(--dx-warning-text-emphasis)
}

.icon-outline-warning {
	background-color: var(--dx-warning);
	outline-color: var(--dx-warning)
}

.card-slide-danger .badge {
	background-color: var(--dx-danger)
}

.card-slide-danger.card-slide:before {
	background-color: var(--dx-danger)
}

.card-slide-danger.card-slide .badge {
	background-color: var(--dx-danger-text-emphasis)
}

.icon-outline-danger {
	background-color: var(--dx-danger);
	outline-color: var(--dx-danger)
}

.card-slide-light .badge {
	background-color: var(--dx-light)
}

.card-slide-light.card-slide:before {
	background-color: var(--dx-light)
}

.card-slide-light.card-slide .badge {
	background-color: var(--dx-light-text-emphasis)
}

.icon-outline-light {
	background-color: var(--dx-light);
	outline-color: var(--dx-light)
}

.card-slide-dark .badge {
	background-color: var(--dx-dark)
}

.card-slide-dark.card-slide:before {
	background-color: var(--dx-dark)
}

.card-slide-dark.card-slide .badge {
	background-color: var(--dx-dark-text-emphasis)
}

.icon-outline-dark {
	background-color: var(--dx-dark);
	outline-color: var(--dx-dark)
}

.card-slide-pink .badge {
	background-color: var(--dx-pink)
}

.card-slide-pink.card-slide:before {
	background-color: var(--dx-pink)
}

.card-slide-pink.card-slide .badge {
	background-color: var(--dx-pink-text-emphasis)
}

.icon-outline-pink {
	background-color: var(--dx-pink);
	outline-color: var(--dx-pink)
}

.card-slide-orange .badge {
	background-color: var(--dx-orange)
}

.card-slide-orange.card-slide:before {
	background-color: var(--dx-orange)
}

.card-slide-orange.card-slide .badge {
	background-color: var(--dx-orange-text-emphasis)
}

.icon-outline-orange {
	background-color: var(--dx-orange);
	outline-color: var(--dx-orange)
}

.card-slide-indigo .badge {
	background-color: var(--dx-indigo)
}

.card-slide-indigo.card-slide:before {
	background-color: var(--dx-indigo)
}

.card-slide-indigo.card-slide .badge {
	background-color: var(--dx-indigo-text-emphasis)
}

.icon-outline-indigo {
	background-color: var(--dx-indigo);
	outline-color: var(--dx-indigo)
}

.schedule-tabs {
	display: flex;
	gap: .75rem
}

.schedule-tabs a {
	position: relative;
	color: var(--dx-secondary-color);
	transition: all .4s ease-in-out;
	display: inline-block;
	font-size: .875rem
}

@media (prefers-reduced-motion: reduce) {
	.schedule-tabs a {
		transition: none
	}
}

.schedule-tabs a:after {
	content: "";
	position: absolute;
	right: 0;
	left: 0;
	bottom: -.75rem;
	width: .25rem;
	height: .25rem;
	transition: all .4s ease-in-out;
	border-radius: 50rem;
	background-color: var(--dx-primary);
	margin: 0 auto;
	opacity: 0
}

@media (prefers-reduced-motion: reduce) {
	.schedule-tabs a:after {
		transition: none
	}
}

.schedule-tabs a:hover,
.schedule-tabs a.active {
	color: var(--dx-primary)
}

.schedule-tabs a:hover:after,
.schedule-tabs a.active:after {
	bottom: -.375rem;
	opacity: 1
}

[class*=widget-banner] .banner-circle {
	border: 20px solid transparent;
	width: 14rem;
	height: 14rem;
	position: absolute;
	right: -3rem;
	bottom: -3rem;
	border-radius: 50%
}

[class*=widget-banner] img {
	margin-bottom: -1.5rem
}

@media (min-width: 768px) {
	[class*=widget-banner] img {
		margin-bottom: 0;
		position: absolute;
		right: .75rem;
		bottom: -1.5rem
	}
}

.widget-banner-primary {
	--dx-card-bg: var(--dx-primary-bg-subtle);
	--dx-card-border-color: var(--dx-primary-border-subtle)
}

.widget-banner-primary .banner-circle {
	border-color: rgba(var(--dx-primary-rgb), .1)
}

.widget-banner-secondary {
	--dx-card-bg: var(--dx-secondary-bg-subtle);
	--dx-card-border-color: var(--dx-secondary-border-subtle)
}

.widget-banner-secondary .banner-circle {
	border-color: rgba(var(--dx-secondary-rgb), .1)
}

.widget-banner-success {
	--dx-card-bg: var(--dx-success-bg-subtle);
	--dx-card-border-color: var(--dx-success-border-subtle)
}

.widget-banner-success .banner-circle {
	border-color: rgba(var(--dx-success-rgb), .1)
}

.widget-banner-info {
	--dx-card-bg: var(--dx-info-bg-subtle);
	--dx-card-border-color: var(--dx-info-border-subtle)
}

.widget-banner-info .banner-circle {
	border-color: rgba(var(--dx-info-rgb), .1)
}

.widget-banner-warning {
	--dx-card-bg: var(--dx-warning-bg-subtle);
	--dx-card-border-color: var(--dx-warning-border-subtle)
}

.widget-banner-warning .banner-circle {
	border-color: rgba(var(--dx-warning-rgb), .1)
}

.widget-banner-danger {
	--dx-card-bg: var(--dx-danger-bg-subtle);
	--dx-card-border-color: var(--dx-danger-border-subtle)
}

.widget-banner-danger .banner-circle {
	border-color: rgba(var(--dx-danger-rgb), .1)
}

.widget-banner-light {
	--dx-card-bg: var(--dx-light-bg-subtle);
	--dx-card-border-color: var(--dx-light-border-subtle)
}

.widget-banner-light .banner-circle {
	border-color: rgba(var(--dx-light-rgb), .1)
}

.widget-banner-dark {
	--dx-card-bg: var(--dx-dark-bg-subtle);
	--dx-card-border-color: var(--dx-dark-border-subtle)
}

.widget-banner-dark .banner-circle {
	border-color: rgba(var(--dx-dark-rgb), .1)
}

.widget-banner-pink {
	--dx-card-bg: var(--dx-pink-bg-subtle);
	--dx-card-border-color: var(--dx-pink-border-subtle)
}

.widget-banner-pink .banner-circle {
	border-color: rgba(var(--dx-pink-rgb), .1)
}

.widget-banner-orange {
	--dx-card-bg: var(--dx-orange-bg-subtle);
	--dx-card-border-color: var(--dx-orange-border-subtle)
}

.widget-banner-orange .banner-circle {
	border-color: rgba(var(--dx-orange-rgb), .1)
}

.widget-banner-indigo {
	--dx-card-bg: var(--dx-indigo-bg-subtle);
	--dx-card-border-color: var(--dx-indigo-border-subtle)
}

.widget-banner-indigo .banner-circle {
	border-color: rgba(var(--dx-indigo-rgb), .1)
}

.widget-svg svg path {
	stroke: #e1e4eb26
}

[class*=chart-icon-ring] {
	outline: 1px solid var(--dx-border-color);
	outline-offset: 2px;
	border: 2px solid var(--dx-border-color)
}

.chart-icon-ring-primary {
	outline-color: rgba(var(--dx-primary-rgb), .2);
	border-color: var(--dx-primary)
}

.chart-icon-ring-secondary {
	outline-color: rgba(var(--dx-secondary-rgb), .2);
	border-color: var(--dx-secondary)
}

.chart-icon-ring-success {
	outline-color: rgba(var(--dx-success-rgb), .2);
	border-color: var(--dx-success)
}

.chart-icon-ring-info {
	outline-color: rgba(var(--dx-info-rgb), .2);
	border-color: var(--dx-info)
}

.chart-icon-ring-warning {
	outline-color: rgba(var(--dx-warning-rgb), .2);
	border-color: var(--dx-warning)
}

.chart-icon-ring-danger {
	outline-color: rgba(var(--dx-danger-rgb), .2);
	border-color: var(--dx-danger)
}

.chart-icon-ring-light {
	outline-color: rgba(var(--dx-light-rgb), .2);
	border-color: var(--dx-light)
}

.chart-icon-ring-dark {
	outline-color: rgba(var(--dx-dark-rgb), .2);
	border-color: var(--dx-dark)
}

.chart-icon-ring-pink {
	outline-color: rgba(var(--dx-pink-rgb), .2);
	border-color: var(--dx-pink)
}

.chart-icon-ring-orange {
	outline-color: rgba(var(--dx-orange-rgb), .2);
	border-color: var(--dx-orange)
}

.chart-icon-ring-indigo {
	outline-color: rgba(var(--dx-indigo-rgb), .2);
	border-color: var(--dx-indigo)
}

.auth-modern {
	background: url(../images/auth.jpg);
	background-position: center;
	background-size: cover
}

.auth-modern .card {
	background-color: #ffffff1a;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	box-shadow: none;
	border: none;
	color: var(--dx-gray-300)
}

.auth-modern .card a {
	color: #ffffffbf
}

.auth-modern .card .form-control.pattern-input,
.auth-modern .card .form-control.pattern-input:focus,
.auth-modern .card .form-control {
	background-color: #ffffff1a !important;
	border: none;
	color: var(--dx-white);
	box-shadow: none
}

.auth-modern .card .form-control.pattern-input::placeholder,
.auth-modern .card .form-control.pattern-input:focus::placeholder,
.auth-modern .card .form-control::placeholder {
	color: var(--dx-gray-300)
}

.auth-modern .card .form-check-input {
	border-color: #ffffff1a !important
}

.auth-modern .card .btn-light {
	background-color: #ffffff0e
}

.auth-modern .card .social-link:hover {
	background-color: #ffffff1a;
	color: #fff
}

.auth-creative-img {
	max-width: 100%;
	height: auto
}

.auth-title {
	font-size: 24px
}

@media (min-width: 576px) {
	.auth-title {
		font-size: 2.25rem
	}
}

@media (min-width: 1200px) {
	.auth-title {
		font-size: 2.25rem
	}
}

.custom-pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
	width: auto
}

.custom-pagination.swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet {
	height: .4063rem;
	width: .4063rem;
	border-radius: 50rem;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.custom-pagination.swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet {
		transition: none
	}
}

.custom-pagination.swiper-pagination-bullets.swiper-pagination-horizontal .swiper-pagination-bullet.swiper-pagination-bullet-active {
	border: none;
	width: 1.2rem
}

@media (min-width: 1200px) {
	.auth-creative-effect {
		background: linear-gradient(270deg, rgba(var(--dx-body-color-rgb), .06), transparent);
		rotate: 240deg;
		position: absolute;
		top: 10rem;
		right: 13rem;
		bottom: 0
	}
}

@media (min-width: 1536px) {
	.auth-creative-effect {
		right: 22rem;
		top: 7rem
	}
}

.btn-outline-light.auth-social-icon:hover {
	background-color: var(--dx-tertiary-bg)
}

@media (min-width: 1200px) {
	.auth-creative-img {
		transform: scale(.7);
		position: absolute;
		top: 30px;
		left: -209px;
		max-width: none
	}
}

@media (min-width: 576px) {
	.otp-box {
		height: 56px;
		width: 56px
	}
}

.mailbox-wrapper {
	display: flex;
	flex-direction: row
}

.mailbox-wrapper .mailbox-left {
	width: 20rem;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0
}

.mailbox-wrapper .mailbox-left .inbox-message .inbox-message-list {
	display: flex;
	padding-left: 0;
	flex-direction: column;
	gap: .75rem;
	list-style-type: none
}

.mailbox-wrapper .mailbox-left .inbox-message .inbox-message-list a {
	color: var(--dx-secondary-color);
	display: flex;
	align-items: center;
	gap: .5rem;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.mailbox-wrapper .mailbox-left .inbox-message .inbox-message-list a {
		transition: none
	}
}

.mailbox-wrapper .mailbox-left .inbox-message .inbox-message-list a:is(:hover, .active) {
	color: var(--dx-primary)
}

@media (max-width: 1535.98px) {
	.mailbox-wrapper .mailbox-left {
		position: fixed;
		inset-block: 0;
		right: 0;
		z-index: 1045;
		margin-bottom: 0;
		border-radius: 0;
		display: none;
		overflow-y: auto
	}
}

.mailbox-wrapper .mailbox-list {
	border-inline-start: none;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0
}

.mailbox-wrapper .mailbox-list .mailbox-user-list .mailbox-user-item {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.mailbox-wrapper .mailbox-list .mailbox-user-list .mailbox-user-item {
		transition: none
	}
}

.mailbox-wrapper .mailbox-list .mailbox-user-list .mailbox-user-item .avatar {
	position: relative;
	border-radius: 50rem
}

.mailbox-wrapper .mailbox-list .mailbox-user-list .mailbox-user-item .avatar .mailbox-user-noti {
	position: absolute;
	right: -.3125rem;
	bottom: -.25rem;
	border-radius: 50rem;
	font-size: 11px;
	border: 2px solid var(--dx-secondary-bg)
}

.mailbox-wrapper .mailbox-list .mailbox-user-list .mailbox-user-item:hover {
	background-color: rgba(var(--dx-tertiary-bg-rgb), .5)
}

.mailbox-wrapper .mailbox-list .mailbox-list-wrapper {
	height: 550px
}

.mailbox-wrapper .mailbox-list .mailbox-list-item:not(:last-child) {
	border-bottom: 1px solid var(--dx-border-color)
}

@media (max-width: 1535.98px) {
	.mailbox-wrapper .mailbox-list {
		border-radius: .375rem;
		border-inline-start: 1px solid var(--dx-border-color)
	}
}

.mailbox-wrapper.show .mailbox-list {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0
}

@media (min-width: 1200px) {
	.mailbox-wrapper.show .mailbox-list {
		max-width: 28rem
	}
}

.mailbox-wrapper .mail-overview {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-left: none
}

.mailbox-wrapper .mail-overview .mail-overview-wrapper {
	height: 390px
}

@media (max-width: 991.98px) {
	.mailbox-wrapper .mail-overview {
		border-radius: .375rem;
		border-left: 1px solid var(--dx-border-color)
	}
}

.news-gradient {
	background: linear-gradient(to top, var(--dx-orange-bg-subtle), rgba(var(--dx-warning-rgb), 0))
}

.fc {
	--dx-link-color-rgb: var(--dx-emphasis-color);
	--fc-small-font-size: .85em;
	--fc-page-bg-color: var(--dx-secondary-bg);
	--fc-neutral-bg-color: var(--dx-tertiary-bg);
	--fc-neutral-text-color: var(--dx-secondary-color);
	--fc-border-color: var(--dx-border-color);
	--fc-button-text-color: #fff;
	--fc-button-bg-color: var(--dx-info);
	--fc-button-border-color: var(--dx-info);
	--fc-button-hover-bg-color: var(--dx-info);
	--fc-button-hover-border-color: var(--dx-info);
	--fc-button-active-bg-color: var(--dx-info);
	--fc-button-active-border-color: var(--dx-info);
	--fc-event-bg-color: var(--dx-info);
	--fc-event-border-color: transparent;
	--fc-event-text-color: var(--dx-white);
	--fc-event-selected-overlay-color: rgba(0, 0, 0, .25);
	--fc-more-link-bg-color: #d0d0d0;
	--fc-more-link-text-color: var(--dx-emphasis-color);
	--fc-event-resizer-thickness: 8px;
	--fc-event-resizer-dot-total-width: 8px;
	--fc-event-resizer-dot-border-width: 1px;
	--fc-non-business-color: hsla(0, 0%, 84%, .3);
	--fc-bg-event-color: #8fdf82;
	--fc-bg-event-opacity: .3;
	--fc-highlight-color: rgba(188, 232, 241, .3);
	--fc-today-bg-color: rgba(var(--dx-primary-rgb), .07);
	--fc-now-indicator-color: red;
	--fc-list-event-hover-bg-color: var(--dx-tertiary-bg);
	--fc-highlight-color: rgba(var(--dx-primary-rgb), .05)
}

.fc .fc-col-header-cell-cushion {
	padding: 10px
}

.fc .fc-toolbar-title {
	font-size: 1rem
}

.fc .fc-toolbar {
	display: flex;
	flex-wrap: wrap
}

.fc .fc-multimonth-title {
	background-color: var(--fc-page-bg-color)
}

.fc .fc-header-toolbar {
	gap: .5rem
}

.fc .fc-button-primary:focus,
.fc .fc-button-primary:not(:disabled):active:focus,
.fc .fc-button-primary:not(:disabled).fc-button-active:focus {
	box-shadow: none
}

.fc-license-message {
	display: none
}

.fc-daygrid-event {
	border-radius: .375rem;
	padding: .375rem 1rem;
	font-size: .9063rem
}

.fc-daygrid-event-harness {
	position: relative
}

.fc-daygrid-event-harness:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 8px;
	width: 3px;
	height: 75%;
	border-radius: 2px;
	transform: translateY(-50%)
}

.fc-daygrid-event-harness:has(.text-primary):before {
	background-color: var(--dx-primary)
}

.fc-daygrid-event-harness:has(.text-info):before {
	background-color: var(--dx-info)
}

.fc-daygrid-event-harness:has(.text-pink):before {
	background-color: var(--dx-pink)
}

.fc-daygrid-event-harness:has(.text-indigo):before {
	background-color: var(--dx-indigo)
}

.chat-profile-card .chat-profile-height {
	max-height: calc(100vh - 15.3125rem)
}

.chat-profile-card .chat-profile-height a {
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.chat-profile-card .chat-profile-height a {
		transition: none
	}
}

.chat-profile-card .chat-profile-height a:is(:hover, :focus, .active) {
	box-shadow: 0 0 0 2px var(--dx-primary);
	outline-offset: 2px;
	opacity: 1
}

.chat-list .chat-list-item {
	color: var(--dx-body-color);
	padding: .6875rem 1rem;
	display: flex;
	align-items: center;
	gap: .5rem;
	border-radius: 8px;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {
	.chat-list .chat-list-item {
		transition: none
	}
}

.chat-list .chat-list-item:hover {
	background-color: rgba(var(--dx-light-rgb), .6)
}

.chat-list .chat-list-item.active {
	background-color: var(--dx-light-bg-subtle)
}

.chat-list .chat-list-item .unread {
	color: var(--dx-body-color) !important
}

.chat-list .unread {
	color: var(--dx-emphasis-color) !important;
	font-weight: 500
}

.chat-list .chat-list-height {
	max-height: calc(100vh - 18.75rem)
}

.status-indicator {
	position: absolute;
	bottom: 0;
	right: 0;
	border: 2px solid var(--dx-secondary-bg);
	border-radius: 50rem
}

.meassages .chat-height {
	max-height: calc(100vh - 310px)
}

.meassages .chat-toolbar {
	background-color: rgba(var(--dx-secondary-bg-rgb), .3);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	z-index: 50
}

.member-list {
	max-height: 295px
}

.member-list .member-list-item {
	color: var(--dx-body-color);
	display: flex;
	align-items: center;
	gap: .5rem
}

.property-card .propery-wrapper img {
	transition: all .4s ease-in-out;
	height: 185px
}

.property-card .propery-wrapper .img-2 {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	visibility: hidden
}

.property-card .social-btn {
	transition: all .4s ease-in-out;
	right: -50px
}

.property-card:hover .propery-wrapper .img-2 {
	opacity: 1;
	visibility: visible
}

.property-card:hover .propery-wrapper .img-1 {
	opacity: 0;
	visibility: hidden
}

.property-card:hover .social-btn {
	right: 0
}

.backdrop-blur-md {
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px)
}

.nav-pills.property-type .nav-link {
	padding-inline: 35px
}

.nav-pills.property-type .nav-link:not(.active) {
	background-color: var(--dx-secondary-bg)
}

.invoice-card {
	transition: all .4s ease-in-out;
	cursor: pointer
}

.invoice-card .view-btn {
	opacity: 0;
	visibility: hidden
}

.invoice-card:hover {
	transform: translateY(-3px)
}

.invoice-card:hover .view-btn {
	opacity: 1;
	visibility: visible
}

.tracking-map {
	height: 380px
}

@media (min-width: 768px) {
	.tracking-map {
		height: 510px
	}
}

@media (min-width: 1536px) {
	.tracking-map {
		height: 610px
	}
}

@media (min-width: 1200px) {
	.tracking-cards {
		max-height: 710px
	}
}

.schedule-date-line {
	position: absolute;
	top: 12px;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: var(--dx-border-color);
	z-index: 0
}

.schedule-date {
	letter-spacing: 1.5px
}

.swiper-buttons {
	top: 25px;
	width: 95px
}

.swiper-buttons .swiper-button-next,
.swiper-buttons .swiper-button-prev {
	background-color: var(--dx-secondary-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	height: 32px;
	width: 32px;
	font-size: 22px;
	color: var(--dx-body-color);
	border-radius: 50rem;
	transition: all .4s ease-in-out
}

@media (prefers-reduced-motion: reduce) {

	.swiper-buttons .swiper-button-next,
	.swiper-buttons .swiper-button-prev {
		transition: none
	}
}

.swiper-buttons .swiper-button-next:hover,
.swiper-buttons .swiper-button-prev:hover {
	background-color: var(--dx-primary);
	color: var(--dx-white)
}

.goal-achieved-poster {
	background: url(../images/property-5.jpg);
	background-size: cover;
	background-position: center
}

.goal-achieved-poster .bg-overlay {
	opacity: .8
}

.goal-achieved-poster .fire-cracker {
	right: -20px;
	opacity: .65
}

.welcome-card {
	background-image: url(../images/welcome-bg.png);
	background-size: cover;
	background-position: center
}

@media (min-width: 375px) and (max-width: 425px) {
	.welcome-card p {
		max-width: 295px
	}
}

.welcome-card .welcome-vector {
	top: 16px;
	right: -25px;
	width: 170px
}

@media (max-width: 375px) {
	.welcome-card .welcome-vector {
		display: none
	}
}

[data-bs-theme=dark] .welcome-card {
	background-image: none
}

.circular-progress {
	position: relative
}

.circular-progress:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border: 1px solid var(--dx-white);
	height: 90%;
	width: 90%;
	border-radius: 50rem
}

.h-6px {
	height: 6px
}

.agent-map {
	height: 330px
}

.top-sales-agent {
	transition: all .4s ease-in-out;
	border: 1px solid transparent
}

@media (prefers-reduced-motion: reduce) {
	.top-sales-agent {
		transition: none
	}
}

.top-sales-agent:hover {
	box-shadow: var(--dx-box-shadow);
	border-color: var(--dx-border-color)
}

.progress-dot {
	position: absolute;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--dx-danger);
	box-shadow: 0 0 12px #e91e2f80;
	transform: translate(-50%, -50%);
	transition: all .3s ease;
	pointer-events: none;
	z-index: 10
}

#customerGrowthChart .apexcharts-text {
	fill: var(--dx-secondary-color) !important
}

.customer-widget .avatar {
	border-top-right-radius: 13px;
	border-bottom-left-radius: 13px
}