/* ==========================================================================
   Compatibilité Bootstrap 4.2.1 -> Bootstrap 5.3.8  (site cbdi38 / Ueno)

   Chargée juste APRÈS bootstrap-5.3.8.min.css et AVANT style.css (Ueno)
   et perso.css : elle occupe dans la cascade la place qu'avait Bootstrap 4,
   donc style.css et perso.css continuent de l'emporter comme avant.

   Objectif : retrouver le rendu Bootstrap 4 là où Bootstrap 5 a changé
   le comportement de classes ou de balises utilisées par le site.
   Pour revenir à Bootstrap 4 : restaurer inc/inc_head.html.bs4.
   ========================================================================== */


/* --- Grille ------------------------------------------------------------- */

/* BS5 ajoute un palier >= 1400px (conteneur 1320px). Le bandeau du site est
   calculé pour 1140px (image_reduire{1140,292}, hauteur 292px dans perso.css) :
   on plafonne le conteneur à 1140px comme en BS4. */
@media (min-width: 1400px) {
	.container {
		max-width: 1140px;
	}
}

/* Gouttières : 1.5rem (24px) en BS5, 30px en BS4. */
.container,
.row {
	--bs-gutter-x: 30px;
}

/* En BS4, toutes les colonnes étaient en position:relative. Indispensable
   ici : le lien d'accueil du bandeau (a#toHome::after, inset:0 dans
   perso.css) doit rester limité à .header-main, sinon il recouvre le menu. */
.col,
.col-auto,
[class^="col-"],
[class*=" col-"] {
	position: relative;
}

/* La zone de recherche du bandeau est une colonne (.col-sm-3) placée hors
   d'une .row : BS5 ne lui donne plus ni marge intérieure, ni pleine largeur
   sur mobile. */
.header-sidebar {
	padding-left: 15px;
	padding-right: 15px;
}
@media (max-width: 575.98px) {
	.header-sidebar {
		width: 100%;
	}
}

/* En BS5, « .row > * » s'applique à TOUS les enfants directs d'une .row,
   pas seulement aux colonnes (marge intérieure, flex-shrink:0).
   - logos partenaires du pied de page : pas de marge intérieure en BS4
     (perso.css garde la main sous 576px avec « padding: 0 2px ») ;
   - blocs de la barre latérale : ils doivent pouvoir rétrécir, sinon ils
     débordent de la colonne sur mobile. */
.footer-logos {
	padding-left: 0;
	padding-right: 0;
}
.row > .bloc {
	flex-shrink: 1;
}


/* --- Liens -------------------------------------------------------------- */

/* BS5 souligne tous les liens ; BS4 ne les soulignait qu'au survol. */
a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}


/* --- Typographie -------------------------------------------------------- */

/* BS5 réduit les titres sous 1200px (tailles « responsives »).
   Tailles fixes de BS4 ; style.css garde ses propres tailles sous 768px. */
h1, .h1 { font-size: 2.5rem; }
h2, .h2 { font-size: 2rem; }
h3, .h3 { font-size: 1.75rem; }
h4, .h4 { font-size: 1.5rem; }

small,
.small {
	font-size: 80%;
}

/* Listes : BS5 force 2rem de retrait, BS4 laissait celui du navigateur. */
ol,
ul {
	padding-left: 40px;
}

/* Filet : BS5 le rend à 25 % d'opacité. */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
	opacity: 1;
	color: gray; /* couleur par défaut du navigateur, comme en BS4 */
	border: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}


/* --- Formulaires -------------------------------------------------------- */

/* BS5 rend les <legend> flottants (float:left), ce qui décale le contenu
   qui suit (formulaire Formidable, formulaire « écrire à l'auteur »). */
legend {
	float: none;
	width: 100%;
	max-width: 100%;
	white-space: normal;
	font-size: 1.5rem; /* style.css (1.2rem) reste prioritaire */
}
legend + * {
	clear: none;
}

/* BS4 mettait une marge sous les <label>. */
label {
	margin-bottom: 0.5rem;
}


/* --- Composants --------------------------------------------------------- */

/* Arrondis BS4 (boutons, alertes…) */
:root {
	--bs-border-radius: 0.25rem;
	--bs-border-radius-sm: 0.2rem;
	--bs-border-radius-lg: 0.3rem;
}

/* Pagination SPIP (div.pagination) : arrondi BS4 */
.pagination {
	border-radius: 0.25rem;
}

/* Couleurs BS4 du bouton principal (formulaire « écrire à l'auteur ») */
.btn-primary {
	--bs-btn-bg: #007bff;
	--bs-btn-border-color: #007bff;
	--bs-btn-hover-bg: #0069d9;
	--bs-btn-hover-border-color: #0062cc;
	--bs-btn-active-bg: #0062cc;
	--bs-btn-active-border-color: #005cbf;
	--bs-btn-focus-shadow-rgb: 38, 143, 255;
	--bs-btn-disabled-bg: #007bff;
	--bs-btn-disabled-border-color: #007bff;
}

/* Bouton « hamburger » du menu mobile (plugin responsiveMultiLevelMenu) :
   en BS5, un .btn sans variante devient transparent au survol / à l'appui. */
.btn.btn-navbar {
	--bs-btn-hover-bg: #aaa;
	--bs-btn-hover-color: inherit;
	--bs-btn-active-bg: #aaa;
	--bs-btn-active-color: inherit;
	--bs-btn-active-border-color: transparent;
}


/* --- Comportements globaux ---------------------------------------------- */

/* BS5 active le défilement doux sur toute la page, ce qui ralentit les
   défilements faits en jQuery (pagination ajax de SPIP, gui.js). */
:root {
	scroll-behavior: auto;
}

/* BS5 n'a plus de styles d'impression ; reprise des principaux de BS4
   (menu masqué, mise en page « bureau »). */
@media print {
	*,
	*::before,
	*::after {
		text-shadow: none !important;
		box-shadow: none !important;
	}
	a:not(.btn) {
		text-decoration: underline;
	}
	img,
	tr {
		page-break-inside: avoid;
	}
	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}
	h2,
	h3 {
		page-break-after: avoid;
	}
	body,
	.container {
		min-width: 992px !important;
	}
	.navbar {
		display: none;
	}
}