/**
 * Cartes Trokaaz (spec lot 3A) — mobile d'abord, sans framework.
 */

.trokaaz-carte__conteneur {
	height: 320px;
	width: 100%;
	border-radius: 8px;
	z-index: 0;
}

@media ( min-width: 768px ) {
	.trokaaz-carte__conteneur {
		height: 420px;
	}
}

.trokaaz-carte__vide {
	margin: 12px 0 0;
	padding: 12px 16px;
	background: #f2f7f2;
	border-left: 4px solid #2e7d32;
}

.trokaaz-relais-liste {
	margin-top: 16px;
}

.trokaaz-relais-liste h3 {
	margin-bottom: 4px;
}

.trokaaz-relais-liste ul {
	margin: 0 0 8px;
	padding-left: 20px;
}

/* Carte des annonces : repliable. */
details[data-trokaaz-carte="annonces"] {
	margin-bottom: 16px;
}

details[data-trokaaz-carte="annonces"] > summary {
	cursor: pointer;
	font-weight: 600;
	padding: 8px 0;
}

/* Badge de décompte par commune. */
.trokaaz-badge-commune span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #2e7d32;
	color: #fff;
	font-weight: 700;
	border: 2px solid #fff;
	box-shadow: 0 1px 4px rgba( 0, 0, 0, 0.4 );
}

/* Itinéraire en un geste : phrase d'aide + boutons tactiles empilés. */
.trokaaz-itineraire {
	display: block;
	margin-top: 10px;
}

.trokaaz-itineraire__aide {
	display: block;
	margin: 0 0 6px;
	font-size: 0.9em;
	color: #444;
}

.trokaaz-itineraire__principal,
.trokaaz-itineraire__btn {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 260px;
	margin: 6px 0;
	padding: 8px 10px;
	border-radius: 8px;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	line-height: 1.2;
}

/* Rangée compacte : les trois applications côte à côte. */
.trokaaz-itineraire__rangee {
	display: flex;
	gap: 6px;
	max-width: 260px;
}

.trokaaz-itineraire__rangee .trokaaz-itineraire__btn {
	flex: 1;
	margin: 0;
	padding: 7px 4px;
	font-size: 0.85em;
}

.trokaaz-itineraire__principal {
	background: #2e7d32;
	color: #fff !important;
	border: 2px solid #2e7d32;
}

.trokaaz-itineraire__btn {
	background: #fff;
	color: #2e7d32 !important;
	border: 2px solid #2e7d32;
}

/* Dans les listes (sous la carte, encart de troc) : boutons côte à côte. */
.trokaaz-relais-liste .trokaaz-itineraire__principal,
.trokaaz-relais-liste .trokaaz-itineraire__btn,
.trokaaz-troc__relais .trokaaz-itineraire__principal,
.trokaaz-troc__relais .trokaaz-itineraire__btn {
	display: inline-block;
	width: auto;
	margin: 4px 6px 4px 0;
	padding: 7px 12px;
}

/* Choix d'un lieu de rencontre (conversation, lot 6.5) : carte plus basse,
   bouton « Proposer ce lieu » dans la bulle, liste + bouton en dessous. */
.trokaaz-choix-relais__carte {
	height: 280px;
	margin: 0 0 12px;
	border: 1px solid #e2c58f;
}

.trokaaz-choix-relais__bouton {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 260px;
	margin: 10px 0 2px;
	padding: 9px 10px;
	border: 2px solid #b8461a;
	border-radius: 8px;
	background: #df602d;
	color: #fff;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
}

.trokaaz-choix-relais__form label,
.trokaaz-bandeau-troc__autre-lieu label {
	display: block;
	margin: 0 0 6px;
	font-weight: 700;
}

.trokaaz-choix-relais__ligne {
	display: flex;
	gap: 8px;
	align-items: stretch;
}

.trokaaz-choix-relais__ligne select,
.trokaaz-choix-relais__ligne input {
	flex: 1;
	min-width: 0;
}

.trokaaz-bandeau-troc__autre-lieu {
	margin-top: 14px;
	padding-top: 10px;
	border-top: 1px dashed #e2c58f;
}

.trokaaz-bandeau-troc__autre-lieu > summary {
	cursor: pointer;
	font-weight: 600;
	color: #4a4238;
}

.trokaaz-bandeau-troc__autre-lieu form {
	margin-top: 10px;
}

@media only screen and (max-width: 575px) {
	.trokaaz-choix-relais__ligne {
		flex-direction: column;
	}
}

/* La bulle Leaflet : jamais plus large que l'écran, contenu compact. */
.leaflet-popup-content {
	margin: 10px 12px;
	max-width: calc( 100vw - 90px );
	font-size: 0.92em;
	line-height: 1.35;
}

/* Bulle ouverte : les contrôles +/− s'estompent, la lecture prime (le
   z-index ne peut pas faire passer la bulle devant — voir trokaaz-cartes.js). */
.trokaaz-bulle-ouverte .leaflet-control-zoom {
	opacity: 0.15;
	pointer-events: none;
	transition: opacity 0.2s;
}

