.iva-btn-primary {
	color: #fff;
	background-color: rgba(128, 0, 71, .75);
	border-radius: 18px;
	border-color: #800047;
	padding: .2rem 10px .2rem 10px;
}

	.iva-btn-primary:hover {
		color: #fff;
		background-color: #800047;
		border-color: #800047
	}

	.btn-check:focus + .iva-btn-primary, .iva-btn-primary:focus {
		color: #fff;
		background-color: rgba(128, 0, 71, .75);
		border-color: #000000;
		/*box-shadow: 0 0 0 .25rem rgba(49,132,253,.5)*/
	}

	.btn-check:active + .iva-btn-primary, .btn-check:checked + .iva-btn-primary, .iva-btn-primary.active, .iva-btn-primary:active, .show > .iva-btn-primary.dropdown-toggle {
		color: #fff;
		/*background-color: #0a58ca;*/
		border-color: #0a53be
	}

		.btn-check:active + .iva-btn-primary:focus, .btn-check:checked + .iva-btn-primary:focus, .iva-btn-primary.active:focus, .iva-btn-primary:active:focus, .show > .iva-btn-primary.dropdown-toggle:focus {
			/*box-shadow: 0 0 0 .25rem rgba(49,132,253,.5)*/
		}

	.iva-btn-primary.disabled, .iva-btn-primary:disabled {
		color: #fff;
		background-color: #800047;
		border-color: #800047
	}

	.iva-btn-primary:focus, .iva-btn-primary:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
		box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #800047;
	}

.iva-float-label {
	color: rgba(128, 0, 71, 0.75);
	position: absolute;
	pointer-events: none;
	left: 10px;
	top: 4px;
	transition: 0.1s;
	white-space: nowrap;
}

.text-field {
	position: relative;
}
.text-field-margin{
	margin: 10px 2.5px 20px 2.5px;
}

.iva-textbox {
	padding-left: 10px;
	width: 125px;
	height: 45px;
	border: 1px solid #d9abc4;
	background-color: #fafafa;
	border-radius: 15px;
	outline-color: #800047;
}

	.iva-textbox:focus {
		border: 2px solid #800047;
	}

		.iva-textbox:focus ~ .iva-float-label, .iva-textbox:valid ~ .iva-float-label, .iva-textbox:read-only ~ .iva-float-label {
			top: -15px;
			left: 3px;
			font-size: 14px;
			color: #800047;
			background-color: #fff;
			padding: 0 5px 0 5px;
			border-radius: 15px;
			border: solid 1px #800047;
		}

	.iva-textbox:disabled {
		background-color: #dedede;
	}

.iva-date-input {
	padding-left: 10px;
	width: 125px;
	height: 45px;
	border: 1px solid #d9abc4;
	background-color: #fafafa;
	border-radius: 15px;
	outline-color: #800047;
}

	.iva-date-input:focus {
		border: 2px solid #800047;
	}

		.iva-date-input:focus ~ .iva-float-label, .iva-date-input:valid ~ .iva-float-label, .iva-date-input:disabled ~ .iva-float-label {
			top: -15px;
			left: 3px;
			font-size: 14px;
			color: #800047;
			background-color: #fff;
			padding: 0 5px 0 5px;
			border-radius: 15px;
			border: solid 1px #800047;
		}

	.iva-date-input:disabled {
		background-color: #dedede;
	}

.iva-color-input {
	padding: 10px;
	width: 125px;
	height: 45px;
	border: 1px solid #d9abc4;
	background-color: #fafafa;
	border-radius: 15px;
	outline-color: #800047;
}

	.iva-color-input:focus {
		border: 2px solid #800047;
	}

		.iva-color-input:focus ~ .iva-float-label, .iva-color-input:valid ~ .iva-float-label, .iva-color-input:disabled ~ .iva-float-label {
			top: -15px;
			left: 3px;
			font-size: 14px;
			color: #800047;
			background-color: #fff;
			padding: 0 5px 0 5px;
			border-radius: 15px;
			border: solid 1px #800047;
		}

	.iva-color-input:disabled {
		background-color: #dedede;
	}

