/* ---------- COI ESCALATIONS REVIEW LAYOUT ---------- */
.coi-escalations-layout {
  display: flex;
  flex-direction: column;
  padding: 0 0.5rem;
}

.coi-escalations-tab-content {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: 1.25rem;
  row-gap: 1.25rem;
  align-items: start;
}

.coi-escalations-status-panel {
  grid-column: 1 / 3;
  background-color: #fff;
  border-radius: 8px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
}

.coi-escalation-review {
  grid-column: 3 / 13;
  min-width: 0;
}

.coi-escalations-comment { min-height: 80px; }
.coi-escalations-form-actions { display: flex; gap: 0.5rem; align-items: center; justify-content: space-between; }

.coi-escalations-form-row-horizontal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.coi-escalations-site-status-form .coi-escalations-form-row-horizontal .form-field:has(textarea) { grid-column: 2 / -1; }
.coi-escalations-site-status-form .coi-escalations-form-row-horizontal .form-field:has(textarea) textarea { min-height: 100px; }

.coi-escalations-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }

.coi-escalations-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* COI Escalations Table Container - Enable scrolling with max-height */
#coiEscalationsTableContainer {
  overflow-x: auto !important;
  overflow-y: auto !important;
  max-height: 600px;
  width: 100%;
  max-width: 100%;
}

/* COI Escalations Table - Set minimum width to force scrolling when needed */
#coiEscalationsTable {
  width: max-content;
  min-width: 100%;
}

/* Wider column for "Project Number / Project Number (CoI)" */
#coiEscalationsTable thead th:nth-child(2),
#coiEscalationsTable tbody td:nth-child(2) {
  min-width: 120px;
  max-width: 200px;
  white-space: normal;
  word-wrap: break-word;
}

/* Wider column for "Feas Project Contact / Project Contact (CoI)" */
#coiEscalationsTable thead th:nth-child(3),
#coiEscalationsTable tbody td:nth-child(3) {
  min-width: 200px;
  max-width: 300px;
  white-space: normal;
  word-wrap: break-word;
}

.coi-table-scroll {
  overflow-x: auto !important;
  overflow-y: auto !important;
  max-height: 600px !important; 
  border-radius: 0 !important;
  background: white;
  position: relative;
  display: block;
  font-family: inherit;
  min-height: 400px;
}