/* The floor plan: the dining room seen from directly above, in fine ink. One
   component for the run site's drawings, the app's floor and its empty room.
   .floor-map is the room (double-line walls with window breaks and two door
   swings, from /brand/wall.svg as a border image drawn 1:1 over a 6px wall;
   --wall scales it down for small rooms); .floor-table a table with
   its chairs, placed by left/top percentages. Tokens: /rer-theme.css. */
.floor-map{--wall:60px;position:relative;box-sizing:border-box;border:6px solid transparent;border-image:url('/brand/wall.svg') 60 / var(--wall) round;background:var(--pm-surface);background-clip:padding-box}
.floor-table{--t:64px;position:absolute;left:var(--x,50%);top:var(--y,50%);isolation:isolate;width:var(--t);height:var(--t);transform:translate(-50%,-50%);color:var(--pm-ink);font:500 13px/1.25 var(--pm-ui);text-align:center}
.floor-table::before,.floor-table::after{content:'';position:absolute;z-index:-1;box-sizing:border-box;border:1.25px solid var(--pm-plan);border-radius:calc(var(--t) * .09);background:var(--pm-surface)}
.floor-table::after{left:calc(var(--t) * -.15);right:calc(var(--t) * -.15);top:27%;bottom:27%}
.floor-table::before{top:calc(var(--t) * -.15);bottom:calc(var(--t) * -.15);left:27%;right:27%}
.floor-table[data-seats="2"]::before{display:none}
.floor-table>.top{position:relative;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:100%;height:100%;padding:4px;overflow:hidden;border:1.5px solid var(--pm-plan);border-radius:12px;background:var(--pm-surface)}
.floor-table[data-shape=round]>.top{border-radius:50%}
.floor-table[data-occupancy=booked]>.top{background:var(--pm-sea-soft)}
.floor-table[data-occupancy=seated]>.top{background:var(--pm-sea-deep)}
.floor-table strong{font-weight:600;font-size:1.08em}
.floor-table small{display:block;max-width:100%;font-size:.86em;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.legend{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 26px;margin:16px 0 0;padding:0;list-style:none;color:var(--pm-ink);font:400 14px/1.4 var(--pm-ui)}
.legend span,.legend li{display:inline-flex;align-items:center;gap:8px}
.legend span::before,.legend li::before{content:'';width:16px;height:16px;box-sizing:border-box;border:1.25px solid var(--pm-plan);border-radius:50%;background:var(--pm-surface)}
.legend .booked::before{background:var(--pm-sea-soft)}
.legend .seated::before{background:var(--pm-sea-deep)}
