body {
	user-select: none;
	font-family: Inter !important;
	font-weight: inherit;
}

@font-face {
	font-family: Inter;
	src: url('../fonts/Inter.otf');
}

textarea:focus,
input:focus {
	outline: none;
}

*:focus {
	outline: none;
}

a:hover {
	text-decoration: none !important;
}

button:hover {
	cursor: poInter !important;
}

button:focus {
	outline: 0 !important;
}

button {
	outline: 0;
}

input:focus,
textarea:focus {
	outline-color: none;
}

input[type=email],
input[type=text],
textarea {
	outline: none;
}

/* width */
::-webkit-scrollbar {
	width: 4px;
	border-radius: 3px;
}

/* Track */
::-webkit-scrollbar-track {
	background: transparent;
	border-radius: 3px;
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: #888;
	border-radius: 3px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: #697176;
	border-radius: 3px;
}

.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl {
	width: 100%;
	padding-right: 36px !important;
	padding-left: 36px !important;
	margin-right: auto;
	margin-left: auto;
}

.toolbar {
	width: 100%;
	padding: 12px;
	display: flex;
}

.toolbar a {
	margin-right: 8px;
}

.exit-button {
	background: #FF5A53;
	border-radius: 10px;
	width: 10px;
	height: 10px;
	display: block;
}

.min-button {
	background: #E6C029;
	border-radius: 10px;
	width: 10px;
	height: 10px;
	display: block;
}

.max-button {
	background: #53C22C;
	border-radius: 10px;
	width: 10px;
	height: 10px;
	display: block;
}

#bg {
	background-color: #0E1113;
	background-image: url('../images/bg-dashboard.png');
	background-size: cover;
	background-repeat: no-repeat;
}

.mobile {
	display: none !important;
}

.navbar {
	padding: 18px 0 !important;
}

.logo {
	height: 58px;
}

.logo img {
	height: 100%;
	object-fit: contain;
	object-position: left;
}

.nav-custom {
	width: 65%;
}

.profile {
	width: 24%;
}

.nav-custom ul {
	padding-inline-start: 0px;
	margin-block-start: 0px;
	margin-block-end: 0px;
}

.nav-custom ul li {
	width: 84px;
	background: #181C1F;
	border-radius: 12px;
	text-align: center;
	display: inline-block;
	margin-right: 16px;
}

.nav-custom ul li a {
	color: rgba(255, 255, 255, 0.5);
	font-family: Inter;
	font-size: 12px;
	text-align: center;
	display: block;
	padding-top: 8px;
	padding-bottom: 8px;
	text-decoration: none;
}

.nav-custom ul li.active a {
	color: #fff;
}

.nav-custom ul li a p {
	margin-bottom: 0;
}

.profile {
	text-align: right;
	padding: 8px !important;
}

.profile b {
	text-overflow: ellipsis;
	max-width: 130px;
	white-space: nowrap;
	overflow: hidden;
	display: -webkit-inline-box;
}

.profile a {
	color: #fff !important;
	font-size: 14px;
	color: #FFFFFF;
	text-align: left;
	padding-left: 8px !important;
}

.profile img {
	margin-left: 12px;
	width: 42px;
	height: 42px;
}

.dropdown-toggle::after {
	position: relative;
	top: 10px;
	border: none !important;
	/*
	content: url('../images/chevron-down.svg') !important;*/
}

.profile.dropdown.show {
	background: #0B0D0E;
	border-radius: 8px 8px 0 0;
}

.profile .dropdown {
	background: #0B0D0E !important;
	border-radius: 8px 8px 0 0;
	color: #fff;
}

.profile .dropdown-menu {
	position: absolute;
	width: 100%;
	top: 100%;
	left: 0;
	background: #0B0D0E !important;
	box-shadow: none !important;
	margin: 0 !important;
	border-radius: 0 0 8px 8px !important;
}

.profile a.dropdown-item.admin {
	color: #FE5656 !important;
}

.profile .dropdown-menu a.dropdown-item img {
	margin-right: 12px;
	margin-left: 0;
	padding: 0;
	width: 24px;
	height: 24px;
}

.profile .dropdown-menu a.dropdown-item:hover img {
	filter: invert(1) sepia(0) saturate(50) hue-rotate(6rad);
}

.profile .dropdown-menu a.dropdown-item.admin img {
	filter: none;
}

.profile .dropdown-menu a.dropdown-item:hover {
	background: transparent;
	color: #FE5656 !important;
}



