/* 4. Theme Style */
/* 4.1 Misc */
/* Inter */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Niconne&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap");

:root {
	/* Colors */
	--primary: #433abd;
	--secondary: #9a72b8;
	--accent: #636829;
	--background: #fafafa;
	--surface: #f1f1f4;
	--success: #2eb82e;
	--info: #269dd9;
	--warning: #eebd2b;
	--danger: #d92626;
}

body {
	background-color: var(--surface);
	font-size: 14px;
	font-weight: 400;
	font-family: "Inter", "Segoe UI", arial;
	color: #6c757d;
}

a {
	color: var(--primary);
}

.module-card {
	height: 150px;
	color: #fdfdff;
	background-color: var(--primary);
}

.module-card:hover {
	background-color: var(--secondary);
}

.module-link:hover {
	text-decoration: none;
}

.bg-primary {
	background-color: var(--primary) !important;
}

.bg-secondary {
	background-color: var(--secondary) !important;
}

.bg-success {
	background-color: var(--success) !important;
}

.bg-info {
	background-color: var(--info) !important;
}

.bg-warning {
	background-color: var(--warning) !important;
}

.bg-danger {
	background-color: var(--danger) !important;
}

.text-primary,
.text-primary-all *,
.text-primary-all *:before,
.text-primary-all *:after {
	color: var(--primary) !important;
}

.text-secondary,
.text-secondary-all *,
.text-secondary-all *:before,
.text-secondary-all *:after {
	color: var(--secondary) !important;
}

.text-success,
.text-success-all *,
.text-success-all *:before,
.text-success-all *:after {
	color: var(--success) !important;
}

.text-info,
.text-info-all *,
.text-info-all *:before,
.text-info-all *:after {
	color: var(--info) !important;
}

.text-warning,
.text-warning-all *,
.text-warning-all *:before,
.text-warning-all *:after {
	color: var(--warning) !important;
}

.text-danger,
.text-danger-all *,
.text-danger-all *:before,
.text-danger-all *:after {
	color: var(--danger) !important;
}

/* 3.2 Form */
.custom-radio .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-input:checked ~ .custom-control-label::before {
	background-color: var(--primary) !important;
}

.custom-file-input:focus + .custom-file-label {
	box-shadow: none;
	border-color: var(--primary);
}

/* 3.3 List */
.list-group-item.active {
	background-color: var(--primary);
}
.list-group-item.disabled {
	color: #c9d7e0;
}

.list-group-item-primary {
	background-color: var(--primary);
	color: #fff;
}

.list-group-item-secondary {
	background-color: var(--secondary);
	color: #fff;
}

.list-group-item-success {
	background-color: var(--success);
	color: #fff;
}

.list-group-item-danger {
	background-color: var(--danger);
	color: #fff;
}

.list-group-item-warning {
	background-color: var(--warning);
	color: #fff;
}

.list-group-item-info {
	background-color: var(--info);
	color: #fff;
}

/* 3.4 Alert */
.alert.alert-primary {
	background-color: var(--primary);
}
.alert.alert-secondary {
	background-color: var(--secondary);
}
.alert.alert-success {
	background-color: var(--success);
}
.alert.alert-info {
	background-color: var(--info);
}
.alert.alert-warning {
	background-color: var(--warning);
}
.alert.alert-danger {
	background-color: var(--danger);
}

/* 3.5 Card */
.card .card-header h4 + .card-header-action .btn.active,
.card .card-header h4 + .card-header-form .btn.active {
	box-shadow: 0 2px 6px #acb5f6;
	background-color: var(--primary);
	color: #fff;
}

.card.card-primary {
	border-top: 2px solid var(--primary);
}
.card.card-secondary {
	border-top: 2px solid var(--secondary);
}
.card.card-success {
	border-top: 2px solid var(--success);
}
.card.card-danger {
	border-top: 2px solid var(--danger);
}
.card.card-warning {
	border-top: 2px solid var(--warning);
}
.card.card-info {
	border-top: 2px solid var(--info);
}

