/*@font-face 
{
	font-family: 'Open Sans';
	font-weight: 400;
	src: url('assets/fonts/OpenSans-Regular.ttf') format('truetype'); 
}

@font-face
{
	font-family: 'Open Sans';
	font-weight: 700;
	src: url('assets/fonts/OpenSans-Bold.ttf') format('truetype');
}*/

html, body {
	width: 100%;
	height: 100%;
	background-color: #CFCFCF;
}

html, body, * {
	font-family: Roboto, Montserrat;
	font-weight: 400;
	font-style: normal;
	color: #000000;
}

.primary-color {
	color: #62A12F;
}

.secondary-color {
	color: #534341;
}

a {
	color: black;
	text-decoration: none
}

	a:hover {
		cursor: pointer;
	}

		a:hover i {
			opacity: 0.8;
			transform: scale(1.1);
		}



.btn {
	border-radius: 12px;
	font-style: normal;
	font-weight: 500;
	justify-content: center;
	align-items: center;
	align-self: stretch;
	padding: 8px 16px;
	font-size: 14px;
	line-height: normal;
}

.btn-primary {
	background-color: #62A12F;
	box-shadow: none;
	color: #ffffff;
	border: none;
}

	.btn-primary:hover,
	.btn-primary:focus,
	.btn-primary:active:focus {
		background: linear-gradient(0deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%), #62A12F;
	}

	.btn-primary span {
		color: #ffffff;
	}

.btn-secondary {
	box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.08);
	border: none;
	font-size: 14px;
	line-height: normal;
}

	.btn-secondary.reset {
		display: flex;
		padding: 10px 15px;
		font-size: 18px !important;
	}

.btn-tertiary {
	background-color: #BBCCA7;
}


.btn-outline-danger,
.btn-outline-info,
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-warning {
	color: black;
}

.btn-outline-primary {
	border-color: #A2A2A2;
}

.btn:disabled,
.btn-disabled, .btn-disabled:hover
.btn-tertiary:disabled,
.btn-secondary.disabled,
.btn-secondary:disabled {
	color: #20202080;
	border-radius: 50px;
	border: 1px solid #D1D1D1;
	opacity: 0.5;
	background: #8e8e8e;
	box-shadow: 1px 1px 0px 0px rgba(0, 0, 0, 0.08);
}

.btn-check:checked + .btn-outline-primary,
.btn-check:hover + .btn-outline-primary,
.btn-check:active:focus + .btn-outline-primary {
	background: linear-gradient(0deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%), #62A12F;
	border-color: #A2A2A2;
	color: White;
}

.btn-check:checked + .btn-tertiary,
.btn-check:hover + .btn-tertiary,
.btn-check:active:focus + .btn-tertiary {
	background: linear-gradient(0deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%), #859674;
}

.btn:focus, .btn:hover, .btn:active:focus, .form-control:focus, .form-check-input:focus, .richTextEditorContainer:focus-within {
	transform: translateY(-1px);
	-webkit-transform: translateY(-1px);
}

.nav-link:focus, .nav-link:hover, .nav-link:active:focus {
	color: #62A12F;
}

.col-form-label {
	font-size: 12px;
}

.form-control,
.form-select {
	border-color: black;
}

	.form-control::placeholder {
		color: rgba(32, 32, 32, 0.33);
	}

	.form-control.disabled {
		background-color: #EDF1F5;
		color: #6F6F6F;
		border: none 0px;
		word-break: break-all;
		min-height: 46px;
		cursor: not-allowed;
		padding-top: 12px;
		cursor: auto;
	}

	.form-control.text-break {
		border-radius: 10px;
	}

.form-check-input:checked {
	background-color: #adc13675 !important;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28173, 193, 54, 1%29'/%3e%3c/svg%3e");
}

.notched-label {
	position: absolute;
	top: -0.5rem;
	left: 1rem;
}

h1:focus {
	outline: none;
}

.invalid {
	outline: 1px solid #e50000;
}

.validation-message {
	color: #e50000;
}

.blazor-error-boundary {
	background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
	padding: 1rem 1rem 1rem 3.7rem;
	color: white;
}

	.blazor-error-boundary::after {
		content: "An error has occurred."
	}

