.gem-wrap { position: relative; font-family: inherit; }
.gem-bar, .gem-cats, .gem-status {
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
	padding: 10px 12px; background: #f6f7f5; border: 1px solid #e2e4df; border-bottom: 0;
}
.gem-bar { border-radius: 8px 8px 0 0; }
.gem-cats { padding-top: 0; border-top: 0; }
.gem-status { padding: 6px 12px; font-size: .85em; color: #555; background: #fff; }

.gem-field { display: flex; align-items: center; gap: 6px; font-weight: 600; margin: 0; font-size: .95em; }
.gem-select, .gem-bar input[type="date"] {
	padding: 6px 8px; border-radius: 6px; border: 1px solid #c9ccc4; background: #fff; font: inherit; font-weight: 400;
}
.gem-select { min-width: 160px; }

.gem-presets { display: flex; flex-wrap: wrap; gap: 4px; }
.gem-presets button, .gem-chip {
	font: inherit; font-size: .88em; line-height: 1.2; cursor: pointer;
	padding: 6px 10px; border-radius: 999px; border: 1px solid #c9ccc4; background: #fff; color: #333;
}
.gem-presets button:hover, .gem-chip:hover { border-color: #888; }
.gem-presets button.is-active { background: #1f2a1f; border-color: #1f2a1f; color: #fff; }

.gem-chip { display: inline-flex; align-items: center; gap: 6px; }
.gem-chip i { width: 10px; height: 10px; border-radius: 50%; background: var(--c, #7f8c8d); }
.gem-chip b { font-weight: 600; opacity: .7; }
.gem-chip.is-active { background: var(--c, #1f2a1f); border-color: var(--c, #1f2a1f); color: #fff; }
.gem-chip.is-active i { background: #fff; }

.gem-map { width: 100%; border: 1px solid #e2e4df; border-radius: 0 0 8px 8px; z-index: 0; }
.gem-wrap.is-loading .gem-map { opacity: .6; transition: opacity .2s; }
.gem-wrap.is-loading .gem-status::before {
	content: ""; display: inline-block; width: 10px; height: 10px;
	border: 2px solid #2e7d32; border-top-color: transparent; border-radius: 50%;
	animation: gem-spin .8s linear infinite;
}
@keyframes gem-spin { to { transform: rotate(360deg); } }

/* Marqueurs */
.gem-pin { background: none; border: 0; }
.gem-pin span {
	display: flex; align-items: center; justify-content: center; box-sizing: border-box;
	border-radius: 50%; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4);
	color: #fff; font: 700 11px/1 sans-serif;
}

/* Popup */
.gem-pop strong { font-size: 1.05em; }
.gem-city { color: #666; font-size: .9em; margin-bottom: 6px; }
.gem-pop ul { list-style: none; margin: 0; padding: 0; max-height: 240px; overflow-y: auto; }
.gem-pop li { display: flex; gap: 8px; padding: 6px 0; border-top: 1px solid #eee; line-height: 1.3; }
.gem-pop li > i { flex: 0 0 8px; height: 8px; margin-top: 5px; border-radius: 50%; }
.gem-pop li span { display: block; font-size: .82em; color: #666; }
.gem-pop li em { font-style: normal; opacity: .75; }
.gem-pop a { color: #2e7d32; text-decoration: none; font-weight: 600; }
.gem-pop a:hover { text-decoration: underline; }
.gem-more { margin-top: 6px; font-size: .85em; color: #666; font-style: italic; }

@media (max-width: 600px) {
	.gem-field { flex: 1 1 100%; }
	.gem-select, .gem-bar input[type="date"] { flex: 1; min-width: 0; }
}