body {
	--ok-message : #26bf26 ;
	--warning-message : #f0ac30 ;
	--error-message : #fd4f4f ;
}

#messages {
	position : fixed ;
	bottom : 0.4em ;
	right : 0.4em ;
	border-radius : 1em 1em 0 1em ;
	border : 1px solid darkgrey ;
	background-color : #EFEFEF ;
	max-width : 15em ;
	max-height : 60vh ;
	min-width : 1em ;
	min-height : 1em ;
	overflow-x : hidden ;
	overflow-y : auto ;
	z-index:100000;
}

#messages[size="small"] {
	max-width : 1em ;
	max-height : 1em ;
}

#messages span {
	display : block ;
	margin : 1em ;
	color : #0070C0 ;
}

#messages span.info {
	color: var(--ok-message);
}

#messages span.warning {
	color:orange;
	/* color:var(--warningMsg); */
	color:var(--warning-message);
}

#messages .error {
	/* color: var(--errorMsg) !important; */
	color: var(--error-message) !important;
	font-weight : 900 ;
	background-color:initial !important;
	opacity:initial !important;
	text-align:left !important;
	padding : 0 !important;
	width:auto !important;
	margin-left:1em !important;
	margin-top:1em !important;
	text-shadow:none !important;
	letter-spacing:0 !important;
}
#messages .oldError {
	color:#606060 !important;
	font-weight : 900 ;
}

#messages .avoidMessage {
	border: none;
	border-radius: 0.5em;
	font-size: 60%;
	display: inline-block;
	position: relative;
	left: 50%;
	transform: translate(-50%,0);
	margin-top: 0.5em;
	background-color: black;
	color: #EFEFEF;
}

#messages .avoidMessage:hover {
	font-size : 90% ;
	font-weight : 900 ;
}

#messages .nomDepartement {
	color : #E5C516 ;
	display : inline ;
	margin : 0 ;
}

#messages > .info >.title {
	color : #E5C516 ;
	font-variant: small-caps ;
	display : inline ;
	margin : 0 ;
}

#messages > .info > hr {
  margin-top: 0.7em;
  margin-bottom: 0.7em;
  border-color: white;
  border-width: 0.5px;
}

@media (prefers-color-scheme: dark) { 
	#messages {
		background-color : #424242 ;
	}

	body {
		--ok-message : #1bb370 ;
		--warning-message : #c4a366 ;
		--error-message : #e88 ;
	}
}