/*
Theme Name: Samira MTC
Theme URI: https://www.samira-mtc.com/
Description: Thème bloc autonome pour samira-mtc.com (migration Elementor → FSE). Charte, polices et presets dans theme.json.
Author: Jonathan Scapin
Author URI: https://jonathanscapin.com/
Version: 1.2.0
Requires at least: 7.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: samira-mtc
*/

/*
 * CSS custom minimal : uniquement ce que theme.json et les blocs natifs ne savent pas exprimer.
 * Toutes les valeurs passent par les presets (--wp--preset--*).
 */

/* ---------- Mise en page générale ---------- */

/* Sections pleine largeur collées : pas de blockGap entre header / main / footer ni entre sections. */
.wp-site-blocks > *,
.wp-block-post-content > .alignfull {
	margin-block-start: 0;
}

/* ---------- Header (part « header ») ---------- */

/* Sticky + léger flou en desktop uniquement, comme sur le site actuel (sticky_on: desktop). */
@media (min-width: 1025px) {
	.wp-site-blocks > header.wp-block-template-part {
		position: sticky;
		top: var(--wp-admin--admin-bar--height, 0);
		z-index: 50;
	}

	.site-header {
		background-color: rgb(255 255 255 / 96%) !important; /* surcharge la couleur de fond du bloc pour l'effet verre */
		backdrop-filter: blur(10px);
	}
}

@media (max-width: 781px) {
	.site-header .wp-block-site-logo img {
		width: 64px;
	}
}

/* Menu : survol en lavande, sans soulignement, comme le site d'origine. Spécificité 0,5,0 : la règle du cœur
   `.wp-block-navigation-item__content.wp-block-navigation-item__content { color: inherit }` écraserait theme.json. */
.site-header .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--secondary);
}

/* Menu : item actif en lavande (le bloc Navigation ne propose pas de couleur « courante »).
   Spécificité 0,3,1 pour passer devant la règle du cœur `.wp-block-navigation-item__content.wp-block-navigation-item__content`. */
.wp-block-navigation .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--secondary);
}

.site-header .wp-block-navigation .wp-block-navigation-item__content {
	padding: 13px 20px;
}

@media (max-width: 1024px) {
	.site-header .wp-block-navigation .wp-block-navigation-item__content {
		padding-inline: 12px;
	}
}

/*
 * Hamburger sous 782px au lieu de 600px (valeur codée en dur dans le bloc Navigation).
 * Entre 600 et 781px, le menu horizontal passerait sur 3 lignes.
 */
@media (min-width: 600px) and (max-width: 781px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* Overlay du menu mobile : liens centrés et plus grands, comme dans les maquettes.
   La liste porte elle-même `items-justified-right` (alignement du header) : on recentre ses variables. */
.wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--20) var(--wp--style--root--padding-right);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	--navigation-layout-justification-setting: center;
	--navigation-layout-justify: center;
	--navigation-layout-align: center;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: var(--wp--preset--spacing--40);
}

/* Même spécificité (0,4,0) que les règles du cœur, qui imposent gap: inherit et padding: 0 dans l'overlay. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--20);
	text-align: center;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
	padding-block: 6px;
}

/* Bouton de fermeture : décollé du coin, comme dans les maquettes. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: var(--wp--preset--spacing--20);
	right: var(--wp--style--root--padding-right);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 24px;
	text-align: center;
}

/* ---------- Vagues « mountains » (styles de bloc Groupe « wave-pale » / « wave-white ») ---------- */

.wp-block-group.is-style-wave-pale,
.wp-block-group.is-style-wave-white {
	position: relative;
}

.wp-block-group.is-style-wave-pale::before,
.wp-block-group.is-style-wave-white::before {
	content: "";
	position: absolute;
	inset: -1px 0 auto;
	background: url("assets/images/wave-pale.svg") center top / 100% 100% no-repeat;
	pointer-events: none;
}

/* Vague rose pâle, 30px : section qui suit un fond rose pâle (Bienvenue). */
.wp-block-group.is-style-wave-pale::before {
	height: 30px;
}

