/*.modal {
z-index: 1100 !important;*/ /* Ensure this value is higher than the dropdown's z-index */
/*}*/

.dropdown-menu {
	z-index: 1000 !important; /* Typical z-index for dropdowns */
}

/* Adjust Select2 dropdown z-index */
.select2-container--open .select2-dropdown {
	z-index: 1051; /* Adjust this to be lower than your modal */
}

/*#components-reconnect-modal {
	display: none !important;
	}
	
	#blazor-error-ui {
	display: none !important;
}*/

div.dataTables_processing, div.dataTables_wrapper div.dataTables_processing {
	background-color: rgba(42, 42, 60, 0.1);
	border-radius: 0.475rem;
	padding-top: 1rem !important;
	color: var(--bs-gray-700);
	font-weight: 600;
	font-size: 15px;
	margin: 1rem !important;
	width: auto;
	padding: 1rem 2rem !important;
	transform: translateX(-50%) translateY(-50%);
	z-index: 9999;
}

div.dataTables_processing > div:last-child > div {
	background: rgba(80, 205, 137, 0.9);
}

.select2-container--bootstrap5 .select2-dropdown {
	background-color: white;
}



#json-container {
	width: 100%;
	margin: 20px auto;
	background-color: #000;
	padding: 20px;
	border-radius: 10px;
}

.copy-button {
	position: absolute;
	top: 10px;
	right: 10px;
	padding: 10px;
	cursor: pointer;
	background-color: #555;
	border: none;
	color: #fff;
	border-radius: 5px;
}

code {
	/*white-space: pre-wrap;*/
	font-family: 'Courier New', monospace;
	font-size: 14px;
	/*color: #00ff00;*/
}

/*.key {
color: #ff0000;*/ /* Red text */
/*}*/

