/* L'Oeuf Normand — styles complémentaires non exprimables en theme.json */

/* Titres : Archivo Black en capitales coupe mal les mots longs — on
   interdit la césure automatique et on autorise plutôt le retour à la
   ligne au niveau d'un mot entier. */
h1, h2, h3, h4, h5, h6, .wp-block-heading {
	hyphens: none;
	overflow-wrap: break-word;
}

/* Pied de page : fond primary, donc liens en surface (le vert forêt par
   défaut des liens serait invisible sur fond vert forêt) */
.loeufnormand-footer a {
	color: var(--wp--preset--color--surface);
	text-decoration: underline;
}
.loeufnormand-footer a:hover {
	color: var(--wp--preset--color--kraft);
}
.loeufnormand-footer .wp-block-site-logo {
	max-width: 160px;
	margin-left: auto;
	margin-right: auto;
}
.loeufnormand-footer .wp-block-site-logo img {
	max-width: 100%;
	height: auto;
}
.loeufnormand-footer p.has-small-font-size {
	font-size: 0.875rem;
}

/* Logo d'en-tête : le SVG clair (#F8F2EA) fourni est prévu pour un fond
   foncé (footer). Sur l'en-tête, fond clair, on le rend en silhouette
   sombre par filtre CSS plutôt que de dupliquer un second fichier logo. */
.loeufnormand-header .wp-block-site-logo img {
	filter: brightness(0);
	height: 56px;
	width: auto;
}

/* Fallback hover (en plus des états déclarés dans theme.json) */
a:hover {
	color: var(--wp--preset--color--primary-dark);
}
.wp-element-button:hover,
.wp-block-button__link:hover {
	background-color: var(--wp--preset--color--primary-dark) !important;
	color: var(--wp--preset--color--surface) !important;
}

/* Style de bloc réutilisable "Accent manuscrit" (paragraphe) */
.is-style-accent-manuscrit {
	font-family: var(--wp--preset--font-family--caveat);
	color: var(--wp--preset--color--primary);
	font-size: 1.4em;
	line-height: 1.3;
}

/* Pattern : Bandeau kraft */
.loeufnormand-ruban {
	display: inline-block;
	background-color: var(--wp--preset--color--kraft);
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--archivo-black);
	text-transform: uppercase;
	letter-spacing: -0.01em;
	padding: 0.6em 1.6em;
	transform: rotate(-1deg);
	box-shadow: 2px 3px 0 rgba(28, 28, 26, 0.12);
}

/* Pattern : Liste à pastilles */
.loeufnormand-pastille-liste {
	list-style: none;
	margin: 0;
	padding: 0;
}
.loeufnormand-pastille-liste li {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	padding: 1.25rem 0;
	border-bottom: 2px dotted var(--wp--preset--color--powder);
}
.loeufnormand-pastille-liste li:last-child {
	border-bottom: none;
}
.loeufnormand-pastille {
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: var(--wp--preset--color--primary);
	display: flex;
	align-items: center;
	justify-content: center;
}
.loeufnormand-pastille svg {
	width: 24px;
	height: 24px;
	fill: var(--wp--preset--color--surface);
}

/* Pattern : Encart appel pro */
.loeufnormand-encart {
	background-color: var(--wp--preset--color--surface);
	border-radius: 16px;
	box-shadow: 0 4px 24px rgba(28, 28, 26, 0.08);
	padding: 2.5rem;
}
.loeufnormand-encart h3 {
	margin-top: 0;
	font-size: var(--wp--preset--font-size--card-title);
}
.loeufnormand-encart h3 a {
	text-decoration: none;
}
.loeufnormand-encart h3 a:hover {
	text-decoration: underline;
}
.loeufnormand-encart-accent {
	font-family: var(--wp--preset--font-family--caveat);
	color: var(--wp--preset--color--primary);
	text-transform: none;
	letter-spacing: normal;
	font-size: 1.3em;
}

