/*
Theme Name: Magn'Amap
Theme URI: https://magnamap.fr
Description: Thème WordPress FSE pour l'AMAP Magn'Amap. Association pour le maintien d'une agriculture paysanne à Magnat-l'Étrange et ses environs. Thème moderne avec blocs Gutenberg, navigation verte personnalisée et moteur de recherche de recettes intégré.
Author: Magn'Amap
Author URI: https://magnamap.fr
Version: 1.0.0
Requires at least: 5.9
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: magnamap
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, style-variations, wide-blocks, block-styles, accessibility-ready, blog, amap, agriculture, local, ecologie, vert
*/

/*
 * Font smoothing.
 */
body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

/*
 * Text and navigation link styles.
 */
a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.25ch;
}

a:hover,
a:focus {
	text-decoration-style: dashed;
}

a:active {
	text-decoration: none;
}

.wp-block-navigation .wp-block-navigation-item a:hover,
.wp-block-navigation .wp-block-navigation-item a:focus {
	text-decoration: none;
}

/*
 * Search and File Block button styles.
 */
.wp-block-search__button,
.wp-block-file .wp-block-file__button {
	background-color: var(--wp--preset--color--primary);
	border-radius: 0;
	border: none;
	color: var(--wp--preset--color--background);
	font-size: var(--wp--preset--font-size--medium);
	padding: calc(.667em + 2px) calc(1.333em + 2px);
}
  
/*
 * Heading anchors.
 */
.wp-block-heading.has-background a {
	color: inherit;
}

/*
 * Audio Block
 */
.wp-block-audio figcaption {
	margin-top: 0.5em;
	margin-bottom: 1em;
}

.wp-block-audio audio {
	width: 100%;
	min-width: 300px;
}

/*
 * Gallery Block - overrides Gallery v1 margin.
 */
.wp-block-gallery.has-nested-images {
	margin-bottom: 0;
}

/*
 * File Block
 */
.wp-block-file a:where(:not(.wp-element-button)) {
	text-decoration: underline;
}

.wp-block-file .wp-block-file__button:hover,
.wp-block-file .wp-block-file__button:focus {
	background-color: var(--wp--preset--color--secondary);
}

/*
 * General Post Comments Block styles.
 */
.wp-block-post-comments .commentlist .comment {
	min-height: 2.25rem;
	padding-left: 2.25rem;
}

.wp-block-post-comments .commentlist .comment p {
	font-size: var(--wp--preset--font-size--small);
	line-height: calc(1.4 * var(--wp--preset--font-size--small));
	margin: 0;
}

.wp-block-post-comments input:not([type="submit"]),
.wp-block-post-comments textarea {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--foreground);
	font-size: var(--wp--preset--font-size--small);
}

.wp-block-post-comments input[type="submit"] {
	border: none;
	font-size: var(--wp--preset--font-size--small);
}

/*
 * Post Comment Form Block
 */
.wp-block-post-comments-form input:not([type="submit"]),
.wp-block-post-comments-form textarea {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--foreground);
	font-size: var(--wp--preset--font-size--small);
}

.wp-block-post-comments-form input[type="submit"] {
	border: none;
	font-size: var(--wp--preset--font-size--small);
}

/*
 * Improves spacing for the legacy Post Comments block.
 */
