/**
 * Styles complementaires a theme.json — charges sur le site ET dans l'editeur.
 */

/* La police n'a pas de gras : on le simule avec un contour */
strong, b {
	font-weight: 400;
	-webkit-text-stroke: 0.04em currentColor;
}

/* Texte justifie (charte) : la cesure evite les grands trous dans les colonnes etroites */
p {
	hyphens: auto;
	-webkit-hyphens: auto;
}

/* Pas d'italique natif non plus */
em, i {
	font-style: normal;
}

/* === Style de groupe : "Carte" === */
.is-style-carte {
	border-radius: var(--wp--custom--radius--card);
	overflow: hidden;
}
.is-style-carte:not([style*="border-width"]) {
	border-width: 2px;
	border-style: solid;
}
.is-style-carte:not(.has-border-color) {
	border-color: var(--wp--preset--color--beige);
}
.is-style-carte:not([style*="padding"]) {
	padding: var(--wp--preset--spacing--40);
}

/* Carte cliquable : leger zoom au survol si elle contient un lien */
.is-style-carte:has(a) {
	transition: transform 0.3s ease;
}
.is-style-carte:has(a):hover {
	transform: scale(1.03);
}

/* === Style de groupe : "Eclaboussures" (eclats de peinture hors-champ) === */
.is-style-eclaboussures {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
.is-style-eclaboussures::before,
.is-style-eclaboussures::after {
	content: "";
	position: absolute;
	z-index: -1;
	pointer-events: none;
	background: var(--tc-eclaboussures) no-repeat center / contain;
	opacity: 0.25;
}
.is-style-eclaboussures::before {
	width: min(22rem, 45vw);
	aspect-ratio: 1;
	top: 0;
	left: 0;
	transform: translate(-30%, -30%);
}
.is-style-eclaboussures::after {
	width: min(16rem, 35vw);
	aspect-ratio: 1;
	bottom: 0;
	right: 0;
	transform: translate(30%, 30%) rotate(160deg);
}

/* === Style d'image : "Cercle" (logo entoure d'un cercle fin) === */
.wp-block-image.is-style-cercle img {
	border-radius: 50%;
	border: 3px solid currentColor;
	padding: 0.5rem;
	aspect-ratio: 1;
	object-fit: contain;
}

/* === Style de bouton : "Contour" === */
.wp-block-button.is-style-contour .wp-block-button__link {
	background: transparent;
	border: 2px solid currentColor;
}

/* === Bloc Commander a emporter === */
.tc-commande .wp-block-buttons { justify-content: center; }
.tc-commande__horaires { margin-bottom: 1rem; }
.tc-commande-placeholder {
	border: 2px dashed var(--wp--preset--color--miam);
	border-radius: 1rem;
	background: color-mix(in srgb, var(--wp--preset--color--miam) 10%, transparent);
	color: var(--wp--preset--color--miam);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	text-align: center;
	font-size: var(--wp--preset--font-size--large);
}

/* === Bloc formulaire de contact === */
.tc-contact-form {
	display: grid;
	gap: 1.25rem;
}
.tc-contact-form label {
	display: block;
	margin-bottom: 0.4rem;
}
.tc-contact-form input,
.tc-contact-form textarea {
	width: 100%;
	box-sizing: border-box;
	font: inherit;
	padding: 0.75rem 1rem;
	border: 2px solid var(--wp--preset--color--beige);
	border-radius: 0.75rem;
	background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--noir);
}
.tc-contact-form input:focus,
.tc-contact-form textarea:focus {
	outline: none;
	border-color: var(--tc-accent, var(--wp--preset--color--miam));
}
.tc-contact-form textarea {
	resize: vertical;
}
.tc-contact-form button {
	font: inherit;
	font-size: var(--wp--preset--font-size--large);
	cursor: pointer;
	border: 0;
	border-radius: var(--wp--custom--radius--pill);
	padding: 0.6rem 1.6rem;
	background: var(--tc-accent, var(--wp--preset--color--miam));
	color: var(--wp--preset--color--blanc);
}
.tc-contact-form button:hover {
	background: var(--wp--preset--color--noir);
}
.tc-contact-notice {
	border: 2px solid currentColor;
	border-radius: 0.75rem;
	padding: 1rem;
}
.tc-contact-notice.is-success { color: var(--wp--preset--color--waouh); }
.tc-contact-notice.is-error { color: var(--wp--preset--color--miam); }
.tc-hp { position: absolute; left: -9999px; }