.iva-combobox {
	padding-left: 10px;
	height: 45px;
	border: 1px solid #d9abc4;
	background-color: #fafafa;
	border-radius: 15px;
	outline-color: #800047;
	position: relative;
}

	.iva-combobox:focus {
		border: 2px solid #800047;
	}

		.iva-combobox:focus ~ .iva-float-label, .iva-combobox:valid ~ .iva-float-label, .iva-combobox:disabled ~ .iva-float-label {
			top: -15px;
			left: 3px;
			font-size: 14px;
			color: #800047;
			background-color: #fff;
			padding: 0 5px 0 5px;
			border-radius: 15px;
			border: solid 1px #800047;
		}

	.iva-combobox:disabled {
		background-color: #dedede;
		border: solid 1px #800047;
	}

/*.text-field {
	position: relative;
}*/

.iva-textarea {
	display: inline-block;
	border: solid 1px #d9abc4;
	color: #000000;
	background-color: #fafafa;
	border-radius: 15px;
	padding-left: 10px;
}

	.iva-textarea:focus {
		border: solid 1px #800047;
		background-color: #fff;
		border-radius: 15px;
		outline-color: #800047;
	}

		.iva-textarea:focus ~ .iva-float-label, .iva-textarea:valid ~ .iva-float-label, .iva-textarea:disabled ~ .iva-float-label {
			top: -15px;
			left: 3px;
			font-size: 14px;
			color: #800047;
			background-color: #fff;
			padding: 0 5px 0 5px;
			border-radius: 15px;
			border: solid 1px #800047;
		}

	.iva-textarea:disabled {
		background-color: #dedede;
	}

.spinner-container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	/*z-index: 1100;*/
	cursor: wait;
}

.spinner-gif {
	width: 200px; /* Adjust size as needed */
	height: auto;
}

#CopyBtn {
	margin-left: 5px;
}

/* Center the checkbox inside a bordered container */
.checkbox-container {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 45px;
	padding: 0;
	border: 1px solid #d9abc4;
	border-radius: 15px;
	background-color: white;
}

	.checkbox-container.disabled-textbox {
		background-color: #dedede;
	}