/* quill */
.ql-toolbar {
	border: var(--bs-border-width) solid var(--bs-border-color) !important;
	border-top-left-radius: var(--bs-border-radius);
	border-top-right-radius: var(--bs-border-radius);
}

.ql-container {
	border-left: var(--bs-border-width) solid var(--bs-border-color) !important;
	border-right: var(--bs-border-width) solid var(--bs-border-color) !important;
	border-bottom: var(--bs-border-width) solid var(--bs-border-color) !important;
	border-bottom-left-radius: var(--bs-border-radius);
	border-bottom-right-radius: var(--bs-border-radius);
}

.ql-editor {
	resize: vertical;
}

.richTextEditorContainer {
	border-radius: var(--bs-border-radius);
}

.ql-disabled {
	opacity: 0.5;
	pointer-events: none;
}

.login-container {
	/*	background: url('/assets/bg.jpg') no-repeat center center fixed;
	background-size: cover;*/
	position: relative;
	z-index: 4;
	margin: 0;
	height: 100vh
}

.login .form-control {
	border-radius: 0px;
}

.form-container {
	background-color: white;
	max-width: 500px;
	border-radius: 16px;
}

	.form-container.login {
		max-width: 420px;
	}

	.form-container .form-control {
		border: none;
		background-color: white !important;
	}

		.form-container .form-control:focus {
			outline: none;
			box-shadow: none;
		}

	.form-container a:link,
	.form-container a:visited,
	.form-container a:active {
		color: #073E74;
		font-size: 16px;
		text-decoration: none;
	}

	.form-container .valid {
		outline: none !important;
	}

	.form-container .invalid {
		outline: none !important;
	}

	.form-container .input-group {
		border-bottom: 2px solid #20202054;
	}

		.form-container .input-group:has(input.modified.valid) i::before {
			content: "\ea05";
			color: green;
		}

		.form-container .input-group:has(input.modified.invalid) i::before {
			content: "\ea06";
			color: red;
		}

	.form-container .input-group-text {
		border: none;
		background-color: white;
	}

	.form-container h1,
	.form-container h2,
	.form-container h6,
	.form-container .h1,
	.form-container .h2,
	.form-container .h6 {
		color: #6F6F6F;
	}


.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
}

	.footer .copyright {
		color: white;
		font-size: 14px;
	}

.container-main {
	width: 100%;
}

/* Pagination */
.pagination .page-item {
	align-content: center;
}

.pagination .page-link {
	border: none;
	background-color: transparent;
}

.pagination li:first-child .page-link, .pagination li:last-child .page-link {
	border-radius: 5px !important;
	background: #FFF;
	line-height: 1px;
}

	.pagination li:first-child .page-link i, .pagination li:last-child .page-link i {
		color: #202020;
	}

.pagination li.active .page-link {
	/*	color: #073E74;*/
	font-weight: 700;
	font-size: 22px
}

.pagination > li:not(.active) .page-link {
	font-size: 14px
}

.pagination > li:not(:first-child):not(:last-child) .page-link {
	padding-left: 16px;
	padding-right: 16px;
	line-height: 20px;
}

.pagination > li:not(.active):not(:first-child):not(:last-child) .page-link:hover {
	text-decoration: underline;
}

.pagination > li:not(.active) .page-link {
	color: #6F6F6F;
}

.pagination > :nth-last-child(n+1) .page-link {
	color: #202020;
}

/* Search box */
.search-box .form-control, .search-box .input-group-text {
	background-color: #fff;
	border: none 0px;
}

.search-box.inside-card .form-control, .search-box.inside-card .input-group-text {
	background-color: #f7f7f7;
}

.search-box .form-control {
	border-bottom-right-radius: 23px !important;
	border-top-right-radius: 23px !important;
}

.search-box-button {
	width: 38px;
	height: 38px;
	border-radius: 19px !important;
	z-index: 6 !important;
}

.search-box-header {
	height: 38px;
}

.search-box .input-group-text {
	border-radius: 23px;
}

	.search-box .input-group-text:has(+ .search-input:placeholder-shown) {
		color: #babdc0;
	}

tr.fileBrowserDraggable td,
tr.fileBrowserDroppable td {
	vertical-align: middle;
}


