/* Icon */
.icon_svg {
	width: 24px;
	height: 24px;
}

.rix {
	vertical-align: middle !important;
}

.loadertable {
	margin: auto;
	background: rgb(255, 255, 255);
	display: block;
	shape-rendering: auto;
}

.z-index-1 {
	z-index: -1;
}

.dot-active a.nav-link.active:before,
.dot-active .nav-link:hover:before {
	border-radius: 50%;
	content: '';
	width: 10px;
	height: 10px;
	transform: scale(0.4);
	position: absolute;
	background: var(--bs-blue);
	bottom: -10px;
	margin: auto;
	right: 0;
	left: 0;
}

.dot-active .nav-item {
	position: relative;
}

/* Actions btn */
.bg-lihat:hover {
	background-color: #ccffb3 !important;
	color: #307b08 !important;
}

.bg-update:hover {
	background-color: #d7f5fc !important;
	color: #03c3ec !important;
}

.bg-delete:hover {
	background-color: #ffc9c9 !important;
	color: #910808 !important;
}

.action_menu.show {
	color: #24a8ff;
	transform: rotate(90deg);
}

/* ToolTip */
.tooltip .tooltip-inner {
	background-color: #595959 !important;
	opacity: 1 !important;
	backdrop-filter: blur(12px);
}

.tooltip.bs-tooltip-end .tooltip-arrow::before {
	border-right-color: #595959 !important;
}

.tooltip.bs-tooltip-start .tooltip-arrow::before {
	border-left-color: #595959 !important;
}

.tooltip.bs-tooltip-bottom .tooltip-arrow::before {
	border-bottom-color: #595959 !important;
}

.tooltip.bs-tooltip-top .tooltip-arrow::before {
	border-top-color: #595959 !important;
}

input[type="datetime-local"]::-webkit-calendar-picker-indicator {
	color: #697a8d;
	opacity: 1;
	display: block;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23697a8d' viewBox='0 0 24 24'%3E%3Cpath d='M17 3h4a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h4V1h2v2h6V1h2v2zm-2 2H9v2H7V5H4v4h16V5h-3v2h-2V5zm5 6H4v8h16v-8z'/%3E%3C/svg%3E") no-repeat;
	width: 14px;
	height: 14px;
	border-width: thin;
}

/* table */
table.dataTable>tbody>tr.child ul.dtr-details>li {
	padding: 10px 20px !important;
}

/* btn edit */
.btn_edit {
	cursor: pointer;
}

.cursor-pointer {
	cursor: pointer;
}

.show_pass {
	cursor: pointer;
}

/* animasi */
.spin_animasi {
	animation-name: spin_animasi;
	animation-duration: 3000ms;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

@keyframes spin_animasi {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

.bg-editor {
	background: #fafafa !important;
	resize: none !important;
}

/* keterangan */
#keterangan {
	display: flex;
}

#keterangan span:last-child {
	margin-right: 0;
}

#keterangan span {
	margin-right: 15px;
}

#keterangan .menipis:before {
	width: 16px;
	background: #ff9800;
	border-radius: 5px;
	height: 10px;
	content: "";
	display: inline-block;
	margin-right: 10px;
}

#keterangan .habis:before {
	width: 16px;
	background: #e91e44;
	border-radius: 5px;
	height: 10px;
	content: "";
	display: inline-block;
	margin-right: 10px;
}

.row_menipis:hover {
	--bs-table-hover-bg: rgb(255 152 0 / 11%);
	--bs-table-hover-color: #ff9800;
}

.row_menipis {
	--bs-table-striped-bg: transparent;
	--bs-table-striped-color: #e98d05;
	background: rgb(255 152 0 / 11%);
	color: #e98d05;
	font-weight: 500;
}

.row_habis:hover {
	--bs-table-hover-bg: rgb(232 33 70 / 5%);
}

.row_habis {
	--bs-table-striped-bg: transparent;
	background: rgb(233 32 69 / 12%);
	--bs-table-striped-color: #e91e44;
	--bs-table-hover-color: #e81e27;
	font-weight: 500;
	color: #e91e44;
}

