section.select-seats {
    display: flex;
    flex-direction: row;
}

div.seat-info div {
    border: 1px dotted;
    padding: 0.5rem;
}

.theater-seat-map svg {
    max-width: 520px;
    max-height: 620px;
}

.theater-seat-map svg rect.stage {
    stroke-width: 1;
    fill: none;
    stroke: #000;
}

.theater-seat-map svg text.stage-text {
    font-size: 14;
    text-anchor: middle;
    fill: #000;
}

.seat {
    fill: #000;
}

.taken-seat {
    fill: #ff173d;
}

.selected-seat {
    fill: #ffff00;
}

.seat:not(.taken-seat) {
    cursor: pointer;
}

.seat:not(.taken-seat):hover {
    fill: #ffff00;
}

section.select-seats {
    display: flex;
    flex-direction: row;
}

div.seat-info div {
    border: 1px dotted;
    padding: 0.5rem;
}

.theater-seat-map svg {
    border: 1px solid black;
}

.theater-seat-map svg rect.stage {
    stroke-width: 1;
    fill: none;
    stroke: #000;
}

.theater-seat-map svg text.stage-text {
    font-size: 14;
    text-anchor: middle;
    fill: #000;
}

.seat {
    fill: #000;
}

.taken-seat {
    fill: #ff173d;
}

.selected-seat {
    fill: #ffff00;
}

.seat:not(.taken-seat) {
    cursor: pointer;
}

.seat:not(.taken-seat):hover {
    fill: #ffff00;
}

Remove magic numbers from select.seats.css
Remove magic numbers from select.seats.css
