.py-table-surface { background: var(--py-surface); border: 1px solid var(--py-line); border-radius: var(--py-radius); }
.py-data-table { width: 100%; border: 0; border-collapse: collapse; text-align: left; font-size: 13px; }
.py-data-table th, .py-data-table td { padding: 9px 8px; vertical-align: middle; overflow-wrap: anywhere; }
.py-data-table th { background: var(--py-table-head, #edf1f1); color: var(--py-muted); font-size: 11px; font-weight: 750; }
.py-data-table thead th:first-child { border-radius: var(--py-radius) 0 0 0; }
.py-data-table thead th:last-child { border-radius: 0 var(--py-radius) 0 0; }
.py-data-table tbody tr + tr, .py-data-table thead + tbody { border-top: 1px solid var(--py-line); }
.py-data-table tbody tr:not(.py-empty):hover { background: var(--py-table-hover, #f8fbfa); }
.py-data-table .py-date { font-variant-numeric: tabular-nums; white-space: nowrap; }
.py-data-table .py-date span, .py-data-table .py-title small { display: block; color: var(--py-muted); font-size: 11px; }
.py-data-table .py-title strong { margin-right: 4px; font-size: 13px; }
.py-tag, .py-access { display: inline-flex; align-items: center; width: fit-content; max-width: 100%; padding: 2px 6px; border-radius: 6px; color: var(--py-accent); background: var(--py-soft); font-size: 10px; line-height: 1.35; font-weight: 730; }
.py-tag-refresh { background: #d8f0e1; color: #0c5b3a; }
.py-access { color: var(--py-muted); background: #edf1f1; }
.py-source-lock { display: inline-flex; align-items: center; gap: 4px; color: var(--py-muted); font-size: 11px; }
.py-score { font-weight: 760; white-space: nowrap; }
.py-score small { color: var(--py-muted); font-size: 10px; font-weight: 570; }
.py-row-action { min-height: 34px; padding: 6px 7px; font-size: 11px; white-space: nowrap; }
.py-row-action .py-icon { width: 12px; height: 12px; }
.py-empty td { padding: clamp(20px, 3vw, 32px) 16px; text-align: center; }
.py-empty-icon { margin: 0 auto 8px; }
.py-empty strong { font-size: 15px; }
.py-empty p { margin: 5px 0 12px; color: var(--py-muted); }
@media (max-width: 1149px) {
  .py-table-surface { background: transparent; border: 0; }
  .py-data-table, .py-data-table tbody { display: block; }
  .py-data-table thead { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }
  .py-data-table thead + tbody { border: 0; }
  .py-data-table tbody { display: grid; gap: 8px; }
  .py-data-table tr {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px 10px;
    padding: 11px 12px;
    border: 1px solid var(--py-line);
    border-radius: var(--py-radius);
    background: var(--py-surface);
  }
  .py-data-table td { min-width: 0; display: block; padding: 0; }
  .py-data-table td[data-label]::before { display: block; content: attr(data-label); color: var(--py-muted); font-size: 10px; font-weight: 680; }
  .py-data-table .py-title { grid-column: 1 / -1; grid-row: 1; }
  .py-data-table .py-title strong { font-size: 15px; }
  .py-data-table .py-date span { display: inline; margin-left: 4px; }
  .py-data-table .py-action-cell { align-self: end; }
  .py-data-table .py-empty { display: block; padding: 0; }
  .py-data-table .py-empty td { padding: 20px 13px; }
}
@media (max-width: 640px) {
  .py-data-table tr { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .py-data-table .py-date { white-space: normal; }
  .py-data-table .py-action-cell { grid-column: 1 / -1; }
  .py-data-table .py-action-cell a { width: 100%; }
}

/* The client list reuses the public table and adapts it to the active client theme. */
.popyto-app .py-table-surface {
  --py-surface: var(--card);
  --py-muted: var(--muted);
  --py-ink: var(--txt);
  --py-line: var(--border);
  --py-accent: var(--accent);
  --py-soft: var(--soft);
  --py-table-head: var(--bg);
  --py-table-hover: var(--soft);
  --py-radius: var(--popyto-radius-md);
  margin-block: 12px;
}
.popyto-app .py-data-table .pc-tag { font-size: 10px; padding: 2px 6px; }
.popyto-app .py-data-table .py-client-tags { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; }
.popyto-app .py-data-table .py-row-actions { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.popyto-app .py-data-table .py-row-actions :is(a, button) { min-height: 34px; padding: 6px 7px; font-size: 11px; }
.popyto-app .py-data-table .py-title > a { color: var(--txt); font-weight: 730; }
.popyto-app[data-theme="light"] .pc-refresh-tag { color: #0c5b3a !important; }

@media (max-width: 1149px) {
  .py-data-table .py-action-cell { grid-column: 1 / -1; }
}
@media (max-width: 979px) {
  .py-row-action, .popyto-app .py-data-table .py-row-actions :is(a, button) { min-height: 44px; }
}
@media (max-width: 640px) {
  .popyto-app .py-data-table .py-row-actions { gap: 6px; }
  .popyto-app .py-data-table .py-row-actions > * { flex: 1 1 auto; }
  .popyto-app .py-data-table .py-row-actions form button { width: 100%; }
}