.form-control {
	background: #22272A !important;
	border-radius: 8px !important;
	border: none !important;
	outline: none !important;
	font-family: Inter;
	font-size: 14px !important;
	color: #fff !important;
	min-height: 40px !important;
	margin-bottom: 8px;
	height: 36px;
}

#card-section {
	width: 100%;
}

.card-amount {
	width: 100%;
	max-height: 140px;
	height: 120px;
	padding: 16px;
	background-color: #181c1f;
	background-image: url('../images/bg-amount.svg');
	background-size: inherit;
	background-position: bottom right;
	background-repeat: no-repeat;
	border-radius: 18px;
}

.card-amount h5 {
	opacity: 0.5;
	font-family: Inter;
	font-size: 12px;
	color: #697176;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.card-amount h1.value {
	font-family: Inter;
	font-size: 28px;
	color: #fff;
	text-align: center;
	padding-top: 19px;
}

.card-checkout {
	width: 100%;
	max-height: 120px;
	height: 120px;
	padding: 16px;
	background-color: #181c1f;
	background-image: url('../images/bg-checkout.png');
	background-size: inherit;
	background-position: bottom right;
	background-repeat: no-repeat;
	border-radius: 12px;
	margin-bottom: 24px;
}

.card-checkout h5 {
	opacity: 0.5;
	font-family: Inter;
	font-size: 12px;
	color: #697176;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.card-checkout h1.value {
	font-family: Inter;
	font-size: 28px;
	color: #1b77ff;
	text-align: center;
	padding-top: 19px;
}

.card-success-checkout {
	width: 100%;
	max-height: 120px;
	height: 120px;
	padding: 16px;
	background-color: #181c1f;
	background-image: url('../images/bg-success-checkout.png');
	background-size: inherit;
	background-position: bottom right;
	background-repeat: no-repeat;
	border-radius: 12px;
}

.card-success-checkout h5 {
	opacity: 0.5;
	font-family: Inter;
	font-size: 12px;
	color: #697176;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.card-success-checkout h1.value {
	font-family: Inter;
	font-size: 28px;
	color: #3AFF8E;
	text-align: center;
	padding-top: 19px;
}

.card-failed-checkout {
	width: 100%;
	max-height: 120px;
	height: 120px;
	padding: 16px;
	background-color: #181c1f;
	background-image: url('../images/bg-failed-checkout.png');
	background-size: inherit;
	background-position: bottom right;
	background-repeat: no-repeat;
	border-radius: 12px;
}

.card-failed-checkout h5 {
	opacity: 0.5;
	font-family: Inter;
	font-size: 12px;
	color: #697176;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.card-failed-checkout h1.value {
	font-family: Inter;
	font-size: 28px;
	color: #FE5656;
	text-align: center;
	padding-top: 19px;
}



.label-blue {
	padding: 4px 12px;
	background: rgba(58, 153, 255, 0.2);
	border-radius: 15px;
	font-family: Inter;
	font-size: 12px;
	color: #3AB9FF;
}

.label-green {
	padding: 4px 12px;
	background: rgba(58, 255, 142, 0.2);
	border-radius: 15px;
	font-family: Inter;
	font-size: 12px;
	color: #3AFF8E;
}

.label-red {
	padding: 4px 12px;
	background: rgba(254, 86, 86, 0.2);
	border-radius: 15px;
	font-family: Inter;
	font-size: 12px;
	color: #FE5656;
}

/* SETTINGS */
#settings {
	width: 100%;
	padding-top: 30px;
}

#settings a.link {
	font-family: Inter;
	font-size: 18px;
	color: #FE5656;
	margin-bottom: 24px;
	display: block;
	text-align: center;
}

#settings a.link img {
	margin-left: 8px;
}

a .card-backup:hover {
	text-decoration: none;
	color: #fff;
	text-decoration: none;
	opacity: 0.9;
}

a .card-restore:hover {
	text-decoration: none;
	color: #fff;
	text-decoration: none;
	text-decoration: none;
	opacity: 0.9;
}

.section-cli {
	width: 100%;
	height: auto;
	padding: 18px;
	padding-bottom: 12px;
	background: url('../images/bg-cli.png');
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 12px;
}

.section-cli h6 {
	opacity: 0.5;
	font-family: Inter;
	font-size: 14px;
	color: #697176;
	letter-spacing: 2px;
	text-align: center;
	margin-bottom: 30px;
}

.section-cli a:hover {
	text-decoration: none;
	opacity: 0.9;
}

.section-cli .import-export-cli {
	background: #15181B;
	border-radius: 12px;
	text-align: center;
	padding: 24px 37px 20px 37px;
	color: #fff;
	margin-bottom: 12px;
}