div.long-property-name .nav-link-text,
h3.long-property-name,
h2.long-property-name {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

h5.long-property-name {
	overflow-wrap: anywhere;
}

.card-with-bg {
	border-radius: 16px;
	background-color: #E7E9DE;
}

.file-drop-zone.drag-over {
	border: 1px dotted #007bff;
}

.file-drop-zone-instructions {
	line-height: 24px;
}

.file-drop-zone-limits {
	font-size: 14px;
	line-height: 18px;
	color: #6F6F6F;
}

/* Supported Responsive Breakpoints */
/* Small */
@media (min-width: 550px) {
	.image-wrapper {
		height: 250px;
	}
}

/* Medium */
@media (min-width: 641px) {
	.container-main {
		margin-left: 310px;
	}

	.container-main-max-width {
		max-width: calc(100vw - 310px)
	}
}

/* Large */
@media (min-width: 992px) {
	.scrollable-column {
		max-height: calc(100vh - 310px);
		overflow-y: auto;
	}

	.image-wrapper {
		height: 200px;
	}
}

/* X-Large */
@media (min-width: 1200px) {
}

/* XX-Large */
@media (min-width: 1400px) {
}

@media (min-width: 1602px) {
	.container-main-max-width {
		max-width: 1602px;
	}
}

@media (max-width: 1024px) {
}

/* Login video*/
.login-video-wrapper {
	position: absolute;
	/* ensure positioning regardless of parent flex settings */
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	/* important */
	container-type: size;
	/* cut off overflowing video */
	overflow: hidden;
	z-index: 1;
}

@media only screen and (max-width: 767px) {
	.login-video {
		display: none;
	}
}

@media only screen and (min-width: 768px) {
	.login-video {
		display: block;
		position: absolute;
		/* keep video centered both vertically and horizontally */
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
		height: 100%;
		/* force aspect ratio based on parent container */
		@container (min-aspect-ratio: 16/9) {
			height: 56.25cqw; /* 100*9/16 */
		}

		@container (max-aspect-ratio: 16/9) {
			width: 177.78cqh; /* 100*16/9 */
		}
		/* prevent interaction */
		pointer-events: none;
	}
}

@media only screen and (max-width: 767px) {
	.login-video-mobile {
		display: block;
		position: absolute;
		/* keep video centered both vertically and horizontally */
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
		height: 100%;
		/* force aspect ratio based on parent container */
		@container (min-aspect-ratio: 9/16) {
			height: 177.78cqh; /* 100*9/16 */
		}

		@container (max-aspect-ratio: 9/16) {
			width: 177.78cqw; /* 100*16/9 */
		}
		/* prevent interaction */
		pointer-events: none;
	}
}

@media only screen and (min-width: 768px) {
	.login-video-mobile {
		display: none;
	}
}

.login-video-gradient {
	width: 100vw;
	height: 100vh;
	object-fit: cover;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 2;
}


/* Custon Switch */
.custom-switch > .form-check-input {
	background-color: #adc13675 !important;
	position: relative;
	-webkit-appearance: none;
	outline: none;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28173, 193, 54, 1%29'/%3e%3c/svg%3e");
}

	.custom-switch > .form-check-input:checked {
		background-color: #0b4b827d !important;
		-webkit-appearance: none;
		background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%2811, 75, 130, 1%29'/%3e%3c/svg%3e");
	}


/* Auto complete */
.autocomplete {
	position: relative;
}

	.autocomplete .options {
		position: absolute;
		top: -7px;
		left: 0;
		background: white;
		width: 100%;
		padding: 0;
		z-index: 10;
		border: 1px solid #ced4da;
		border-radius: 0.5rem;
		box-shadow: 0 30px 25px 8px rgba(0, 0, 0, 0.1);
	}

	.autocomplete .option {
		display: block;
		padding: 0.25rem;
	}

		.autocomplete .option .option-text {
			padding: 0.25rem 0.5rem;
		}

		.autocomplete .option:hover {
			background: #1967d2;
			color: #fff;
		}

			.autocomplete .option:hover .option-text {
				color: #fff;
			}

		.autocomplete .option.disabled {
			background-color: lightgrey;
			cursor: not-allowed;
		}

			.autocomplete .option.disabled:hover {
				background: lightgrey;
				color: var(--bs-body);
			}

/* Toast */
.toast-container {
	animation: slide-in 0.5s ease-out, slide-out 0.5s ease-in 5s forwards;
}

.toast-body {
	color: white !important;
}

@keyframes slide-in {
	from {
		transform: translateX(100%);
		opacity: 0;
	}

	to {
		transform: translateX(0);
		opacity: 1;
	}
}

@keyframes slide-out {
	from {
		transform: translateX(0);
		opacity: 1;
	}

	to {
		transform: translateX(100%);
		opacity: 0;
	}
}

.responsive-table thead th {
	background-color: #EAEAEA;
}

.responsive-table tbody td, .responsive-table tbody td a {
	color: #737373;
}

	.responsive-table tbody td a:hover {
		color: #62A12F;
	}

	.responsive-table tbody td a.close-icon .icon:hover {
		color: red;
	}


/* Responsive table */
@media only screen and (max-width: 800px) {
	/* Force table to not be like tables anymore */
	.responsive-table table, .responsive-table thead, .responsive-table tbody, .responsive-table th, .responsive-table td, .responsive-table tr {
		display: block;
	}

		/* Hide table headers (but not display: none;, for accessibility) */
		.responsive-table thead tr {
			position: absolute;
			top: -9999px;
			left: -9999px;
		}

	.responsive-table tr {
		border: 1px solid #ccc;
		font-size: 12px;
	}

	.responsive-table td {
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee;
		position: relative;
		padding-left: 50%;
		white-space: normal;
		text-align: left;
		min-height: 40px;
		font-size: 12px;
	}

	.responsive-table.no-column-name td {
		padding-left: 0px;
	}

	.responsive-table td[data-title]:before {
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 13px;
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
		text-align: left;
		font-weight: 600;
		font-size: small;
	}

	.responsive-table td:before {
		content: attr(data-title);
	}
}

.unit-toggle .btn-tertiary {
	border: none;
}

.unit-toggle > div:first-child label {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 0px;
	border-top-right-radius: 0px;
	border-right: 1px solid black;
}

.unit-toggle > div:last-child label {
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	border-left: 1px solid black;
}

.loading-pulse {
	width: 40px;
}

.shadow {
	box-shadow: 0px 1px 3px 0px #0000004D;
	box-shadow: 0px 4px 8px 3px #00000026;
}

.modal-content .notched-label {
	background-color: #E7E9DE;
}

.modal-content .form-control,
.modal-content .form-select {
	background-color: transparent;
}

.ordermodal .modal-header {
	text-align: center;
}

	.ordermodal .modal-header .modal-title {
		margin: 0 auto;
	}

.product-card-banner {
	background-color: #E5CCC2;
}

.product-card {
	border-color: #1E4E4D;
	border-radius: 12px;
	background-color: #E7E9DE;
}

	.product-card .card-title {
		color: #231918;
	}

	.product-card .card-text {
		color: #898989;
		font-weight: 500;
	}

	.product-card img {
		border-radius: 12px;
		background-color: #F0F1E9;
	}

	.product-card .counter {
		background-color: #B7775E;
		color: #FFFFFF;
	}

		.product-card .counter:hover,
		.product-card .counter:focus,
		.product-card .counter:active:focus {
			background-color: #B7775E;
			color: #FFFFFF;
		}

	.product-card input, .product-card label, .product-card select {
		background-color: #E7E9DE;
	}

.summary-footer .btn, .summary-footer .btn:disabled {
	border-radius: 12px;
}

.scrollable-text {
	line-height: 1.4em;
	max-height: calc(1.4em * 6);
	overflow-y: auto;
}

.image-contain {
	object-fit: contain;
}

.image-cover {
	object-fit: cover;
}

.image-wrapper {
	border-radius: 12px;
	background-color: #F0F1E9;
}

.maxHeight270 {
	max-height: 270px;
}

.height250 {
	height: 250px;
	overflow-y: auto;
}

.w150 {
	width: 150px !important;
}

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

.fs-12 {
	font-size: 12px;
}

.radius-12 {
	border-radius: 12px;
}