@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

@import url("https://cdn-uicons.flaticon.com/3.0.0/uicons-brands/css/uicons-brands.css");
@import url("https://cdn-uicons.flaticon.com/3.0.0/uicons-solid-straight/css/uicons-solid-straight.css");
@import url("https://cdn-uicons.flaticon.com/3.0.0/uicons-solid-rounded/css/uicons-solid-rounded.css");
@import url("https://cdn-uicons.flaticon.com/3.0.0/uicons-bold-rounded/css/uicons-bold-rounded.css");
@import url("https://cdn-uicons.flaticon.com/3.0.0/uicons-thin-rounded/css/uicons-thin-rounded.css");
@import url("https://cdn-uicons.flaticon.com/3.0.0/uicons-regular-rounded/css/uicons-regular-rounded.css");
@import url("https://cdn-uicons.flaticon.com/3.0.0/uicons-regular-straight/css/uicons-regular-straight.css");
@import url('https://cdn-uicons.flaticon.com/3.0.0/uicons-solid-straight/css/uicons-solid-straight.css');
@import url('https://cdn-uicons.flaticon.com/3.0.0/uicons-thin-rounded/css/uicons-thin-rounded.css');

:root {
	--color-primary: #05c778;
	--color-primary-96: #05c778f5;
	--color-primary-88: #05c778e0;
	--color-primary-80: #05c778cc;
	--color-primary-72: #05c778b8;
	--color-primary-64: #05c778a3;
	--color-primary-56: #05c7788f;
	--color-primary-48: #05c7787a;
	--color-primary-32: #05c77852;
	--color-primary-24: #05c7783d;
	--color-primary-16: #05c77829;
	--color-primary-08: #05c77814;
	--color-primary-04: #05c7780a;
	--color-primary-02: #05c77805;

	--color-white: #ffffff;
	--color-white-96: #fffffff5;
	--color-white-88: #ffffffe0;
	--color-white-80: #ffffffcc;
	--color-white-72: #ffffffb8;
	--color-white-64: #ffffffa3;
	--color-white-56: #ffffff8f;
	--color-white-48: #ffffff7a;
	--color-white-32: #ffffff52;
	--color-white-24: #ffffff3d;
	--color-white-16: #ffffff29;
	--color-white-08: #ffffff14;
	--color-white-04: #ffffff0a;
	--color-white-02: #ffffff05;

	--color-dark: #27303f;
	--color-dark-96: #27303ff5;
	--color-dark-88: #27303fe0;
	--color-dark-80: #27303fcc;
	--color-dark-72: #27303fb8;
	--color-dark-64: #27303fa3;
	--color-dark-56: #27303f8f;
	--color-dark-48: #27303f7a;
	--color-dark-32: #27303f52;
	--color-dark-24: #27303f3d;
	--color-dark-16: #27303f29;
	--color-dark-08: #27303f14;
	--color-dark-04: #27303f0a;
	--color-dark-02: #27303f05;

	--color-dark-solid: #27303f;
	--color-dark-solid-96: #27303ff5;
	--color-dark-solid-88: #27303fe0;
	--color-dark-solid-80: #27303fcc;
	--color-dark-solid-72: #27303fb8;
	--color-dark-solid-64: #27303fa3;
	--color-dark-solid-56: #27303f8f;
	--color-dark-solid-48: #27303f7a;
	--color-dark-solid-32: #27303f52;
	--color-dark-solid-24: #27303f3d;
	--color-dark-solid-16: #dddee0;
	--color-dark-solid-08: #27303f14;
	--color-dark-solid-04: #27303f0a;
	--color-dark-solid-02: #27303f05;

	--color-dark-fixed: #27303f;
	--color-dark-fixed-96: #27303ff5;
	--color-dark-fixed-88: #27303fe0;
	--color-dark-fixed-80: #27303fcc;
	--color-dark-fixed-72: #27303fb8;
	--color-dark-fixed-64: #27303fa3;
	--color-dark-fixed-56: #27303f8f;
	--color-dark-fixed-48: #27303f7a;
	--color-dark-fixed-32: #27303f52;
	--color-dark-fixed-24: #27303f3d;
	--color-dark-fixed-16: #27303f29;
	--color-dark-fixed-08: #27303f14;
	--color-dark-fixed-04: #27303f0a;
	--color-dark-fixed-02: #27303f05;

	--color-very-dark-fixed: #00060a;

	--color-white-fixed: #ffffff;
	--color-white-fixed-96: #fffffff5;
	--color-white-fixed-88: #ffffffe0;
	--color-white-fixed-80: #ffffffcc;
	--color-white-fixed-72: #ffffffb8;
	--color-white-fixed-64: #ffffffa3;
	--color-white-fixed-56: #ffffff8f;
	--color-white-fixed-48: #ffffff7a;
	--color-white-fixed-32: #ffffff52;
	--color-white-fixed-24: #ffffff3d;
	--color-white-fixed-16: #ffffff29;
	--color-white-fixed-08: #ffffff14;
	--color-white-fixed-04: #ffffff0a;
	--color-white-fixed-02: #ffffff05;

	--color-yellow: #fec514;
	--color-yellow-96: #fec514f5;
	--color-yellow-88: #fec514e0;
	--color-yellow-80: #fec514cc;
	--color-yellow-72: #fec514b8;
	--color-yellow-64: #fec514a3;
	--color-yellow-56: #fec5148f;
	--color-yellow-48: #fec5147a;
	--color-yellow-32: #fec51452;
	--color-yellow-24: #fec5143d;
	--color-yellow-16: #fec51429;
	--color-yellow-08: #fec51414;
	--color-yellow-04: #fec5140a;
	--color-yellow-02: #fec51405;

	--color-orange: #ff6300;
	--color-orange-96: #ff6300f5;
	--color-orange-88: #ff6300e0;
	--color-orange-80: #ff6300cc;
	--color-orange-72: #ff6300b8;
	--color-orange-64: #ff6300a3;
	--color-orange-56: #ff63008f;
	--color-orange-48: #ff63007a;
	--color-orange-32: #ff630052;
	--color-orange-24: #ff63003d;
	--color-orange-16: #ff630029;
	--color-orange-08: #ff630014;
	--color-orange-04: #ff63000a;
	--color-orange-02: #ff630005;

	--color-blue: #0657a3;
	--color-blue-96: #0657a3f5;
	--color-blue-88: #0657a3e0;
	--color-blue-80: #0657a3cc;
	--color-blue-72: #0657a3b8;
	--color-blue-64: #0657a3a3;
	--color-blue-56: #0657a38f;
	--color-blue-48: #0657a37a;
	--color-blue-32: #0657a352;
	--color-blue-24: #0657a33d;
	--color-blue-16: #0657a329;
	--color-blue-08: #0657a314;
	--color-blue-04: #0657a30a;
	--color-blue-02: #0657a305;

	--color-purple: #6e17b0;
	--color-purple-96: #6e17b0f5;
	--color-purple-88: #6e17b0e0;
	--color-purple-80: #6e17b0cc;
	--color-purple-72: #6e17b0b8;
	--color-purple-64: #6e17b0a3;
	--color-purple-56: #6e17b08f;
	--color-purple-48: #6e17b07a;
	--color-purple-32: #6e17b052;
	--color-purple-24: #6e17b03d;
	--color-purple-16: #6e17b029;
	--color-purple-08: #6e17b014;
	--color-purple-04: #6e17b00a;
	--color-purple-02: #6e17b005;

	--color-green: #05c778;
	--color-green-96: #05c778f5;
	--color-green-88: #05c778e0;
	--color-green-80: #05c778cc;
	--color-green-72: #05c778b8;
	--color-green-64: #05c778a3;
	--color-green-56: #05c7788f;
	--color-green-48: #05c7787a;
	--color-green-32: #05c77852;
	--color-green-24: #05c7783d;
	--color-green-16: #05c77829;
	--color-green-08: #05c77814;
	--color-green-04: #05c7780a;
	--color-green-02: #05c77805;

	--color-red: #f0425f;
	--color-red-96: #f0425ff5;
	--color-red-88: #f0425fe0;
	--color-red-80: #f0425fcc;
	--color-red-72: #f0425fb8;
	--color-red-64: #f0425fa3;
	--color-red-56: #f0425f8f;
	--color-red-48: #f0425f7a;
	--color-red-32: #f0425f52;
	--color-red-24: #f0425f3d;
	--color-red-16: #f0425f29;
	--color-red-08: #f0425f14;
	--color-red-04: #f0425f0a;
	--color-red-02: #f0425f05;

	--color-bitcoin: #f8931d;
}

