.wccb-seat { cursor: pointer; }
.wccb-seat.available { fill: #d32f2f; }
.wccb-seat.booked { fill: #9e9e9e; cursor:not-allowed; }
.wccb-seat.selected { fill: #ffcc33; }
.wccb-seat.available:hover { opacity: .9; }
.wccb-legend { margin-top: 8px; }
.wccb-legend .dot { display:inline-block; width:12px; height:12px; border-radius:2px; margin-inline:6px; vertical-align:middle }
.wccb-legend .available { background:#d32f2f }
.wccb-legend .booked { background:#9e9e9e }
.wccb-svg { width:100%; height:auto; border-radius:12px; box-shadow: 0 6px 22px rgba(0,0,0,.35); background:#111; }
.wccb-seatmap { direction: rtl; color:#222; }


/* Responsive centering */
.wccb-seatmap { display:block; max-width:100%; margin: 0 auto; }
.wccb-seatmap .wccb-svg { display:block; width:100%; height:auto; }
.wccb-seatmap .wccb-legend, .wccb-seatmap .wccb-add-to-cart { margin: 10px auto; display:block; text-align:center; }
.wccb-add-to-cart.button { padding:8px 14px; font-size:14px; }

@media (max-width: 480px){
  .wccb-add-to-cart.button { width: 90%; font-size:15px; }
}

.wccb-seat { stroke: #fff; stroke-width: .5; }
.wccb-seat { cursor: pointer; }
.wccb-seat.available {
  --seat-fill: #c51605;
  --seat-stroke: #c51605;
  --seat-leather: #c51605;
  --seat-leg: #c51605;
  --arm-fill: #c51605;
  --cup-fill: #c51605;
}
.wccb-seat.selected {
  --seat-fill: #fff176;
  --seat-stroke: #fbbf24;
  --seat-leather: #ffecb3;
  --seat-leg: #fff176;
  --arm-fill: #fff176;
  --cup-fill: #fff176;
}
.wccb-seat.selected .part-back,
.wccb-seat.selected .part-seat { fill: var(--seat-fill) !important; }
.wccb-seat.booked {
  --seat-fill: #e5e7eb;
  --seat-stroke: #9ca3af;
  --seat-leather: #eef0f3;
  --seat-leg: #94a3b8;
  --arm-fill: #94a3b8;
  --cup-fill: #6b7280;
  opacity: .75;
  cursor: not-allowed;
}
.wccb-seat.booked .part-back,
.wccb-seat.booked .part-seat {
  fill: var(--seat-fill) !important;
  stroke: var(--seat-stroke) !important;
}
.wccb-seat-label {
  fill: #e5e7eb;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  pointer-events: auto;
  user-select: none;
  paint-order: stroke;
  stroke: rgba(0,0,0,.6);
  stroke-width: 2px;
}