:root {
	/* ORI */

	--theme-color: #5b73e8;
	--theme-second-color: #4d62c5;
	/* --main-color: rgb(25, 97, 100); */

	/* --theme-color: #196164; */
	/* --theme-second-color: #19352d; */
	/* --main-color: rgb(25, 97, 100); */
}

/* Custom */
.authentication-bg {
	/* background-color: #ebf3ee; */
}

.text-theme {
	color: var(--theme-color);
}

a.text-theme:hover {
	color: var(--theme-second-color);
}

.bg-theme {
	background-color: var(--theme-color);
	border-color: var(--theme-color);
}

.btn-theme {
	color: #fff;
	background-color: var(--theme-color);
	border-color: var(--theme-color);
}

.btn-theme:hover {
	color: #fff;
	background-color: var(--theme-second-color);
	border-color: var(--theme-second-color);
}

.btn-check:focus + .btn-theme,
.btn-theme:focus {
	color: #fff;
	background-color: var(--theme-second-color);
	border-color: var(--theme-second-color);
	-webkit-box-shadow: 0 0 0 0.15rem rgba(82, 204, 160, 0.5);
	box-shadow: 0 0 0 0.15rem rgba(82, 204, 160, 0.5);
}

.btn-check:checked + .btn-theme,
.btn-check:active + .btn-theme,
.btn-theme:active,
.btn-theme.active,
.show > .btn-theme.dropdown-toggle {
	color: #fff;
	background-color: var(--theme-second-color);
	border-color: var(--theme-second-color);
}

.btn-check:checked + .btn-theme:focus,
.btn-check:active + .btn-theme:focus,
.btn-theme:active:focus,
.btn-theme.active:focus,
.show > .btn-theme.dropdown-toggle:focus {
	-webkit-box-shadow: 0 0 0 0.15rem rgba(82, 204, 160, 0.5);
	box-shadow: 0 0 0 0.15rem rgba(82, 204, 160, 0.5);
}

.btn-theme:disabled,
.btn-theme.disabled {
	color: #fff;
	background-color: var(--theme-color);
	border-color: var(--theme-color);
}
.mm-active {
	color: var(--theme-color) !important;
}

.mm-active > i {
	color: var(--theme-color) !important;
}

.mm-active .active {
	color: var(--theme-color) !important;
}

.mm-active > a {
	color: var(--theme-color) !important;
}

.mm-active .active i {
	color: var(--theme-color) !important;
}

.mm-active > a > i {
	color: var(--theme-color) !important;
}

.nav-tabs-custom .nav-item .nav-link.active {
	color: var(--theme-color);
}

.nav-tabs-custom .nav-item .nav-link::after {
	background: var(--theme-color);
}

.nav-link:focus,
.nav-link:hover {
	color: var(--theme-color);
}

.mfp-bg {
	z-index: 1060;
}

.mfp-wrap {
	z-index: 1061;
}

#pdfPreview {
	width: 100%;
	max-width: 100%;
	height: 100%;
	margin-top: 20px;
}

/* Login */
.login-page {
	position: relative;
	width: 100%;
	height: 100vh;
}

@media screen and (max-width: 768px) {
	.login-content {
		justify-content: center;
	}

	.login-content .right {
		display: none;
	}
}

/* Utilities */
.flex-menu {
	display: flex !important;
	align-items: start;
	justify-content: space-between;
	gap: 0.25rem;
}

.flex-menu span {
	width: 100%;
}

.mw-150 {
	min-width: 150px;
}

.w-80 {
	width: 80% !important;
}

.w-70 {
	width: 70% !important;
}

.w-15px {
	width: 15px !important;
}

.w-70px {
	width: 70px !important;
}

.w-100px {
	width: 100px !important;
}

.w-120px {
	width: 120px !important;
}

.w-150px {
	width: 150px !important;
}

.w-30 {
	width: 30% !important;
}

.w-20 {
	width: 20% !important;
}

.ms-2px {
	margin-left: 2px !important;
}

.p-35 {
	padding: 1.25rem;
}

.shadow-theme {
	box-shadow: 0 0 5px #196164;
}

.shadow-danger {
	box-shadow: 0 0 4px #f46a6a;
}

.shadow-success {
	box-shadow: 0 0 4px #34c38f;
}