.wp-block-post-comments ol.commentlist ul.children {
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.wp-block-post-comments ol.commentlist li.comment:not(:last-child) {
	margin-bottom: 1rem;
}


/* ========================================
   STYLE PERSONNALISÉ MENU NAVIGATION
   Chaque entrée avec fond vert #33A83D
   Coins arrondis 8px
   Texte noir
   ======================================== */

/* Marge intérieure pour le conteneur de navigation */
.wp-block-navigation__container {
	padding: 0.50em !important;
}

.wp-block-navigation .wp-block-navigation-item a.wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item a {
	background-color: #33A83D !important;
	border-radius: 8px !important;
	padding: 10px 20px !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	transition: background-color 0.3s ease !important;
	margin: 0 5px !important;
	display: inline-block !important;
	text-decoration: none !important;
}

.wp-block-navigation .wp-block-navigation-item a.wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item a.wp-block-navigation-item__content:focus,
.wp-block-navigation .wp-block-navigation-item a:hover,
.wp-block-navigation .wp-block-navigation-item a:focus {
	background-color: #2a8c33 !important;
	color: #ffffff !important;
	text-decoration: none !important;
}

/* Style pour l'entrée de menu active/sélectionnée */
.wp-block-navigation .wp-block-navigation-item.current-menu-item a.wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item.current-menu-item a,
.wp-block-navigation .wp-block-navigation-item.current_page_item a.wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation-item.current_page_item a {
	background-color: var(--wp--preset--color--luminous-vivid-orange) !important;
	color: #000000 !important;
}

/* Ajouter des icônes devant chaque entrée de menu */
.wp-block-navigation .wp-block-navigation-item a.wp-block-navigation-item__content::before,
.wp-block-navigation .wp-block-navigation-item a::before {
	content: "🌿 ";
	margin-right: 8px;
}

/* ========================================
   STYLE PERSONNALISÉ TITRES H1
   ======================================== */
h1.alignwide.wp-block-post-title {
	text-align: center !important;
}

/* ========================================
   STYLE PERSONNALISÉ FOOTER
   Menu horizontal sur fond vert
   ======================================== */
.wp-block-group.has-text-color.is-content-justification-right.wp-block-group-is-layout-constrained {
	background-color: #2a8c33 !important;
	padding: 18px 24px !important;
	display: flex !important;
	flex-direction: row !important;
	justify-content: center !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 10px 18px !important;
	text-align: center !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	color: #ffffff !important;
	font-size: 0.25em !important; /* taille de police divisée par deux */
}

.wp-block-group.has-text-color.is-content-justification-right.wp-block-group-is-layout-constrained p {
	margin: 0 !important;
	display: inline-block !important;
	color: inherit !important;
	font-size: inherit !important;
}

.wp-block-group.has-text-color.is-content-justification-right.wp-block-group-is-layout-constrained p a {
	color: #ffffff !important;
	text-decoration: none !important;
	padding: 6px 10px !important;
	border-radius: 4px !important;
	transition: background-color 0.3s ease !important;
	display: inline-block !important;
	font-size: inherit !important;
}

.wp-block-group.has-text-color.is-content-justification-right.wp-block-group-is-layout-constrained p a:hover {
	background-color: #33A83D !important;
	color: #ffffff !important;
}

/* Responsive : passe en colonne sur petits écrans */
@media screen and (max-width: 768px) {
	.wp-block-group.has-text-color.is-content-justification-right.wp-block-group-is-layout-constrained {
		flex-direction: column !important;
		gap: 10px !important;
	}
}

/* ========================================
   STYLE PERSONNALISÉ BOUTON CONTACT FORM 7
   ======================================== */
.wpcf7-form-control.wpcf7-submit.has-spinner,
input.wpcf7-form-control.wpcf7-submit {
	background-color: #2a8c33 !important;
	color: #ffffff !important;
	font-size: 1em !important;
	padding: 20px 40px !important;
	border: none !important;
	border-radius: 8px !important;
	cursor: pointer !important;
	transition: background-color 0.3s ease !important;
	font-weight: bold !important;
}

.wpcf7-form-control.wpcf7-submit.has-spinner:hover,
input.wpcf7-form-control.wpcf7-submit:hover {
	background-color: #33A83D !important;
}

/* ========================================
   STYLE MOTEUR DE RECHERCHE RECETTES
   ======================================== */
.recette-search-container {
	max-width: 1170px;
	margin: 0 auto 3rem;
	padding: 2rem;
	background-color: #f9f9f9;
	border-radius: 10px;
}

.recette-search-form {
	margin-bottom: 2rem;
}

.search-input-wrapper {
	display: flex;
	gap: 10px;
	max-width: 600px;
	margin: 0 auto;
}

.recette-search-input {
	flex: 1;
	padding: 15px 20px;
	font-size: 1.1em;
	border: 2px solid #33A83D;
	border-radius: 8px;
	outline: none;
	transition: border-color 0.3s ease;
}

.recette-search-input:focus {
	border-color: #2a8c33;
	box-shadow: 0 0 8px rgba(42, 140, 51, 0.2);
}

.recette-search-button {
	padding: 15px 30px;
	font-size: 1.1em;
	font-weight: bold;
	background-color: #2a8c33;
	color: white;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.recette-search-button:hover {
	background-color: #33A83D;
}

.recette-results {
	margin-top: 2rem;
}

.results-title {
	color: #2a8c33;
	font-size: 1.5em;
	margin-bottom: 1.5rem;
	text-align: center;
}

.results-count {
	text-align: center;
	color: #666;
	margin-top: 2rem;
	font-style: italic;
}

.recette-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 2rem;
	margin-top: 2rem;
}

.recette-item {
	background: white;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.recette-item:hover {
	transform: translateY(-5px);
	box-shadow: 0 5px 20px rgba(42, 140, 51, 0.2);
}

.recette-thumbnail {
	overflow: hidden;
	height: 200px;
}

.recette-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.recette-item:hover .recette-thumbnail img {
	transform: scale(1.05);
}

.recette-content {
	padding: 1.5rem;
}

.recette-title {
	margin: 0 0 1rem 0;
	font-size: 1.3em;
}

.recette-title a {
	color: #2a8c33;
	text-decoration: none;
	transition: color 0.3s ease;
}

.recette-title a:hover {
	color: #33A83D;
}

.recette-excerpt {
	color: #666;
	line-height: 1.6;
	margin-bottom: 1rem;
}

.recette-link {
	display: inline-block;
	padding: 8px 15px;
	background-color: #33A83D;
	color: white !important;
	text-decoration: none;
	border-radius: 5px;
	font-weight: 500;
	transition: background-color 0.3s ease;
}

.recette-link:hover {
	background-color: #2a8c33;
}

.no-results {
	text-align: center;
	font-size: 1.2em;
	color: #666;
	padding: 2rem;
}

.search-tips {
	text-align: center;
	color: #999;
	font-style: italic;
}

/* Responsive */
@media screen and (max-width: 768px) {
	.search-input-wrapper {
		flex-direction: column;
	}
	
	.recette-list {
		grid-template-columns: 1fr;
	}
	
	.recette-search-container {
		padding: 1rem;
	}
}

/* ========================================
   PAGE RECETTES
   ======================================== */
.recipes-loop .recipe-entry__title {
	position: relative;
	padding-left: 28px;
	color: #2a8c33 !important;
	font-weight: 700 !important;
}

.recipes-loop .recipe-entry__title a {
	color: inherit;
	text-decoration: none;
}

.recipes-loop .recipe-entry__title a:hover,
.recipes-loop .recipe-entry__title a:focus {
	text-decoration: underline;
}

.recipes-loop .recipe-entry__title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 18px;
	height: 18px;
	transform: translateY(-50%);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232a8c33' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10h16'/%3E%3Cpath d='M6 10v7a3 3 0 0 0 3 3h6a3 3 0 0 0 3-3v-7'/%3E%3Cpath d='M9 7h6'/%3E%3Cpath d='M12 4v3'/%3E%3C/svg%3E") center / contain no-repeat;
}

.recipe-search {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	align-items: center;
}

.recipe-search input[type="search"] {
	flex: 1;
	min-width: 220px;
	padding: 10px 14px;
	border: 2px solid #2a8c33;
	border-radius: 8px;
}

.recipe-search button {
	background-color: #2a8c33;
	color: #ffffff;
	border: none;
	padding: 10px 16px;
	border-radius: 8px;
	cursor: pointer;
	transition: background-color 0.2s ease;
	font-weight: 600;
}

.recipe-search button:hover,
.recipe-search button:focus {
	background-color: #33A83D;
}

.news-loop .news-entry__title {
	position: relative;
	padding-left: 28px;
	color: #2a8c33 !important;
	font-weight: 700 !important;
}

.news-loop .news-entry__title a {
	color: inherit;
	text-decoration: none;
}

.news-loop .news-entry__title a:hover,
.news-loop .news-entry__title a:focus {
	text-decoration: underline;
}

.news-loop .news-entry__title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 18px;
	height: 18px;
	transform: translateY(-50%);
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232a8c33' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v14H4z'/%3E%3Cpath d='M8 9h8'/%3E%3Cpath d='M8 13h8'/%3E%3Cpath d='M8 17h4'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E") center / contain no-repeat;
}

