/* 450.fm — Glossaire dynamique */
.fm450-glo {
	--glo-ink: #0f1b3d;
	--glo-blue: #17399e;
	--glo-sky: #4db2ec;
	--glo-gold: #c9a24a;
	--glo-line: #eaeaea;
	--glo-soft: #f4f7fb;
	font-family: "Open Sans", Arial, sans-serif;
	color: #222;
	margin: 0 0 40px;
}
.fm450-glo *, .fm450-glo *::before, .fm450-glo *::after { box-sizing: border-box; }

/* Bandeau */
.fm450-glo__hero {
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	padding: 38px 32px 30px;
	background: radial-gradient(120% 140% at 100% 0%, #2a4fc4 0%, var(--glo-blue) 35%, var(--glo-ink) 100%);
	color: #fff;
}
.fm450-glo__hero-mark {
	position: absolute; right: -40px; top: -40px; width: 260px; height: 260px; opacity: .10;
	background:
		linear-gradient(45deg, transparent 47%, #fff 47%, #fff 53%, transparent 53%),
		linear-gradient(-45deg, transparent 47%, #fff 47%, #fff 53%, transparent 53%);
	border: 6px solid #fff; transform: rotate(45deg); border-radius: 6px;
}
/* Couleurs verrouillées : le thème (.tagdiv-type p, h2…) ne doit jamais assombrir le texte du bandeau. */
.fm450-glo .fm450-glo__hero .fm450-glo__kicker {
	margin: 0 0 6px !important; font: 500 12px/1 Rubik, sans-serif; letter-spacing: .14em; text-transform: uppercase;
	color: #e6c46e !important; -webkit-text-fill-color: #e6c46e;
}
.fm450-glo .fm450-glo__hero .fm450-glo__title {
	margin: 0 0 8px !important; font: 500 32px/1.15 Rubik, sans-serif; border: 0; padding: 0;
	color: #fff !important; -webkit-text-fill-color: #fff;
}
.fm450-glo .fm450-glo__hero .fm450-glo__sub {
	margin: 0 0 22px !important; font-size: 15px; line-height: 1.5;
	color: #fff !important; -webkit-text-fill-color: #fff; opacity: .92;
}
.fm450-glo .fm450-glo__hero .fm450-glo__sub strong { color: #fff !important; -webkit-text-fill-color: #fff; }

.fm450-glo__search {
	position: relative; display: flex; gap: 8px; max-width: 720px;
}
.fm450-glo__search svg {
	position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; margin-top: -10px;
	fill: none; stroke: #8a94a8; stroke-width: 2; pointer-events: none;
}
.fm450-glo .fm450-glo__input {
	flex: 1; min-width: 0; height: 52px; margin: 0; padding: 0 16px 0 46px;
	border: 0; border-radius: 10px; background: #fff; color: #111;
	font: 400 16px "Open Sans", sans-serif; box-shadow: 0 6px 24px rgba(0,0,0,.25);
}
.fm450-glo .fm450-glo__input:focus { outline: 3px solid var(--glo-sky); outline-offset: 0; }
.fm450-glo .fm450-glo__random {
	height: 52px; padding: 0 18px; border: 1px solid rgba(255,255,255,.4); border-radius: 10px;
	background: rgba(255,255,255,.08); color: #fff !important; -webkit-text-fill-color: #fff; font: 500 14px Rubik, sans-serif; cursor: pointer; white-space: nowrap;
}
.fm450-glo .fm450-glo__random:hover { background: rgba(255,255,255,.18); }

/* Le thème Newspaper met overflow:hidden sur #td-outer-wrap, ce qui casse position:sticky */
body:has(.fm450-glo) #td-outer-wrap { overflow: clip; }

.fm450-glo__filters { margin: 16px 0 0; }

/* Barre collante : lettres */
.fm450-glo__bar {
	position: sticky; top: 0; z-index: 20;
	margin: 4px 0 8px; padding: 10px 0 8px;
	background: rgba(255,255,255,.97); backdrop-filter: blur(6px);
	border-bottom: 1px solid var(--glo-line);
}
.admin-bar .fm450-glo__bar { top: 32px; }
.fm450-glo__letters { display: flex; flex-wrap: wrap; gap: 4px; }
.fm450-glo .fm450-glo__letter {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 34px; height: 34px; padding: 0 8px; border-radius: 8px;
	border: 1px solid var(--glo-line); background: #fff; color: var(--glo-ink);
	font: 500 15px Rubik, sans-serif; text-decoration: none; cursor: pointer; transition: all .15s;
}
.fm450-glo .fm450-glo__letter:hover { border-color: var(--glo-sky); color: var(--glo-blue); }
.fm450-glo .fm450-glo__letter.is-active { background: var(--glo-blue); border-color: var(--glo-blue); color: #fff; }
.fm450-glo .fm450-glo__letter.is-all { padding: 0 12px; }
.fm450-glo .fm450-glo__letter.is-empty,
.fm450-glo .fm450-glo__letter[aria-disabled="true"] { opacity: .3; pointer-events: none; }

.fm450-glo__types { display: flex; flex-wrap: wrap; gap: 6px; }
.fm450-glo .fm450-glo__chip {
	padding: 6px 12px; border-radius: 999px; border: 1px solid var(--glo-line); background: var(--glo-soft);
	color: #333; font: 400 13px "Open Sans", sans-serif; cursor: pointer; line-height: 1.2;
}
.fm450-glo .fm450-glo__chip span { color: #8a94a8; font-size: 12px; margin-left: 2px; }
.fm450-glo .fm450-glo__chip:hover { border-color: var(--glo-sky); }
.fm450-glo .fm450-glo__chip.is-active { background: var(--glo-ink); border-color: var(--glo-ink); color: #fff; }
.fm450-glo .fm450-glo__chip.is-active span { color: var(--glo-gold); }
.fm450-glo__meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 6px 0 0; }
.fm450-glo .fm450-glo__status { margin: 0 !important; font-size: 13px; color: #6b7280; min-height: 1em; }
.fm450-glo .fm450-glo__per {
	display: none; align-items: center; gap: 6px; margin: 0; flex: 0 0 auto;
	font: 400 13px "Open Sans", sans-serif; color: #6b7280; white-space: nowrap;
}
.fm450-glo.is-js .fm450-glo__per { display: inline-flex; } /* Inutile sans JS : tout est affiché. */
.fm450-glo .fm450-glo__per-select {
	width: auto; height: 30px; margin: 0; padding: 0 26px 0 10px; border: 1px solid var(--glo-line); border-radius: 8px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%230f1b3d'/%3E%3C/svg%3E") no-repeat right 9px center;
	-webkit-appearance: none; appearance: none; color: var(--glo-ink); font: 500 13px Rubik, sans-serif; cursor: pointer;
}
.fm450-glo .fm450-glo__per-select:focus { outline: 2px solid var(--glo-sky); outline-offset: 1px; }

/* Sections */
.fm450-glo__section { padding-top: 18px; scroll-margin-top: 150px; content-visibility: auto; contain-intrinsic-size: auto 1200px; }
.fm450-glo .fm450-glo__h {
	display: flex; align-items: baseline; gap: 12px; margin: 0 0 12px; padding: 0 0 8px;
	border-bottom: 2px solid var(--glo-ink); font: 500 30px/1 Rubik, sans-serif; color: var(--glo-blue);
}
.fm450-glo .fm450-glo__h small { font: 400 13px "Open Sans", sans-serif; color: #8a94a8; }

.fm450-glo .fm450-glo__list {
	list-style: none; margin: 0; padding: 0;
	columns: 3 260px; column-gap: 28px;
}
.fm450-glo .fm450-glo__list li {
	break-inside: avoid; margin: 0; padding: 5px 0 5px 12px; border-left: 2px solid transparent;
	font-size: 14px; line-height: 1.4; list-style: none;
}
.fm450-glo .fm450-glo__list li::before { display: none; }
.fm450-glo .fm450-glo__list li:hover { border-left-color: var(--glo-sky); background: var(--glo-soft); }
.fm450-glo .fm450-glo__list a { color: #1a1a1a; text-decoration: none; }
.fm450-glo .fm450-glo__list a:hover { color: var(--glo-blue); text-decoration: underline; }
.fm450-glo .fm450-glo__list em {
	display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 4px; vertical-align: 1px;
	background: var(--glo-soft); color: #6b7280; font: normal 11px "Open Sans", sans-serif;
}
/* Pagination */
.fm450-glo__pager {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px;
	margin: 28px 0 0; padding: 18px 0 0; border-top: 1px solid var(--glo-line);
}
.fm450-glo .fm450-glo__page {
	min-width: 38px; height: 38px; padding: 0 10px; border-radius: 8px;
	border: 1px solid var(--glo-line); background: #fff; color: var(--glo-ink);
	font: 500 14px Rubik, sans-serif; cursor: pointer; line-height: 1;
}
.fm450-glo .fm450-glo__page:hover:not(:disabled) { border-color: var(--glo-sky); color: var(--glo-blue); }
.fm450-glo .fm450-glo__page.is-current { background: var(--glo-blue); border-color: var(--glo-blue); color: #fff; cursor: default; }
.fm450-glo .fm450-glo__page:disabled { opacity: .35; cursor: default; }
.fm450-glo__dots { color: #8a94a8; padding: 0 2px; }

.fm450-glo .fm450-glo__empty { padding: 30px 0; text-align: center; color: #6b7280; font-size: 15px; }

/* Sans JS : tout reste visible. Avec JS : seuls les éléments filtrés sont masqués. */
.fm450-glo [hidden] { display: none !important; }

@media (max-width: 767px) {
	.fm450-glo__hero { padding: 26px 18px 20px; border-radius: 0; margin: 0 -15px; }
	.fm450-glo .fm450-glo__title { font-size: 25px; }
	.fm450-glo__search { flex-wrap: wrap; }
	.fm450-glo .fm450-glo__random { height: 40px; }
	.fm450-glo__letters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
	.fm450-glo__letters::-webkit-scrollbar { display: none; }
	.fm450-glo .fm450-glo__letter { flex: 0 0 auto; }
	.fm450-glo__types { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
	.fm450-glo__types::-webkit-scrollbar { display: none; }
	.fm450-glo .fm450-glo__chip { flex: 0 0 auto; }
	.fm450-glo .fm450-glo__list { columns: 1; }
	.fm450-glo .fm450-glo__page { min-width: 34px; height: 36px; padding: 0 8px; }
	/* Numéros sur une ligne, Précédent / Suivant côte à côte en dessous. */
	.fm450-glo__pager::after { content: ""; flex-basis: 100%; order: 1; }
	.fm450-glo .fm450-glo__page.is-prev, .fm450-glo .fm450-glo__page.is-next { flex: 1 1 40%; order: 2; }
}
