/* components-tables.css */
:root {
  --blue-main: #2563ff;
  --blue-soft: #e5edff;
  --blue-deep: #1d4ed8;
}

/* Glass-style table (original 活动表格) */
.table-glass,
.tier-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 10px;
  overflow: hidden;
}

.table-glass thead,
.tier-table thead {
  background: linear-gradient(135deg, #e5edff, #f1f5ff);
}

.table-glass th,
.table-glass td,
.tier-table th,
.tier-table td {
  padding: 8px 10px;
  text-align: left;
  border-bottom: 1px solid rgba(226, 232, 240, 0.8);
  white-space: nowrap;
}

.table-glass tr:last-child td,
.tier-table tr:last-child td {
  border-bottom: none;
}

.table-glass th,
.tier-table th {
  font-weight: 600;
  color: #1f2937;
  font-size: 12px;
}

.table-glass td span.label,
.tier-table td span.label {
  font-size: 12px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(37, 99, 255, 0.06);
  color: #2563eb;
}

.table-glass small,
.tier-table small {
  font-size: 11px;
  color: #6b7280;
}

/* Generic table reset */
.table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.table th,
.table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
}

/* Soft header variant */
.table-soft thead {
  background: radial-gradient(circle at top left, rgba(37, 99, 255, 0.14), rgba(255, 255, 255, 0.9));
}

.table-soft th {
  font-weight: 600;
  color: #111827;
}

/* Compact yet readable layout */
.table-compact th,
.table-compact td {
  padding-block: 6px;
  font-size: 12px;
}

/* Striped rows */
.table-striped tbody tr:nth-child(odd) {
  background: rgba(249, 250, 251, 0.9);
}

.table-striped tbody tr:hover {
  background: rgba(219, 234, 254, 0.85);
}

/* Metric table: for key/value lists */
.table-metrics {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.table-metrics th {
  width: 32%;
  padding: 6px 10px;
  font-weight: 500;
  color: #6b7280;
  text-align: left;
}

.table-metrics td {
  padding: 6px 10px;
  color: #111827;
}

/* Table with sticky header (for 长表) */
.table-scroll-wrapper {
  max-height: 260px;
  overflow: auto;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow:
    0 18px 40px rgba(15, 23, 42, 0.06),
    0 0 0 1px rgba(255, 255, 255, 0.8);
}

.table-sticky-header thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: linear-gradient(135deg, #e5edff, #f1f5ff);
}

/* Utility: numeric / right aligned cells */
.table .is-num,
.table-glass .is-num,
.tier-table .is-num {
  text-align: right;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

/* Utility: status pill inside tables */
.table-status {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.4;
}

.table-status.is-ok {
  background: rgba(34, 197, 94, 0.08);
  color: #15803d;
}

.table-status.is-warn {
  background: rgba(250, 204, 21, 0.12);
  color: #92400e;
}

.table-status.is-bad {
  background: rgba(248, 113, 113, 0.1);
  color: #b91c1c;
}