/* Pattern : Hero produit — pleine largeur, hauteur fixe, photo en cover,
   texte dans un panneau à gauche (jamais superposé au centre de la photo). */
.loeufnormand-hero-produit {
	position: relative;
	min-height: 420px;
	min-height: max(60vh, 420px);
	overflow: hidden;
}
.loeufnormand-hero-produit .wp-block-image,
.loeufnormand-hero-produit figure {
	margin: 0;
	height: 100%;
}
.loeufnormand-hero-produit img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 0;
}
.loeufnormand-hero-titre-wrap {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0;
	/* Aligne le bord gauche du panneau sur la gouttière du contenu du site
	   (même retrait que le reste des sections), pas sur le bord de la
	   fenêtre — on réutilise la variable de padding racine du thème plutôt
	   qu'une valeur en dur. */
	padding-left: var(--wp--style--root--padding-left);
}
.loeufnormand-hero-titre-inner {
	box-sizing: border-box;
	max-width: min(100%, 34rem);
	width: 100%;
	padding: 2.5rem 2rem;
	/* Voile plat (pas de dégradé) : un dégradé rend le contraste dépendant de
	   la position exacte du texte, variable selon la longueur du titre, donc
	   invérifiable à l'avance. Un aplat à 65% garantit >= 4.5:1 entre le
	   texte "surface" et le voile quel que soit l'endroit où le texte tombe,
	   y compris sur une photo claire future. */
	background: rgba(28, 28, 26, 0.65);
}
/* Titre et accent manuscrit du hero : les deux passent en "surface" (blanc cassé)
   sur ce fond sombre — le vert forêt de l'accent manuscrit n'est pas assez
   lisible sur un fond sombre, donc dérogation volontaire à la couleur "primary"
   par défaut du style Accent manuscrit, uniquement dans ce contexte. */
.loeufnormand-hero-titre-inner h1,
.loeufnormand-hero-titre-inner h2 {
	color: var(--wp--preset--color--surface);
	margin: 0 0 1rem;
}
.loeufnormand-hero-titre-inner .is-style-accent-manuscrit {
	color: var(--wp--preset--color--surface);
	margin: 0 0 1.5rem;
}
/* Sous 600px : plus de retrait de gouttière, le panneau reprend toute la
   largeur — son padding interne (2.5rem 2rem, inchangé) reste l'unique
   respiration, l'espace latéral est trop précieux sur mobile. */
@media (max-width: 599px) {
	.loeufnormand-hero-titre-wrap {
		padding-left: 0;
	}
	.loeufnormand-hero-titre-inner {
		max-width: 100%;
	}
}

/* Pattern : Horaires et accès (pied de page) — la couleur du bloc est gérée
   nativement via les attributs de couleur du bloc Groupe (has-surface-color) */
.loeufnormand-horaires-liste {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.5rem;
}
.loeufnormand-horaires-liste li {
	padding: 0.35rem 0;
	border-bottom: 1px dotted rgba(253, 251, 247, 0.3);
}
.loeufnormand-horaires-acces a {
	color: var(--wp--preset--color--surface);
	text-decoration: underline;
}
.loeufnormand-horaires-acces a:hover {
	color: var(--wp--preset--color--kraft);
}

/* WooCommerce */
.woocommerce .price,
.woocommerce-Price-amount.amount {
	font-family: var(--wp--preset--font-family--archivo-black);
}
.woocommerce span.onsale {
	background-color: var(--wp--preset--color--kraft);
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--inter);
	font-weight: 700;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 0.85rem;
}
.woocommerce ul.products li.product,
.woocommerce div.product div.summary,
.woocommerce div.product {
	background-color: var(--wp--preset--color--surface);
}
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button {
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--surface);
	border-radius: 8px;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background-color: var(--wp--preset--color--primary-dark);
	color: var(--wp--preset--color--surface);
}