.leaflet-control-zoom {
	transition: opacity 0.2s;
}

/* Dans la bulle : bouton principal et rangée d'applications à la même
   largeur, centrés — aucun décalage. */
.leaflet-popup-content .trokaaz-itineraire {
	text-align: center;
}

.leaflet-popup-content .trokaaz-itineraire__principal,
.leaflet-popup-content .trokaaz-itineraire__rangee {
	width: 100%;
	max-width: 260px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}

.leaflet-popup-content .trokaaz-itineraire__rangee {
	margin-top: 6px;
}

.leaflet-popup-content .trokaaz-itineraire__principal,
.leaflet-popup-content .trokaaz-itineraire__btn {
	max-width: none;
}

/* Événements (lot 3B). */
.trokaaz-event-carte {
	margin: 0 0 16px;
	padding: 12px 16px;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
}

.trokaaz-event-carte--annule {
	opacity: 0.65;
}

.trokaaz-event-carte h3 {
	margin: 0 0 4px;
}

.trokaaz-event-annule {
	display: inline-block;
	padding: 4px 10px;
	background: #fdecea;
	color: #b3261e;
	border-radius: 6px;
}

.trokaaz-event-jauge {
	font-weight: 600;
}

.trokaaz-events__passes {
	margin-top: 20px;
}

.trokaaz-events__passes > summary {
	cursor: pointer;
	font-weight: 600;
	padding: 8px 0;
}

.trokaaz-event-inscription {
	margin: 16px 0;
	padding: 12px 16px;
	background: #f2f7f2;
	border-radius: 8px;
}

/* Badges (lot 4). */
.trokaaz-badges__grille {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 150px, 1fr ) );
	gap: 16px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.trokaaz-badge {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 12px;
	text-align: center;
	border: 1px solid #f0e2c4;
	border-radius: 10px;
	background: #fdf6e8;
}

.trokaaz-badge--restant img {
	filter: grayscale( 1 );
	opacity: 0.45;
}

.trokaaz-badge progress {
	width: 100%;
	accent-color: #6b8e4e;
}

.trokaaz-badge__progression {
	font-weight: 700;
}

.trokaaz-badges-profil {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin: 8px 0;
}

.trokaaz-top__liste li {
	padding: 4px 0;
}

.trokaaz-top__note {
	font-size: 0.9em;
	color: #555;
}

/* Adhésion (lot 5) : encadré « Adhérer », page d'adhésion, Mon adhésion. */
.trokaaz-appel {
	margin: 0 0 16px;
	padding: 14px 16px;
	background: #fdf6e8;
	border: 1px solid #f3ba6b;
	border-left: 4px solid #df602d;
	border-radius: 8px;
}

.trokaaz-appel p {
	margin: 0 0 10px;
}

.trokaaz-appel__bouton {
	display: inline-block;
	padding: 10px 18px;
	border-radius: 8px;
	background: #df602d;
	color: #fff !important;
	font-weight: 700;
	text-decoration: none !important;
	line-height: 1.2;
}

.trokaaz-appel__bouton--secondaire {
	background: #fff;
	color: #df602d !important;
	border: 2px solid #df602d;
}

.trokaaz-adhesion__avantages {
	margin: 0 0 20px;
	padding-left: 20px;
}

.trokaaz-adhesion__tarif {
	margin: 0 0 20px;
	padding: 16px;
	background: #faeea6;
	border-radius: 10px;
}

.trokaaz-adhesion__montant {
	margin: 0 0 6px;
	font-size: 2em;
	font-weight: 800;
	color: #111;
}

.trokaaz-adhesion__montant span {
	font-size: 0.5em;
	font-weight: 600;
}

.trokaaz-adhesion__mention {
	font-size: 0.92em;
	color: #444;
}

.trokaaz-mon-adhesion__statut {
	margin: 0 0 20px;
	padding: 14px 16px;
	border-radius: 8px;
	background: #fdf6e8;
	border-left: 4px solid #f3ba6b;
}

.trokaaz-mon-adhesion__statut--a_jour {
	background: #f2f7f2;
	border-left-color: #6b8e4e;
}

.trokaaz-mon-adhesion__statut p {
	margin: 0 0 8px;
}

.trokaaz-mon-adhesion__historique {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95em;
}

.trokaaz-mon-adhesion__historique th,
.trokaaz-mon-adhesion__historique td {
	padding: 6px 8px;
	border-bottom: 1px solid #f0e2c4;
	text-align: left;
}

.trokaaz-republication {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.trokaaz-republication li {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0;
	border-bottom: 1px solid #f0e2c4;
}

.trokaaz-republication__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
}

/* Encart relais dans un troc. */
.trokaaz-troc__relais {
	margin: 8px 0;
	padding: 8px 12px;
	background: #f2f7f2;
	border-radius: 6px;
	font-size: 0.95em;
}

.trokaaz-troc__relais ul {
	margin: 4px 0 0;
	padding-left: 18px;
}
