/* ==========================================================================
   Nourri Core — Front : Carte régionales (shortcode [nourri_regionales_map])
   ========================================================================== */

/* Police Reddit Sans appliquée au conteneur ET au popup Leaflet (popup
   est rendu hors du conteneur, dans le body, donc ciblé séparément). */
.nourri-regionales-map,
.nourri-regionales-map__popup {
	font-family: 'Reddit Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

.nourri-regionales-map {
	display: grid;
	grid-template-columns: 2fr 3fr;
	gap: 0;
	height: 600px;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	overflow: hidden;
	background: #fff;
	font-size: 14px;
}

@media (max-width: 782px) {
	.nourri-regionales-map {
		grid-template-columns: 1fr;
		grid-template-rows: 300px 1fr;
		height: auto;
	}
}

/* ---- Liste à gauche ---------------------------------------------------- */
.nourri-regionales-map__list {
	overflow-y: auto;
	background: #f9fafb;
	border-right: 1px solid #e5e7eb;
	position: relative; /* contexte pour le sticky header */
}
@media (max-width: 782px) {
	.nourri-regionales-map__list {
		border-right: none;
		border-top: 1px solid #e5e7eb;
		order: 2;
	}
}

/* Header sticky en haut de la liste */
.nourri-regionales-map__list-header {
	position: sticky;
	top: 0;
	background: #f9fafb;
	padding: 20px 24px 16px;
	border-bottom: 1px solid #e5e7eb;
	z-index: 2;
}
.nourri-regionales-map__list-header-title {
	margin: 0;
	font-size: 22px;
	font-weight: 700;
	color: #24142E;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.nourri-regionales-map__list-body {
	padding: 8px 0;
}

.nourri-regionales-map__status {
	padding: 24px 16px;
	text-align: center;
	color: #6b7280;
	font-style: italic;
}

.nourri-regionales-map__item {
	padding: 16px 24px;
	border-bottom: 1px solid #e5e7eb;
	transition: background 0.15s;
	scroll-margin-top: 70px; /* clearance pour le sticky header au scrollIntoView */
}
.nourri-regionales-map__item:last-child { border-bottom: none; }
.nourri-regionales-map__item:hover,
.nourri-regionales-map__item.is-hovered { background: #f3f4f6; }
.nourri-regionales-map__item.is-active { background: #f3f4f6; }

/* CTA outlined dans chaque item liste — link vers single post */
.nourri-regionales-map__item-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 12px;
	padding: 7px 14px 7px 12px;
	background: transparent;
	color: #24142E;
	border: 1px solid rgba(36, 20, 46, 0.18);
	border-radius: 7px;
	font-family: inherit;
	font-size: 12px;
	font-weight: 500;
	text-decoration: none;
	letter-spacing: 0.005em;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, gap 0.2s ease;
	align-self: flex-start;
}
.nourri-regionales-map__item-cta:hover {
	background: #24142E;
	color: #ffffff;
	border-color: #24142E;
	gap: 8px;
}
.nourri-regionales-map__item-cta-arrow {
	flex-shrink: 0;
	transition: transform 0.2s ease;
}
.nourri-regionales-map__item-cta:hover .nourri-regionales-map__item-cta-arrow {
	transform: translateX(2px);
}

.nourri-regionales-map__item-title {
	margin: 0 0 8px;
	font-size: 18px;
	line-height: 1.25;
	font-weight: 600;
	color: #111827;
}

/* Bloc adresse/tel/email — partagé entre item liste et popup */
.nourri-regionales-map__contact {
	font-size: 12px;
	line-height: 1.45;
	color: #4b5563;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.nourri-regionales-map__contact-address {
	font-style: normal;
	white-space: pre-line; /* préserve les \n de la saisie textarea */
}
/* Liens tel/email : indistincts du texte par défaut, brand color au hover direct.
   Le row entier est aussi cliquable (zoom map), donc on neutralise visuellement
   les liens pour ne pas suggérer plusieurs zones cliquables. */
.nourri-regionales-map__contact-link {
	color: inherit;
	text-decoration: none;
	word-break: break-word;
	align-self: flex-start; /* largeur = texte seulement, pas toute la ligne */
}
.nourri-regionales-map__contact-link:hover {
	color: #24142E;
	text-decoration: underline;
}

/* ---- Carte à droite ---------------------------------------------------- */
.nourri-regionales-map__map {
	background: #e5e7eb;
	min-height: 300px;
}
@media (max-width: 782px) {
	.nourri-regionales-map__map { order: 1; }
}

/* ---- Pin SVG custom : couleur via `color` (le SVG utilise fill=currentColor) -- */
.nourri-regionales-map__pin {
	background: transparent;
	border: none;
	color: #321D3E;
	transition: color 0.18s ease, transform 0.18s ease;
	transform-origin: center bottom;
}
.nourri-regionales-map__pin svg {
	display: block;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.25));
}
.nourri-regionales-map__pin:hover,
.nourri-regionales-map__pin.is-hovered {
	color: #E396A6;
	transform: scale(1.35);
	z-index: 1000 !important; /* passe devant les autres pins */
}

/* ==========================================================================
   Bouton « Voir toutes les régionales » (control bottomleft Leaflet)
   ========================================================================== */