/* Center the checkbox in its container */
.checkbox-center {
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Increase checkbox size while keeping it square and centered */
.checkbox-large {
	transform: scale(1.3);
	margin: 0; /* Remove default margin to avoid layout disruption */
	appearance: none;
	-webkit-appearance: none;
	width: 20px; /* Square dimensions */
	height: 20px; /* Square dimensions */
	cursor: pointer;
	border: 2px solid #800047; /* Add a visible border */
	background-color: white; /* Default background */
	display: inline-block;
	position: relative;
	border-radius: 0; /* Force square corners */
}

	/* Style for hover and focus */
	.checkbox-large:hover,
	.checkbox-large:active,
	.checkbox-large:focus {
		border-color: #5f0037; /* Slightly darker border on hover */
		border-radius: 0; /* Force square corners */
	}

	/* Style for checked state */
	.checkbox-large:checked {
		background-color: #800047;
		border-color: #800047;
		border-radius: 0; /* Force square corners */
	}

		/* Add a checkmark */
		.checkbox-large:checked::after {
			content: "✔";
			color: white;
			font-size: 14px;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			display: block;
			border-radius: 0; /* Force square corners */
		}

	/* Style for disabled state */
	.checkbox-large:disabled {
		background-color: #666666;
		border-color: #666666;
		cursor: not-allowed;
	}

.disabled-textbox {
	padding-left: 10px;
	height: 45px;
	border: 1px solid #d9abc4;
	background-color: #dedede;
	border-radius: 15px;
	outline-color: #800047;
	position: relative;
}

.disabled-field {
	position: relative;
}

	.disabled-field label {
		position: absolute;
		top: -10px;
		background-color: #fafafa;
		padding: 0 5px;
		font-size: 14px;
		color: #800047;
	}

	.disabled-field input:focus + label,
	.disabled-field input:not(:placeholder-shown) + label,
	.disabled-field[disabled="true"] + .disabled-field-placeholder {
		top: -15px;
		left: 3px;
		background-color: #fafafa;
		padding: 0 5px;
		font-size: 14px;
		color: #800047;
		border-radius: 15px;
		border: 1px solid #800047;
	}

.disabled-textarea {
	display: inline-block;
	border: solid 1px #800047;
	color: #000000;
	background-color: #fafafa;
	border-radius: 15px;
	padding-top: 3px;
	padding-left: 10px;
}

	.disabled-textarea:focus {
		border: solid 1px #800047;
		background-color: #fff;
		border-radius: 15px;
		outline-color: #800047;
	}

		.disabled-textarea:focus ~ .iva-float-label, .disabled-textarea:valid ~ .iva-float-label {
			top: -15px;
			left: 3px;
			font-size: 14px;
			color: #800047;
			background-color: #fff;
			padding: 0 5px 0 5px;
			border-radius: 15px;
			border: solid 1px #800047;
		}

	.disabled-textarea input:focus + label,
	.disabled-textarea input:not(:placeholder-shown) + label,
	.disabled-textarea[disabled="true"] + .disabled-textarea-placeholder {
		top: -15px;
		left: 3px;
		background-color: #fafafa;
		padding: 0 5px;
		font-size: 14px;
		color: #800047;
		border-radius: 15px;
		border: 1px solid #800047;
	}

/* TreeView node selection — driven by CssClass property set in C# code.
   CssClass is applied to dxbl-treeview-item (the <li>), which includes the subtree.
   Do NOT use CssClass on parent (letter) nodes — it bleeds into all children.
   Leaf nodes are safe since they have no subtree. */
.iva-selected {
    background-color: #800047 !important;
    color: #fff !important;
    border-radius: 0.25rem;
    padding: 2px 4px;
}
.iva-selected b {
    color: #fff !important;
}

/* Letter header selection — applied via a span INSIDE NodeTemplate (inside dxbl-treeview-item-container,
   which is before the subtree). flex: 1 1 auto fills the full row width. */
.iva-header-selected {
    background-color: #800047;
    color: #fff;
    border-radius: 0.25rem;
    padding: 2px 4px;
    /*flex: 1 1 auto;*/
    display: block;
    align-items: center;
	font-weight: bold;
}
.iva-header-selected b {
    color: #fff !important;
}

.carlsgrid-table {
	width: 100%;
	height: auto;
	position: relative;
	border: none;
	border-collapse: separate;
	border-spacing: 0;
}

.carlsgrid-table thead th {
	text-align: center;
	position: sticky;
	top: 0;
	background-color: #800047;
	border-radius: 15px;
	color: #FFFFFF;
}

.carlsgrid-table tbody tr:hover {
	background-color: rgba(128,0,71,.5);
	color: rgb(255, 255, 255);
}

	.carlsgrid-table tbody tr:hover td:first-child {
		border-top-left-radius: 10px;
		border-bottom-left-radius: 10px;
	}

	.carlsgrid-table tbody tr:hover td:last-child {
		background-color: white;
		color: inherit;
	}

	.carlsgrid-table tbody tr:hover td:nth-last-child(2) {
		border-top-right-radius: 10px;
		border-bottom-right-radius: 10px;
	}

.carlsgrid-report-table {
	max-height: 500px;
	font-size: small;
	overflow-y: auto;
}

.modal-700 {
	min-width: 700px;
	max-width: 700px;
}

.modal-800 {
	min-width: 800px;
	max-width: 800px;
}