/* Vague blanche, 70px : section qui suit un fond blanc (MTC sur l'accueil). */
.wp-block-group.is-style-wave-white::before {
	height: 70px;
	background-image: url("assets/images/wave-white.svg");
}

/* ---------- Bulles animées de la section « Bienvenue » (assets/js/bulles.js) ---------- */

/* Mêmes position et taille que sur l'ancien site, derrière le texte (z-index -1, section isolée).
   overflow-x: clip supprime le défilement horizontal que provoquait l'ancienne animation. */
.has-bulles {
	isolation: isolate;
	overflow-x: clip;
}

.samira-bulles {
	position: absolute;
	z-index: -1;
	top: calc(var(--wp--preset--spacing--60) - 92px);
	left: calc(50% + 140px);
	width: 500px;
	height: 500px;
	margin: 0; /* sinon la marge entre blocs (blockGap) de la mise en page la décale */
	pointer-events: none;
}

@media (max-width: 1024px) {
	.samira-bulles {
		display: none;
	}
}

/* ---------- Bouton « lien » (style de bloc Bouton « link ») ---------- */

.wp-block-button.is-style-link .wp-block-button__link:hover,
.wp-block-button.is-style-link .wp-block-button__link:focus {
	background: transparent;
	color: var(--wp--preset--color--secondary);
}

/* Icônes des Infos pratiques : une image dans un groupe en ligne ne doit pas rétrécir. */
.is-layout-flex > .wp-block-image.is-resized {
	flex-shrink: 0;
}

/* Le numéro de téléphone ne se coupe pas. */
.wp-block-button__link[href^="tel:"],
a[href^="tel:"] {
	white-space: nowrap;
}

/* ---------- FAQ (bloc Details) ---------- */

.wp-block-details + .wp-block-details {
	border-top: 0;
}

.wp-block-details summary {
	display: flex;
	gap: 14px;
	align-items: baseline;
	padding: 15px 20px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--wp--preset--color--primary);
	cursor: pointer;
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

/* Signe +/− décoratif (texte de remplacement vide pour les lecteurs d'écran). */
.wp-block-details summary::before {
	content: "+" / "";
	flex: 0 0 1ch;
}

.wp-block-details[open] summary,
.wp-block-details summary:hover {
	color: var(--wp--preset--color--secondary);
}

.wp-block-details[open] summary::before {
	content: "−" / "";
}

.wp-block-details > :not(summary) {
	margin-inline: calc(20px + 1ch + 14px) 20px;
}

.wp-block-details > :last-child:not(summary) {
	margin-block-end: 18px;
}

/* ---------- Table des horaires (style de bloc Tableau « hours ») ---------- */

.wp-block-table.is-style-hours {
	max-width: 360px;
	margin-inline: auto;
}

.wp-block-table.is-style-hours td {
	padding: 8px 4px;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--pale-pink);
	text-align: left;
}

.wp-block-table.is-style-hours td:last-child {
	text-align: right;
	white-space: nowrap;
}

.wp-block-table.is-style-hours tr:last-child td {
	border-bottom: 0;
}

/* ---------- Listes ---------- */

.wp-block-list li::marker {
	color: var(--wp--preset--color--secondary);
}

/* Liste des cinq éléments : icônes en image en ligne, pas de puce. */
.wp-block-list.list-icons {
	list-style: none;
	padding-left: 0;
}

/* ---------- Footer (part « footer ») ---------- */

/* Téléphone du pied de page : lien isolé, pas besoin de soulignement. Menu : soulignement au survol. */
.site-footer a[href^="tel:"] {
	text-decoration: none;
}

.site-footer .wp-block-navigation-item__content:hover,
.site-footer .wp-block-navigation-item__content:focus-visible {
	text-decoration: underline;
	text-underline-offset: 6px;
}

@media (max-width: 781px) {
	.site-footer {
		text-align: center;
	}

	.site-footer .is-layout-flex {
		justify-content: center;
	}
}

/* ---------- Accessibilité ---------- */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition: none !important;
		scroll-behavior: auto !important;
	}
}