.section-cli .import-export-cli p {
	margin-bottom: 0;
}

.section-cli .import-export-cli img {
	margin-bottom: 12px;
}


.webhook {
	width: 100%;
	height: 166px;
	padding: 18px;
	padding-bottom: 12px;
	background: url('../images/bg-webhook.png');
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 12px;
	text-align: center;
	margin-bottom: 24px;
}

.webhook h6 {
	opacity: 0.5;
	font-size: 14px;
	color: #697176;
	letter-spacing: 2px;
	text-align: center;
	margin-bottom: 24px;
}

.webhook .link-area {
	width: 100%;
	background: #22272A;
	border: 0;
	border-radius: 8px;
	padding: 8px 12px;
	color: #fff;
	font-size: 14px;
	color: #697176;
	margin-bottom: 12px;
	outline: none;
	text-align: center;
}

.btn-black {
	background: #0B0D0E;
	border-radius: 17px;
	padding: 8px 16px;
	font-size: 14px;
	color: #FE5656;
	display: block;
	text-align: center;
}

.btn-black:hover {
	text-decoration: none;
	color: #FE5656;
	opacity: 0.9;
}

.btn-black:disabled {
	color: rgb(146, 146, 146);
	opacity: 0.6;
}

.btn-black img {
	background: #0B0D0E;
	padding-right: 12px;
}

.btn-copy-text {
	background: transparent;
	border: none;
	font-size: 14px;
	color: #FE5656;
	text-align: right;
	padding: 8px 16px;
	outline: none;
}

/* 
div.btn-group {
	padding: none !important;
} */

/* .btn-group .grouped-buttons:first-of-type {
	margin-right: -10px;
	margin-right: 20px;
} */

.btn-group {
	width: 100%;
}

.btn-group .grouped-buttons {
	max-width: calc(50% - 5px);
}

.btn-group .grouped-buttons:first-of-type {
	margin-right: 10px;
}

.card-version {
	height: 73px;
	background: #181C1F;
	box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.12);
	border-radius: 12px;
	padding: 12px 18px;
	display: flex;
	justify-content: space-between;
	margin-bottom: 24px;
}

.version {
	margin-left: 24px;
}

.version p {
	opacity: 0.5;
	font-size: 14px;
	color: #697176;
	letter-spacing: 2px;
	margin-bottom: 8px;
}

.version h4 {
	font-size: 18px;
	color: #FFFFFF;
	margin-bottom: 0;
	font-weight: 800 !important;
}

.flex {
	display: flex;
}

.card-backup {
	width: 100%;
	height: 73px;
	background-color: #181C1F;
	background-image: url('../images/icon-backup.svg');
	background-repeat: no-repeat;
	background-position: left;
	line-height: 73px;
	padding-left: 78px;
	color: #fff;
	border-radius: 12px;
}

.card-restore {
	width: 100%;
	height: 73px;
	background-color: #181C1F;
	background-image: url('../images/icon-restore.svg');
	background-repeat: no-repeat;
	background-position: right;
	line-height: 73px;
	padding-left: 40px;
	color: #fff;
	border-radius: 12px;
}


.card-license {
	width: 100%;
	color: #fff;
	border-radius: 12px;
	overflow: hidden;
	background: #181C1F;
	box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.12);
	margin-bottom: 24px;
}

.head-license {
	padding: 18px 24px;
	background-image: url('../images/bg-license.png');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: right;
}

.head-license p {
	margin-bottom: 16px;
	font-size: 14px;
	color: #FFFFFF;
	letter-spacing: 2px;
}

.head-license h2 {
	font-size: 28px;
	color: #FFFFFF;
	margin-bottom: 0px;
}

.body-license {
	padding: 20px 42px;
	font-size: 14px;
	color: #FFFFFF;
}

.body-license p {
	margin-bottom: 0;
}

.body-license p span {
	color: #FE5656;
}

.card-monitor {
	width: 100%;
	height: 170px;
	background-color: #181C1F;
	background-image: url('../images/bg-monitor-delay.png');
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 18px 12px;
	color: #fff;
	border-radius: 12px;
	text-align: center;
}

.card-monitor p {
	opacity: 0.5;
	font-size: 14px;
	color: #697176;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.card-monitor h1 {
	font-size: 36px;
	color: #FFFFFF;
	text-align: center;
	margin-top: 37px;
}

.card-delay {
	width: 100%;
	height: 170px;
	background-color: #181C1F;
	background-image: url('../images/bg-delay.png');
	background-repeat: no-repeat;
	background-position: right bottom;
	padding: 18px 12px;
	color: #fff;
	border-radius: 12px;
	text-align: center;
}

