/*
La palette et les polices s'appliquent à tout le site, pas seulement aux pages
WooCommerce : sinon l'accueil et les pages statiques restent en blanc avec les polices
système, et le décalage avec la boutique se voit immédiatement.
*/
body {
	background-color: var(--color-background);
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: var(--font-size-base);
	line-height: var(--line-height-base);
}

/*
Astra habille les titres via `.entry-content :where(h1, h2, …)`. `:where()` n'ajoute
aucune spécificité, mais `.entry-content` en apporte une classe : un simple `h1` ne
gagne pas. D'où la liste préfixée par `.entry-content` en plus des sélecteurs nus.
*/
h1,
h2,
h3,
h4,
.entry-title,
.site-title,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content .wp-block-heading {
	font-family: var(--font-heading);
	font-weight: var(--font-weight-heading);
	line-height: var(--line-height-heading);
	color: var(--color-text);
}

/*
Les couleurs de lien ne sont pas corrigées ici : Astra les imprime en ligne après
cette feuille, avec la même spécificité, donc il gagnerait. Elles lui sont données à
la source dans inc/astra-integration.php. La règle ci-dessous ne sert qu'aux liens
qu'Astra ne cible pas.
*/
a {
	color: var(--color-accent-text);
}

a:hover,
a:focus {
	color: var(--color-accent-hover);
}

/*
Astra peint son en-tête, son pied de page et ses conteneurs de contenu en blanc via
ses propres réglages. On les ramène au crème, sinon des bandes blanches subsistent
en haut et en bas de chaque page.
*/
.site-header,
.ast-primary-header-bar,
.ast-header-break-point .site-header,
.site-footer,
.ast-small-footer,
#content,
.site-content,
.ast-container,
.ast-separate-container,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post {
	background-color: var(--color-background);
}

/* Filets de séparation d'Astra, ramenés au ton de la palette. */
.site-header,
.ast-small-footer {
	border-color: var(--color-border);
}

/*
Libellé en capitales espacées — le motif typographique récurrent de la direction.
Réutilisé par les composants via cette classe plutôt que redéclaré à chaque fois.
*/
.lingerie-label {
	display: block;
	font-family: var(--font-body);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-bold);
	letter-spacing: var(--letter-spacing-label);
	text-transform: uppercase;
	color: var(--color-text-muted);
}
