/* Property cockpit — overview / health view.
   Visual interest comes from semantic colour (status, occupancy), not decoration. */

.cockpit-card {
  overflow: hidden;
  border-radius: 10px;
}

/* Header band, tinted by the real estate's worst status. */
.cockpit-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.7rem 1.1rem;
  border-left: 6px solid var(--mud-palette-primary);
  background: linear-gradient(120deg, rgba(103, 160, 210, .14), rgba(179, 207, 232, .22));
}

.cockpit-header.status-ok {
  border-left-color: var(--mud-palette-success);
}

.cockpit-header.status-warning {
  border-left-color: var(--mud-palette-warning);
}

.cockpit-header.status-error {
  border-left-color: var(--mud-palette-error);
}

.cockpit-header-icon {
  font-size: 2rem;
  color: var(--mud-palette-text-secondary);
}

.cockpit-muted {
  color: var(--mud-palette-text-secondary);
}

/* KPI tile row. */
.cockpit-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  padding: 0.85rem 1rem;
}

.kpi-tile {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 130px;
  flex: 1 1 130px;
  padding: 0.55rem 0.8rem;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--mud-palette-divider);
}

.kpi-icon {
  font-size: 1.7rem;
}

.kpi-value {
  line-height: 1.1;
  font-weight: 600;
  color: var(--mud-palette-primary);
}

.cockpit-occupancy {
  padding: 0 1.1rem 0.4rem 1.1rem;
}

.cockpit-issues {
  padding: 0 0.5rem 0.4rem 0.5rem;
}

.cockpit-tree {
  padding: 0.15rem 0.6rem 0.6rem 0.6rem;
}

/* One row inside the hierarchy tree (building / entry / room). */
.cockpit-node {
  display: flex;
  align-items: center;
  flex-grow: 1;
  min-width: 0;
}

.cockpit-dot {
  font-size: 0.7rem !important;
  margin-right: 0.5rem;
}

.cockpit-node-name {
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cockpit-summary {
  color: var(--mud-palette-text-secondary);
  white-space: nowrap;
  margin-right: 0.5rem;
}

.cockpit-cap {
  margin-left: 0.35rem;
}