/*
 * Corrections globales, chargées après Bootstrap 3 et la CSS compilée : pas de recompilation Grunt nécessaire.
 */

/* Taille de texte. Bootstrap 3 fixe html { font-size: 10px } et body { font-size: 14px } :
 * on revient à la base de 16 px prévue par Astra, dont toutes les tailles sont en rem. */
html {
	font-size: 100%;
}

body {
	font-size: 16px;
	/* Les bandeaux en 100vw débordent de la largeur de la barre de défilement : pas de défilement horizontal. */
	overflow-x: clip;
}

/* Les deux tailles en rem de la CSS compilée valaient 20 et 12 px avec la base Bootstrap : fixées en px. */
.publications-list-results article h2,
.post-type-archive-publication article h2,
.tax-tag-technology article h2,
.single-publication article h2 {
	font-size: 24px;
}

.publications-list-results article .pdf-included,
.post-type-archive-publication article .pdf-included,
.tax-tag-technology article .pdf-included,
.single-publication article .pdf-included {
	font-size: 14px;
}

/* Espace avant le pied de page (sauf l'accueil, dont le dernier bloc va jusqu'au bord). */
body:not(.home) .site-footer {
	margin-top: 48px;
}

/* Titre des pages d'archive : bandeau sombre pleine largeur, collé à l'en-tête, comme le titre des pages. */
body.archive #primary {
	margin-top: 0 !important;
}

body.archive .ast-archive-description {
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	max-width: 100vw;
	width: 100vw;
	background-color: #001a46;
	padding: 20px;
	/* Fond de page visible entre le bandeau et le premier article, plus discret qu'en bas de page. */
	margin-bottom: 32px;
}

body.archive .ast-archive-description .ast-archive-title {
	max-width: var(--ast-normal-container-width, 1200px);
	margin: 0 auto;
	color: #ffffff;
}

body.archive .ast-archive-description p {
	max-width: var(--ast-normal-container-width, 1200px);
	margin: 10px auto 0;
	color: #e2e8f0;
}

/* Filtres : un fieldset prend par défaut la largeur de son contenu le plus long (min-width: min-content) ;
 * la liste des revues, dont certains noms sont très longs, débordait donc sur mobile. */
.js-filter-form fieldset {
	min-width: 0;
}

.js-filter-form select {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	border: 1px solid grey;
	border-radius: 4px;
}

/* Bouton « Filter » et choix du nombre de résultats par page sur une même ligne. */
.js-filter-form .form-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
}

.js-filter-form .per-page-field {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-weight: 400;
}

.js-filter-form .per-page-field select {
	width: auto;
	min-width: 5em;
}

/* Menu principal : icônes devant les libellés, bouton de thème clair / sombre. */
.st-menu-icon {
	margin-right: 8px;
	vertical-align: -3px;
}

.st-theme-toggle {
	background: none;
	border: 0;
	color: inherit;
	cursor: pointer;
	font: inherit;
	text-align: left;
}

.st-theme-toggle:hover,
.st-theme-toggle:focus {
	background: none;
	color: var(--ast-global-color-0);
}

/* Desktop : bouton réduit à l'icône. Menu mobile : icône et libellé. */
.ast-desktop .st-theme-toggle-label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.st-theme-toggle .st-icon-sun,
html[data-theme="dark"] .st-theme-toggle .st-icon-moon {
	display: none;
}

html[data-theme="dark"] .st-theme-toggle .st-icon-sun {
	display: inline;
}

/* Bandeau « Filters » : vrai bouton (accessible au clavier) à la place de l'ancienne balise <btn>. */
.panel-heading .panel-title .filters-toggle {
	background: none;
	border: 0;
	border-radius: 0;
	color: inherit;
	font: inherit;
	text-align: left;
}

.filters-count {
	display: inline-block;
	margin-left: 8px;
	padding: 1px 9px;
	border-radius: 999px;
	background-color: rgba(255, 255, 255, 0.2);
	font-size: 14px;
	font-weight: 400;
}

.filters-count[hidden] {
	display: none;
}

/* Ligne du bas des filtres : boutons à gauche, tri et nombre par page à droite. */
.js-filter-form .form-actions-buttons,
.js-filter-form .form-actions-options {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
}

.js-filter-form .form-actions-buttons {
	gap: 12px;
}

/* Fiche : année, revue et thèmes, chacun avec son libellé et sa couleur. */
.publication--facts {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 10px 12px;
}

/* Libellé au-dessus de ses boutons, aligné à gauche. */
.publication--fact {
	display: inline-flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	max-width: 100%;
}

