/**
 * MuscleCare Guide — Platform styles
 * Only what Tailwind utilities can't express: focus rings, motion
 * preferences, print, and the handful of third-party overrides.
 * Everything else stays in Tailwind classes, as the theme already does.
 */

/* --- Accessibility floor -------------------------------------------- */

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid #6366f1;
	outline-offset: 2px;
	border-radius: 6px;
}

.mcg-chip:focus-within {
	outline: 2px solid #6366f1;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* --- Star rating input ---------------------------------------------- */

.mcg-star {
	background: none;
	border: 0;
	padding: 0 2px;
	cursor: pointer;
	color: inherit;
	line-height: 1;
}

.mcg-star-input:hover .mcg-star {
	color: #fbbf24;
}

.mcg-star-input .mcg-star:hover ~ .mcg-star {
	color: inherit;
}

/* --- Leaflet: match the theme, including dark mode ------------------- */

.leaflet-container {
	background: #f1f5f9;
	font-family: inherit;
}

html.dark .leaflet-container {
	background: #0f1523;
}

html.dark .leaflet-tile-pane {
	filter: invert(92%) hue-rotate(180deg) brightness(85%) contrast(105%);
}

.leaflet-popup-content-wrapper {
	border-radius: 14px;
	box-shadow: 0 12px 30px rgba(15, 23, 42, 0.18);
}

.leaflet-popup-content {
	margin: 12px 16px;
	font-size: 13px;
	line-height: 1.55;
}

html.dark .leaflet-popup-content-wrapper,
html.dark .leaflet-popup-tip {
	background: #0f1523;
	color: #e2e8f0;
}

/* --- Details/summary chevron ---------------------------------------- */

details > summary::-webkit-details-marker {
	display: none;
}

/* --- Range input, consistent across browsers ------------------------ */

input[type="range"] {
	height: 6px;
	border-radius: 999px;
	background: rgba(99, 102, 241, 0.2);
	appearance: none;
}

input[type="range"]::-webkit-slider-thumb {
	appearance: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #4f46e5;
	border: 3px solid #fff;
	box-shadow: 0 1px 6px rgba(79, 70, 229, 0.5);
	cursor: pointer;
}

input[type="range"]::-moz-range-thumb {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #4f46e5;
	border: 3px solid #fff;
	cursor: pointer;
}

/* --- Print: a practitioner profile or plan should print cleanly ------ */

@media print {
	header,
	footer,
	#mcg-chat-toggle,
	#mcg-chat-window,
	#mcg-enquiry-form,
	.mcg-ad,
	.leaflet-control-container {
		display: none !important;
	}

	main {
		max-width: 100% !important;
	}

	a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 10px;
		color: #64748b;
	}
}