.dark {
	--color-dark: #ffffff;
	--color-dark-96: #fffffff5;
	--color-dark-88: #ffffffe0;
	--color-dark-80: #ffffffcc;
	--color-dark-72: #ffffffb8;
	--color-dark-64: #ffffffa3;
	--color-dark-56: #ffffff8f;
	--color-dark-48: #ffffff7a;
	--color-dark-32: #ffffff52;
	--color-dark-24: #ffffff3d;
	--color-dark-16: #ffffff29;
	--color-dark-08: #ffffff14;
	--color-dark-04: #ffffff0a;
	--color-dark-02: #ffffff05;

	--color-dark-solid: #ffffff;
	--color-dark-solid-96: #fffffff5;
	--color-dark-solid-88: #ffffffe0;
	--color-dark-solid-80: #ffffffcc;
	--color-dark-solid-72: #ffffffb8;
	--color-dark-solid-64: #ffffffa3;
	--color-dark-solid-56: #ffffff8f;
	--color-dark-solid-48: #ffffff7a;
	--color-dark-solid-32: #ffffff52;
	--color-dark-solid-24: #ffffff3d;
	--color-dark-solid-16: #283c47;
	--color-dark-solid-08: #ffffff14;
	--color-dark-solid-04: #ffffff0a;
	--color-dark-solid-02: #ffffff05;

	--color-white: #001524;
	--color-white-96: #001524f5;
	--color-white-88: #001524e0;
	--color-white-80: #001524cc;
	--color-white-72: #001524b8;
	--color-white-64: #001524a3;
	--color-white-56: #0015248f;
	--color-white-48: #0015247a;
	--color-white-32: #00152452;
	--color-white-24: #0015243d;
	--color-white-16: #00152429;
	--color-white-08: #00152414;
	--color-white-04: #0015240a;
	--color-white-02: #00152405;

	--color-dark-fixed: #001524;
	--color-dark-fixed-96: #001524f5;
	--color-dark-fixed-88: #001524e0;
	--color-dark-fixed-80: #001524cc;
	--color-dark-fixed-72: #001524b8;
	--color-dark-fixed-64: #001524a3;
	--color-dark-fixed-56: #0015248f;
	--color-dark-fixed-48: #0015247a;
	--color-dark-fixed-32: #00152452;
	--color-dark-fixed-24: #0015243d;
	--color-dark-fixed-16: #00152429;
	--color-dark-fixed-08: #00152414;
	--color-dark-fixed-04: #0015240a;
	--color-dark-fixed-02: #00152405;
}