.publication--fact-links {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 6px;
}

/* Annule la marge de .single-publication article .tag-list .tag : l'espacement vient de gap. */
.publication--facts .publication--fact-links .tag.btn {
	margin: 0;
}

.publication--fact-label {
	font-size: 0.8rem;
	font-weight: 600;
	color: #475569;
}

/* Les noms de revues longs passent à la ligne dans le bouton. */
.publication--meta .publication-journal {
	max-width: 100%;
	white-space: normal;
	text-align: left;
}

.publication--facts .btn.publication-year,
.publication--facts .btn.publication-journal,
.publication--facts .btn.publication-topic {
	background-image: none;
	box-shadow: none;
	text-shadow: none;
}

.publication--facts .btn.publication-year {
	background-color: #f1f5f9;
	border-color: #cbd5e1;
	color: #334155;
}

.publication--facts .btn.publication-journal {
	background-color: #e0edff;
	border-color: #a9c7ee;
	color: #0b4a8f;
}

.publication--facts .btn.publication-topic {
	background-color: #e6f4ea;
	border-color: #b1dcbc;
	color: #146c2e;
}

.publication--facts .btn.publication-year:hover,
.publication--facts .btn.publication-year:focus {
	border-color: #475569;
}

.publication--facts .btn.publication-journal:hover,
.publication--facts .btn.publication-journal:focus {
	border-color: #0b4a8f;
}

.publication--facts .btn.publication-topic:hover,
.publication--facts .btn.publication-topic:focus {
	border-color: #146c2e;
}

html[data-theme="dark"] .publication--fact-label {
	color: var(--st-text);
}

html[data-theme="dark"] .publication--facts .btn.publication-year {
	background-color: var(--st-surface-2);
	border-color: var(--st-border);
	color: var(--ast-global-color-2);
}

html[data-theme="dark"] .publication--facts .btn.publication-journal {
	background-color: rgba(108, 180, 245, 0.16);
	border-color: rgba(108, 180, 245, 0.45);
	color: #a8d3fa;
}

html[data-theme="dark"] .publication--facts .btn.publication-topic {
	background-color: rgba(0, 163, 42, 0.18);
	border-color: rgba(126, 226, 160, 0.4);
	color: #7ee2a0;
}

/* Fiche publication : retour à la liste, outils de citation. */
.publication--back {
	margin-bottom: 16px;
}

.publication--cite {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 24px;
}

.publication--cite .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	vertical-align: -3px;
}

/* Accessibilité : contour net autour de l'élément actif au clavier (Astra n'affiche qu'un fin pointillé). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible,
.select2-container--focus .select2-selection {
	outline: 3px solid var(--ast-global-color-0) !important;
	outline-offset: 2px;
}

/* Lien « Skip to content » d'Astra : visible quand il reçoit le focus clavier. */
.skip-link.screen-reader-text:focus {
	clip: auto !important;
	clip-path: none;
	height: auto;
	width: auto;
	left: 8px;
	top: 8px;
	z-index: 100000;
	padding: 12px 20px;
	background-color: #ffffff;
	color: #001a46;
	font-size: 16px;
	font-weight: 600;
}

/* Sur le bandeau bleu, contour blanc à l'intérieur. */
.panel-heading .filters-toggle:focus-visible {
	outline-color: #ffffff !important;
	outline-offset: -5px;
}

/* Bootstrap 3 entoure aussi les boutons après un clic de souris : contour réservé au clavier. */
.btn:focus:not(:focus-visible),
.btn:active:focus:not(:focus-visible) {
	outline: none;
}

/* Logo devant le titre du site (Header_Menu::add_logo). */
.ast-site-identity {
	display: flex;
	align-items: center;
	gap: 12px;
}

.st-logo {
	display: block;
	flex: none;
	line-height: 0;
}

.st-logo svg {
	width: 40px;
	height: 40px;
}

/* En-tête collant, replié en descendant et déplié en remontant (assets/js/header.js). */
#masthead {
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 1px 6px rgb(0 0 0 / 0.1);
	transition: transform 0.4s ease-in-out;
}

#masthead.is-hidden {
	transform: translateY(-100%);
}

/* Barre d'administration de WordPress (connecté) : l'en-tête se colle sous elle. */
.admin-bar #masthead {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar #masthead {
		top: 46px;
	}
}

@media (prefers-reduced-motion: reduce) {
	#masthead {
		transition: none;
	}
}

/* Ancres et retour en haut des résultats : la cible ne passe pas sous l'en-tête. */
#filter-panel {
	scroll-margin-top: 96px;
}