/* En-tete collant */
.tc-header {
	position: sticky;
	top: 0;
	z-index: 40;
	box-shadow: 0 1px 6px rgb(0 0 0 / 0.06);
}
.admin-bar .tc-header { top: var(--wp-admin--admin-bar--height, 32px); }
.tc-header__ligne { gap: 1.5rem; }
.tc-header__ligne > .wp-block-navigation { margin-left: auto; }
.tc-header__actions { gap: 0.5rem; flex-shrink: 0; }
.tc-header__actions .wp-block-button__link {
	padding: 0.35rem 1.1rem;
	font-size: var(--wp--preset--font-size--medium);
	white-space: nowrap;
}
/* Ecrans etroits : les boutons passent sur une 2e ligne, toujours visibles sous le logo */
@media (max-width: 1099px) {
	.tc-header__ligne { flex-wrap: wrap; row-gap: 0.6rem; }
	.tc-header__actions { order: 3; flex-basis: 100%; justify-content: center; }
	.tc-header__actions .wp-block-button { flex: 1; max-width: 14rem; }
	.tc-header__actions .wp-block-button__link { width: 100%; }
}
@media (max-width: 599px) {
	.tc-logo img { width: 170px !important; }
}

/* Pas de marge entre les sections pleine largeur empilees */
.wp-site-blocks > main > .entry-content > .alignfull,
.wp-site-blocks > main > .wp-block-post-content > .alignfull {
	margin-block-start: 0;
}

/* Liens de menu aux couleurs des visages (style du bloc "Lien de navigation") */
.wp-block-navigation .wp-block-navigation-item.is-style-miam > .wp-block-navigation-item__content.wp-block-navigation-item__content { color: var(--wp--preset--color--miam); }
.wp-block-navigation .wp-block-navigation-item.is-style-youpi > .wp-block-navigation-item__content.wp-block-navigation-item__content { color: var(--wp--preset--color--youpi); }
.wp-block-navigation .wp-block-navigation-item.is-style-waouh > .wp-block-navigation-item__content.wp-block-navigation-item__content { color: var(--wp--preset--color--waouh); }
.wp-block-navigation-item > a:hover { opacity: 0.7; }

/* Le logo n'est pas une photo : pas d'arrondi */
.tc-logo img { border-radius: 0; }

/* === Styles "Bulles" (titres / paragraphes) : le point des i devient une bulle ===
 * Geometrie mesuree sur SchuboiseHandwrite : la zone de contenu d'un span inline
 * commence 0.95em au-dessus de la ligne de base ; le point du i occupe 0.24em-0.33em
 * depuis ce haut, la barre commence a 0.41em. On coupe donc a 0.37em. */
.tc-i {
	position: relative;
}
.tc-i__lettre {
	clip-path: inset(0.37em -0.1em -0.5em -0.1em);
}
.tc-i::after {
	content: "";
	position: absolute;
	left: 0.09em;
	top: 0.24em;
	width: 0.24em;
	height: 0.28em;
	transform: translate(-50%, -50%);
	background: var(--tc-bulle-orange) no-repeat center / contain;
	pointer-events: none;
}
.tc-i--violet::after { background-image: var(--tc-bulle-violet); }
.tc-i--vert::after { background-image: var(--tc-bulle-vert); }