/* FREE SAILING — org-map.css. The operator's "Your place on the map" workspace.

   Everything here is prefixed `omap-` and nothing else in the estate uses that
   prefix, so this file cannot reach any surface that has not asked for it.
   Layout, type scale and colour all come from the tokens dash.css and
   org-ui.css already set (--ink, --ink-40, --ink-60, --line, --hl, --cyan) —
   no new palette, because a second set of greys on one board is how a
   dashboard stops looking like one product.

   THE ONE OPINION IN THIS FILE is the note colours. A wrong pin and a healthy
   pin have to be distinguishable before either is read, because the operator
   is scanning for trouble, not reading a report. They are distinguished by a
   left edge and a wash, never by colour alone — the words "This pin is wrong"
   and "This pin holds" carry the meaning on their own, so the file passes with
   the colours ignored. */

/* ------------------------------------------------------------------ the pin.
   The map is deliberately short and wide. It is a locator answering "is that
   where you are", not an explorer — a taller box invites panning that
   org-map.js has switched off on purpose. */
.omap-wrap {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  margin: 0 0 18px;
  background: #0A2440;              /* the sea, so the box never flashes white */
}
.omap-canvas { height: 260px; width: 100%; }
@media (max-width: 640px) { .omap-canvas { height: 200px; } }

/* Read over the sea, so it carries its own contrast rather than borrowing the
   page's. The coordinate is here and not in the prose because it is the one
   number an operator can check against something they already know. */
.omap-where {
  position: absolute; left: 12px; bottom: 12px; z-index: 420;
  background: rgba(6, 22, 40, .82);
  backdrop-filter: blur(6px);
  border-radius: 9px; padding: 8px 11px;
  color: #fff; max-width: calc(100% - 24px);
}
.omap-where b { display: block; font-size: 14px; line-height: 1.25; }
.omap-where span { display: block; font-size: 12px; color: rgba(255, 255, 255, .78); }
.omap-co { font-variant-numeric: tabular-nums; letter-spacing: .01em; }

/* --------------------------------------------------------------- the notes.
   One shape for every finding, so a healthy pin and a broken one are read the
   same way and only their words and edge differ. */
.omap-note {
  border: 1px solid var(--line);
  border-left-width: 3px;
  border-radius: 10px;
  padding: 14px 16px;
  margin: 0 0 14px;
}
.omap-note b { display: block; font-size: 15px; margin-bottom: 5px; }
.omap-note p { font-size: 13.5px; color: var(--ink-60); margin: 0 0 10px; max-width: 60ch; }
.omap-note p:last-child { margin-bottom: 0; }

.omap-wrong  { border-left-color: #9A4318; background: #FDF6F2; }
.omap-check  { border-left-color: #9A7A18; background: #FDFAF1; }
.omap-ok     { border-left-color: #1C6B33; background: #F4FAF6; }
.omap-spread { border-left-color: var(--hl, #1F5FD0); background: #F5F8FD; }

/* The error text under a failed read. Small and monospaced because it is for
   whoever has to fix it, not for the operator — but it is shown rather than
   swallowed, so a fault can be reported accurately by the person who saw it. */
.omap-detail {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px; color: var(--ink-40); word-break: break-word;
}

/* ------------------------------------------------------------- what is near.
   A count per kind, set as a list rather than a chart. Nine numbers do not
   need an axis, and a bar chart here would invite comparing this club's
   surroundings against another's, which is not a question this board answers. */
.omap-near { border-top: 1px solid var(--line); padding-top: 16px; }
.omap-near > b { display: block; font-size: 15px; margin-bottom: 8px; }
.omap-near p { font-size: 13.5px; color: var(--ink-60); margin: 0 0 10px; max-width: 60ch; }

.omap-total {
  font-size: 22px !important;
  font-weight: 700;
  color: var(--ink) !important;
  font-variant-numeric: tabular-nums;
  margin-bottom: 10px !important;
}

.omap-kinds { list-style: none; margin: 0 0 14px; padding: 0; max-width: 420px; }
.omap-kinds li {
  display: flex; align-items: baseline; gap: 10px;
  padding: 6px 0; border-bottom: 1px solid var(--line);
  font-size: 13.5px;
}
.omap-kinds li:last-child { border-bottom: 0; }
.omap-kinds li span { flex: 1 1 auto; color: var(--ink-60); }
.omap-kinds li b { font-variant-numeric: tabular-nums; font-size: 14px; }

/* The line that sends demand questions to the surface that answers them
   properly. Quieter than the counts above it on purpose: it is a signpost, not
   a finding. */
.omap-aside { font-size: 12.5px !important; color: var(--ink-40) !important; }

/* ------------------------------------------------------------- the drawer.
   Reuses org-ui.css's `.ev-f` field styling; this only sets the width, because
   a town is a short answer and a full-width input invites a long one. */
.omap-form input[type=text] { max-width: 340px; }