/* ============================================================
   EVA API Log Table – Wider Request & Response Columns
   ============================================================ */

.eva-log-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-family: monospace;
  font-size: 13px;
}

/* Table header styling */
.eva-log-table th {
  background-color: #f4f4f4;
  padding: 8px;
  border: 1px solid #ddd;
  text-align: left;
  font-weight: 600;
}

/* Table cell styling */
.eva-log-table td {
  vertical-align: top;
  padding: 8px;
  border: 1px solid #ddd;
  word-break: break-word;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Narrower columns for small data */
.eva-log-table td.aid,
.eva-log-table th.aid {
  width: 8%;
  max-width: 8%;
}

.eva-log-table td.api_url,
.eva-log-table th.api_url {
  width: 10%;
  max-width: 10%;
}

.eva-log-table td.request_type,
.eva-log-table th.request_type {
  width: 5%;
}

.eva-log-table td.status_code,
.eva-log-table th.status_code {
  width: 5%;
}

.eva-log-table td.api_source,
.eva-log-table th.api_source {
  width: 7%;
}

/* Make Request & Response columns wider */
.eva-log-table td.request-col,
.eva-log-table th.request-col,
.eva-log-table td.response-col,
.eva-log-table th.response-col {
  width: 30%;
  max-width: 30%;
  word-break: break-word;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* Preformatted JSON box styling */
.eva-log-table td.request-col pre,
.eva-log-table td.response-col pre {
  background-color: #fafafa;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  padding: 10px;
  overflow-x: auto;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: pre-wrap;
  max-height: 500px;
  font-size: 12px;
  font-family: monospace;
}

/* Hover effect */
.eva-log-table tr:hover {
  background-color: #f9f9f9;
}

/* Prevent overflow ellipsis for small columns only */
.eva-log-table td:not(.request-col):not(.response-col),
.eva-log-table th:not(.request-col):not(.response-col) {
  overflow: hidden;
  text-overflow: ellipsis;
}