/*
 * Habillage du site : en-tête et pied d'après la maquette (sources/maquette/evenement.html).
 * FICHIER DU SITE (la mise à niveau n'y touche pas). Chargé par la base (inc/assets.php, poignée
 * dqb-site) après ses feuilles et celles des composants, avant les sections.
 */

/* Page sombre : contrôles natifs et barres de défilement sombres, comme la maquette. */
html {
	color-scheme: dark;
}

/* Page Commande et confirmation : la suite du tunnel d'inscription, sur son fond clair, d'un
   bord à l'autre entre l'en-tête et le pied (sections/inscription/inscription.css). */
.woocommerce-checkout main {
	background: var(--couleur-tunnel-fond);
	color-scheme: light;
}

/* En-tête : barre simple, non collante, comme la maquette ; positionnée pour garder le z-index
   de la base (le panneau du burger passe au-dessus de la page). */
.dqb-entete {
	position: relative;
}

/* Barre sur toute la largeur, comme la maquette (sans conteneur), et à sa hauteur : 70 px trait
   compris. Le logo garde sa cible de 44 px, centrée dans la barre. */
.dqb-entete__barre {
	max-width: none;
	min-height: var(--hauteur-entete);
	padding-block: 0;
}

/* La maquette n'a pas de téléphone dans l'en-tête : il reste au pied. */
.dqb-entete__telephone {
	@media (min-width: 1200px) {
		display: none;
	}
}

/* Logo du client, un écusson détaillé : aussi haut que la barre le permet (la base le borne à 48 px). */
.dqb-entete .dqb-logo__image {
	max-height: var(--hauteur-logo-entete);
}

.dqb-logo__nom {
	font-size: var(--taille-logo);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* Logo en deux tons de la maquette : la fin du nom en gris (inc/projet.php la découpe). */
.dqb-logo__suite {
	color: var(--couleur-texte-doux);
}

/* Liens du menu : petits, atténués, le lien de la page en cours en blanc. */
.dqb-navigation .menu-item > a {
	color: var(--couleur-texte-doux);
	font-size: var(--taille-petite);
	font-weight: var(--graisse-texte);

	&:hover,
	&[aria-current="page"] {
		color: var(--couleur-texte);
		background: none;
	}
}

/* Pied : une ligne sombre sur toute la largeur, comme la maquette (sans conteneur) ; tout centré,
   empilé, à toutes les largeurs (demandes de l'humain, 28/10 en mobile, 02/11 sur grand écran :
   calé à gauche, il laissait la droite vide). */
.dqb-pied {
	margin-block-start: 0;
	padding-block: var(--espace-5);
	border-block-start: 1px solid var(--couleur-trait);
	background: var(--couleur-fond);
	color: var(--couleur-texte-doux);
	font-size: var(--taille-petite);
	text-align: center;

	& > .dqb-conteneur {
		max-width: none;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--espace-3);
	}

	& .dqb-pied__coordonnees .dqb-icone {
		display: none;
	}
}

.dqb-pied__grille {
	display: block;
}

.dqb-pied__marque,
.dqb-pied__coordonnees,
.dqb-pied__legal {
	justify-content: center;
}

.dqb-pied__marque {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	column-gap: var(--espace-4);
	row-gap: 0;
}

.dqb-pied__logo .dqb-logo__image {
	max-height: var(--hauteur-logo-pied);
}

.dqb-pied__logo .dqb-logo__nom {
	font-family: var(--police-texte);
	font-size: var(--taille-petite);
	letter-spacing: 0;
	text-transform: none;
}

.dqb-pied__coordonnees {
	flex-direction: row;
	flex-wrap: wrap;
	column-gap: var(--espace-4);
}

.dqb-pied__lien {
	align-items: center;
	padding-block: 0;
}

.dqb-pied__bas {
	justify-content: center;
	margin-block-start: 0;
	padding-block-start: 0;
	border-block-start: 0;
	font-size: inherit;
}

.dqb-pied__legal a:hover,
.dqb-pied__credit:hover {
	color: var(--couleur-texte);
}