/**
 * Bannière d'avis bciti+.
 *
 * Les couleurs proviennent de variables injectées inline depuis les réglages,
 * ce qui permet de personnaliser sans surcharger la feuille de style.
 */

.bciti-nb {
	--bciti-nb-bg: #0b5fa5;
	--bciti-nb-text: #ffffff;
	--bciti-nb-accent: #ffd166;
	--bciti-nb-urgent-bg: #b3261e;
	--bciti-nb-urgent-text: #ffffff;
	--bciti-nb-radius: 0px;
	--bciti-nb-max-width: none;

	position: relative;
	z-index: 9;
	box-sizing: border-box;
	width: 100%;
	font-family: inherit;
	line-height: 1.45;
}

.bciti-nb *,
.bciti-nb *::before,
.bciti-nb *::after {
	box-sizing: border-box;
}

.bciti-nb[hidden],
.bciti-nb__item[hidden],
.bciti-nb__detail[hidden] {
	display: none;
}

/* --- Bloc d'un avis --- */

.bciti-nb__item {
	background-color: var(--bciti-nb-bg);
	color: var(--bciti-nb-text);
	border-radius: var(--bciti-nb-radius);
}

.bciti-nb__item.is-urgent {
	background-color: var(--bciti-nb-urgent-bg);
	color: var(--bciti-nb-urgent-text);
}

.bciti-nb__inner {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	max-width: var(--bciti-nb-max-width);
	margin: 0 auto;
	padding: 0.7rem 1.25rem;
}

.bciti-nb--card {
	padding: 1rem;
}

.bciti-nb--card .bciti-nb__item {
	--bciti-nb-radius: 8px;

	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
}

/* --- Contenu --- */

.bciti-nb__icon {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	margin-top: 0.1rem;
}

.bciti-nb__body {
	flex: 1 1 auto;
	min-width: 0;
}

.bciti-nb__category {
	margin: 0 0 0.1rem;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--bciti-nb-accent);
	opacity: 0.95;
}

/* Le titre est un <p> : aucune règle de titre du thème ne s'y applique. Les
   réinitialisations ci-dessous neutralisent malgré tout les thèmes qui stylent
   les paragraphes de façon agressive. */
.bciti-nb .bciti-nb__title {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: normal;
	text-transform: none;
	text-shadow: none;
	color: inherit;
}

/* max-height est piloté en JS, à partir de la hauteur réelle du contenu : une
   valeur fixe tronquerait un résumé long. */
.bciti-nb__summary {
	margin: 0.2rem 0 0;
	overflow: hidden;
	font-size: 0.88rem;
	color: inherit;
	transition: max-height 0.35s ease, opacity 0.2s ease, margin-top 0.35s ease;
}

/* Vue longue : le résumé s'escamote au profit de la description. */
.bciti-nb__item.is-expanded .bciti-nb__summary {
	margin-top: 0;
	opacity: 0;
}

.bciti-nb__period {
	margin: 0.2rem 0 0;
	font-size: 0.76rem;
	opacity: 0.85;
}

/* max-height est piloté en JS pour animer vers la hauteur réelle du contenu. */
.bciti-nb__detail {
	margin-top: 0.4rem;
	overflow: hidden;
	font-size: 0.88rem;
	transition: max-height 0.35s ease;
}

@media (prefers-reduced-motion: reduce) {
	.bciti-nb__summary,
	.bciti-nb__detail {
		transition: none;
	}
}

.bciti-nb__detail p {
	margin: 0 0 0.5em;
	font-size: inherit;
	line-height: 1.5;
	color: inherit;
}

/* Sous-titres issus des <h1>…<h6> de la description, convertis côté serveur.
   Même corps que le texte, simplement mis en gras — comme dans une infolettre
   rendue en web. */
.bciti-nb .bciti-nb__subhead {
	margin: 0.9em 0 0.25em;
	font-family: inherit;
	font-size: 1em;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: normal;
	text-transform: none;
	text-shadow: none;
	color: inherit;
}

/* Filet de sécurité : si un titre survit à la conversion (template surchargé,
   markup inattendu), il ne doit pas pouvoir prendre la taille du thème. */
.bciti-nb .bciti-nb__detail h1,
.bciti-nb .bciti-nb__detail h2,
.bciti-nb .bciti-nb__detail h3,
.bciti-nb .bciti-nb__detail h4,
.bciti-nb .bciti-nb__detail h5,
.bciti-nb .bciti-nb__detail h6 {
	margin: 0.9em 0 0.25em;
	padding: 0;
	font-family: inherit;
	font-size: 1em;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: normal;
	text-transform: none;
	color: inherit;
}

.bciti-nb__detail ul,
.bciti-nb__detail ol {
	margin: 0 0 0.5em;
	padding-left: 1.4em;
}

.bciti-nb__detail li {
	margin: 0 0 0.15em;
	font-size: inherit;
}

.bciti-nb__detail img {
	max-width: 100%;
	height: auto;
}

.bciti-nb__detail > :first-child,
.bciti-nb__detail .bciti-nb__subhead:first-child {
	margin-top: 0;
}

.bciti-nb__detail > :last-child {
	margin-bottom: 0;
}

.bciti-nb__detail a {
	color: inherit;
	text-decoration: underline;
}

/* --- Contrôles --- */

.bciti-nb__toggle {
	margin-top: 0.5rem;
	padding: 0;
	font: inherit;
	font-size: 0.85rem;
	font-weight: 600;
	color: inherit;
	background: none;
	border: 0;
	border-bottom: 1px solid currentColor;
	cursor: pointer;
}

.bciti-nb__nav {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 0.35rem;
}

.bciti-nb__arrow,
.bciti-nb__dismiss {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 1.9rem;
	height: 1.9rem;
	padding: 0;
	font-family: inherit;
	line-height: 1;
	color: inherit;
	background: rgba(255, 255, 255, 0.14);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
}

.bciti-nb__arrow {
	font-size: 1.25rem;
}

.bciti-nb__dismiss {
	font-size: 1.35rem;
	background: transparent;
}

.bciti-nb__arrow:hover,
.bciti-nb__dismiss:hover {
	background: rgba(255, 255, 255, 0.28);
}

.bciti-nb__counter {
	font-size: 0.78rem;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	opacity: 0.9;
}

/* Focus visible garanti quel que soit le thème. */
.bciti-nb button:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* --- Responsive --- */

@media (max-width: 640px) {
	.bciti-nb__inner {
		flex-wrap: wrap;
		padding: 0.8rem 1rem;
	}

	.bciti-nb__body {
		flex: 1 1 100%;
		order: 2;
	}

	.bciti-nb__icon {
		order: 1;
	}

	.bciti-nb__nav {
		order: 3;
		width: 100%;
		justify-content: center;
		margin-top: 0.5rem;
	}

	.bciti-nb__dismiss {
		order: 1;
		margin-left: auto;
	}

	.bciti-nb .bciti-nb__title {
		font-size: 0.92rem;
	}
}

/* --- Impression --- */

@media print {
	.bciti-nb__arrow,
	.bciti-nb__dismiss,
	.bciti-nb__toggle {
		display: none;
	}

	.bciti-nb__item {
		color: #000;
		background: none;
		border: 1px solid #000;
	}

	.bciti-nb__item[hidden] {
		display: block;
	}
}