.card-delay p {
	opacity: 0.5;
	font-size: 14px;
	color: #697176;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.card-delay h1 {
	font-size: 36px;
	color: #FFFFFF;
	text-align: center;
	margin-top: 37px;
}



/* LOGIN */
#login {
	width: 100%;
	height: 100vh;
	background: url('../images/bg-login.png');
	background-size: cover;
}

.logo-login {
	width: auto;
	height: auto;
	text-align: center;
	margin-bottom: 50px;
}

.logo-login img {
	margin: auto;
}

.login-form {
	text-align: center;
}

.login-form p {
	font-size: 14px;
	color: #FFFFFF;
	margin-bottom: 18px;
	text-align: center;
}

.license-form {
	width: 100%;
	background: #22272A;
	border-radius: 16px;
	padding: 14px;
	font-size: 16px;
	color: #B4BEC1;
	letter-spacing: 0;
	text-align: center;
	outline: none;
	border: none;
	text-transform: uppercase;
	display: block;
	margin: auto;
	margin-bottom: 16px;
	letter-spacing: 2px;
}

.btn-login {
	background: #FE5656;
	border-radius: 16px;
	color: #fff;
	padding: 12px 16px;
	/* padding-right: 64px; */
	display: block;
}

.btn-login img {
	text-align: center;
	width: 24px;
	height: 24px;
	object-fit: contain;
	margin-right: 8px;
}

.btn-login:hover {
	text-decoration: none;
	color: #fff;
	opacity: 0.9;
}

.center-content {
	/* width: 24%; */
	vertical-align: middle;

	height: 70vh;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	max-width: 100%;
	max-height: 100%;
	overflow: hidden;
	text-align: center;
	padding: 20px;
	max-width: 500px;
}

.navbar-custom {
	display: flex;
	padding: 18px 0px;
}

.navbar-custom .logo {
	line-height: 54px;
}

.navbar-custom .logo img {
	height: 44px;
}


.elipsis {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.title-section {
	font-family: Inter;
	font-size: 18px;
	color: #fff;
}

.card-license {
	background: #181C1F;
	border-radius: 18px;
	padding: 16px;
}

.card-license p {
	padding-top: 8px;
	margin: 0;
}

.card-license h5 {
	font-family: Inter;
	font-size: 14px;
	text-transform: uppercase;
	color: rgba(105, 113, 118, 0.5);
	letter-spacing: 2px;
	margin-bottom: 16px;
}

.card-license h5 span {
	float: right;
	font-size: 14px;
	color: #FFFFFF;
	letter-spacing: 0;
	text-transform: initial;
}

.machine {
	margin-bottom: 20px;
}

.btn-windows {
	margin-bottom: 12px;
}

.icon-machine {
	padding-right: 12px;
}

.card-license .license {
	font-family: Inter;
	font-size: 14px;
	color: #FFFFFF;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	width: 100%;
	display: block;
	margin-bottom: 12px;
}

.card-license .form-control {
	margin-right: 12px;
}

.button {
	outline: none;
	border: none;
}

#licenseRow {
	margin-bottom: 12px;
	padding: 0 15px;
}

#license_key {
	width: calc(100% - 40px - 5px);
	margin: 0;
}

#copyKey {
	width: 40px;
	border-radius: 8px;
	margin-left: 5px;
	background-color: rgb(34, 39, 42);
}

#qtButton {
	border-radius: 50px;
}

.btn-red {
	background: #FE5656;
	border-radius: 17px;
	padding: 6px 8px;
	color: #fff;
	transition: background 0.15s ease;
}

.btn-red:hover {
	background: rgba(254, 86, 86, 0.75);
}

.btn-red:disabled {
	background: rgba(254, 86, 86, 0.3);
	cursor: not-allowed !important;
	color: #8d8d8d;
}

.btn-red:disabled img {
	opacity: 40%;
}

.dot-status {
	position: relative;
	display: inline-block;
	top: -3px;
	margin-right: 8px;
	width: 6px;
	height: 6px;
	background: #fff;
	border-radius: 3px;
}



.table-analytics {
	background-image: url(../images/bg-analytics.png);
	background-size: cover;
	background-position: left;
	border-radius: 18px;
	height: 600px;
	padding: 24px;
}

.table .thead-dark th {
	font-size: 16px;
	color: #FE5656 !important;
	background: transparent !important;
}

.table tbody {
	height: 480px;
	overflow: hidden;
	overflow-y: scroll;
	display: block;
}

