/*
Theme Name: Chocolaterie Enfant
Theme URI: https://example.com/chocolaterie-enfant
Template: twentytwentyfive
Author: Manon Valdonio
Author URI: https://example.com
Description: Thème enfant de Twenty Twenty-Five pour le site Chocolaterie.
Version: 1.4.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chocolaterie-enfant
*/

/*
 * Ajustements visuels "Chocolaterie" — s'appuient sur les variables CSS
 * générées par theme.json (--wp--preset--color--*, --wp--preset--font-family--*)
 * pour rester synchronisés avec la palette et les polices définies là-bas.
 *
 * Rôle des couleurs (voir theme.json) :
 *  - contrast (brun chocolat foncé #3B221B) : texte principal
 *  - base     (crème #EFE3DE)               : fond principal
 *  - accent-1 (olive clair/moutarde #AFA533) : accent clair, boutons (fond bouton)
 *  - accent-2 (bordeaux profond #580200)     : accent, hover
 *  - accent-3 (chocolat clair #563A3A)       : accent discret — sections
 *    alternées, badges, détails de carte.
 *  - accent-7 (olive foncé #695808)          : secondaire — liens, bouton outline
 * Le bleu pâle a été retiré de la palette.
 * Les couleurs elles-mêmes sont déjà posées par theme.json (elements.link et
 * elements.button) ; on ne fait ici que du polish (transitions, arrondis) et
 * un utilitaire "badge" pour l'accent chocolat clair.
 */

/* Articles de blog en grande largeur : la largeur "contenu" (645px) est alignée
   sur la largeur "wide" (1340px) uniquement sur les pages article, ce qui élargit
   automatiquement titre, image mise en avant et contenu sans toucher au template. */
body.single-post {
	--wp--style--global--content-size: var(--wp--style--global--wide-size);
}

/* Titre centré sur les pages présentes dans le menu (Nos créations, Nous découvrir, Passer commande) */
body.page-id-56 .wp-block-post-title,
body.page-id-57 .wp-block-post-title,
body.page-id-58 .wp-block-post-title {
	text-align: center;
}

/* Nous découvrir : le premier bloc de contenu a son propre padding-top (spacing|50),
   ce qui crée déjà l'espace sous le titre — le titre lui-même n'a donc pas besoin
   d'une marge supplémentaire ici. */
body.page-id-57 .wp-block-post-title {
	margin-bottom: var(--wp--preset--spacing--50);
}

/* Nos créations et Passer commande n'ont pas ce padding-top dans leur premier bloc :
   on double la marge du titre pour obtenir le même espace visuel que sur Nous découvrir. */
body.page-id-56 .wp-block-post-title,
body.page-id-58 .wp-block-post-title {
	margin-bottom: calc(var(--wp--preset--spacing--50) * 2);
}

/* Scroll fluide vers les ancres (#nos-creations, etc.) */
html {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* Liens du footer : beige constant, opacité réduite au survol plutôt qu'un changement de couleur */
footer a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--base);
	opacity: 1;
	transition: opacity 0.2s ease;
}

footer a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--base);
	opacity: 0.65;
}

/* Curseur pointer sur tout élément cliquable */
a,
button,
.wp-element-button,
.wp-block-button__link,
.wp-block-search__button,
.wp-block-file__button,
.wp-block-navigation-item__content,
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="checkbox"],
input[type="radio"],
select,
summary,
label[for],
[role="button"] {
	cursor: pointer;
}

/* Liens : transition douce, soulignement plus discret au repos */
a {
	text-underline-offset: 0.15em;
	transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

/* Boutons : coins arrondis et légère élévation au survol */
.wp-block-button__link {
	border-radius: 6px;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

.wp-block-button__link:hover {
	transform: translateY(-1px);
}

/* Variante outline : bordure olive foncé (secondaire) au repos, bascule bordeaux au survol */
.wp-block-button.is-style-outline .wp-block-button__link:not(:hover) {
	border-color: var(--wp--preset--color--accent-7);
	color: var(--wp--preset--color--accent-7);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	color: var(--wp--preset--color--base);
}

/*
 * Chocolat clair : réservé aux petits détails (badges, séparations de sections,
 * bordures de carte) — jamais comme couleur de texte ou de lien, pour qu'il
 * reste discret face au duo chocolat/moutarde/bordeaux.
 */
.chocolaterie-badge {
	display: inline-block;
	background-color: var(--wp--preset--color--accent-3);
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1;
	padding: 0.35em 0.75em;
	border-radius: 999px;
}

/* Détail de carte : liseré chocolat clair discret, à poser sur .wp-block-group par ex. */
.chocolaterie-card-accent {
	border-left: 3px solid var(--wp--preset--color--accent-3);
	padding-left: var(--wp--preset--spacing--30, 1rem);
}