.news-search {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	align-items: center;
}

.news-search input[type="search"] {
	flex: 1;
	min-width: 220px;
	padding: 10px 14px;
	border: 2px solid #2a8c33;
	border-radius: 8px;
}

.news-search button {
	background-color: #2a8c33;
	color: #ffffff;
	border: none;
	padding: 10px 16px;
	border-radius: 8px;
	cursor: pointer;
	transition: background-color 0.2s ease;
	font-weight: 600;
}

.news-search button:hover,
.news-search button:focus {
	background-color: #33A83D;
}

/* Actualités : titres colonne latérale alignés sur la taille du corps de texte */
.news-sidebar .wp-block-heading {
	font-size: 1em;
	font-weight: 700;
	color: var(--wp--preset--color--luminous-vivid-orange);
}

/* Actualités : nuage de tags aligné sur la taille du corps de texte */
.news-tag-cloud a {
	font-size: 1em !important;
}

/* Recettes : titres colonne latérale alignés sur la taille du corps de texte */
.recipe-sidebar .wp-block-heading {
	font-size: 1em;
	font-weight: 700;
	color: var(--wp--preset--color--luminous-vivid-orange);
}

/* Recettes : nuage de tags aligné sur la taille du corps de texte */
.recipe-tag-cloud a {
	font-size: 1em !important;
}