.img-table {
	width: 36px;
	height: 36px;
	margin-right: 12px;
}



.table-responsive-stack tr {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
}


.table-responsive-stack td,
.table-responsive-stack th {
	display: block;

	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
}

.table-responsive-stack .table-responsive-stack-thead {
	font-weight: bold;
}

.table,
.table th,
.table tr,
.table td,
.table-bordered td,
.table-bordered th {
	border: 0 !important;
	font-size: 14px;
	color: #FFFFFF;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.table-striped tbody tr:nth-of-type(odd) {
	border-radius: 6px;
	/* margin-bottom: 6px; */
}

.table tr {
	line-height: 35px;
}

.table tr td {
	padding-top: 0;
	padding-bottom: 5px;
}

@media screen and (max-width: 768px) {
	.table-responsive-stack tr {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		border-bottom: 3px solid #ccc;
		display: block;

	}

	/*  IE9 FIX   */
	.table-responsive-stack td {
		float: left\9;
		width: 100%;
	}
}


#footer {
	padding: 20px 0px;
	position: absolute;
	bottom: 0;
	width: -webkit-fill-available;
}

#footer p {
	margin: 0;
	padding: 0;
	font-size: 12px;
	color: #FFFFFF;
	letter-spacing: 0;
	text-align: center;
	color: rgba(255, 255, 255, 0.5);
}


/* Sweet Alert */



.swal-overlay--show-modal .swal-modal {
	will-change: unset !important;
}


.swal-modal {
	background-color: #171e20;
	border-radius: 18px;
	width: 410px;
}

.swal-modal,
.swal-text,
.swal-title {
	text-align: center;
	color: white;
	font-family: Inter;
	font-weight: 800;
}

:root {
	--purchase-form-secondary: rgba(255, 255, 255, 0.75);
	--purchase-form-active: rgb(7, 144, 255);
}


.purchase-form>* {
	box-sizing: border-box;
	text-align: left;
}

.purchase-form {
	margin: auto;
	display: block;
	width: 350px;
	padding: 10px;
	background: #171e20;
}

.purchase-form__header {
	margin-bottom: 30px;
	padding: 0px 10px;
}

.purchase-form__header h1 {
	margin: 0;
	font-size: 28px;
}

.purchase-form__header h2 {
	margin: 6px 0px 0px 0px;
	font-size: 16px;
	font-weight: normal;
	color: var(--purchase-form-secondary);
}

.purchase-form label {
	position: relative;
	display: flex;
	align-items: flex-start;
	overflow: hidden;
	padding: 14px 24px 14px 16px;
	border-radius: 18px;
	border: 2px solid rgba(255, 255, 255, 0.5);
	transition: all 200ms;
	margin-bottom: 30px;
}

.purchase-form .star,
.purchase-form .star-bg {
	position: absolute;
	top: 0;
	right: 0;
}

.purchase-form .star {
	color: white;
	top: 2px;
	right: 6px;
}

.purchase-form .star-bg {
	width: 100%;
	height: 100%;
	background: var(--purchase-form-active);
	position: absolute;
	top: 0;
	right: -64%;
	transform-origin: 50% 50%;
	transform: rotate(45deg);
}

.purchase-form label:has(input[type="radio"]:checked) {
	border: 2px solid var(--purchase-form-active);
	background: rgba(255, 255, 255, 0.05);
}

.purchase-form label:has(input[type="radio"]:checked) .star-bg {
	background: var(--purchase-form-active);
}

.purchase-form label:hover {
	cursor: pointer;
}

.purchase-form label input {
	margin-top: 5px;
	margin-right: 10px;
	border: 0;
}

.plan-info {
	display: flex;
	flex-direction: column;
}

.plan-info__name {
	font-weight: bold;
	margin-bottom: 4px;
}

.plan-info__desc {
	color: var(--purchase-form-secondary);
	font-size: 12px;
}

.plan-price {
	margin-left: auto;
}

.plan-price__prefix {
	color: var(--purchase-form-secondary);
	margin-right: -2px;
}

.plan-price__number {
	font-size: 20px;
	font-weight: bold;
}

.plan-price__suffix {
	color: var(--purchase-form-secondary);
	font-size: 12px;
}

.purchase-form input[type="submit"] {
	appearance: none;
	display: block;
	text-align: center;
	width: 100%;
	border: 0;
	color: white;
	font-weight: bold;
	padding: 15px;
	border-radius: 18px;
	background: #FE5656;
}

.purchase-form input[type="submit"]:hover {
	cursor: pointer;
}

.purchase-form input[type="submit"]:active {
	transform: translateY(1px);
}