.editorFullScreen {
	z-index: 10000000000000000000;
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

.editorTextFullScreen {
	height: 100% !important;
	width: 100% !important;
}

/*Start Krajee multiple upload*/
.file-footer-caption {
	display: none;
}

.btnHide {
	display: none;
}


/*User Control - image Upload Start*/
.kv-avatar .file-preview-frame, .kv-avatar .file-preview-frame:hover {
	margin: 0;
	padding: 0;
	border: none;
	box-shadow: none;
	text-align: center;
	width: 100%;
}

.kv-avatar .file-input {
	display: table-cell;
	width: 220px;
}

.kv-file-content {
	height: 160px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.kv-file-content img {
	width: auto !important;
	height: auto !important;
	max-height: 120px !important;
    max-width: 180px !important;
}

.kv-file-content embed {
	width: auto !important;
	height: auto !important;
	max-height: 160px !important;
	max-width: 208px;
}
/*User Control - image Upload End*/
/*[ctrl=ctl00_ContentPlaceHolder1_ucForm_UserGuide] .file-actions {
	display: none;
}*/
/*Start Payment Options*/
.grey-color-bg:first-of-type {
	margin-top: 0px;
}

.grey-color-bg {
	background-color: #ededed;
	display: inline-block;
	padding: 5px 0 10px 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	line-height: 20px;
	margin-top: 10px;
}
/*End Payment Options*/

/*QUICK View*/
.mobiledisplay {
	display: none;
}

.webdisplay {
	display: block;
}

@media (max-width: 767px) {
	.mobiledisplay {
		display: block;
	}
	
	.webdisplay {
		display: none;
	}
}

/*.lazy {
    opacity: 0;
    transition: opacity 1s;
}*/

.file-live-thumbs .link {
	display: none;
}

.file-live-thumbs .text-warning {
	display: none;
}

.file-live-thumbs .file-thumbnail-footer {
	height: auto !important;
}

.file-caption-icon, .file-input-ajax-new .fileinput-remove-button, .file-input-ajax-new .fileinput-upload-button, .file-input-ajax-new .no-browse .input-group-btn, .file-input-new .close, .file-input-new .file-preview, .file-input-new .fileinput-remove-button, .file-input-new .fileinput-upload-button, .file-input-new .glyphicon-file, .file-input-new .no-browse .input-group-btn, .file-zoom-dialog .modal-header:after, .file-zoom-dialog .modal-header:before, .hide-content .kv-file-content, .is-locked .fileinput-remove-button, .is-locked .fileinput-upload-button, .kv-hidden {
	display: none;
}

.file-live-thumbs .file-actions {
	margin-top: 59px;
	min-width: 190px;
}

.btn-xs, .btn-group-xs > .btn {
	padding: 5px 5px;
	margin: 2px;
}

/*------------ Edit input-group -------------*/
.input-group span.d-none + input {
	border-top-left-radius: .475rem !important;
	border-bottom-left-radius: .475rem !important;
}

.input-group input:has(+ span.d-none) {
	border-top-right-radius: .475rem !important;
	border-bottom-right-radius: .475rem !important;
}

/*------------ Edit content style -------------*/
.edit-content, .hover-content {
	border: 1px solid transparent;
	border-radius: 1rem;
}

.edit-content:hover, .hover-content:hover {
	background-color: #eee;
}

.edit-content:focus, .hover-content:focus {
	border-color: var(--bs-primary);
	outline: none;
	background-color: #fff;
	padding: 0 5px;
	display: block;
}

.hover-content .edit-content, .edit-content.timeline-text {
	border: none;
}

.hover-content .edit-content:focus, .edit-content.timeline-text:focus {
	outline: none;
	background-color: transparent;
	padding: 0;
}

.hover-content {
	position: relative;
	padding-right: 40px;
}

.hover-content-delete {
	position: absolute;
	top: 0;
	right: 0;
}

.hover-content:hover .hover-content-delete {
	display: block;
}

/*---------tooltips------------*/
.popover {
	max-width: none; /* Remove max-width limit */
	width: auto; /* Adjust width based on content */
}

.popover-body {
	user-select: text; /* Allow text selection inside popover */
}

.bi.tooltipHTML {
	cursor: pointer !important;
}

@media (max-width: 767px) {
	.popover {
		max-width: 96%; /* Remove max-width limit */
		width: 96%; /* Adjust width based on content */
	}
}

/* Start Nestable or Draggable Listing */
.dd-list .dd-item .dd-collapse, .dd-expand {
	display: none !important; /* Hides both the collapse (-) and expand (+) buttons provided by nestable */
}

.expand-collapse-btn {
	margin-right: 10px; /* Add space between button and right content */
}

.expand-icon, .collapse-icon {
	display: inline-block;
	width: 20px; /* Adjust size as needed */
	height: 20px; /* Adjust size as needed */
	line-height: 19px; /* Vertically align text/icons */
	text-align: center;
	cursor: pointer;
	border-radius: 50%; /* Circular button */
	background-color: #f0f0f0; /* Soft background color */
	color: #333; /* Icon color */
	font-size: 16px; /* Icon size */
	transition: background-color 0.3s ease, transform 0.3s ease; /* Smooth hover and animation */
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Subtle shadow for a 3D effect */
}

/* Hover effect */
.expand-icon:hover, .collapse-icon:hover {
	background-color: #3e97ff; /* Change background on hover (you can adjust color) */
	color: #fff; /* White icon color on hover */
	transform: scale(1.1); /* Slightly increase the size on hover */
}

/* Active or focused state */
.expand-icon:active, .collapse-icon:active {
	background-color: #3e97ff; /* Darker shade on click */
	transform: scale(0.95); /* Slightly shrink when clicked */
}

/* End Nestable or Draggable Listing */

/*----------- to adjust the filter listing page alignment --------------*/
[id^="_GenericPage_PagePanel_"][id$="_SearchForm"].card-header {
	border-bottom: none;
}
/*[id^="_GenericPage_PagePanel_"][id$="_SearchForm"] + .d-flex {
	padding-left: 2.25rem; padding-right: 2.25rem;
	}
[id^="divBody__GenericPage_PagePanel_"] { padding-left: 2.25rem; padding-right: 2.25rem;}*/

.content-inner-button { padding: .75rem 0; }
.content-inner-button + .card-body { padding-top: 0 !important; }
.multitab-wrapper {  padding: 1.25rem 2.25rem;}
.multitab-wrapper .form.card-header { padding: 0 !important;}
.multitab-wrapper .content-inner-button { padding: .75rem 0;}

/*---------- adjust side menu padding ---------*/
.menu-item .menu-link { padding: .45rem 1rem;}

@media (min-width: 992px) {
	.app-header-menu .app-container {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}

/*------ Filter Accordion Style ---------*/
.search-criteria .accordion-button:not(.collapsed) { border: 1px solid var(--bs-primary); border-bottom: 0;}
.search-criteria .accordion-button { border: 1px solid var(--bs-primary);}
.search-criteria .accordion-collapse { border: 1px solid var(--bs-primary); border-top: 0;}
.search-criteria .accordion-button { color: var(--bs-primary);}

/*------ Avatar Upload ---------*/
.custom-file-upload {
	position: relative;
	width: 90px;
	height: 90px;
}

.image-preview-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	background: white;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	display: flex;
	justify-content: center;
	align-items: center;
}

.image-preview {
	width: 90%;
	height: 90%;
	background-size: cover;
	background-position: center;
	border-radius: 8px;
}

.edit-btn, .remove-btn {
	position: absolute;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: white;
	display: flex;
	justify-content: center;
	align-items: center;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	border: none;
	outline: none;
}

.edit-btn {
	top: -5px;
	right: -5px;
}

.remove-btn {
	bottom: -5px;
	right: -5px;
}

.edit-btn i, .remove-btn i {
	font-size: 12px;
	color: gray;
}


/*------ Filter Dropdown Username ---------*/
#kt_header_user_menu_toggle .menu-sub-dropdown .d-flex.flex-column .fs-5 { word-break: break-all;}


/*------ Border Hover ---------*/
.border-hover-primary:hover { border: 1px solid var(--bs-primary);}
.border-hover-success:hover { border: 1px solid var(--bs-success);}
.border-hover-warning:hover { border: 1px solid var(--bs-warning);}
.border-hover-danger:hover { border: 1px solid var(--bs-danger);}
.border-hover-info:hover { border: 1px solid var(--bs-info);}

/*------ required ---------*/
.required:after {
	content: "" !important;
	padding: 0 !important;
}
.required > div:first-child:after {
	content: "*";
	position: relative;
	font-size: inherit;
	color: var(--bs-danger);
	padding-left: 0.25rem;
	font-weight: 600;
}

/*------ disable pointer-event for icon when it in hyperlink ---------*/
a i {
	pointer-events: none !important;
}

/*------ toolbar_search ---------*/
.toolbar_search .fv-plugins-message-container.invalid-feedback {
	position: absolute;
	bottom: -17px;
	font-size: 0.75rem !important;
}
.toolbar_search .row.mb-5, .toolbar_search .row.mb-3 {
	margin-bottom: 0 !important;
}
.toolbar_search .input-group > input {
	border-left: 0 !important;
}

/*------ toolbar_search ---------*/
table.dataTable {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

/*------ for slider ---------*/
.slider {
	appearance: none;
	width: 100%;
	height: 6px;
	border-radius: 5px;
	outline: none;
	background: linear-gradient(to right, #00C29F 0%, #00C29F var(--progress, 50%), #ddd var(--progress, 50%), #ddd 100%);
	transition: background 0.15s ease-in-out;
}

.slider::-webkit-slider-thumb {
	appearance: none;
	width: 12px;
	height: 12px;
	background: #00C29F;
	border-radius: 50%;
	cursor: pointer;
}

.slider::-moz-range-thumb {
	width: 12px;
	height: 12px;
	background: #00C29F;
	border-radius: 50%;
	cursor: pointer;
}

.flatpickr-calendar {
	min-width: 500px; /* Adjust width as needed */
}

/*---------- File Upload Style-----------*/
.file-preview {
	border: 1px dashed var(--bs-primary) !important;
	background-color: var(--bs-primary-light) !important;
	border-radius: .475rem !important;
}
.file-drop-zone { 
	border: 1px dashed var(--bs-primary) !important; 
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 150px !important;
}
.file-drop-zone-title {
	color: #4B5675 !important;
	font-size: 1.2rem !important;
	padding: 10px !important;
	font-weight: 500 !important;
}
.file-drop-zone-title:before {
	content: "\ea14";
	font-family: keenicons-outline !important;
	font-style: normal;
	font-weight: 400;
	font-variant: normal;
	text-transform: none;
	display: block;
	color: var(--bs-primary);
	font-size: 3.25rem;
	opacity: 0.7;
}
.file-preview-thumbnails { justify-content: center;  display: flex;}
.krajee-default.file-preview-frame { 
	border: 1px solid #ccc !important;  
	box-shadow: 0 0 10px 0 rgba(0,0,0,.05) !important; 
	border-radius: 10px !important; 
	background-color: #fff !important;
}
.krajee-default .file-footer-caption { margin-bottom: 5px !important;}
.krajee-default.file-preview-frame .kv-file-content { width: 190px; height: 130px;}

/*---------- Modal form adjustment -----------*/
.modal-body .form { padding-left: 0.75rem; padding-right: 0.75rem;}