/* ========================================
   CORRECTION LOGO AMAP
   Éviter l'anamorphose sur mobile
   ======================================== */
.wp-image-59 {
	width: auto !important;
	height: auto !important;
	max-width: 50.7% !important;
	object-fit: contain !important;
	display: block !important;
	margin: 0 auto !important;
}

/* Version mobile spécifique */
@media screen and (max-width: 768px) {
	.wp-image-59 {
		max-height: 300px !important;
		max-width: 50.7% !important;
		height: auto !important;
		object-fit: contain !important;
		margin: 0 auto !important;
	}
}

/* ========================================
   SUPPRESSION HAMBURGER ET AFFICHAGE MENU MOBILE
   ======================================== */
@media screen and (max-width: 782px) {
	/* Cache le bouton hamburger */
	.wp-block-navigation__responsive-container-open {
		display: none !important;
	}

	/* Force l'affichage du menu */
	.wp-block-navigation__responsive-container {
		display: block !important;
		position: static !important;
		inset: auto !important;
		padding: 0 !important;
		background-color: transparent !important;
		overflow: visible !important;
	}

	/* Cache le bouton de fermeture */
	.wp-block-navigation__responsive-container-close {
		display: none !important;
	}
	
	/* Assure l'affichage du contenu et le centre */
	.wp-block-navigation__responsive-container-content {
		display: flex !important;
		justify-content: center !important;
		width: 100% !important;
	}

	/* Centre la liste des éléments */
	.wp-block-navigation__container {
		justify-content: center !important;
		display: flex !important;
		flex-wrap: wrap !important;
	}

	/* Centre le texte dans les éléments de menu */
	.wp-block-navigation-item,
	.wp-block-navigation-link {
		text-align: center !important;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
	}
}
