/* Equal height rows + ellipsis for overflow */
table.dataTable tbody td {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
  vertical-align: middle;
}

/* Expand details rows - light theme */
html[data-bs-theme="light"] table.dataTable tbody tr.child td {
  white-space: normal;
  word-break: break-word;
  padding: 6px 10px;
  font-size: 13px;
  background: #f9fafc;
  border-radius: 6px;
  color: #333;
}

/* Expand details rows - dark theme */
html[data-bs-theme="dark"] table.dataTable tbody tr.child td {
  white-space: normal;
  word-break: break-word;
  padding: 6px 10px;
  font-size: 13px;
  background: #2b2d31;
  border-radius: 6px;
  color: #eee;
}

/* Tooltip effect (hover pe pura text show) */
table.dataTable tbody td[title]:hover {
  position: relative;
  cursor: help;
}

html[data-bs-theme="light"] table.dataTable tbody td[title]:hover::after {
  content: attr(title);
  position: absolute;
  left: 0;
  top: 100%;
  background: #333;
  color: #fff;
  padding: 4px 6px;
  border-radius: 4px;
  font-size: 12px;
  white-space: normal;
  max-width: 300px;
  z-index: 9999;
}

/* Dark theme tooltip */
html[data-bs-theme="dark"] table.dataTable tbody td[title]:hover::after {
  content: attr(title);
  position: absolute;
  left: 0;
  top: 100%;
  background: #eee;
  color: #111;
  padding: 4px 6px;
  border-radius: 4px;
  font-size: 12px;
  white-space: normal;
  max-width: 300px;
  z-index: 9999;
}