* {
	font-family: "Poppins", sans-serif;

	line-height: 1.2;
}

html,
body {
	color: var(--color-dark);
	background: var(--color-white);

	font-size: 16px;
	
    -webkit-overflow-scrolling: touch;
}

@media screen and (max-width: 375px) {
	html,
	body {
		font-size: 13px;
	}
}

@media screen and (min-width: 2000px) {
	html,
	body {
		font-size: 18px;
	}
}

body::before {
	content: "";

	display: block;

	width: 100%;
	height: 100%;

	position: fixed;
	top: 0;
	left: 0;

	z-index: -1;

	background: var(--color-white);
}

body {
	max-width: 100vw;

	overflow-x: hidden;
}

button {
	color: var(--color-dark);
}

ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

hr {
	border-color: var(--color-dark-16);

	opacity: 1;
}

a,
a.link,
a:link,
a:hover {
	font-weight: 500;
	text-decoration: none;

	color: var(--color-dark);
}

a:hover {
	opacity: 0.7;
}

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

i.fi {
	width: 1rem;
	height: 1rem;

	line-height: 1;

	display: inline-flex;
	justify-content: center;
	align-items: center;
}

.fi-rr-spinner {
	width: 1rem;
	height: 1rem;

	line-height: 1;

	display: inline-flex;
	justify-content: center;
	align-items: center;

	animation: spin 1s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

/* buttons */

button {
	padding: 0;
	margin: 0;

	background: transparent;
	border: 0;
}

.link {
	font-weight: 500;

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

.link-grey {
	color: var(--color-dark-56);
}

.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
	border: 1px solid transparent;
}

.btn,
.btn:active {
	font-size: 0.85rem;
	text-transform: uppercase;
	white-space: nowrap;

	color: var(--color-dark-72);

	border: 1px solid transparent;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	padding: 0.75rem 1.25rem;

	border-radius: 0.75rem;

	transition: all 0s;

	outline: 0;

	font-weight: 600;
}

.btn > span {
	display: inline-block;

	position: relative;
	bottom: -1px;
}

.btn.small_,
.btn.small {
	padding: 0.5rem 1rem;

	font-size: 0.75rem;
}

.btn:hover {
	filter: opacity(.75);
}

.btn > i,
.link > i {
	font-size: 1rem;
	width: clamp(1rem, 1rem, 1rem);
	height: clamp(1rem, 1rem, 1rem);

	margin: 0 -0.5rem;
}

.btn.btn-primary,
.btn.btn-primary:active,
.btn.btn-primary:focus,
.btn.btn-primary:hover {
	color: var(--color-white);
	background: var(--color-primary);
	border: 1px solid var(--color-primary);
}

.btn.btn-dark,
.btn.btn-dark:active,
.btn.btn-dark:focus,
.btn.btn-dark:hover {
	color: var(--color-white);
	background: var(--color-dark);
	border: 1px solid var(--color-dark);
}

.btn.btn-white,
.btn.btn-white:active,
.btn.btn-white:focus,
.btn.btn-white:hover {
	color: var(--color-primary);
	background: var(--color-white);
	border: 1px solid var(--color-white);
}

.btn.btn-dark-outline,
.btn.btn-dark-outline:active,
.btn.btn-dark-outline:focus,
.btn.btn-dark-outline:hover {
	color: var(--color-dark);
	background: transparent;
	border: 1px solid var(--color-dark);
}

.btn.btn-red,
.btn.btn-red:active,
.btn.btn-red:focus,
.btn.btn-red:hover {
	color: var(--color-white);
	background: var(--color-red);
	border: 1px solid var(--color-red);
}

.btn.btn-red-outline,
.btn.btn-red-outline:active,
.btn.btn-red-outline:focus,
.btn.btn-red-outline:hover {
	color: var(--color-red);
	background: transparent;
	border: 1px solid var(--color-red);
}

.btn.btn-green,
.btn.btn-green:active,
.btn.btn-green:focus,
.btn.btn-green:hover {
	color: var(--color-white);
	background: var(--color-green);
	border: 1px solid var(--color-green);
}

.btn.btn-primary-outline,
.btn.btn-primary-outline:active,
.btn.btn-primary-outline:focus,
.btn.btn-primary-outline:hover {
	color: var(--color-primary);
	background: transparent;
	border: 1px solid var(--color-primary);
}

.btn.btn-grey-outline,
.btn.btn-grey-outline:active,
.btn.btn-grey-outline:focus,
.btn.btn-grey-outline:hover {
	color: var(--color-dark);
	background: transparent;
	border: 1px solid var(--color-dark-16);
}

.btn.btn-default,
.btn.btn-default:active,
.btn.btn-default:focus,
.btn.btn-default:hover {
    background: var(--color-dark-08);
    color: var(--color-dark-72);
	border: 1px solid transparent;
}

/* alert */

.alert {
	padding: 0.75rem 1rem;
	margin: 0;

	background: transparent;

	font-weight: 500;
	font-size: .85rem;

	border-width: 1px;

	border-radius: 0.75rem;

	display: flex;
	gap: 1rem;
}

.alert i {
	font-size: 1rem;

	width: 1rem;
	height: 1rem;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	margin-top: 1px;
}

.alert h6 {
	font-size: 1rem;
}

.alert ul {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;

	padding-left: 1rem;
	padding-bottom: 0.125rem;

	list-style: disc;
}

.alert ul li {
	font-size: .85rem;
	font-weight: 400;

	color: var(--color-dark-80);
}

.alert span {
	position: relative;
	bottom: -0.5px;

	line-height: 1.6;
}

.alert.slim {
	padding: 0;

	border-width: 0;
}

.alert.alert-danger {
	border-color: var(--color-red);
	color: var(--color-red);
}

.alert.alert-red {
	border-color: transparent;
	background: var(--color-red-08);
	color: var(--color-dark);
}

.alert.alert-yellow {
	border-color: transparent;
	background: var(--color-yellow-16);
	color: var(--color-dark);
}

.alert.alert-default {
	border-color: transparent;
	background: var(--color-dark-04);
	color: var(--color-dark);
}

.alert.alert-green {
	border-color: transparent;
	background: var(--color-green-08);
	color: var(--color-dark);
}

/* forms */

::placeholder {
	font-weight: 500;

	color: var(--color-dark-48);
}

.select2-container {
	width: 100% !important;
}

.input {
	padding: 0.6rem 0.85rem;

	height: auto;
	min-height: 2.75rem;

	width: 100%;

	font-size: 0.85rem;

	border-radius: 0.75rem;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

	display: flex;
	align-items: center;

	border: 1px solid var(--color-dark-16);
	background: var(--color-white);
	color: var(--color-dark);
}

select.input {
	background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2327303f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	background-position: right .75rem center;
	background-repeat: no-repeat;
	background-size: .75rem;

	padding-right: calc(1rem + .75rem + 1rem);
}

body.dark select.input {
	background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	background-position: right .75rem center;
	background-repeat: no-repeat;
	background-size: .75rem;
}

input::-webkit-datetime-container {
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.input:disabled {
	background: var(--color-dark-04);
}

.input.between {
	display: flex;
	justify-content: space-between;
}

.input.a-center {
	display: flex;
	align-items: center;
}

.input:active,
.input:focus,
.input:focus-visible,
.input:focus-within {
	border: 1px solid var(--color-dark-32);
	outline: 0 !important;
}

.input-group-text {
	border-radius: .75rem 0 0 .75rem;
}

.form-check {
	margin: 0;
	padding-left: 0;

	display: flex;
	align-items: center;

	min-height: unset;
}

.form-check > input.form-check-input {
	margin-left: 0;
	margin-top: 0;

	background: var(--color-white);
	border-color: var(--color-dark-24);

	float: unset;
}

.form-check > label.form-check-label {
	font-size: 0.9rem;

	/* padding-top: 0.15rem; */

	display: block;
	margin-left: 0.5rem;

	color: var(--color-dark);
}

.form-check > label.form-check-label i {
	position: relative;
	bottom: -2px;
}

.form-switch .form-check-input {
	width: 3.5rem;
	height: 1.75rem;

	margin: 0;
}

.form-switch.small .form-check-input {
	width: 2.5rem;
	height: 1.25rem;
}

.form-switch .form-check-input:focus {
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2305C778'/%3e%3c/svg%3e");
}

.form-switch .form-check-input:checked {
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
}

.form-check-input:focus {
	box-shadow: none !important;
}

.form-check-input:checked[type="checkbox"] {
	background-repeat: no-repeat;
	background-color: var(--color-primary);
	border-color: var(--color-primary);

	margin: 0;
}

.form-check-input:checked:not([role="switch"]) {
	background: var(--color-primary) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") no-repeat center/contain !important;
	border-color: var(--color-primary);
}

.form-check-input[type="checkbox"][role="switch"] {
	background-color: var(--color-white);
	background-image: var(--bs-form-switch-bg);
	background-repeat: no-repeat;
}

body.dark .form-check-input[type="checkbox"][role="switch"] {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffffcc'/%3e%3c/svg%3e");
}

.form-check-input:checked[type="checkbox"][role="switch"] {
	background-color: var(--color-primary);
	background-image: var(--bs-form-switch-bg);
}

.form-check-input:focus {
	border-color: var(--color-primary);
}

.toggle-item {
	display: flex;
	align-items: center;
	gap: 0.5rem;

	font-weight: 500;
}

.input-label,
div:has(> .input) label,
div:has(div.ddropdown > button > .input) label {
	margin-bottom: 0.5rem;

	font-weight: 500;
	font-size: 0.85rem;
}

body.dark input[type="date" i]::-webkit-calendar-picker-indicator {
	background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNSIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjZmZmZmZmIiBkPSJNMjAgM2gtMVYxaC0ydjJIN1YxSDV2Mkg0Yy0xLjEgMC0yIC45LTIgMnYxNmMwIDEuMS45IDIgMiAyaDE2YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6bTAgMThINFY4aDE2djEzeiIvPjxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiLz48L3N2Zz4=);
}

/* datapicker */

.daterangepicker {
	border-radius: 0.7rem;
}

.daterangepicker td.in-range {
	background: var(--color-primary-08);
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
	background: var(--color-primary);
}

.daterangepicker td.available:hover,
.daterangepicker th.available:hover {
	background: var(--color-primary-24);
}

/* ddropdown */

div.ddropdown {
	position: relative;

	display: flex;
}

div.ddropdown > button {
	width: 100%;

	display: flex;
}

div.ddropdown > button > span {
	width: 100%;

	display: flex;
	align-items: center;
}

div.ddropdown > aside {
	position: absolute;

	top: calc(100% + 0.5rem);
	right: 0;

	display: none;
}

/* tags */

div.tags {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}

div.tags > span {
	white-space: nowrap;

	font-weight: 500;
	font-size: 0.8rem;

	color: var(--color-dark-80);
	background: var(--color-dark-04);
	border: 1px solid var(--color-dark-08);

	border-radius: 0.5rem;

	padding: 0 0.5rem;

	display: inline-flex;
	align-items: center;

	height: 1.5rem;
}

div.tags > span.green {
	background: var(--color-green-16);
}

div.tags > span.red {
	background: var(--color-red-16);
	border-color: var(--color-red-32);
	color: var(--color-red);
}

div.tags > span.blue {
	background: var(--color-blue-16);
}

div.tags > span.yellow {
	background: var(--color-yellow-16);
}

div.tags > span.purple {
	background: var(--color-purple-16);
}

/* modal */

.modal-content {
	border: 0;

	border-radius: 1rem;

	background: var(--color-white);
	border: 1px solid var(--color-dark-16);
}

.modal-backdrop {
	opacity: 1 !important;

	background: var(--color-dark-fixed-64);

	backdrop-filter: blur(0.25rem);
}

.modal-content > div.header {
	display: flex;
	align-items: center;

	padding: 1rem 1rem 0 1.5rem;

	position: absolute;

	width: 100%;
}

.modal-content > div.header:has(> span.title) {
	padding: 1rem 1rem 1rem 1.5rem;

	border-bottom: 1px solid var(--color-dark-16);

	position: relative;
}

.modal-content > div.body {
	padding: 1.25rem;
}

.modal-content:not(:has(> div.header > span.title)) > div.body {
	padding: 1.25rem 1.5rem 1.5rem;
}

.modal-content > div.header > span.title {
	font-weight: 600;
	font-size: 1.15rem;

	color: var(--color-dark);
}

.modal-content > div.header > button.close {
	margin: 0;
	margin-left: auto;
	padding: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	width: clamp(1.75rem, 1.75rem, 1.75rem);
	height: clamp(1.75rem, 1.75rem, 1.75rem);

	font-size: 1.75rem;

	color: var(--color-dark);
}

.modal-content > .header:not(:has(> span.title)) > button.close {
	position: absolute;

	right: 1rem;
	top: 1rem;
}

/* pagination */

/* nav.pagination {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;

	margin: 0;
}

nav.pagination span.desc {
	color: var(--color-dark-64);

	font-size: 0.85rem;
	font-weight: 500;

	display: inline-flex;
}

nav.pagination ul {
	display: flex;

	list-style: none;

	padding: 0;
}

nav.pagination ul li {
	margin-right: 0.5rem;
}

nav.pagination ul li a {
	width: 2rem;
	height: 2rem;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	font-weight: 500;
	line-height: 1;

	border-radius: 8px;

	color: var(--color-dark-64);
}

nav.pagination ul li a i {
	display: flex;
}

nav.pagination ul li:first-child a,
nav.pagination ul li:last-child a,
nav.pagination ul li a:hover {
	opacity: 0.8;

	background: var(--color-dark-08);
}

nav.pagination ul li a.active {
	background: var(--color-primary);
	color: #ffffff;
}

nav.pagination ul li a.disabled {
	opacity: 0.4;
} */

/* design block */

section.block {
	padding: 1.5rem 1.5rem 1.5rem;

	border: 2px solid var(--color-dark-16);

	border-radius: 1rem;
}

section.block-t {
	padding: 1.25rem 1.5rem 1.5rem;

	border: 2px solid var(--color-dark-16);

	border-radius: 1rem;
}

/* loader */

span.button-loader {
	width: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	top: 1px;
	aspect-ratio: 2;
	--_g: no-repeat radial-gradient(circle closest-side, var(--color-white-32) 90%, #0000);
	background: var(--_g) 0% 50%, var(--_g) 50% 50%, var(--_g) 100% 50%;
	background-size: calc(100% / 3) 50%;
	animation: l3 1s infinite linear;
}

span.button-loader-dark {
	width: 2rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	top: 1px;
	aspect-ratio: 2;
	--_g: no-repeat radial-gradient(circle closest-side, var(--color-dark-32) 90%, #0000);
	background: var(--_g) 0% 50%, var(--_g) 50% 50%, var(--_g) 100% 50%;
	background-size: calc(100% / 3) 50%;
	animation: l3 1s infinite linear;
}

@keyframes l3 {
	20% {
		background-position: 0% 0%, 50% 50%, 100% 50%;
	}
	40% {
		background-position: 0% 100%, 50% 0%, 100% 50%;
	}
	60% {
		background-position: 0% 50%, 50% 100%, 100% 0%;
	}
	80% {
		background-position: 0% 50%, 50% 50%, 100% 100%;
	}
}

div.loading-full {
	position: fixed;

	width: 100%;
	height: 100%;

	left: 0;
	top: 0;

	background: var(--color-white-88);

	display: flex;
	align-items: center;
	justify-content: center;

	z-index: 88888888;
}

aside.direct-box div.loading-full {
	border-radius: 0 0 1rem 1rem;
}

#loading-beforeunload {
	opacity: 0;
	visibility: hidden;
}

#loading-beforeunload.show {
	opacity: 1;
	visibility: visible;
	
	transition: .2s;
}

span.loader {
	display: flex;
	justify-content: center;
}

span.loader::before {
	content: "";

	display: block;

	width: 3rem;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(farthest-side, var(--color-primary) 94%, #0000) top/.25rem 0.25rem no-repeat, conic-gradient(#0000 30%, var(--color-primary));
	-webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 0.25rem), #000 0);
	animation: loader 1s infinite linear;
}
span.loader.small::before {
	width: 2rem !important;
}

@keyframes loader {
	100% {
		transform: rotate(1turn);
	}
}


/* table */

div.table-container > table {
    width: 100%;
}

div.table-container:has(> nav) > table {
    margin-bottom: 1rem;
}

div.table-container > table > thead > tr > th {
    /* border: 1px solid var(--color-dark-16); */

    padding: .65rem;

    text-align: left;
    font-size: .85rem;
	font-weight: 600;
	white-space: nowrap;
}

div.table-container > table > tbody > tr > td {
    /* border: 1px solid var(--color-dark-16); */

    padding: .65rem;

    font-size: .85rem;
}

div.table-container > table > tbody > tr {
    background-color: var(--color-dark-04);
}

div.table-container > table > tbody > tr:nth-child(even) {
    background-color: var(--color-white);
}

div.table-container > table > tbody > tr > td input {
    width: 100%;

    outline: 0;
}

div.table-container > table > tbody > tr > td .btn {
    padding: .25rem .5rem;

    font-size: .75rem;

    border-radius: .5rem;

    gap: .25rem;
}

/* pagination */

nav.pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

nav.pagination div.count {
    color: var(--color-dark-56);

    font-size: 0.875rem;
}

nav.pagination ul {
    display: flex;
    gap: 0.5rem;
}

nav.pagination ul li a.disabled {
    opacity: 0.4;
}

nav.pagination ul li:first-child a,
nav.pagination ul li:last-child a {
    background: var(--color-dark-08);
}

nav.pagination ul li a {
    width: 2rem;
    height: 2rem;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-weight: 500;
    font-size: 0.875rem;

    border-radius: 0.5rem;

    color: var(--color-dark-56);
    background: var(--color-dark-02);
}

nav.pagination ul li a.active {
    background: var(--color-primary);
    color: #ffffff;
}

/* table.dataTable */

div.table-container table.dataTable > tbody > tr > td {
	padding: .75rem;
}

/*  */

.daterangepicker {
	background: var(--color-white);
	border-color: var(--color-dark-16);
}

.daterangepicker .calendar-table {
	background: var(--color-white);
	border-color: var(--color-white);
}

.daterangepicker:after {
	border-bottom-color: var(--color-white);
}

.daterangepicker:before {
	border-bottom-color: var(--color-dark-16);
}

.daterangepicker td.in-range {
	color: var(--color-dark);
}

.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {
	background: var(--color-dark-08);
	background: transparent;
	color: var(--color-dark-32);
}

body.dark .daterangepicker td.in-range {
	background: var(--color-primary-72);
}

body.dark .daterangepicker td.off.in-range {
	background: var(--color-primary-24);
}

.daterangepicker .drp-buttons {
	border-top-color: var(--color-dark-16);
}

.daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span {
	border-color: var(--color-dark);
}

.daterangepicker.show-calendar .drp-buttons {
	justify-content: flex-end;
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.daterangepicker .drp-buttons .btn {
	margin-left: 0;

	border-radius: .5rem;
}

.daterangepicker .drp-selected {
	display: none;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
	color: var(--color-white);
}

/* select2 */

.select2-dropdown {
	border-color: var(--color-dark-16);
}

.select2-search--dropdown {
	padding: .5rem .5rem .25rem;
}

.select2-container--default .select2-selection--single {
	border-radius: 0.75rem;

	height: 2.85rem;

	border: 1px solid var(--color-dark-16);
}

.select2-container--default .select2-results__option {
	padding: .75rem;

	font-size: .85rem;
}

.select2-search--dropdown .select2-search__field {
	padding: .5rem;

	font-size: .85rem;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	font-size: .85rem;
}

.select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar {
	background: var(--color-white);

	width: .5rem;
}

.select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar-corner {
	background: var(--color-dark-16);
}

.select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar-thumb {
	background: var(--color-dark-16);

	border-radius: 1rem;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 2.85rem;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 2.85rem;
	width: 2.25rem;
}

.select2-container .select2-selection--single .select2-selection__rendered {
	padding-left: 0.75rem;
}

.select2-container--default .select2-selection--single {
	background: var(--color-white);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: var(--color-dark);
}

.select2-dropdown {
	background: var(--color-white);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	border-color: var(--color-dark-16);
	color: var(--color-dark);
	background: var(--color-white);

	border-radius: .5rem;

	outline: 0;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background: var(--color-dark-04);
	color: var(--color-dark);
}

.select2-container--default .select2-results__option--selected {
	background: var(--color-primary);
}