/* The public course, start area and finish area maps (D-race-203). Classes only: the CSP forbids inline styles. */
.cam-page { max-width: 64rem; margin: 0 auto; padding: 0.75rem 1rem 1.5rem; }
.cam-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.5rem; }
.cam-title { font-size: 1.35rem; margin: 0 0 0.5rem; }
.cam-links { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.5rem; }
.cam-link { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 0.75rem; border: 1px solid var(--rowops-border, #dee2e6); border-radius: 0.4rem; text-decoration: none; }
.cam-link.is-current { font-weight: 700; background: var(--rowops-surface-2, #f1f3f5); }
.cam-map { width: 100%; height: 70vh; min-height: 20rem; border: 1px solid var(--rowops-border, #dee2e6); border-radius: 0.4rem; }
.cam-empty { color: var(--rowops-muted, #6c757d); }
.cam-legend { margin-top: 0.75rem; }
.cam-legend-title { font-size: 1rem; margin: 0 0 0.25rem; }
.cam-legend-list, .cam-places { list-style: none; padding: 0; margin: 0 0 0.5rem; display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; }
.cam-place-kind { color: var(--rowops-muted, #6c757d); }
/* T-race-TODO-293: the places, grouped, each name a button that shows its place on the map. It reads as a link. */
.cam-places-group { font-size: 0.85rem; font-weight: 600; margin: 0.5rem 0 0.2rem; color: var(--rowops-muted, #6c757d); }
.cam-place-btn { background: none; border: 0; padding: 0; font: inherit; color: var(--rowops-link, #0d6efd); text-decoration: underline; cursor: pointer; text-align: left; }
.cam-place-btn:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.leaflet-tooltip.place-label { font-size: 0.75rem; padding: 1px 5px; }
.cam-key { display: inline-block; width: 0.9rem; height: 0.9rem; vertical-align: -0.1rem; }
/* D-race-233: a route's key is a short line with an arrowhead, twice as wide as a dot. */
.cam-key-route { width: 1.8rem; }
span.cam-key { border: 2px solid currentColor; }
.cam-accuracy { margin: 0.5rem 0 0; font-size: 0.9rem; }
.cam-key-course { color: #dc3545; border-radius: 0; height: 0.25rem; vertical-align: 0.2rem; }
.cam-key-start { color: #198754; border-radius: 0; height: 0.25rem; vertical-align: 0.2rem; }
.cam-key-finish { color: #0d6efd; border-radius: 0; height: 0.25rem; vertical-align: 0.2rem; }

@media (max-width: 575.98px) {
  .cam-map { height: 60vh; }
  .cam-link { flex: 1 1 auto; justify-content: center; }
}

/* D-race-207: the QR block under the legend. Small on screen; the print rule below keeps it on the page. */
.cam-qr { margin-top: 0.75rem; }
.cam-foot { display: block; }
.cam-qr-title { font-size: 1rem; margin: 0 0 0.25rem; }

/* One A4 page: the map, the legend and the regatta's name. Never a US paper size. */
@page { size: A4; margin: 10mm; }
@media print {
  .cam-page { max-width: none; padding: 0; }
  .cam-links { display: none; }
  .cam-map { height: 165mm; min-height: 0; break-inside: avoid; }
  /* A long list of places stays on the page: small type, in columns. */
  .cam-places { display: block; columns: 3; column-gap: 6mm; font-size: 7.5pt; }
  .cam-places-group { font-size: 8pt; margin: 1mm 0 0.5mm; }
  .cam-place-btn { color: inherit; text-decoration: none; }
  .cam-legend-list { font-size: 8pt; }
  .cam-accuracy { font-size: 8pt; }
  .cam-title { font-size: 14pt; }
  .cam-legend { break-inside: avoid; }
  /* One A4 page: the legend takes the width and the code sits beside it, so a long list of places does not push the code to a second page. */
  .cam-foot { display: flex; align-items: flex-start; gap: 6mm; }
  .cam-foot .cam-legend { flex: 1 1 auto; min-width: 0; }
  .cam-qr { flex: 0 0 auto; width: 62mm; break-inside: avoid; margin-top: 3mm; }
  .leaflet-control-zoom { display: none; }
}
