@keyframes red-blink-animation {
	0%, 100% {
		box-shadow: 0 0 0 4px #ff0000, 0 0 12px rgba(255, 0, 0, 0.9);
		outline: none;
	}
	50% {
		box-shadow: 0 0 0 0 transparent, 0 0 0 transparent;
		outline: none;
	}
}
#simulateur .tootltipButton.highlight-flash,
.tootltipButton.highlight-flash,
.tooltipss.highlight-flash,
.info-btn.highlight-flash,
.custom-input-group.highlight-flash {
	animation: red-blink-animation 0.5s ease-in-out 10 !important;
	border-radius: 4px !important;
	transition: all 0.2s ease !important;
	z-index: 99999 !important;
}
body, html {
	margin: 0 !important;
	padding: 0 !important;
}
.modal-backdrop {
	width: 150vw !important;
	height: 150vh !important;
	z-index: 100000 !important;
}
.modal {
	z-index: 100050 !important;
}
.subtitle-badge {
	position: absolute !important;
	left: 50% !important;
	top: 100% !important;
	transform: translate(-50%, -50%) !important;
	background-color: #b50000 !important;
	padding: 1.5px !important;
	clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 8px 100%, 0 50%) !important;
	z-index: 1000 !important;
}
.subtitle-badge-inner {
	background-color: #01677d !important;
	color: #ffffff !important;
	font-family: 'Albert Sans', 'Inter', sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	padding: 2px 20px !important;
	clip-path: polygon(7px 0, calc(100% - 7px) 0, 100% 50%, calc(100% - 7px) 100%, 7px 100%, 0 50%) !important;
	white-space: nowrap !important;
}
@media screen and (max-width: 991px) {
	.subtitle-badge {
		clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 50%, calc(100% - 6px) 100%, 6px 100%, 0 50%) !important;
	}
	.subtitle-badge-inner {
		font-size: 10px !important;
		padding: 1.5px 14px !important;
		clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 50%, calc(100% - 5px) 100%, 5px 100%, 0 50%) !important;
	}
}
@media screen and (max-width: 480px) {
	.subtitle-badge {
		clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 50%, calc(100% - 5px) 100%, 5px 100%, 0 50%) !important;
	}
	.subtitle-badge-inner {
		font-size: 9px !important;
		padding: 1px 10px !important;
		clip-path: polygon(4px 0, calc(100% - 4px) 0, 100% 50%, calc(100% - 4px) 100%, 4px 100%, 0 50%) !important;
	}
}
/* base.html.twig (spécificité de 3 id, comme le style inline remplacé) */
:is(.base__header, #_#_#_) {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 1040;
	border-bottom: 3px solid #CCA533;
}
:is(.base__header.base__header--admin, #_#_#_) {
	border-bottom-color: #b50000;
}
/* Mode administrateur : la barre rouge doit passer par-dessus le contenu du bandeau (icône du compte comprise).
   Un contenu qui déborde sur la bordure (qui est peinte avant lui) la masquait. Le pseudo-élément recouvre exactement
   la bordure de 3px (bottom: -3px = sous la zone de remplissage), au-dessus du contenu mais sous les menus déroulants
   (z-index 1000 pour .dropdown-menu), sans capter les clics. Valable sur bureau comme sur mobile (header position: fixed). */
:is(.base__header.base__header--admin, #_#_#_)::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -3px;
	height: 3px;
	background-color: #b50000;
	z-index: 900;
	pointer-events: none;
}
:is(.base__main-body-container, #_#_#_) {
	margin-top: 81px !important;
	position: relative !important;
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
}