.shadow-warning {
	box-shadow: 0 0 4px #f1b44c;
}

.shadow-info {
	box-shadow: 0 0 4px #50a5f1;
}

.shadow-primary {
	box-shadow: 0 0 10px 2px rgba(91, 115, 232, 0.5) !important;
}

.c-pointer {
	cursor: pointer;
}

.text-underline {
	text-decoration: underline !important;
}

.rounded-end-0 {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.rounded-start-0 {
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}

.rounded-end-25 {
	border-top-right-radius: 0.25rem;
	border-bottom-right-radius: 0.25rem;
}

.text-italic {
	font-style: italic;
}

.btn-wicon {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.text-wicon {
	display: flex;
	align-items: center;
	gap: 0.2rem;
}

.hidden {
	display: none;
}

.cust-textarea {
	resize: none;
	overflow-y: hidden;
}

.fs-7 {
	font-size: 0.75rem;
}

/* Custom Tabs Accordion */
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
	background-color: #f5f6f8;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
	color: #fff;
	background-color: var(--theme-color);
}

.nav-pills .nav-link-bg {
	background-color: #f5f6f8;
}

/* Disabled */
input[type="text"]:disabled,
input[type="text"]:read-only,
input[type="number"]:disabled,
input[type="number"]:read-only,
input[type="checkbox"]:disabled,
select:disabled,
textarea:disabled,
textarea:read-only,
button:disabled,
.select2-container--disabled .select2-selection--single {
	cursor: not-allowed !important;
}

.form-check.check-disabled {
	cursor: not-allowed !important;
}

/* Input Group */
.input-group > .input-group-prepend > span#forSelect {
	height: 38px !important;
	border-right: 2px solid #ced4da !important;
}

.input-group > .select2 > .selection > .select2-selection {
	border-left: 0 !important;
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}

/* Select2 */
select.w-100 + .select2-container {
	width: 100% !important;
}

select.is-invalid ~ .select2-container .select2-selection {
	border: 1px solid #f46a6a;
	padding-right: calc(1.5em + 0.94rem);
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23f46a6a'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23f46a6a' stroke='none'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right calc(1.775em + 0.235rem) center;
	background-size: calc(0.75em + 0.47rem) calc(0.75em + 0.47rem);
	-webkit-box-shadow: 0 0 0 0.15rem rgba(244, 106, 106, 0.25);
	box-shadow: 0 0 0 0.15rem rgba(244, 106, 106, 0.25);
}

.select2-container--default.select2-container--disabled
	.select2-selection--single {
	background-color: #f5f6f8;
}

.select2-container--open {
	z-index: 9999;
}

/* SweetAlerts */
.swal2-popup-loader {
	width: 150px;
}

