BODY
{
	background-color: #544646;
	color: #EFEFEF;
}
A
{
	color: #EFEFEF;
}
A.btn
{
	color: #FFF0F0 !important;
}
LABEL
{
	font-size: 1.2rem;
}
TABLE
{
	margin-bottom: 0px !important;
	padding-bottom: 0 !important;
}
.monospace
{
	font-family: monospace;
	font-size: 1.1rem;
}
.form-control
{
	display: block;
	width: 100%;
	padding: 0.5rem 1rem;
	font-size: 1.3rem;
	font-weight: 400;
	line-height: 1.5;
	color:var(--bs-body-color);
	background-color:var(--bs-form-control-bg);
	background-clip: padding-box;
	border:var(--bs-border-width) solid var(--bs-border-color);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0.375rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-text
{
	margin-top: 0.25rem;
	font-size: 1em;
	color: rgba(255, 213, 213, 0.746);
	font-style: italic;
	text-align: right;
	margin-right: 10px;
}
.form-check-input
{
	--bs-form-check-bg:var(--bs-form-control-bg);
	width: 2em;
	height: 2em;
	margin-top: 0em;
	vertical-align: top;
	background-color:var(--bs-form-check-bg);
	background-image:var(--bs-form-check-bg-image);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	border:var(--bs-border-width) solid var(--bs-border-color);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-print-color-adjust: exact;
	color-adjust:exact;
	print-color-adjust:exact;
	margin-right: 10px;
}
LI.list-group-item A
{
	color: #C92026;
}
UL.pagination A
{
	color: #C92026;
}
UL.pagination A:hover
{
	color: #C92026;
}
HEADER H1 I.bi
{
	text-shadow: 5px 5px 0px #000000 !important;
	-webkit-text-stroke: 2px black;
	margin-right: 20px;
}
HEADER H3.pageTitle
{
	color: #EFEFEF;
	/*background-color: #C92026;*/
	display: inline-block;
	margin-left: 73px;
	text-transform: uppercase;
	font-size: 20px;
	font-family: monospace;
}
HEADER H3.pageTitle SPAN
{
	color: #EFEFEF;
	/*background-color: #C92026;*/
	text-transform: uppercase;
	font-size: 20px;
	background-color: #2A2222;
	padding: 5px 10px;
	/*+border-radius: 6px;*/
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-khtml-border-radius: 6px;
	border-radius: 6px;
	position: relative;
	top: -4px;
}
HEADER H3.pageTitle I
{
	font-size: 30px;
}
HEADER A
{
	text-decoration: none;
}
@media (max-width: 600px)
{
	HEADER H1
	{
		font-size: 2rem;
	}
	HEADER H3
	{
		font-size: 1rem;
		margin-left: 47px !important;
	}
}
@media (max-width: 400px)
{
	HEADER H1
	{
		font-size: 1.5rem;
	}
	HEADER H3
	{
		font-size: 1rem;
		margin-left: 0px !important;
	}
}
.nav-link
{
	display: block !important;
	font-size:var(--bs-nav-link-font-size);
	font-weight:var(--bs-nav-link-font-weight);
	color: #FFF0F0 !important;
	text-decoration: none !important;
	transition: all 0.2s ease-in-out !important;
	background-color: #212529 !important;
	padding: 3px 10px !important;
}
.nav-link:hover
{
	color: #FFF0F0 !important;
	background-color: #424649 !important;
	transition: all 0.2s ease-in-out !important;
	box-shadow: 5px 5px 0px #000000 !important;
}
.nav-link:active, .nav-link:focus, .nav-link:visited
{
	color: #FFF0F0 !important;
	text-decoration: none !important;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out !important;
}
.nav-link.active
{
	background-color: #212529 !important;
}
.nav-link.active:hover
{
	background-color: #424649 !important;
}
I.copyTip
{
	cursor: pointer;
}
TH.file-icon I
{
	font-size: 1.5rem;
}
.btn:hover
{
	transition: all 0.2s ease-in-out !important;
	box-shadow: 5px 5px 0px #211C1C !important;
}
.btn-secondary
{
	background-color: #2A2222;
	border: 1px solid #2A2222;
}
.btn-secondary:hover
{
	background-color: #544646;
	border: 1px solid #2A2222;
}
.btn-outline-secondary
{
	background-color: #2A2222;
	border: 1px solid #FFFFFF;
	color: #FFFFFF;
}
.btn-outline-secondary:hover
{
	background-color: #FFFFFF;
	border: 1px solid #FFFFFF;
	color: #2A2222;
}
.btn-dark
{
	background-color: #1D1A1A;
	border: 1px solid #1B1717;
}
LI.list-group-item.list-group-item-hiper
{
	background-color: #2A2222;
	color: #FFF0F0;
	padding: 50px;
}
LI.list-group-item.list-group-item-hiper INPUT.form-control, LI.list-group-item.list-group-item-hiper SELECT.form-control, LI.list-group-item.list-group-item-hiper INPUT[type="checkbox"].form-control
{
	background-color: #FFFFFF;
	color: #1E1E1E;
	border: 0px solid black;
}
TABLE.table-upload-slots TR.table-success TD A, TABLE.table-upload-slots TR.table-success TH A
{
	color: #065D36;
}
DIV.loginForm
{
	padding: 30px;
}
DIV.table-dns-container
{
	padding: 0px;
	background-color: #000000;
	/*+border-radius: 5px;*/
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px;
	border-radius: 5px;
	box-shadow: 5px 5px 0px #211C1C !important;
}
TABLE.table-dns
{
	font-size: 0.9rem;
	border: 0px solid black;
	overflow: hidden;
	/*+border-radius: 8px;*/
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	-khtml-border-radius: 8px;
	border-radius: 8px;
	background-color: #000000;
}
TABLE.table-dns TD
{
	background-color: #FFFFFF;
	color: #252525;
	vertical-align: middle;
	border-right: 0px solid black;
}
TABLE.table-dns TD.td-label
{
	font-weight: bold;
	background-color: #E0DADA;
	color: #535455;
}
TABLE.table-dns TD.td-label.td-label-warning
{
	background-color: #F7BFBF;
}
TABLE.table-dns TD.td-value.td-value-warning
{
	background-color: #FBDFDF;
}
TABLE.table-dns TD.td-label.td-label-success
{
	background-color: #CDF6BE;
}
TABLE.table-dns TD.td-value.td-value-success
{
	background-color: #CDF6BE;
}
#nav-menu A
{
	margin: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
#nav-menu .btn
{
}
#nav-menu .btn:hover
{
	/*+box-shadow: none !important;*/
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
}
.hidden-content
{
	display: none;
}
DIV.loader
{
	/*display: inline;*/
	height: 15px !important;
	width: 15px !important;
	margin-left: 5px;
}
DIV.loader IMG
{
	display: inline;
	height: 25px !important;
	width: 25px !important;
}
DIV.table-dns-container TABLE TBODY TR TD A
{
	color: #2A2222;
	text-decoration: none;
	font-weight: 600;
}
PRE.large
{
	font-size: 1rem;
}
I.bi.small
{
	font-size: 0.5rem;
	color: rgba(42, 34, 34, 0.491);
}
.text-muted
{
	color: rgba(255, 255, 255, 0.655) !important;
}
TABLE.table-dns .text-muted
{
	color: #544646 !important;
}
TABLE.table-dns SMALL
{
	font-size: 0.8rem;
}
DIV.card
{
	color: #544646;
}
DIV.card TABLE .text-muted
{
	color: rgba(84, 70, 70, 0.828) !important;
}
TABLE.table-client-services TD.td-additional-header
{
	background-color: #E9ECEF;
}
TABLE.table-client-services TH
{
	background-color: #E9ECEF !important;
}
TABLE.table-client-services TD.td-value SPAN.badge.bg-secondary
{
	background-color: #FFFFFF !important;
	color: #544646;
	border: 1px solid #544646;
}
TABLE.table-client-services TD.td-value SPAN.badge
{
	padding: 6px 5px 5px;
}
/*KENNETH*/
DIV#chat-messages.chat-conversation
{
	background-color: #2A2222 !important;
}
DIV#chat-messages.chat-conversation .alert-warning
{
	background-color: #493D3D !important;
	color: #CDC5C5;
	border: 1px solid #746262;
}
DIV#chat-messages.chat-conversation .alert-info
{
	background-color: #BCAEAE !important;
	color: #2A2424;
	border: 1px solid #BEB2B2;
}
#chat-messages::-webkit-scrollbar
{
	width: 8px;
	background-color: #544646;
}
#chat-messages::-webkit-scrollbar-track
{
	background: #544646;
	border-radius: 4px;
}
#chat-messages::-webkit-scrollbar-thumb
{
	background: #BCAEAE;
	border-radius: 4px;
}
#chat-messages::-webkit-scrollbar-thumb:hover
{
	background: #555;
}
DIV.alert.alert-info.claude-response
{
	background-color: #BCAEAE;
	color: #2A2424 !important;
	border: 1px solid #BEB2B2;
}
.dns-hiper-dashboard
{
	font-family: Arial, sans-serif;
}
.summary-section, .dns-group-section, .recommendations-section
{
	margin-bottom: 30px;
}
.client-subsection
{
	/*margin-left: 20px;*/
}
.status-ok
{
	background-color: #D1EDCC !important;
}
.status-warning
{
	background-color: #FFF3CD !important;
}
.status-error
{
	background-color: #F8D7DA !important;
}
.status-unknown
{
	background-color: #E9ECEF !important;
}
.status-hiper
{
	background-color: #D1EDCC !important;
}
.status-external
{
	background-color: #F8D7DA !important;
}
.status-mixed
{
	background-color: #FFF3CD !important;
}
.status-unknown
{
	background-color: #E9ECEF !important;
}
.dns-server
{
	display: inline-block;
	padding: 2px 6px;
	margin: 1px;
	border-radius: 3px;
	font-size: 0.9em;
}
.hiper-server
{
	background-color: #D1EDCC;
	color: #0F5132;
	border: 1px solid #A3D977;
}
.external-server
{
	background-color: #F8D7DA;
	color: #842029;
	border: 1px solid #F1AEB5;
}
/* DROPZONE*/
@-webkit-keyframes passing-through
{
	0%
	{
		opacity: 0;
		-webkit-transform: translateY(40px);
		-moz-transform: translateY(40px);
		-ms-transform: translateY(40px);
		-o-transform: translateY(40px);
		transform: translateY(40px);
	}
	30%, 70%
	{
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
	100%
	{
		opacity: 0;
		-webkit-transform: translateY(-40px);
		-moz-transform: translateY(-40px);
		-ms-transform: translateY(-40px);
		-o-transform: translateY(-40px);
		transform: translateY(-40px);
	}
}
@-moz-keyframes passing-through
{
	0%
	{
		opacity: 0;
		-webkit-transform: translateY(40px);
		-moz-transform: translateY(40px);
		-ms-transform: translateY(40px);
		-o-transform: translateY(40px);
		transform: translateY(40px);
	}
	30%, 70%
	{
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
	100%
	{
		opacity: 0;
		-webkit-transform: translateY(-40px);
		-moz-transform: translateY(-40px);
		-ms-transform: translateY(-40px);
		-o-transform: translateY(-40px);
		transform: translateY(-40px);
	}
}
@keyframes passing-through
{
	0%
	{
		opacity: 0;
		-webkit-transform: translateY(40px);
		-moz-transform: translateY(40px);
		-ms-transform: translateY(40px);
		-o-transform: translateY(40px);
		transform: translateY(40px);
	}
	30%, 70%
	{
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
	100%
	{
		opacity: 0;
		-webkit-transform: translateY(-40px);
		-moz-transform: translateY(-40px);
		-ms-transform: translateY(-40px);
		-o-transform: translateY(-40px);
		transform: translateY(-40px);
	}
}
@-webkit-keyframes slide-in
{
	0%
	{
		opacity: 0;
		-webkit-transform: translateY(40px);
		-moz-transform: translateY(40px);
		-ms-transform: translateY(40px);
		-o-transform: translateY(40px);
		transform: translateY(40px);
	}
	30%
	{
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
}
@-moz-keyframes slide-in
{
	0%
	{
		opacity: 0;
		-webkit-transform: translateY(40px);
		-moz-transform: translateY(40px);
		-ms-transform: translateY(40px);
		-o-transform: translateY(40px);
		transform: translateY(40px);
	}
	30%
	{
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
}
@keyframes slide-in
{
	0%
	{
		opacity: 0;
		-webkit-transform: translateY(40px);
		-moz-transform: translateY(40px);
		-ms-transform: translateY(40px);
		-o-transform: translateY(40px);
		transform: translateY(40px);
	}
	30%
	{
		opacity: 1;
		-webkit-transform: translateY(0px);
		-moz-transform: translateY(0px);
		-ms-transform: translateY(0px);
		-o-transform: translateY(0px);
		transform: translateY(0px);
	}
}
@-webkit-keyframes pulse
{
	0%
	{
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
	10%
	{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1);
	}
	20%
	{
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
}
@-moz-keyframes pulse
{
	0%
	{
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
	10%
	{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1);
	}
	20%
	{
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes pulse
{
	0%
	{
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
	10%
	{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-ms-transform: scale(1.1);
		-o-transform: scale(1.1);
		transform: scale(1.1);
	}
	20%
	{
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
	}
}
.dropzone, .dropzone *
{
	box-sizing: border-box;
}
.dropzone
{
	min-height: 150px;
	border: 2px dashed #000000;
	background: #FFF;
	padding: 20px 20px;
	color: #C92026;
	/*+border-radius: 10px;*/
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;
	transition: all 0.3s;
}
.dropzone:hover
{
	/*+box-shadow: 5px 5px 0px #000000 !important;*/
	-moz-box-shadow: 5px 5px 0px #000000 !important;
	-webkit-box-shadow: 5px 5px 0px #000000 !important;
	box-shadow: 5px 5px 0px #000000 !important;
	border: 2px solid #000000;
	transition: all 0.3s;
}
.dropzone.dz-clickable
{
	cursor: pointer;
}
.dropzone.dz-clickable *
{
	cursor: default;
}
.dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message *
{
	cursor: pointer;
}
.dropzone.dz-started .dz-message
{
	display: none;
}
.dropzone.dz-drag-hover
{
	border-style: solid;
}
.dropzone.dz-drag-hover .dz-message
{
	opacity: 0.5;
}
.dropzone .dz-message
{
	text-align: center;
	margin: 2em 0;
}
.dropzone .dz-message .dz-button
{
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}
.dropzone DIV.dz-default.dz-message BUTTON.dz-button
{
	font-size: 1.5rem;
}
.dropzone .dz-preview
{
	position: relative;
	display: inline-block;
	vertical-align: top;
	margin: 16px;
	min-height: 100px;
}
.dropzone .dz-preview:hover
{
	z-index: 1000;
}
.dropzone .dz-preview:hover .dz-details
{
	opacity: 1;
}
.dropzone .dz-preview.dz-file-preview .dz-image
{
	border-radius: 20px;
	background: #999;
	background: linear-gradient(to bottom, #EEE, #DDD);
}
.dropzone .dz-preview.dz-file-preview .dz-details
{
	opacity: 1;
}
.dropzone .dz-preview.dz-image-preview
{
	background: #FFF;
}
.dropzone .dz-preview.dz-image-preview .dz-details
{
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	-ms-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;
}
.dropzone .dz-preview .dz-remove
{
	font-size: 14px;
	text-align: center;
	display: block;
	cursor: pointer;
	border: none;
	color: #C92026;
}
.dropzone .dz-preview .dz-remove:hover
{
	text-decoration: underline;
}
.dropzone .dz-preview:hover .dz-details
{
	opacity: 1;
}
.dropzone .dz-preview .dz-details
{
	z-index: 20;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	font-size: 13px;
	min-width: 100%;
	max-width: 100%;
	padding: 2em 1em;
	text-align: center;
	color: rgba(0, 0, 0, 0.9);
	line-height: 150%;
}
.dropzone .dz-preview .dz-details .dz-size
{
	margin-bottom: 1em;
	font-size: 16px;
}
.dropzone .dz-preview .dz-details .dz-filename
{
	white-space: nowrap;
}
.dropzone .dz-preview .dz-details .dz-filename:hover SPAN
{
	border: 1px solid rgba(200, 200, 200, 0.8);
	background-color: rgba(255, 255, 255, 0.8);
}
.dropzone .dz-preview .dz-details .dz-filename:not(:hover)
{
	overflow: hidden;
	text-overflow: ellipsis;
}
.dropzone .dz-preview .dz-details .dz-filename:not(:hover) SPAN
{
	border: 1px solid transparent;
}
.dropzone .dz-preview .dz-details .dz-filename SPAN, .dropzone .dz-preview .dz-details .dz-size SPAN
{
	background-color: rgba(255, 255, 255, 0.4);
	padding: 0 0.4em;
	border-radius: 3px;
}
.dropzone .dz-preview:hover .dz-image IMG
{
	-webkit-transform: scale(1.05, 1.05);
	-moz-transform: scale(1.05, 1.05);
	-ms-transform: scale(1.05, 1.05);
	-o-transform: scale(1.05, 1.05);
	transform: scale(1.05, 1.05);
	-webkit-filter: blur(8px);
	filter: blur(8px);
}
.dropzone .dz-preview .dz-image
{
	border-radius: 20px;
	overflow: hidden;
	width: 120px;
	height: 120px;
	position: relative;
	display: block;
	z-index: 10;
}
.dropzone .dz-preview .dz-image IMG
{
	display: block;
}
.dropzone .dz-preview.dz-success .dz-success-mark
{
	-webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
	-o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
	animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
}
.dropzone .dz-preview.dz-error .dz-error-mark
{
	opacity: 1;
	-webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
	-moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
	-ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
	-o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
	animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
}
.dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark
{
	pointer-events: none;
	opacity: 0;
	z-index: 500;
	position: absolute;
	display: block;
	top: 50%;
	left: 50%;
	margin-left: -27px;
	margin-top: -27px;
}
.dropzone .dz-preview .dz-success-mark SVG, .dropzone .dz-preview .dz-error-mark SVG
{
	display: block;
	width: 54px;
	height: 54px;
	color: #EA0000;
}
.dropzone .dz-preview.dz-processing .dz-progress
{
	opacity: 1;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
.dropzone .dz-preview.dz-complete .dz-progress
{
	opacity: 0;
	-webkit-transition: opacity 0.4s ease-in;
	-moz-transition: opacity 0.4s ease-in;
	-ms-transition: opacity 0.4s ease-in;
	-o-transition: opacity 0.4s ease-in;
	transition: opacity 0.4s ease-in;
}
.dropzone .dz-preview:not(.dz-processing) .dz-progress
{
	-webkit-animation: pulse 6s ease infinite;
	-moz-animation: pulse 6s ease infinite;
	-ms-animation: pulse 6s ease infinite;
	-o-animation: pulse 6s ease infinite;
	animation: pulse 6s ease infinite;
}
.dropzone .dz-preview .dz-progress
{
	opacity: 1;
	z-index: 1000;
	pointer-events: none;
	position: absolute;
	height: 16px;
	left: 50%;
	top: 50%;
	margin-top: -8px;
	width: 80px;
	margin-left: -40px;
	background: rgba(255, 255, 255, 0.9);
	-webkit-transform: scale(1);
	border-radius: 8px;
	overflow: hidden;
}
.dropzone .dz-preview .dz-progress .dz-upload
{
	background: #333;
	background: linear-gradient(to bottom, #666, #444);
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0;
	-webkit-transition: width 300ms ease-in-out;
	-moz-transition: width 300ms ease-in-out;
	-ms-transition: width 300ms ease-in-out;
	-o-transition: width 300ms ease-in-out;
	transition: width 300ms ease-in-out;
}
.dropzone .dz-preview.dz-error .dz-error-message
{
	display: block;
}
.dropzone .dz-preview.dz-error:hover .dz-error-message
{
	opacity: 1;
	pointer-events: auto;
}
.dropzone .dz-preview .dz-error-message
{
	pointer-events: none;
	z-index: 1000;
	position: absolute;
	display: block;
	display: none;
	opacity: 0;
	-webkit-transition: opacity 0.3s ease;
	-moz-transition: opacity 0.3s ease;
	-ms-transition: opacity 0.3s ease;
	-o-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
	border-radius: 8px;
	font-size: 13px;
	top: 130px;
	left: -10px;
	width: 140px;
	background: #BE2626;
	background: linear-gradient(to bottom, #BE2626, #A92222);
	padding: 0.5em 1.2em;
	color: #FFF;
}
.dropzone .dz-preview .dz-error-message:after
{
	content: "";
	position: absolute;
	top: -6px;
	left: 64px;
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid #BE2626;
}

/* Loading spinner overlay */
        .loading-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 9999;
            display: none;
            justify-content: center;
            align-items: center;
        }

        /* Spinner animation */
        .spinner {
            width: 40px;
            height: 40px;
            border: 10px solid #BCAEAE;
            border-top: 10px solid rgba(0, 0, 0, 0.0);
            border-radius: 50%;
            animation: spin 1s linear infinite;
        }

        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        /* Optional: Style for loading text */
        .loading-text {
            margin-top: 20px;
            font-family: Arial, sans-serif;
            font-size: 16px;
            color: #555;
        }

        /* Prevent scrolling when loading */
        body.loading {
            overflow: hidden;
        }

        /* Alternative spinner styles - uncomment to use */
        /*
        .spinner-dots {
            display: inline-block;
            position: relative;
            width: 80px;
            height: 80px;
        }
        
        .spinner-dots div {
            position: absolute;
            top: 33px;
            width: 13px;
            height: 13px;
            border-radius: 50%;
            background: #3498db;
            animation-timing-function: cubic-bezier(0, 1, 1, 0);
        }
        
        .spinner-dots div:nth-child(1) {
            left: 8px;
            animation: spinner-dots1 0.6s infinite;
        }
        
        .spinner-dots div:nth-child(2) {
            left: 8px;
            animation: spinner-dots2 0.6s infinite;
        }
        
        .spinner-dots div:nth-child(3) {
            left: 32px;
            animation: spinner-dots2 0.6s infinite;
        }
        
        .spinner-dots div:nth-child(4) {
            left: 56px;
            animation: spinner-dots3 0.6s infinite;
        }
        
        @keyframes spinner-dots1 {
            0% { transform: scale(0); }
            100% { transform: scale(1); }
        }
        
        @keyframes spinner-dots3 {
            0% { transform: scale(1); }
            100% { transform: scale(0); }
        }
        
        @keyframes spinner-dots2 {
            0% { transform: translate(0, 0); }
            100% { transform: translate(24px, 0); }
        }
        */