/* Enhanced Table Styles - shared across all pages */
.enhanced-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}
.enhanced-table thead {
  position: sticky;
  top: 0;
  z-index: 2;
}
.enhanced-table th {
  padding: 10px 14px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--table-head-text, var(--text-muted));
  background: var(--table-head-bg, linear-gradient(180deg, rgba(255,255,255,0.98), rgba(240,248,251,0.92)));
  border-bottom: 2px solid var(--table-head-border, rgba(15,139,220,0.12));
  white-space: nowrap;
}
.enhanced-table th.num {
  text-align: right;
}
.enhanced-table td {
  padding: 10px 14px;
  border-bottom: 1px solid rgba(16,32,51,0.06);
  vertical-align: middle;
  transition: background 0.15s ease;
}
.enhanced-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.enhanced-table tr {
  transition: background 0.15s ease, transform 0.15s ease;
}
.enhanced-table tbody tr:hover {
  background: rgba(15,139,220,0.04);
}
.enhanced-table tbody tr:hover td:first-child {
  box-shadow: inset 3px 0 0 var(--accent);
}
.enhanced-table tbody tr:nth-child(even) {
  background: rgba(16,32,51,0.015);
}
.enhanced-table tbody tr:nth-child(even):hover {
  background: rgba(15,139,220,0.04);
}

/* Animated row entry */
@keyframes rowFadeIn {
  from { opacity: 0; transform: translateX(-8px); }
  to { opacity: 1; transform: translateX(0); }
}
.enhanced-table.animate-rows tbody tr {
  animation: rowFadeIn 0.3s ease-out forwards;
  opacity: 0;
}
.enhanced-table.animate-rows tbody tr:nth-child(1) { animation-delay: 0.02s; }
.enhanced-table.animate-rows tbody tr:nth-child(2) { animation-delay: 0.04s; }
.enhanced-table.animate-rows tbody tr:nth-child(3) { animation-delay: 0.06s; }
.enhanced-table.animate-rows tbody tr:nth-child(4) { animation-delay: 0.08s; }
.enhanced-table.animate-rows tbody tr:nth-child(5) { animation-delay: 0.10s; }
.enhanced-table.animate-rows tbody tr:nth-child(6) { animation-delay: 0.12s; }
.enhanced-table.animate-rows tbody tr:nth-child(7) { animation-delay: 0.14s; }
.enhanced-table.animate-rows tbody tr:nth-child(8) { animation-delay: 0.16s; }
.enhanced-table.animate-rows tbody tr:nth-child(9) { animation-delay: 0.18s; }
.enhanced-table.animate-rows tbody tr:nth-child(10) { animation-delay: 0.20s; }
.enhanced-table.animate-rows tbody tr:nth-child(n+11) { animation-delay: 0.22s; }

/* Status badges */
.badge-up {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--up);
  background: rgba(217,31,74,0.08);
}
.badge-down {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--down);
  background: rgba(4,135,95,0.08);
}
.badge-flat {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  background: rgba(100,116,139,0.08);
}

:root[data-theme="dark"] {
  --table-head-text: var(--text-muted);
  --table-head-bg: linear-gradient(180deg, rgba(30, 41, 59, 0.98), rgba(15, 23, 42, 0.96));
  --table-head-border: rgba(56, 189, 248, 0.24);
}

:root[data-theme="dark"] .enhanced-table td {
  border-bottom-color: rgba(148, 163, 184, 0.14);
}

:root[data-theme="dark"] .enhanced-table tbody tr:nth-child(even) {
  background: rgba(148, 163, 184, 0.045);
}

:root[data-theme="dark"] .enhanced-table tbody tr:hover,
:root[data-theme="dark"] .enhanced-table tbody tr:nth-child(even):hover {
  background: rgba(56, 189, 248, 0.1);
}

:root[data-theme="dark"] .badge-up {
  color: var(--up);
  background: rgba(251, 113, 133, 0.16);
}

:root[data-theme="dark"] .badge-down {
  color: var(--down);
  background: rgba(52, 211, 153, 0.14);
}

/* Responsive table wrapper */
.table-scroll-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 -12px;
  padding: 0 12px;
}

@media (max-width: 768px) {
  .enhanced-table {
    min-width: 640px;
    font-size: 12px;
  }
  .enhanced-table th,
  .enhanced-table td {
    padding: 8px 10px;
    white-space: nowrap;
  }
  .enhanced-table th {
    font-size: 11px;
    letter-spacing: 0.3px;
  }
}

@media (max-width: 480px) {
  .enhanced-table {
    min-width: 560px;
    font-size: 11px;
  }
  .enhanced-table th,
  .enhanced-table td {
    padding: 6px 8px;
  }
}