.card.card-hero .card-header {
	background-image: linear-gradient(to bottom, var(--primary), #95a0f4);
	color: #fff;
}

/* 3.9 Nav */
.nav-tabs .nav-item .nav-link {
	color: var(--primary);
}

.nav-tabs .nav-item .nav-link.active {
	color: #000;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
	color: #fff;
	background-color: var(--primary);
}
.nav-pills .nav-item .nav-link {
	color: var(--primary);
}
.nav-pills .nav-item .nav-link:hover {
	background-color: #f6f7fe;
}
.nav-pills .nav-item .nav-link.active {
	box-shadow: 0 2px 6px #acb5f6;
	color: #fff;
	background-color: var(--primary);
}

/* 3.10 Pagination */
.page-item .page-link {
	color: var(--primary);
}
.page-item.active .page-link {
	background-color: var(--primary);
	border-color: var(--primary);
}
.page-item.disabled .page-link {
	border-color: transparent;
	background-color: #f9fafe;
	color: var(--primary);
	opacity: 0.6;
}

.page-link {
	border-color: transparent;
	background-color: #f9fafe;
}

.page-link:hover {
	background-color: var(--primary);
	color: #fff;
	border-color: transparent;
}

.page-link:focus {
	box-shadow: none;
}

/* 3.11 Badge */
.badge.badge-warning {
	color: #fff;
	background-color: var(--warning);
	font-size: 10px;
}
.badge.badge-primary {
	background-color: var(--primary);
	font-size: 10px;
}
.badge.badge-secondary {
	background-color: var(--secondary);
	font-size: 10px;
}
.badge.badge-success {
	background-color: var(--success);
	font-size: 10px;
}
.badge.badge-info {
	background-color: var(--info);
	font-size: 10px;
}
.badge.badge-danger {
	background-color: var(--danger);
	font-size: 10px;
}

.badge.badge-dark, .badge.badge-secondary {
	font-size: 10px;
}

/* 3.12 Button */
.btn-success,
.btn-success.disabled {
	box-shadow: 0 2px 6px #a8f5b4;
	background-color: var(--success);
	border-color: var(--success);
	color: #fff;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.disabled:hover,
.btn-success.disabled:focus,
.btn-success.disabled:active {
	background-color: #4cea67 !important;
	color: #fff !important;
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active,
.btn-outline-success.disabled:hover,
.btn-outline-success.disabled:focus,
.btn-outline-success.disabled:active {
	background-color: #63ed7a !important;
	color: #fff !important;
}

.btn-danger,
.btn-danger.disabled {
	box-shadow: 0 2px 6px #fd9b96;
	background-color: var(--danger);
	border-color: var(--danger);
	color: #fff;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.disabled:hover,
.btn-danger.disabled:focus,
.btn-danger.disabled:active {
	background-color: #fb160a !important;
}

.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger:active,
.btn-outline-danger.disabled:hover,
.btn-outline-danger.disabled:focus,
.btn-outline-danger.disabled:active {
	background-color: #fb160a !important;
	color: #fff !important;
}

.btn-warning,
.btn-warning.disabled {
	box-shadow: 0 2px 6px #ffc473;
	background-color: var(--warning);
	border-color: var(--warning);
	color: #fff;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.disabled:hover,
.btn-warning.disabled:focus,
.btn-warning.disabled:active {
	background-color: #ff990d !important;
	color: #fff !important;
}

.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning:active,
.btn-outline-warning.disabled:hover,
.btn-outline-warning.disabled:focus,
.btn-outline-warning.disabled:active {
	background-color: #ffa426 !important;
	color: #fff !important;
}

.btn-info,
.btn-info.disabled {
	box-shadow: 0 2px 6px #82d3f8;
	background-color: var(--info);
	border-color: var(--info);
	color: #fff;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.disabled:hover,
.btn-info.disabled:focus,
.btn-info.disabled:active {
	background-color: #0da8ee !important;
}

.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info:active,
.btn-outline-info.disabled:hover,
.btn-outline-info.disabled:focus,
.btn-outline-info.disabled:active {
	background-color: #0da8ee !important;
	color: #fff !important;
}

.btn-primary,
.btn-primary.disabled {
	box-shadow: 0 2px 6px #acb5f6;
	background-color: var(--primary);
	border-color: var(--primary);
}
.btn-primary:focus,
.btn-primary.disabled:focus {
	background-color: #394eea !important;
}
.btn-primary:focus:active,
.btn-primary.disabled:focus:active {
	background-color: #394eea !important;
}
.btn-primary:active,
.btn-primary:hover,
.btn-primary.disabled:active,
.btn-primary.disabled:hover {
	background-color: #394eea !important;
}

.btn-outline-primary,
.btn-outline-primary.disabled {
	border-color: #6777ef;
	color: #6777ef;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.disabled:hover,
.btn-outline-primary.disabled:focus,
.btn-outline-primary.disabled:active {
	background-color: #6777ef !important;
	color: #fff;
}

.btn-outline-white,
.btn-outline-white.disabled {
	border-color: #fff;
	color: #fff;
}
.btn-outline-white:hover,
.btn-outline-white:focus,
.btn-outline-white:active,
.btn-outline-white.disabled:hover,
.btn-outline-white.disabled:focus,
.btn-outline-white.disabled:active {
	background-color: #fff;
	color: #6777ef;
}

.btn-group .btn.active {
	background-color: #6777ef;
	color: #fff;
}

/* 3.13 Media */
.media .media-right {
	color: #6777ef;
}

/* 3.18 Navbar */
.navbar.active {
	background-color: var(--primary);
	box-shadow: rgba(103, 119, 239, 0.2) rgba(0, 0, 0, 0.03);
}

.navbar-bg {
	background-color: var(--primary);
}

/* 3.19 Dropdown */
a.dropdown-item:focus,
a.dropdown-item:active,
a.dropdown-item.active {
	background-color: #6777ef;
	color: #fff !important;
}

.dropdown-list .dropdown-item:focus {
	background-color: #6777ef;
}

/* 3.21 Progress Bar */
.progress-bar {
	background-color: #6777ef;
}

/* 4. Theme Style */
/* 4.1 Misc */
a.bb {
	border-bottom: 1px solid #6777ef;
}

.circle-step .circle.circle-primary {
	border-color: #6777ef;
	color: #6777ef;
}

/* 4.2 Section */
.section .section-header .section-header-back .btn:hover {
	background-color: #6777ef;
	color: #fff;
}

.section .section-title:before {
	background-color: #6777ef;
}

/* 4.3 Page */

/* 4.4 Layout */