/* Repoints map.css onto the shared theme and adapts it to the site shell.
   Load after map.css. Tokens are set on body, not :root, because the theme
   tokens they reference live on body.bico-nocturne. */

body.bico-nocturne {
  --map-parchment:      var(--text-primary);
  --map-parchment-dark: var(--text-secondary);
  --map-parchment-glow: #f4ecda;

  --map-card-bg:        #f7efdc;
  --map-card-inner-bg:  #ece0c8;

  --map-ink:            #1c150f;
  --map-ink-soft:       #4d4032;
  --map-ink-mid:        #3a2f22;

  --map-gold:           var(--gold);
  --map-gold-bright:    #f0c877;
  --map-gold-deep:      var(--gold-soft);
  --map-border:         var(--gold-soft);

  --map-teal:           var(--src-guild);
  --map-red:            var(--src-army);

  --map-font-display:   var(--font-display);
  --map-font-body:      var(--font-prose);

  --header-h: 56px;
}

/* The shared shell owns the page frame now. */
body.bico-nocturne .bico-main.is-wide {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.map-shell { flex: 1; min-height: 0; }

/* ---- slim bar where the old hero used to be ---- */
.geo-bar {
  display: flex;
  align-items: center;
  gap: var(--gap-md);
  flex-wrap: wrap;
  padding: 9px 22px;
  background: var(--surface-1);
  border-bottom: 1px solid var(--border);
}
.geo-bar__titles { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; flex: 1; min-width: 0; }
.geo-bar__title {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 500;
  color: var(--text-primary);
  white-space: nowrap;
}
.geo-bar__note {
  font-family: var(--font-ui);
  font-size: 12.5px;
  color: var(--text-muted);
}

.geo-bar__cmd {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-primary);
  background: var(--surface-2);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-pill);
  padding: 5px 15px;
  cursor: pointer;
  white-space: nowrap;
}
.geo-bar__cmd:hover { border-color: var(--gold-soft); color: var(--gold); }
.geo-bar__cmd-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent);
  flex: 0 0 auto;
}

/* ---- Leaflet chrome ---- */
.leaflet-container {
  font-family: var(--font-ui);
  background: var(--surface-0);
}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  background: var(--map-card-bg);
  color: var(--map-ink);
  border: 1px solid var(--map-gold-deep);
  border-radius: 12px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
}
.leaflet-popup-tip { border-radius: 0; }
.leaflet-popup-content { margin: 12px 15px; font-size: 14px; line-height: 1.55; }
.leaflet-popup-content h1, .leaflet-popup-content h2, .leaflet-popup-content h3 {
  font-family: var(--font-display);
  font-weight: 500;
  color: var(--map-ink);
}
.leaflet-popup-close-button { color: var(--map-ink-soft) !important; }
.leaflet-popup-close-button:hover { color: var(--map-ink) !important; }

.leaflet-control-attribution {
  background: rgba(20, 17, 13, 0.78) !important;
  color: #a1937a !important;
  font-family: var(--font-ui);
  font-size: 11px;
  border-radius: var(--radius-sm) 0 0 0;
}
.leaflet-control-attribution a { color: var(--gold-soft) !important; }

.leaflet-bar a,
.leaflet-bar a:hover {
  background: var(--surface-2);
  color: var(--text-primary);
  border-bottom-color: var(--border);
}
.leaflet-bar a:hover { color: var(--gold); }

.leaflet-tooltip {
  background: var(--surface-2);
  color: var(--text-primary);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  font-family: var(--font-ui);
  font-size: 12.5px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4);
}
.leaflet-tooltip-top:before { border-top-color: var(--border-strong); }
.leaflet-tooltip-bottom:before { border-bottom-color: var(--border-strong); }
.leaflet-tooltip-left:before { border-left-color: var(--border-strong); }
.leaflet-tooltip-right:before { border-right-color: var(--border-strong); }

/* Guild chips in popups resolve to the Codex, which now shares this palette. */
.leaflet-popup-content .guild-chip,
.leaflet-popup-content .guild-name {
  color: var(--map-gold-deep);
  border-bottom: 1px dotted var(--map-gold-deep);
}

@media (max-width: 760px) {
  .geo-bar { padding: 8px var(--pad-md); }
  .geo-bar__note { display: none; }
}