body {
    background: #f5f6f8;
}

.app {
    display: flex;
    min-height: 100vh;
}

.sidebar {
    width: 230px;
    position: sticky;
    top: 0;
    height: 100vh;
}

.content {
    flex: 1;
    min-width: 0;
    padding: 1.5rem 2rem;
}

@media (max-width: 768px) {
    .app { flex-direction: column; }
    .sidebar { width: 100%; height: auto; position: static; }
    .content { padding: 1rem; }
}

.page-title {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

.stat .value {
    font-size: 1.5rem;
    font-weight: 600;
}

/* Infra grid: one tile per unit */
.unit-tile {
    width: 130px;
    min-height: 92px;
    border-radius: .5rem;
    padding: .5rem .6rem;
    font-size: .85rem;
    border: 1px solid #dee2e6;
    background: #fff;
}
.unit-tile.free { border-left: 5px solid #198754; }
.unit-tile.occupied { border-left: 5px solid #dc3545; background: #fff5f5; }
.unit-tile.oos { border-left: 5px solid #6c757d; background: #f1f3f5; color: #6c757d; }
.unit-tile .name { font-weight: 600; font-size: 1rem; }

/* Booking calendar */
.cal-table td, .cal-table th { white-space: nowrap; font-size: .8rem; padding: .35rem .4rem; }
.cal-table td.busy { background: #cfe2ff; }
.cal-table td.busy.CHECKED_IN { background: #d1e7dd; }
.cal-table td.busy.CHECKED_OUT { background: #e2e3e5; }
.cal-table th.today, .cal-table td.today { outline: 2px solid #ffc107; outline-offset: -2px; }
.cal-table td a { text-decoration: none; color: inherit; }

/* Printable invoice */
.invoice { max-width: 820px; margin: 2rem auto; background: #fff; padding: 2.5rem; }
@media print {
    body { background: #fff; }
    .no-print { display: none !important; }
    .invoice { margin: 0; padding: 0; max-width: none; }
}