@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&display=swap");

/*
 * The map is a live utility, so its editorial treatment is intentionally
 * scoped. The map library, data attributes and interaction hooks remain
 * untouched.
 */
.editorial-map {
  --map-paper: #f5f4ee;
  --map-panel: #fbfaf5;
  --map-ink: #193a32;
  --map-muted: #687970;
  --map-line: #d5ddd5;
  --map-moss: #28594a;
  --map-rust: #a75336;
  --map-wheat: #e6c477;
  background: var(--map-paper);
  color: var(--map-ink);
  font-family: "DM Sans", sans-serif;
  padding: 1rem 0 4.5rem;
}

.editorial-map h1,
.editorial-map h2,
.editorial-map h3,
.editorial-map h4 {
  font-family: "Fraunces", Georgia, serif !important;
  color: var(--map-ink) !important;
  letter-spacing: -.04em;
}
.editorial-map > .max-w-7xl { padding-top: clamp(2rem, 5vw, 4.5rem) !important; }
.editorial-map > .max-w-7xl > .text-center {
  text-align: left;
  border-bottom: 1px solid var(--map-line);
  padding-bottom: 1.6rem;
  margin-bottom: 1.75rem !important;
}
.editorial-map > .max-w-7xl > .text-center h1 {
  margin-bottom: .55rem !important;
  font-size: clamp(2.65rem, 6vw, 5.25rem) !important;
  font-weight: 500 !important;
  line-height: .95;
}
.editorial-map > .max-w-7xl > .text-center p {
  max-width: 42rem;
  color: var(--map-muted) !important;
  font-size: 1.05rem;
}

.editorial-map .bg-white {
  background: var(--map-panel) !important;
}
.editorial-map .rounded,
.editorial-map .rounded-lg,
.editorial-map .rounded-xl,
.editorial-map .rounded-2xl,
.editorial-map .rounded-full {
  border-radius: 0 !important;
}
.editorial-map .shadow-md,
.editorial-map .shadow-lg,
.editorial-map .shadow-xl,
.editorial-map .shadow-2xl {
  box-shadow: 0 10px 24px rgba(25, 58, 50, .075) !important;
}
.editorial-map .border-gray-100,
.editorial-map .border-gray-200,
.editorial-map .border-gray-300 {
  border-color: var(--map-line) !important;
}
.editorial-map .text-golf-navy,
.editorial-map .text-gray-800,
.editorial-map .text-gray-700 { color: var(--map-ink) !important; }
.editorial-map .text-gray-500,
.editorial-map .text-gray-600 { color: var(--map-muted) !important; }
.editorial-map .text-golf-blue { color: var(--map-moss) !important; }
.editorial-map .bg-golf-blue,
.editorial-map .bg-golf-green { background: var(--map-moss) !important; }
.editorial-map .bg-gray-50,
.editorial-map .bg-gray-100 { background: #e9eee8 !important; }

/* AI search is the page's lead utility panel. */
.editorial-map > .max-w-7xl > .bg-white {
  border: 1px solid var(--map-line) !important;
  box-shadow: 0 14px 30px rgba(25, 58, 50, .09) !important;
  padding: clamp(1.2rem, 3vw, 2rem) !important;
}
.editorial-map > .max-w-7xl > .bg-white h2 {
  font-size: 1.5rem !important;
  font-weight: 500 !important;
}
.editorial-map #ai-search-input {
  min-height: 3.2rem;
  border: 1px solid var(--map-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--map-ink) !important;
  box-shadow: none !important;
}
.editorial-map #ai-search-input:focus {
  border-color: var(--map-moss) !important;
  box-shadow: 0 0 0 3px #dce8de !important;
}
.editorial-map #ai-search-button,
.editorial-map #apply-filters-mobile {
  border-radius: 0 !important;
  background: var(--map-moss) !important;
  font: 500 .68rem "DM Mono", monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
  box-shadow: none !important;
}
.editorial-map #ai-search-button:hover,
.editorial-map #apply-filters-mobile:hover { background: var(--map-ink) !important; }
.editorial-map #clear-search,
.editorial-map #clear-filters-sidebar {
  color: var(--map-rust) !important;
  font: 500 .67rem "DM Mono", monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.editorial-map #search-suggestions-container {
  font-size: .75rem;
}
.editorial-map #search-suggestions button {
  color: var(--map-moss) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.editorial-map #search-results-info {
  border-radius: 0 !important;
  border-left-color: var(--map-rust) !important;
  background: #eeeade !important;
}

