/**
 * DMR75 — barre supérieure : date/heure, état FreeDMR, propagation tropo.
 */

.dmr-topbar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 18px;
	font-size: 14px;
	line-height: 1;
}

/* Date et heure */
.dmr-topbar-datetime {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	letter-spacing: -0.01em;
}

.dmr-topbar-datetime i {
	font-size: 13px;
	opacity: 0.65;
}

.dmr-topbar-date::first-letter {
	text-transform: uppercase;
}

.dmr-topbar-divider {
	width: 1px;
	height: 14px;
	background: currentColor;
	opacity: 0.25;
}

/* L'heure défile à la seconde : une chasse fixe évite que la ligne tremble. */
.dmr-topbar-clock {
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum";
}

/* Pastilles d'état */
.dmr-chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 5px 11px;
	border-radius: 999px;
	background: rgba(128, 128, 128, 0.12);
	color: inherit;
	text-decoration: none;
	transition: background 0.2s ease;
}

.dmr-chip:hover,
.dmr-chip:focus {
	background: rgba(128, 128, 128, 0.22);
	color: inherit;
}

.dmr-chip i {
	font-size: 13px;
	opacity: 0.75;
}

.dmr-chip-label {
	font-weight: 600;
	opacity: 0.75;
}

.dmr-chip-value {
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.dmr-chip-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #9aa0a6;
	box-shadow: 0 0 0 3px rgba(154, 160, 166, 0.2);
}

/* États : gris inconnu, rouge hors service, vert en service.
   Tropo : gris normale, bleu légère, ambre bonne, vert conduit. */
.dmr-chip-dot[data-state="down"]    { background: #e5484d; box-shadow: 0 0 0 3px rgba(229, 72, 77, 0.22); }
.dmr-chip-dot[data-state="up"]      { background: #30a46c; box-shadow: 0 0 0 3px rgba(48, 164, 108, 0.22); }
.dmr-chip-dot[data-state="tropo-0"] { background: #9aa0a6; box-shadow: 0 0 0 3px rgba(154, 160, 166, 0.2); }
.dmr-chip-dot[data-state="tropo-1"] { background: #3b82f6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.22); }
.dmr-chip-dot[data-state="tropo-2"] { background: #f5a524; box-shadow: 0 0 0 3px rgba(245, 165, 36, 0.24); }
.dmr-chip-dot[data-state="tropo-3"] { background: #30a46c; box-shadow: 0 0 0 3px rgba(48, 164, 108, 0.22); }

@media (max-width: 991px) {
	.dmr-topbar {
		justify-content: center;
	}
}
