table.data-table {
    text-align: center;
    border-collapse: collapse;
    width: 100%;
}

table.data-table th,
table.data-table td {
    border: 1px solid #dee2e6;
    padding: 0.4rem 0.6rem;
}

.text-danger-row {
    color: #dc3545;
}

/* The grid is a picture of the building, not a table that should fill the page. Inheriting
   data-table's width:100% dumped all the slack into the "Этаж" column, leaving it wider than the
   building itself. */
table.scheme-view-table {
    width: auto;
    max-width: 100%;
}

.scheme-view-table th,
.scheme-view-table td {
    text-align: center;
    vertical-align: middle;
}

.scheme-cell {
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    font-weight: 600;
    border-radius: 4px;
}

.scheme-cell.status-green {
    background-color: #4caf50;
    color: #fff;
}

.scheme-cell.status-orange {
    background-color: #ff9800;
    color: #fff;
}

.scheme-cell.status-red {
    background-color: #f44336;
    color: #fff;
}

.scheme-cell.status-empty {
    background-color: #f1f1f1;
    color: #adb5bd;
}

/* Visual gap between entrances: without it a wide building reads as one undifferentiated wall of
   flats, and the operator has to count columns to work out which entrance to walk into. White
   rather than a dark rule, so it reads as a gap between blocks instead of another grid line. */
.scheme-view-table .entrance-end {
    border-right: 4px solid #fff;
}

.scheme-legend .scheme-cell {
    width: 1.25rem;
    height: 1.25rem;
    min-width: 1.25rem;
    vertical-align: middle;
    margin-right: 0.25rem;
}

.scheme-edit-table input.scheme-cell-input {
    width: 4.5rem;
}