/* Rocheport Times: Discover (modules/discover). Loaded on the Discover page only.
   A printed newspaper map: black on white, Times, hairline rules, no cards,
   shadows or gradients. Every colour is a theme token. */

.rt-disc {
	--d-ink: var(--wp--preset--color--contrast, #000);
	--d-ground: var(--wp--preset--color--base, #fff);
	--d-muted: var(--wp--preset--color--muted, #555);
	--d-rule: var(--wp--preset--color--border, #bbb);
	--d-link: var(--wp--preset--color--clay-dark, #14387f);
	font-family: "Times New Roman", Times, "Nimbus Roman", serif;
	color: var(--d-ink);
}
.rt-disc a { color: var(--d-link); }
.rt-disc__dek {
	font-size: 1.0625rem;
	line-height: 1.45;
	color: var(--d-muted);
	margin: 0 0 .75rem;
	max-width: 40rem;
}
.rt-disc__key { font-size: .9375rem; color: var(--d-muted); margin: 0 0 .75rem; }
/* Each legend entry stays whole, so the line wraps between them on the phone. */
.rt-disc__key span.rt-disc__item { display: inline-block; margin-right: 1rem; }
.rt-disc__dot { display: inline-block; border-radius: 50%; vertical-align: -1px; margin-right: .2rem; }
.rt-disc__dot--big { width: 14px; height: 14px; background: var(--d-ink); }
.rt-disc__dot--open { width: 9px; height: 9px; border: 2px solid var(--d-ink); background: var(--d-ground); }

/* ---------- the map ------------------------------------------------------ */
.rt-disc__map {
	width: 100%;
	height: 400px;
	border: 1px solid var(--d-ink);
	margin: 0 0 2rem;
}
@media (min-width: 960px) { .rt-disc__map { height: 600px; } }
/* Newspaper look: drain the basemap's colour. Markers sit outside the canvas, so they stay black. */
.rt-disc__map .maplibregl-canvas { filter: grayscale(1) contrast(.92) brightness(1.04); }
.rt-disc__map .maplibregl-ctrl-attrib { font-family: "Times New Roman", Times, serif; }

/* MapLibre positions .rt-disc-mark with its own transform; the look is on the inner spans. */
.rt-disc-mark {
	/* No position here: MapLibre's own .maplibregl-marker is position:absolute, and the label and dot hang off it. */
	display: block;
	width: var(--d);
	height: var(--d);
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	font: inherit;
}
.rt-disc-mark__dot {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: #000;
	border: 2px solid #fff;
	box-sizing: border-box;
}
.rt-disc-mark.is-open .rt-disc-mark__dot { background: #fff; border: 2px solid #000; }
.rt-disc-mark.is-home .rt-disc-mark__dot { outline: 2px solid #000; outline-offset: 2px; }
.rt-disc-mark:focus-visible .rt-disc-mark__dot { outline: 3px solid #14387f; outline-offset: 2px; }
/* Tap target: at least 36px even for a 9px dot. */
.rt-disc-mark::after { content: ""; position: absolute; left: 50%; top: 50%; width: 36px; height: 36px; transform: translate(-50%, -50%); }
.rt-disc-mark__lab {
	display: none;
	position: absolute;
	left: calc(100% + 3px);
	top: 50%;
	transform: translateY(-50%);
	white-space: nowrap;
	font-family: "Times New Roman", Times, serif;
	font-size: 14px;
	line-height: 1;
	color: #000;
	text-shadow: -1px -1px #fff, 1px -1px #fff, -1px 1px #fff, 1px 1px #fff, 0 0 3px #fff;
	pointer-events: none;
}
.rt-disc-mark.is-home .rt-disc-mark__lab { font-weight: 700; }
.rt-disc-mark.is-major .rt-disc-mark__lab,
.rt-disc-mark.is-home .rt-disc-mark__lab { display: block; }
.rt-disc__map.z-mid .is-minor .rt-disc-mark__lab { display: block; }
.rt-disc__map.z-high .is-hamlet .rt-disc-mark__lab { display: block; }
.rt-disc__map .maplibregl-popup-content {
	font-family: "Times New Roman", Times, serif;
	font-size: 15px;
	line-height: 1.35;
	color: #000;
	border-radius: 0;
	box-shadow: none;
	border: 1px solid #000;
	padding: 10px 28px 10px 12px;
}
.rt-disc__map .maplibregl-popup-close-button { font-size: 20px; width: 32px; height: 32px; color: #000; }
.rt-disc-pop strong { font-size: 17px; display: block; }
.rt-disc-pop__note { color: #555; font-size: 13px; margin-top: 2px; }
.rt-disc-pop__src { font-size: 13px; }

/* ---------- the list ----------------------------------------------------- */
.rt-disc__county { margin: 0 0 2rem; max-width: 40rem; }
.rt-disc__county h2 {
	font-size: 1.5rem;
	margin: 0 0 .5rem;
	padding-top: .5rem;
	border-top: 3px double var(--d-ink);
}
.rt-disc__county h3 { font-size: 1rem; font-style: italic; font-weight: 400; margin: 1rem 0 .25rem; }
.rt-disc__list { list-style: none; margin: 0; padding: 0; }
.rt-disc__list li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	column-gap: .75rem;
	align-items: baseline;
	padding: .35rem 0;
	border-bottom: 1px solid var(--d-rule);
}
.rt-disc__name { font-weight: 700; }
.rt-disc__type { color: var(--d-muted); }
.rt-disc__pop { min-width: 4.5rem; text-align: right; font-variant-numeric: tabular-nums; }
.rt-disc__note { grid-column: 1 / -1; font-size: .875rem; color: var(--d-muted); }
.rt-disc__unincorp { margin: 0; line-height: 1.5; }
.rt-disc__src { max-width: 40rem; font-size: .875rem; color: var(--d-muted); border-top: 1px solid var(--d-rule); padding-top: .75rem; }

/* Page gutter: 16px on the phone, no sideways scroll. */
.rt-disc-page { padding: 1rem 16px 3rem; box-sizing: border-box; max-width: 100%; overflow-x: clip; }

/* ---------- county and town pages ---------------------------------------- */
.rt-disc--place { max-width: 46rem; margin: 0 auto; }
.rt-disc__crumbs { font-size: .9375rem; color: var(--d-muted); margin: 0 0 .5rem; }
.rt-disc__h1 { font-size: 2rem; line-height: 1.1; margin: 0 0 .75rem; font-weight: 700; }
.rt-disc__facts { display: flex; flex-wrap: wrap; gap: .5rem 2rem; margin: 0 0 .75rem; padding: .5rem 0; border-top: 1px solid var(--d-ink); border-bottom: 1px solid var(--d-rule); }
.rt-disc__facts div { min-width: 0; }
.rt-disc__facts dt { font-size: .8125rem; text-transform: uppercase; letter-spacing: .04em; color: var(--d-muted); }
.rt-disc__facts dd { margin: 0; font-size: 1.125rem; font-weight: 700; }
.rt-disc__factnote { font-size: .9375rem; color: var(--d-muted); margin: 0 0 .75rem; max-width: 40rem; }
.rt-disc__map--place { height: 280px; margin: 1rem 0 1.5rem; }
@media (min-width: 960px) { .rt-disc__map--place { height: 380px; } }
.rt-disc__block { margin: 0 0 1.75rem; }
.rt-disc__block h2 { font-size: 1.375rem; margin: 0 0 .5rem; padding-top: .5rem; border-top: 3px double var(--d-ink); }
.rt-disc__block h3 { font-size: 1rem; font-style: italic; font-weight: 400; margin: 1rem 0 .25rem; }
.rt-disc__stories, .rt-disc__events, .rt-disc__dir, .rt-disc__unlist { list-style: none; margin: 0; padding: 0; }
.rt-disc__stories li, .rt-disc__events li, .rt-disc__dir li { padding: .4rem 0; border-bottom: 1px solid var(--d-rule); line-height: 1.35; }
.rt-disc__stories a { font-weight: 700; }
.rt-disc__when { color: var(--d-muted); font-size: .9375rem; white-space: nowrap; }
.rt-disc__ex { display: block; color: var(--d-muted); font-size: .9375rem; margin-top: .15rem; white-space: normal; }
.rt-disc__empty, .rt-disc__more { color: var(--d-muted); margin: .25rem 0 0; }
.rt-disc__unlist { columns: 2; column-gap: 1.5rem; }
.rt-disc__unlist li { padding: .15rem 0; break-inside: avoid; }
.rt-disc__events li[hidden] { display: none; }
.rt-disc-pop__more { display: block; font-size: 14px; margin-top: 4px; }
.rt-disc__county h2 a { color: inherit; text-decoration: none; }
.rt-disc__county h2 a:hover { text-decoration: underline; }
.rt-town-link { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
