/* =====================================================================
   Pagina Regolarizza rooming list — classi .rooming__*
   Container query sul root pagina (regole UI §8): niente scroll-x fino a laptop.
   ===================================================================== */
.rooming {
  container-type: inline-size;
  container-name: rooming;
}

.rooming__grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 20px;
  margin-bottom: 20px;
}

/* ---------- dropzone ---------- */
.rooming__drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 32px 16px;
  border: 1px dashed var(--color-border);
  border-radius: var(--radius);
  background: var(--color-surface-muted);
  text-align: center;
  cursor: pointer;
}
.rooming__drop:hover,
.rooming__drop--over,
.rooming__drop:focus-visible {
  outline: none;
  border-color: var(--color-primary);
  background: var(--color-primary-soft);
}
.rooming__drop-icon { font-size: 28px; color: var(--color-primary); }
.rooming__drop-title { font-weight: 600; color: var(--color-primary); }

.rooming__file {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}
.rooming__file-icon { font-size: 16px; color: var(--color-primary); }
.rooming__file-name { flex: 1 1 auto; font-weight: 500; }

.rooming__key-warn { margin-top: 14px; }
.rooming__run { margin-top: 20px; }
.rooming__error { margin-bottom: 20px; }

/* ---------- risultato ---------- */
.rooming__toolbar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  min-width: 0;
}
.rooming__toolbar-title { margin: 0; white-space: nowrap; }
.rooming__meta { flex: 1 1 120px; min-width: 60px; text-align: right; }
.rooming__notes { margin-bottom: 14px; }

.rooming__col-num { width: 48px; }
.rooming__col-act { width: 48px; }
.rooming__table td:has(.rooming__cell) { padding: 0; }
.rooming__table .sib-table__num { padding: 0 8px; }

/* cella modificabile: una riga, ellipsis + tooltip; righe sempre bianche */
.rooming__cell {
  display: block;
  height: 37px;
  line-height: 37px;
  padding: 0 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  outline: none;
  cursor: text;
}
.rooming__cell:focus {
  text-overflow: clip;
  box-shadow: inset 0 0 0 1px var(--color-primary);
}
.rooming__cell--empty:empty:not(:focus)::before {
  content: "mancante";
  color: var(--color-warning);
  font-style: italic;
}
.rooming__cell--bad { color: var(--color-error); font-weight: 500; }

.rooming__legend { margin: 10px 0 0; font-size: var(--fs-label); }
.rooming__legend-empty { color: var(--color-warning); font-style: italic; }
.rooming__legend-bad { color: var(--color-error); font-weight: 500; }

/* ---------- compattazione solo sotto soglia ---------- */
@container rooming (max-width: 1360px) {
  .rooming .sib-table { font-size: 12px; }
  .rooming .sib-table thead th { font-size: 11px; }
  .rooming .sib-table th,
  .rooming .rooming__cell { padding-inline: 4px; }
  .rooming .rooming__col-act { width: 32px; }
  .rooming .sib-table .sib-icon-btn { width: 24px; height: 24px; }
  .rooming .sib-table .sib-icon-btn i { font-size: 12px; }
}
@container rooming (max-width: 760px) {
  .rooming__grid { grid-template-columns: minmax(0, 1fr); }
  .rooming__toolbar { flex-wrap: wrap; }
}

/* ---------- contesto prenotazione (modalità Sibylla) ---------- */
.rooming__booking { margin-bottom: 20px; }
.rooming__booking-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.rooming__booking-title { margin: 0; white-space: nowrap; }
.rooming__booking-detail { font-size: var(--fs-label); white-space: nowrap; }
.rooming__rooms-table .rooming__num-col { width: 130px; text-align: right; }
.rooming__sent {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}
.rooming__col-room { width: 110px; }
.rooming__room--empty { color: var(--color-warning); }

@container rooming (max-width: 1360px) {
  .rooming .rooming__col-room { width: 84px; }
  .rooming .rooming__rooms-table .rooming__num-col { width: 104px; }
}