.box-garis-hijau:before {
	content: "";
	display: block;
	background: #9de875;
	position: absolute;
	top: 0;
	left: 0;
	width: 5px;
	height: calc(100% - 50px);
	margin: 25px 0;
	border-radius: 0 3px 3px 0;
}

.box-garis-merah:before {
	content: "";
	display: block;
	background: #fa6363;
	position: absolute;
	top: 0;
	left: 0;
	width: 5px;
	height: calc(100% - 50px);
	margin: 25px 0;
	border-radius: 0 3px 3px 0;
}

.box-garis-cyan:before {
	content: "";
	display: block;
	background: #03c3ec;
	position: absolute;
	top: 0;
	left: 0;
	width: 5px;
	height: calc(100% - 50px);
	margin: 25px 0;
	border-radius: 0 3px 3px 0;
}

.box-garis-ungu:before {
	content: "";
	display: block;
	background: #8503ec;
	position: absolute;
	top: 0;
	left: 0;
	width: 5px;
	height: calc(100% - 50px);
	margin: 25px 0;
	border-radius: 0 3px 3px 0;
}


/* placeholder drag */

.sort-highlight {
	background: #fafafa;
	margin-bottom: 24px;
	border-radius: 0.5rem;
	box-shadow: inset 0px 0px 0px 1px #e6e6e6;
}

.drag_btn {
	cursor: move !important;
}

#GrafikMasukKeluar {
	min-height: 315px;
}

.btn_login {
	color: #fff !important;
	background-color: #09a98e !important;
	border-color: #08a88d !important;
}

/* Kalender */
.dhx_cal_ltext.my_editor {
	position: relative;
	top: -2px;
}

.dhx_cal_ltext.my_editor {
	line-height: 40px;
}

.dhx_cal_ltext.my_editor input {
	width: 271px;
	padding-left: 8px;
	box-sizing: border-box;
	height: 33px;
	text-overflow: ellipsis;
}

.dhx_cal_ltext.my_editor input:first-child {
	margin: 0 0 0 20px;
	border-bottom: 0;
}

.ctrl {
	-webkit-box-flex: 0;
	-webkit-flex: 0 0 auto;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	border: 1px solid #D5DCE6;
	background-color: #fff;
	border-radius: 5px;
	font-size: 16px;
	width: 105px;
}

.ctrl__counter {
	position: relative;
	width: 45px;
	height: 35px;
	color: #333C48;
	text-align: center;
	overflow: hidden;
}

.ctrl__counter.is-input .ctrl__counter-num {
	opacity: 0;
	-webkit-transition: opacity 100ms ease-in;
	transition: opacity 100ms ease-in;
}

.ctrl__counter.is-input .ctrl__counter-input {
	opacity: 1;
	-webkit-transition: opacity 100ms ease-in;
	transition: opacity 100ms ease-in;
}

.ctrl__counter-input {
	width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	z-index: 2;
	box-shadow: none;
	outline: none;
	border: none;
	color: #333C48;
	font-size: 16px;
	line-height: 35px;
	text-align: center;
	opacity: 0;
	-webkit-transition: opacity 100ms ease-in;
	transition: opacity 100ms ease-in;
}

.ctrl__counter-num {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	line-height: 35px;
	opacity: 1;
	-webkit-transition: opacity 100ms ease-in;
	transition: opacity 100ms ease-in;
}

.ctrl__counter-num.is-increment-hide {
	opacity: 0;
	-webkit-transform: translateY(-50px);
	transform: translateY(-50px);
	-webkit-animation: increment-prev 100ms ease-in;
	animation: increment-prev 100ms ease-in;
}

.ctrl__counter-num.is-increment-visible {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	-webkit-animation: increment-next 100ms ease-out;
	animation: increment-next 100ms ease-out;
}

.ctrl__counter-num.is-decrement-hide {
	opacity: 0;
	-webkit-transform: translateY(50px);
	transform: translateY(50px);
	-webkit-animation: decrement-prev 100ms ease-in;
	animation: decrement-prev 100ms ease-in;
}

.ctrl__counter-num.is-decrement-visible {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	-webkit-animation: decrement-next 100ms ease-out;
	animation: decrement-next 100ms ease-out;
}