/* Filter rail and map frame. */
.editorial-map .sticky {
  border: 1px solid var(--map-line);
  box-shadow: 0 10px 22px rgba(25, 58, 50, .065) !important;
}
.editorial-map .filter-header {
  min-height: 3.25rem;
  padding: .75rem .2rem !important;
  color: var(--map-ink);
  font: 600 .9rem "DM Sans", sans-serif;
  border-bottom: 1px solid transparent;
}
.editorial-map .filter-header:hover,
.editorial-map label:hover { background: #eeeee5 !important; }
.editorial-map .filter-content { border-color: var(--map-line) !important; padding: .4rem 0 .75rem !important; }
.editorial-map .filter-content h4,
.editorial-map .sticky > div > h4,
.editorial-map .uppercase {
  font: 500 .65rem "DM Mono", monospace !important;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.editorial-map select {
  min-height: 2.7rem;
  border-color: var(--map-line) !important;
  border-radius: 0 !important;
  background: var(--map-panel) !important;
  color: var(--map-ink) !important;
  box-shadow: none !important;
}
.editorial-map select:focus { border-color: var(--map-moss) !important; }
.editorial-map #mobile-filter-btn {
  border-radius: 0 !important;
  border-color: var(--map-line) !important;
  color: var(--map-ink);
  box-shadow: none !important;
}
.editorial-map #mobile-filter-btn:hover { background: #e9eee8 !important; }
.editorial-map #map {
  min-height: 600px;
  border: 1px solid var(--map-line);
  background: #dfe7df;
}
.editorial-map .map-marker {
  --marker-color: var(--map-moss);
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  color: #fff;
  background: var(--marker-color);
  border: 3px solid #fff;
  border-radius: 50% 50% 50% 0;
  box-shadow: 0 2px 0 rgba(25, 58, 50, .28), 0 3px 9px rgba(25, 58, 50, .3);
  font: 700 17px/1 Arial, sans-serif;
  transform: rotate(-45deg);
  text-shadow: 0 1px 1px rgba(0, 0, 0, .45);
}
.editorial-map .map-marker > span {
  display: block;
}
.editorial-map .map-marker--course {
  --marker-color: #147a3e;
  transform: rotate(-45deg);
}
.editorial-map .map-marker--hotel {
  --marker-color: #1456a0;
  border-radius: 50%;
  transform: none;
}
.editorial-map .map-marker--business {
  --marker-color: #b84c20;
  border-radius: 5px;
  transform: none;
}
.editorial-map .map-marker--attraction {
  --marker-color: #7138a5;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}
.editorial-map .map-marker--course > span,
.editorial-map .map-marker--attraction > span {
  transform: rotate(45deg);
}
.editorial-map .map-marker--hotel > span { font-size: 14px; letter-spacing: -2px; }
.editorial-map .map-marker--business > span { font-size: 16px; }
.editorial-map .map-marker--attraction > span { font-size: 14px; }
.editorial-map .leaflet-marker-icon.custom-marker { overflow: visible; }
.editorial-map .leaflet-marker-icon.custom-marker:focus .map-marker,
.editorial-map .leaflet-marker-icon.custom-marker:hover .map-marker {
  box-shadow: 0 0 0 4px rgba(230, 196, 119, .72), 0 3px 10px rgba(25, 58, 50, .35);
}
.editorial-map .map-legend {
  color: var(--map-ink);
  font-size: .78rem;
}
.editorial-map .map-legend-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .55rem 1rem;
  margin-bottom: .55rem;
}
.editorial-map .map-legend-item {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-weight: 600;
  white-space: nowrap;
}
.editorial-map .map-legend-marker {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  color: #fff;
  border: 2px solid #fff;
  box-shadow: 0 1px 3px rgba(25, 58, 50, .3);
  font: 700 12px/1 Arial, sans-serif;
}
.editorial-map .map-legend-marker--course {
  background: #147a3e;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}
.editorial-map .map-legend-marker--course span,
.editorial-map .map-legend-marker--attraction span { transform: rotate(45deg); }
.editorial-map .map-legend-marker--hotel {
  background: #1456a0;
  border-radius: 50%;
  transform: none;
}
.editorial-map .map-legend-marker--business {
  background: #b84c20;
  border-radius: 4px;
  transform: none;
}
.editorial-map .map-legend-marker--attraction {
  background: #7138a5;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}
.editorial-map .map-legend-help {
  margin: 0;
  color: var(--map-muted);
  font: 500 .66rem "DM Mono", monospace;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.editorial-map .lg\:col-span-3 > .mt-4 {
  color: var(--map-muted) !important;
  font: 500 .65rem "DM Mono", monospace;
  letter-spacing: .03em;
  text-transform: uppercase;
}

/* Keep the live Leaflet and cluster UI legible within the paper palette. */
.editorial-map .leaflet-control-zoom a {
  border-radius: 0 !important;
  color: var(--map-ink) !important;
}
.editorial-map .leaflet-popup-content-wrapper,
.editorial-map .leaflet-popup-tip { border-radius: 0; }
.editorial-map .marker-cluster-small,
.editorial-map .marker-cluster-medium,
.editorial-map .marker-cluster-large {
  background: rgba(25, 58, 50, .2);
  border-radius: 50%;
}
.editorial-map .marker-cluster div {
  min-width: 38px;
  min-height: 38px;
  display: grid;
  place-items: center;
  margin-left: -1px;
  margin-top: -1px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--map-ink);
  color: #fff;
  font: 700 .78rem "DM Mono", monospace;
  box-shadow: 0 2px 7px rgba(25, 58, 50, .35);
}

.editorial-map a:focus-visible,
.editorial-map button:focus-visible,
.editorial-map input:focus-visible,
.editorial-map select:focus-visible,
.editorial-map-drawer a:focus-visible,
.editorial-map-drawer button:focus-visible,
.editorial-map-drawer input:focus-visible,
.editorial-map-drawer select:focus-visible {
  outline: 3px solid var(--map-rust);
  outline-offset: 2px;
}

/* These controls sit outside the content shell so the JS can use a drawer. */
.editorial-map-overlay { z-index: 1200 !important; }
.editorial-map-drawer {
  --map-panel: #fbfaf5;
  --map-ink: #193a32;
  --map-muted: #687970;
  --map-line: #d5ddd5;
  --map-moss: #28594a;
  --map-rust: #a75336;
  z-index: 1201 !important;
  background: var(--map-panel) !important;
  color: var(--map-ink);
  font-family: "DM Sans", sans-serif;
}
.editorial-map-drawer .border-b { border-color: var(--map-line) !important; }
.editorial-map-drawer h3,
.editorial-map-drawer h4 {
  color: var(--map-ink) !important;
  font-family: "Fraunces", Georgia, serif !important;
  font-weight: 500;
}
.editorial-map-drawer label:hover { background: #eeeee5 !important; }
.editorial-map-drawer select {
  border-color: var(--map-line) !important;
  border-radius: 0 !important;
  background: var(--map-panel) !important;
}
.editorial-map-drawer #mobile-filter-close {
  color: var(--map-rust) !important;
  font-family: "DM Mono", monospace;
}

/* Field-guide filter rail: a quiet, clear counterpoint to the live map. */
.editorial-map .map-filter-panel {
  max-height: calc(100dvh - 2rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1.25rem 1.1rem !important;
  background: var(--map-panel) !important;
  box-shadow: 0 12px 28px rgba(25, 58, 50, .075) !important;
}
.editorial-map .map-filter-intro {
  padding: .1rem .15rem 1.05rem;
  border-bottom: 1px solid var(--map-line);
  margin-bottom: .85rem;
}
.editorial-map .map-filter-kicker {
  margin: 0 0 .45rem;
  color: var(--map-rust);
  font: 500 .62rem "DM Mono", monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.editorial-map-drawer .map-filter-kicker {
  margin: 0 0 .45rem;
  color: var(--map-rust);
  font: 500 .62rem "DM Mono", monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.editorial-map .map-filter-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
}
.editorial-map .map-filter-title-row h3 {
  margin: 0;
  font-size: 1.38rem !important;
  line-height: 1.05;
  font-weight: 500 !important;
}
.editorial-map .map-filter-caption {
  margin: .45rem 0 0;
  color: var(--map-muted);
  font-size: .74rem;
  line-height: 1.45;
}
.editorial-map .map-region-field {
  padding: .2rem .15rem .95rem;
  border-bottom: 1px solid var(--map-line);
  margin-bottom: .35rem !important;
}
.editorial-map .map-region-field h4 {
  margin-bottom: .55rem !important;
}
.editorial-map .filter-section {
  padding: .1rem .15rem;
  border-color: var(--map-line) !important;
}
.editorial-map .filter-header:focus-visible,
.editorial-map-drawer .map-mobile-accordion:focus-visible {
  outline: 3px solid var(--map-rust);
  outline-offset: 2px;
}
.editorial-map .filter-header > span:first-child {
  gap: .65rem !important;
}
.editorial-map .filter-header > span:first-child > span {
  width: .58rem !important;
  height: .58rem !important;
  box-shadow: 0 0 0 3px rgba(25, 58, 50, .06);
}
.editorial-map .filter-content label,
.editorial-map-drawer label {
  min-height: 2.65rem;
  box-sizing: border-box;
  gap: .65rem;
  padding: .55rem .65rem !important;
  color: var(--map-ink);
  line-height: 1.3;
}
.editorial-map .filter-content input[type="checkbox"],
.editorial-map-drawer input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  accent-color: var(--map-moss);
}
.editorial-map .filter-content label span,
.editorial-map-drawer label span {
  margin-left: 0 !important;
  color: var(--map-ink) !important;
}
.editorial-map #clear-filters-sidebar {
  min-height: 2.5rem;
  padding: .35rem .45rem;
}
.editorial-map #mobile-filter-btn {
  min-height: 3rem;
  justify-content: flex-start;
  padding-inline: 1rem;
  font: 600 .78rem "DM Sans", sans-serif;
}
.editorial-map #mobile-filter-btn svg { color: var(--map-moss); }
.editorial-map-drawer {
  display: flex;
  flex-direction: column;
  box-shadow: 14px 0 36px rgba(25, 58, 50, .17);
}
.editorial-map-drawer .map-drawer-heading {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 1.25rem 1.25rem .95rem !important;
  background: var(--map-panel);
}
.editorial-map-drawer .map-drawer-heading h3 {
  margin: 0;
  font-size: 1.55rem !important;
}
.editorial-map-drawer .map-drawer-heading .map-filter-caption {
  margin-top: .45rem;
  color: var(--map-muted);
  font-size: .74rem;
  line-height: 1.45;
}
.editorial-map-drawer > .map-drawer-content {
  padding: 1.2rem 1.25rem 1.5rem !important;
}
.editorial-map-drawer > .map-drawer-content > div {
  padding-bottom: 1.2rem;
  border-bottom: 1px solid var(--map-line);
}
.editorial-map-drawer .map-drawer-content h4 {
  margin-bottom: .55rem !important;
  font: 500 .65rem "DM Mono", monospace !important;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.editorial-map-drawer .map-mobile-accordion {
  width: 100%;
  min-height: 2.75rem;
  margin: 0 0 .5rem !important;
  padding: .4rem .25rem !important;
  border: 0;
  background: transparent;
  text-align: left;
}
.editorial-map-drawer .map-mobile-accordion-label { margin: 0 !important; }
.editorial-map-drawer #apply-filters-mobile {
  position: sticky;
  bottom: 0;
  min-height: 3rem;
  margin-top: 1rem;
  border-radius: 0 !important;
  background: var(--map-moss) !important;
  font: 500 .68rem "DM Mono", monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
  box-shadow: 0 -10px 18px var(--map-panel);
}
.editorial-map-drawer #apply-filters-mobile:hover { background: var(--map-ink) !important; }
.editorial-map-drawer select { min-height: 2.9rem; }

@media (max-width: 767px) {
  .editorial-map { padding-bottom: 2.5rem; }
  .editorial-map > .max-w-7xl { padding-left: 1rem !important; padding-right: 1rem !important; }
  .editorial-map > .max-w-7xl > .text-center h1 { font-size: clamp(2.7rem, 14vw, 4.4rem) !important; }
  .editorial-map #ai-search-button { position: static; width: 100%; min-height: 2.9rem; margin-top: .6rem; }
  .editorial-map #ai-search-input { padding-right: 1rem !important; }
  .editorial-map #map { min-height: 500px; }
  .editorial-map .map-legend-items { justify-content: flex-start; gap: .5rem .8rem; }
  .editorial-map .map-legend-item { font-size: .72rem; }
  .editorial-map .map-legend-help { line-height: 1.6; }
  .editorial-map-drawer { width: min(22rem, 90vw) !important; }
  .editorial-map-drawer > .map-drawer-content { gap: 1rem !important; }
  .editorial-map-drawer label { min-height: 2.9rem; }
}

@media (prefers-reduced-motion: reduce) {
  .editorial-map-drawer,
  .editorial-map-overlay,
  .editorial-map .filter-header,
  .editorial-map-drawer .map-mobile-accordion { transition-duration: .01ms !important; }
}