.nourri-regionales-map__reset-btn {
	align-items: center;
	gap: 8px;
	padding: 9px 14px 9px 12px;
	background: #ffffff;
	color: #24142E;
	border: 1px solid rgba(36, 20, 46, 0.12);
	border-radius: 8px;
	font-family: 'Reddit Sans', system-ui, -apple-system, sans-serif;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	box-shadow:
		0 6px 16px -6px rgba(36, 20, 46, 0.25),
		0 2px 4px -2px rgba(36, 20, 46, 0.12);
	transition: background 0.2s ease, color 0.2s ease, transform 0.15s ease, border-color 0.2s ease;
	white-space: nowrap;
}
.nourri-regionales-map__reset-btn:hover {
	background: #24142E;
	color: #ffffff;
	border-color: #24142E;
	transform: translateY(-1px);
}
.nourri-regionales-map__reset-btn svg {
	flex-shrink: 0;
	color: #E396A6; /* icône rose en accent quand inactif */
	transition: color 0.2s ease;
}
.nourri-regionales-map__reset-btn:hover svg {
	color: #F0C88D; /* swap vers doré au hover (fond foncé) */
}

/* ==========================================================================
   Popup Leaflet — design éditorial refined warm
   ========================================================================== */

/* Override de la chrome Leaflet (wrapper, tip, close button) scopé à .nourri-popup */
.leaflet-popup.nourri-popup .leaflet-popup-content-wrapper {
	background: #ffffff;
	border-radius: 14px;
	padding: 0;
	overflow: hidden;
	box-shadow:
		0 18px 48px -16px rgba(36, 20, 46, 0.32),
		0 4px 14px -4px rgba(36, 20, 46, 0.14);
	border: 1px solid rgba(36, 20, 46, 0.06);
}
.leaflet-popup.nourri-popup .leaflet-popup-content {
	margin: 0;
	width: 280px !important;
	line-height: 1.5;
}
.leaflet-popup.nourri-popup .leaflet-popup-tip {
	background: #ffffff;
	box-shadow: 0 4px 8px -2px rgba(36, 20, 46, 0.18);
}
.leaflet-popup.nourri-popup .leaflet-popup-close-button {
	color: rgba(36, 20, 46, 0.45) !important;
	font-size: 22px !important;
	font-weight: 300 !important;
	padding: 8px 10px !important;
	width: auto !important;
	height: auto !important;
	transition: color 0.2s ease;
}
.leaflet-popup.nourri-popup .leaflet-popup-close-button:hover {
	color: #24142E !important;
}

/* Inner popup card */
.nourri-regionales-map__popup {
	font-family: 'Reddit Sans', system-ui, -apple-system, sans-serif;
}

/* Bandeau dégradé en haut — utilise les 3 couleurs de marque */
.nourri-regionales-map__popup-accent {
	height: 4px;
	background: linear-gradient(90deg, #F0C88D 0%, #E396A6 60%, #24142E 100%);
}

.nourri-regionales-map__popup-content {
	padding: 20px 22px 22px;
}

/* Eyebrow petit caps rose — donne un côté éditorial */
.nourri-regionales-map__popup-eyebrow {
	margin: 0 0 6px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #E396A6;
}

.nourri-regionales-map__popup-title {
	margin: 0 0 16px;
	font-size: 17px;
	font-weight: 700;
	color: #24142E;
	line-height: 1.25;
	letter-spacing: -0.015em;
}

/* Bloc contact avec icônes */
.nourri-regionales-map__popup-contact {
	display: flex;
	flex-direction: column;
	gap: 9px;
	margin-bottom: 18px;
	padding-top: 14px;
	border-top: 1px solid rgba(36, 20, 46, 0.08);
}

.nourri-regionales-map__popup-row {
	display: flex;
	gap: 11px;
	align-items: flex-start;
	font-size: 13px;
	line-height: 1.45;
	color: #4b5563;
}

.nourri-regionales-map__popup-icon {
	flex-shrink: 0;
	width: 15px;
	height: 15px;
	margin-top: 2px;
	color: #E396A6;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.nourri-regionales-map__popup-icon svg {
	width: 100%;
	height: 100%;
	display: block;
}

.nourri-regionales-map__popup-row-text {
	font-style: normal;
	white-space: pre-line;
}

.nourri-regionales-map__popup-row-link {
	color: inherit;
	text-decoration: none;
	word-break: break-word;
	transition: color 0.15s ease;
}
.nourri-regionales-map__popup-row-link:hover {
	color: #24142E;
	text-decoration: underline;
}

/* CTA avec flèche */
.nourri-regionales-map__popup-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	background: #24142E;
	color: #fff !important;
	text-decoration: none;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.005em;
	transition: background 0.22s ease, color 0.22s ease, gap 0.22s ease;
	border: none;
}
.nourri-regionales-map__popup-link:hover {
	background: #E396A6;
	color: #24142E !important;
	gap: 12px;
}
.nourri-regionales-map__popup-link-arrow {
	flex-shrink: 0;
	transition: transform 0.2s ease;
}
.nourri-regionales-map__popup-link:hover .nourri-regionales-map__popup-link-arrow {
	transform: translateX(2px);
}
