:root{
	--font: "Syne", sans-serif;
	--font-heading: "Comfortaa", sans-serif;
}

html[data-color] .logo .img{
	background-image: url(../images/logos/logo_text_w.png);
	background-size: contain;
}

html[data-color][data-navcolor=light] .logo .img{
	background-image: url(../images/logos/logo_text_b.png);
	background-size: contain;
}

html[data-color][data-navcolor=dark] .logo .img{
	background-image: url(../images/logos/logo_text_w.png);
	background-size: contain;
}

html[data-color^="dark-"] .logo-default{
	background-image: url(../images/logos/logo_text_w.png);
	background-size: contain;
}

html[data-color^="light-"] .logo-default{
	background-image: url(../images/logos/logo_text_b.png);
	background-size: contain;
}

html[data-color^="dark-"] .filepond--panel-root{
	background-color: #1e1e1e;
	border: 1px solid #444;
}

html[data-color^="dark-"] .filepond--drop-label,
html[data-color^="dark-"] .filepond--file-info{
	color: #fff;
}

html[data-color^="dark-"] .filepond--drip{
	background-color:#fff;
}

.fixed-background{
	background: url(../images/backgrounds/login_02_c.jpg) no-repeat center center fixed;
	background-blend-mode: multiply;
	/*background-color: var(--primary);*/
	background-color: #88a7b5;
	background-size: cover;
}

table.dataTable.nowrap td{
	white-space: normal;
}

table.dataTable.nowrap th{
	white-space: pre;
}

table.dataTable tbody{
	position: static !important;
	overflow: visible !important;
	z-index: auto;
}

.data-table-responsive-wrapper {
	overflow: visible !important;
}

form .file-input{
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
}

form .file-preview .btn{
	background-color: rgba(0, 0, 0, 0.5);
	border-radius: 50%;
	transition: background 0.2s ease-in-out;
}

form .file-preview .btn:hover{
	background-color: rgba(255, 0, 0, 0.8);
}

form .file-preview .remove-btn{
	opacity: 0;
	transition: opacity 0.3s ease, transform 0.3s ease;
	transform: scale(0.8);
	pointer-events: none; /* Prevent accidental clicks when hidden */
}

form .file-preview:hover .remove-btn{
	opacity: 1;
	transform: scale(1);
	pointer-events: auto;
}

.modal.modal-right form{
	display: contents;
}

@media (min-width: 1200px){
	.modal-xl{
		max-width: 1140px!important;
	}
}

@media (min-width: 1400px){
	.modal-xl{
		max-width: 1340px!important;
	}
}

.dataTables_scrollBody{
	overflow: visible!important;
	/*min-height: 160px!important;*/
	min-height: max(160px, calc(100% + 120px)); /* 120px for dropdown menu height */
	display: block;
}

.dataTables_scrollBody .row-inactive.text-muted td{
	color: var(--muted) !important
}

.dataTables_wrapper .table-container{
	min-height: 40vh;
}

input.qntm_form_field:disabled:not([type="checkbox"]),
textarea.qntm_form_field:disabled{
	background: rgba(var(--separator-rgb), 0.2) !important;
	border-color: rgba(var(--separator-rgb), 0.2) !important;
	color: var(--body) !important;
	-webkit-text-fill-color: var(--body) !important;
}

/* fixes for Alerts bg opacity */
.alert-success{
	background-color: rgba(var(--success-rgb), 0.3);
}

.alert-warning{
	background-color: rgba(var(--warning-rgb), 0.3);
}

.alert-danger{
	background-color: rgba(var(--danger-rgb), 0.3);
}

.alert-info{
	background-color: rgba(var(--info-rgb), 0.3);
}

#response_alerts_wrapper .alert p{
	margin: 0;
}

/* Modal Title dynamic color */
.modal-title{
	color: var(--primary);
}


html[data-placement=vertical] .nav-container .nav-content .logo a,
html[data-placement=vertical] .nav-container.mobile-side-ready .nav-content .logo a,
html[data-placement=horizontal] .nav-container .nav-content .logo a,
html[data-placement=horizontal] .nav-container.mobile-side-ready .nav-content .logo a{
	width: 200px;
}

html[data-placement=vertical] .nav-container .logo img,
html[data-placement=vertical] .nav-container .logo .img,
html[data-placement=horizontal] .nav-container .logo img,
html[data-placement=horizontal] .nav-container .logo .img{
	width: 200px;
	min-height: 35px;
}

.logo-default{
	width: 200px;
}

/* fixes for DT Tables bg opacity */
.table-success{
	--bs-table-bg: rgba(var(--success-rgb), 0.3) !important;
	--bs-table-striped-bg: rgba(var(--success-rgb), 0.3) !important;
	--bs-table-active-bg: rgba(var(--success-rgb), 0.3) !important;
	--bs-table-hover-bg: rgba(var(--success-rgb), 0.3) !important;
}

.table-warning{
	--bs-table-bg: rgba(var(--warning-rgb), 0.3) !important;
	--bs-table-striped-bg: rgba(var(--warning-rgb), 0.3) !important;
	--bs-table-active-bg: rgba(var(--warning-rgb), 0.3) !important;
	--bs-table-hover-bg: rgba(var(--warning-rgb), 0.3) !important;
}

.table-danger{
	--bs-table-bg: rgba(var(--danger-rgb), 0.3) !important;
	--bs-table-striped-bg: rgba(var(--danger-rgb), 0.3) !important;
	--bs-table-active-bg: rgba(var(--danger-rgb), 0.3) !important;
	--bs-table-hover-bg: rgba(var(--danger-rgb), 0.3) !important;
}

.table-info{
	--bs-table-bg: rgba(var(--info-rgb), 0.3) !important;
	--bs-table-striped-bg: rgba(var(--info-rgb), 0.3) !important;
	--bs-table-active-bg: rgba(var(--info-rgb), 0.3) !important;
	--bs-table-hover-bg: rgba(var(--info-rgb), 0.3) !important;
}

.fm-cn{
	font-family: "Courier New", monospace!important;
}

.table-row-inactive td{
	text-decoration: line-through!important;
}

#ajax-loader{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.6);
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Spinner animation */
/*
.spinner{
	width: 60px;
	height: 60px;
	border: 6px solid #ccc;
	border-top: 6px solid #007bff;
	border-radius: 50%;
	animation: spin 1s linear infinite;
}

@keyframes spin{
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
*/

.spinner{
	width: 48px;
	height: 48px;
	border-radius: 50%;
	display: inline-block;
	position: relative;
	border: 3px solid;
	border-color: #0ed0d6 #0ed0d6 transparent;
	box-sizing: border-box;
	animation: rotation 1s linear infinite;
}

.spinner::after{
	content: '';
	box-sizing: border-box;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	border: 3px solid;
	/*border-color: transparent #FF3D00 #FF3D00;*/
	/*border-color: transparent #b3479a #b3479a;*/
	border-color: transparent #3e5c77 #3e5c77;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	animation: rotationBack 0.5s linear infinite;
	transform-origin: center center;
}

@keyframes rotation{
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}

@keyframes rotationBack{
	0% {transform: rotate(0deg);}
	100% {transform: rotate(-360deg);}
}