/* FRC Nexus pit maps (templates/portal/_shared.html pit_map_svg). The alliance colours are
   the whiteboard's and the same in both themes; everything else follows light/dark. */
:root, [data-bs-theme="dark"] {
  --pm-bg: #0d0b0b; --pm-wall: #3a3030; --pm-area: rgba(255, 255, 255, .04); --pm-area-edge: #4a3a3a;
  --pm-label: #9a8a8a; --pm-pit: #161212; --pm-pit-edge: #3a2a2a; --pm-team: #d8cccc; --pm-addr: #7a6a6a;
}
[data-bs-theme="light"] {
  --pm-bg: #fbf8f7; --pm-wall: #bfb0ad; --pm-area: rgba(0, 0, 0, .03); --pm-area-edge: #c9b8b5;
  --pm-label: #6e5656; --pm-pit: #ffffff; --pm-pit-edge: #d9c9c6; --pm-team: #1f1414; --pm-addr: #8a7474;
}
.pit-map { display: block; width: 100%; height: auto; touch-action: pan-x pan-y; }
.pit-map text { text-anchor: middle; dominant-baseline: central; font-family: inherit; pointer-events: none; }
.pm-wall { fill: var(--pm-wall); }
.pm-area { fill: var(--pm-area); stroke: var(--pm-area-edge); stroke-width: 2; stroke-dasharray: 8 6; }
.pm-area-text, .pm-label { fill: var(--pm-label); font-weight: 600; }
.pm-arrow { fill: #2563eb; opacity: .7; }
.pm-arrow-red { fill: #dc2626; } .pm-arrow-purple { fill: #9333ea; } .pm-arrow-gray { fill: #6b7280; }
.pm-pit rect { fill: var(--pm-pit); stroke: var(--pm-pit-edge); stroke-width: 2; }
.pm-pit .pm-team { fill: var(--pm-team); font-weight: 700; }
.pm-pit .pm-addr { fill: var(--pm-addr); }
.pm-pit.pm-empty rect { fill: transparent; stroke-dasharray: 4 4; }
/* Strongest to weakest: us solid in our alliance colour (thin white edge), partners a soft
   tint of it, opponents a dashed outline. */
.pm-pit.pm-us-red rect { fill: #dc2626; stroke: #fff; stroke-width: 3; }
.pm-pit.pm-us-blue rect { fill: #2563eb; stroke: #fff; stroke-width: 3; }
.pm-pit[class*="pm-us-"] text { fill: #fff; }
.pm-pit[class*="pm-us-"] .pm-team { font-weight: 800; }
/* Our pits with no match chosen, or our other team when it isn't in it. */
.pm-pit.pm-ours rect { fill: rgba(204, 34, 0, .3); stroke: #cc2200; stroke-width: 2; }
.pm-pit.pm-partner-blue rect { fill: rgba(37, 99, 235, .28); stroke: #2563eb; stroke-width: 2; }
.pm-pit.pm-partner-red rect { fill: rgba(220, 38, 38, .28); stroke: #dc2626; stroke-width: 2; }
.pm-pit.pm-opponent-blue rect { stroke: #2563eb; stroke-width: 2.5; stroke-dasharray: 7 5; }
.pm-pit.pm-opponent-red rect { stroke: #dc2626; stroke-width: 2.5; stroke-dasharray: 7 5; }
.pm-pit.pm-found rect { stroke: #facc15; stroke-width: 8; stroke-dasharray: none; }
.pm-pit.pm-dim { opacity: .25; }

.pm-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; color: var(--mw-muted); }
.pm-legend span { display: inline-flex; align-items: center; gap: .4rem; }
.pm-swatch { display: inline-block; width: 1.1rem; height: 1.1rem; border-radius: 3px; border: 2px solid var(--pm-pit-edge); }
.pm-swatch.pm-ours { background: rgba(204, 34, 0, .3); border-color: #cc2200; }
.pm-swatch.pm-us-red { background: #dc2626; border-color: #fff; }
.pm-swatch.pm-us-blue { background: #2563eb; border-color: #fff; }
.pm-swatch.pm-partner-blue { background: rgba(37, 99, 235, .28); border-color: #2563eb; }
.pm-swatch.pm-partner-red { background: rgba(220, 38, 38, .28); border-color: #dc2626; }
.pm-swatch.pm-opponent-blue { border: 2px dashed #2563eb; } .pm-swatch.pm-opponent-red { border: 2px dashed #dc2626; }

/* Zoom: the map sits in a scroll box and the buttons widen it. */
.pm-scroll { overflow: auto; -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y; border: 1px solid var(--mw-border); border-radius: .5rem; background: var(--pm-bg); }
.pm-scroll .pit-map { margin: 0 auto; }
/* .pm-fit: the whole map fits the box to start (the Pit Map page); without it the map
   fills the width and scrolls down (the whiteboard's narrow panel). */
.pm-fit .pit-map { height: 100%; }

/* The Pit Map page: never scrolls; the find box zooms the map itself (pitmap.js frame()). */
.pm-frame { overflow: hidden; }