/*
Theme Name:   Photography Child — Marc Jortay
Theme URI:    https://marcjortay.be/
Description:  Thème enfant de « Photography ». Contient la navigation croisée du pied de page entre les 4 univers (peinture, photographie, phobleaux, livres). Toute personnalisation doit vivre ici : le thème parent ne doit plus jamais être modifié, sous peine d'être écrasé à la moindre mise à jour.
Author:       Marc Jortay
Template:     photography
Version:      1.0.0
Text Domain:  photography-child
*/

/* ==========================================================================
   Navigation croisée du pied de page
   ========================================================================== */

.mj-footer-nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 12px;
	margin: 24px 0 8px;

	/* Le conteneur du pied de page est un contexte flex : sans ces trois
	   déclarations, ce bloc se rétrécit sur son contenu et « justify-content:
	   center » ne centre qu'à l'intérieur de lui-même, laissant les boutons
	   calés à gauche du pied de page. */
	width: 100%;
	flex: 0 0 100%;
	align-self: stretch;

	box-sizing: border-box;
	text-align: center;
}

/* .button est la classe du thème parent : on hérite de son habillage
   et on ne surcharge que la mise en page. */
.mj-footer-nav .button {
	margin: 0;
	max-width: 100%;
}

.mj-footer-nav .button i {
	margin-left: 6px;
}

/* Quand les 3 boutons ne tiennent plus sur une ligne, flex-wrap les répartit
   et justify-content les recentre : rien de particulier à prévoir aux largeurs
   intermédiaires. Sous 600 px, on les empile en pleine largeur pour rester
   confortables au doigt. */
@media screen and (max-width: 600px) {
	.mj-footer-nav {
		gap: 10px;
	}

	.mj-footer-nav .button {
		flex: 1 1 100%;
		text-align: center;
	}
}

/* Texte de copyright : centré, sur sa propre ligne au-dessus des boutons.
   Attention : « footer_bar_wrapper » est une CLASSE, pas un identifiant.
   Le parent applique float:left et une largeur fixe au copyright ; comme le
   conteneur du pied de page est un contexte flex, il faut occuper toute la
   largeur pour que le centrage porte sur le pied de page et non sur le texte. */
.footer_bar_wrapper #copyright {
	float: none;
	width: 100%;
	flex: 0 0 100%;
	margin: 0 auto 4px;
	padding-left: 0;
	padding-right: 0;
	text-align: center;
	box-sizing: border-box;
}