/**
 * The lawn map: badges, footprints, the key and the booth picker.
 *
 * A FILE, not inline styles on the vendor list.
 *
 * These rules used to ride along inside the [pride_vendor_list] shortcode's
 * <style> block, so they existed only where that shortcode ran. The admin
 * planner had none of them -- its accessibility badges rendered as bare
 * unstyled text -- and a page showing [ppa_lawn_map] without a vendor list
 * would have had the same problem.
 */

/* ---- Lawn map ---- */
.ppa-lawn-map-wrap{margin:0 0 22px}
.ppa-lawn-map{border-radius:14px;overflow:hidden;border:1px solid #e5e7eb;background:#1e2a24}
/* The tile grid rasterises as one layer; without this the fractional
   scaling leaves pale hairlines between tiles. */
.ppa-lawn-map .leaflet-tile-container{will-change:transform;transform:translateZ(0)}
.ppa-lawn-map .leaflet-container{background:#1e2a24}
.ppa-lawn-area-label{background:rgba(255,255,255,.9);border:0;box-shadow:none;color:#111827;
  font-weight:700;font-size:11px;padding:2px 8px;border-radius:999px}
.ppa-lawn-area-label::before{display:none}
.ppa-lawn-map-key{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:10px 2px 0;
  font-size:13px;color:#4b5563}
.ppa-lawn-key-item{display:inline-flex;align-items:center;gap:7px}
.ppa-lawn-swatch{width:13px;height:13px;border-radius:50%;display:inline-block}
.ppa-lawn-swatch--free{background:#fff;border:2px solid #9ca3af}
.ppa-lawn-swatch--taken{background:#fb923c;border:2px solid #7c2d12}
.ppa-lawn-key-hint{opacity:.75}
/* A card that can point at the map says so on hover. */

/* ---- Map badges ----
   Accessibility markers are a white square with a glyph, not another
   coloured dot — the same badge the parade route map uses. Someone
   looking for a restroom should not have to decode a palette, and the
   two maps saying it the same way is most of what makes either readable. */
.ppa-lawn-badge-wrap{background:none;border:0}
/* 30px, not 24: a marker on a satellite photograph competes with grass, tents
   and shadow, and the smaller badge disappeared into it. The ring gives it an
   edge whatever it lands on. */
.ppa-lawn-badge{display:flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:8px;border:3px solid;background:#fff;box-sizing:border-box;
  box-shadow:0 0 0 2px rgba(255,255,255,.65), 0 2px 8px rgba(8,2,12,.55);
  font:800 13px/1 system-ui,-apple-system,sans-serif;letter-spacing:-.02em}
/* A footprint is a real thing on the ground, so it gets a solid edge rather
   than the faint wash an area uses. */
.ppa-lawn-foot{}
.ppa-lawn-badge-wrap.is-footprint .ppa-lawn-badge{width:26px;height:26px;font-size:12px}
/* No character dependably means "ramp", so it is drawn. */
.ppa-lawn-ramp{display:block;width:0;height:0;border-style:solid;border-width:0 0 7px 11px;
  border-color:transparent transparent currentColor transparent}

/* ---- Booth picker ---- */
.ppa-lawn-pick-wrap{margin:0 0 22px}
.ppa-lawn-pick{border-radius:14px;overflow:hidden;border:1px solid #e5e7eb;background:#1e2a24}
.ppa-lawn-pick .leaflet-tile-container{will-change:transform;transform:translateZ(0)}
.ppa-lawn-pick .leaflet-container{background:#1e2a24}
.ppa-lawn-pick-status{min-height:1.4em;margin:0 2px 8px;font-size:14px;font-weight:600;color:#b45309}
.ppa-lawn-pick-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:12px 2px 0}
.ppa-lawn-confirm{padding:11px 20px;border:0;border-radius:999px;background:#6d28d9;color:#fff;
  font-size:14px;font-weight:700;cursor:pointer}
.ppa-lawn-confirm:hover{background:#5b21b6}
.ppa-lawn-hold-left{font-size:13px;color:#6b7280}
.ppa-lawn-swatch--mine{background:#a78bfa;border:2px solid #5b21b6}