.ctrl__button {
	width: 35px;
	line-height: 35px;
	text-align: center;
	color: #0e5fa4;
	font-size: 28px;
	cursor: pointer;
	-webkit-transition: background-color 100ms ease-in;
	transition: background-color 100ms ease-in;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.ctrl__button:hover {
	background-color: rgb(14 95 164 / 9%);
	-webkit-transition: background-color 100ms ease-in;
	transition: background-color 100ms ease-in;
}

.ctrl__button:active {
	background-color: #bddaf2;
	-webkit-transition: background-color 100ms ease-in;
	transition: background-color 100ms ease-in;
}

.ctrl__button--decrement {
	border-radius: 5px 0 0 5px;
}

.ctrl__button--increment {
	border-radius: 0 5px 5px 0;
}

.subtotal_modal {
	background: rgb(255 235 59 / 24%) !important;
	color: #e18a09;
	font-weight: 500;
	min-width: 110px;
}

.table-hover>tbody>tr:hover>td.subtotal_modal {
	color: #e18a09;
}

.modal .modal-fullscreen-xxl-down .modal-header .btn-close {
	margin: 5px !important;
}

.grand-border {
	border-bottom: 2px dotted #dcdcdc;
}

.bg-regis {
	background: #f5f5f5 !important;
}

.bg-putih-transparan {
	background-color: rgba(255, 255, 255, 0.5) !important;
}

.indexselect {
	z-index: 1500 !important;
}

.icon_pembayaran {
	width: 90px;
}

.select2-dropdown {
	z-index: 2000 !important;
}

.border-grand {
	border-top: 2px solid !important;
}

.fw-500 {
	font-weight: 500 !important;
}

.ui-autocomplete {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 100000;
	display: none;
	float: left;
	min-width: 160px;
	padding: 5px 0;
	margin: 2px 0 0;
	list-style: none;
	font-size: 14px;
	text-align: left;
	background-color: #ffffff;
	border: 1px solid #cccccc;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 4px;
	-webkit-box-shadow: 4px 6px 12px rgb(0 0 0 / 7%);
	box-shadow: 4px 6px 12px rgb(0 0 0 / 7%);
	background-clip: padding-box;
}

.ui-autocomplete>li>div {
	display: block;
	padding: 10px 20px;
	clear: both;
	font-weight: normal;
	line-height: 1.42857143;
	color: #333333;
	white-space: nowrap;
}

.ui-state-hover,
.ui-state-active,
.ui-state-focus {
	text-decoration: none;
	color: #262626;
	background-color: #f5f5f5;
	cursor: pointer;
}

.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

@-webkit-keyframes decrement-prev {
	from {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes decrement-prev {
	from {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@-webkit-keyframes decrement-next {
	from {
		opacity: 0;
		-webkit-transform: translateY(-50px);
		transform: translateY(-50px);
	}
}

@keyframes decrement-next {
	from {
		opacity: 0;
		-webkit-transform: translateY(-50px);
		transform: translateY(-50px);
	}
}

@-webkit-keyframes increment-prev {
	from {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@keyframes increment-prev {
	from {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

@-webkit-keyframes increment-next {
	from {
		opacity: 0;
		-webkit-transform: translateY(50px);
		transform: translateY(50px);
	}
}

@keyframes increment-next {
	from {
		opacity: 0;
		-webkit-transform: translateY(50px);
		transform: translateY(50px);
	}
}

.bg-main {
	background: url('../../images/lain/bg_main.jpg');
	background-size: cover;
	background-position: top;
}

.bg-polos {
	background: #fdede0;
	background-size: cover;
	background-position: top;
}

.font-script {
	font-family: "Rough Anthem";
}

.index-foto-prewed {
	z-index: 2;
}

.mask-prewed {
	-webkit-mask-image: url('../../images/lain/mask.png');
	mask-image: url('../../images/lain/mask.png');
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
}

.warna-mempelai {
	color: #de4848;
}

.btn-nikah {
	color: #fff !important;
	background-color: #f9877f !important;
	border-color: #f9877f !important;
	box-shadow: 0 0.125rem 0.25rem 0 rgb(249 135 127 / 31%) !important;
}

.font-chill {
	font-family: "Chilcilla";
}