/* Datatables */
table.dataTable.table-toggle {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.table-datas {
	border-collapse: collapse !important;
	border-spacing: 0 !important;
	max-width: 100% !important;
	min-width: max-content !important;
}

.tbl-header {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin-bottom: 0.5em;
}

.tbl-footer {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.table-responsive::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

/* Track */
.table-responsive::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 50px;
}

/* Handle */
.table-responsive::-webkit-scrollbar-thumb {
	border-radius: 50px;
	background: #ced4da;
}

/* Handle on hover */
.table-responsive::-webkit-scrollbar-thumb:hover {
	background: #adb5bd;
}

table.dataTable td.dataTables_empty:has(table),
table.dataTable th.dataTables_empty:has(table) {
	text-align: center !important;
	padding: 0 !important;
}

.table-striped > tbody > tr.row_selected:nth-of-type(odd) > * {
	--bs-table-accent-bg: #5b72e875;
	background-color: #5b72e875;
	border-color: #5b72e875;
	color: #fff;
}

.table-striped > tbody > tr.row_selected:nth-of-type(even) > * {
	--bs-table-accent-bg: #5b72e875;
	background-color: #5b72e875;
	border-color: #5b72e875;
	color: #fff;
}

.table-hover > tbody > tr:hover > * {
	cursor: pointer;
	opacity: 0.9;
	--bs-table-accent-bg: #5b72e875;
	background-color: #5b72e875;
	border-color: #5b72e875;
	color: #fff;
}

@media (min-width: 1200px) {
	.chat-leftsidebar {
		min-width: 380px !important;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	.chat-leftsidebar {
		min-width: 280px !important;
	}
}

@media (min-width: 1200px) {
	.filemanager-sidebar {
		min-width: 270px !important;
		max-width: 270px !important;
	}
}

@media (min-width: 769px) {
	.vertical-collpsed {
		min-height: 0;
	}
}

.img-responsive {
	background-size: cover !important;
	object-fit: cover;
	object-position: center;
}

/* .avatar-tbl {
	height: 2.8rem;
	width: 4.8rem;
} */

.activity-feed .feed-item-success:after {
	content: "";
	display: block;
	position: absolute;
	top: 4px;
	right: -6px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: 2px solid #34c38f;
	background-color: #fff;
}

.activity-feed .feed-item-danger:after {
	content: "";
	display: block;
	position: absolute;
	top: 4px;
	right: -6px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: 2px solid #f46a6a;
	background-color: #fff;
}

.activity-feed .feed-item:last-child {
	padding-bottom: 0;
}

/* NAVBAR BRAND BOX */
.navbar-brand-box {
	/* padding: 0 2.5rem 0 1.5rem; */
}

.vertical-collpsed .navbar-brand-box {
	padding: 0.1rem;
	width: auto;
}

.logo {
	line-height: 1 !important;
	padding: 10px 0 0 0 !important;
}

.logo-lg {
	display: flex;
	align-items: center !important;
}

/* CSS Switch */
/* Base switch styles */
input[switch] {
	display: none;
}

input[switch] + label {
	font-size: 1em;
	line-height: 1;
	background-color: #ced4da;
	background-image: none;
	border-radius: 2rem;
	padding: 0.16667rem 0.5rem; /* Tambahkan padding untuk ruang di sekitar teks */
	cursor: pointer;
	display: inline-flex; /* Ubah menjadi inline-flex untuk fleksibilitas */
	align-items: center;
	text-align: center;
	position: relative;
	font-weight: 500;
	/* transition: all .1s ease-in-out; */
	width: auto; /* Biarkan lebar mengikuti teks */
}

input[switch] + label:before {
	color: #343a40;
	content: attr(data-off-label);
	display: block;
	font-family: inherit;
	font-weight: 500;
	font-size: 12px;
	line-height: 21px;
	top: 0;
	left: 10px;
	position: relative; /* Ubah menjadi relative untuk fleksibilitas */
	margin: 0 0.5rem; /* Spasi di antara teks */
	text-align: center;
	/* transition: all .1s ease-in-out; */
}

input[switch] + label:after {
	/* display: none; */
	content: "";
	position: absolute;
	background-color: #f5f6f8;
	box-shadow: none;
	border-radius: 2rem;
	height: 20px;
	width: 20px;
	top: 2px;
	right: 0;
	left: 3px;
	/* transition: all .1s ease-in-out; */
}

input[switch]:checked + label {
	background-color: #5b73e8;
}

input[switch]:checked + label:before {
	left: -10px;
	color: #f8f9fa;
	content: attr(data-on-label);
}

input[switch]:checked + label:after {
	right: 3px;
	left: auto;
}

/* Custom styling for "bool" switch */
input[switch="bool"] + label {
	background-color: #f46a6a;
}

input[switch="bool"]:checked + label {
	background-color: #34c38f;
}

input[switch="bool"] + label:before,
input[switch="bool"]:checked + label:before {
	color: #fff;
}

.square-switch {
	margin-left: 7px;
}

.square-switch input[switch] + label,
.square-switch input[switch] + label:after {
	border-radius: 100px;
}

#statusSpinner {
	margin: -20px 0 0 -50px;
}

.dataTablePagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
	gap: 0.5rem;
}

.dataTablePagination div.dataTables_info {
	padding-top: 0 !important;
}

/* 374.99px */

@media (max-width: 441px) {
	.dataTablePagination {
		justify-content: center;
	}
	ul.pagination a.page-link {
		padding: 0.275rem 0.65rem;
	}
}

@media (max-width: 374.99px) {
	.dataTablePagination {
		justify-content: center;
	}
	ul.pagination a.page-link {
		padding: 0.175rem 0.55rem;
	}
}
