/* =====================================================================
   TABLE
   ===================================================================== */
table{ width: 100%; border-collapse: collapse; font-size: 13px; }
th, td{ padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--border); }
th{
  font-family: var(--font-mono);
  color: var(--faint); font-size: 10.5px; font-weight: 500;
  text-transform: uppercase; letter-spacing: .08em;
}
tr:last-child td{ border-bottom: none; }
tr:hover td{ background: rgba(255,255,255,.02); }

.code-cell{
  font-family: var(--font-mono); font-weight: 600; letter-spacing: .02em;
  cursor: pointer; color: var(--ink-bright);
  -webkit-user-select: all; user-select: all;
}
.code-cell::selection{ background: var(--accent-wash); }

.empty-row{ text-align: center; padding: 48px 20px; color: var(--muted); }
.actions{ display: flex; gap: 6px; flex-wrap: wrap; }

/* scroll horizontal di layar sempit tanpa ngerusak card-nya, dikasih
   fade tipis di kanan biar kelihatan masih ada kolom lagi */
.table-scroll{ position: relative; overflow-x: auto; }
.table-scroll::after{
  content: '';
  position: absolute; top: 0; right: 0; bottom: 0; width: 28px;
  background: linear-gradient(to right, transparent, var(--surface));
  pointer-events: none;
}