/* SmartMoneyTable — cross-portfolio leaderboard. */

.smt {
    font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 6px;
    padding: 14px;
}

.smt__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

.smt__label {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-primary, #f3f4f6);
}

.smt__sub {
    font-family: var(--font-mono, monospace);
    font-size: 0.66rem;
    color: var(--color-text-muted, #9ca3af);
    margin-top: 2px;
}

/* ─── Sort tabs ─── */

.smt__tabs,
.smt__view-tabs {
    display: flex;
    gap: 4px;
}

/* T2: view toggle (wallet/cluster) — visually distinct from sort tabs.
   Slightly stronger border so the eye groups it as a "mode" control,
   not a "sort" control. */
.smt__view-tabs {
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    padding-right: 10px;
    margin-right: 4px;
}

.smt__tab {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.06);
    color: var(--color-text-secondary, #d1d5db);
    font-family: var(--font-mono, monospace);
    font-size: 0.66rem;
    padding: 4px 9px;
    border-radius: 3px;
    cursor: pointer;
    transition: background 120ms;
}

.smt__tab:hover { background: rgba(255, 255, 255, 0.07); }

.smt__tab--active {
    background: rgba(34, 197, 94, 0.15);
    color: #22c55e;
    border-color: rgba(34, 197, 94, 0.3);
}

/* ─── Table ─── */

.smt__scroll { overflow-x: auto; }

.smt__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.74rem;
}

.smt__table thead th {
    font-family: var(--font-mono, monospace);
    font-size: 0.64rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-muted, #9ca3af);
    text-align: left;
    padding: 6px 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    white-space: nowrap;
}

/* Round-13: sortable column headers — same data-smt-sort hook as the tabs. */
.smt__th-sort {
    cursor: pointer;
    user-select: none;
    transition: color 120ms;
}
.smt__th-sort:hover { color: var(--color-text-secondary, #d1d5db); }
.smt__th-sort--active { color: #22c55e; }

/* Round-13: filter-by-agent chip (set when the wallet-drawer dispatches
   walletDrawer:filterByAgent). Sits in the table header area. */
.smt__filter-chip {
    background: rgba(56, 189, 248, 0.12);
    color: #7dd3fc;
    border: 1px solid rgba(56, 189, 248, 0.22);
    font-family: var(--font-mono, monospace);
    font-size: 0.66rem;
    padding: 3px 9px;
    border-radius: 3px;
    cursor: pointer;
    margin-left: 8px;
    transition: background 120ms;
}
.smt__filter-chip:hover { background: rgba(56, 189, 248, 0.2); }

.smt__row td {
    padding: 6px 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    font-family: var(--font-mono, monospace);
    color: var(--color-text-secondary, #d1d5db);
    vertical-align: middle;
}

.smt__row:hover td {
    background: rgba(255, 255, 255, 0.025);
}

.smt__rank {
    color: var(--color-text-muted, #9ca3af);
    text-align: right;
    width: 28px;
}

.smt__addr { white-space: nowrap; }

.smt__agents-count,
.smt__buys-sells,
.smt__buy-usd,
.smt__holding-usd,
.smt__inbound-usd,
.smt__outbound-usd {
    text-align: right;
    white-space: nowrap;
}

/* T1 (round 6): non-swap transfer flow columns. Distinct accent colour
   so the eye separates "tokens that came/went via DEX" (the existing
   buy/sell/PnL/holding columns) from "tokens that came/went via direct
   transfer" (these). Subtle — same hierarchy as the rest. */
.smt__inbound-usd  { color: #67e8f9; }   /* cyan-300 — incoming flow */
.smt__outbound-usd { color: #fdba74; }   /* orange-300 — outgoing flow */

.smt__pnl-usd {
    text-align: right;
    white-space: nowrap;
    font-weight: 600;
}

/* Phase C-1 (round 11): PnL color tones moved to pnl-cell.css. The
   `.smt__pnl-usd` class still exists for layout (text-align/font-weight)
   but the tone classes (`--positive`/`--negative`/`--muted`) are now
   defined ONCE in shared/modules/pnl-cell.css and applied via PnlCell.html().
   These three rules below kept as a back-compat alias for any tests/fixtures
   that still grep for the old class names. Safe to remove later. */
.smt__pnl-usd--positive { color: #22c55e; }
.smt__pnl-usd--negative { color: #ef4444; }
.smt__pnl-usd--muted    { color: #94a3b8; }

/* ─── Agent chips ─── */

.smt__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
}

.smt__chip {
    background: rgba(56, 189, 248, 0.12);
    color: #7dd3fc;
    font-size: 0.6rem;
    padding: 1px 5px;
    border-radius: 2px;
    text-transform: lowercase;
    letter-spacing: 0;
}

.smt__chip--more {
    background: rgba(148, 163, 184, 0.14);
    color: #cbd5e1;
}

.smt__empty {
    text-align: center;
    color: var(--color-text-muted, #9ca3af);
    padding: 18px 8px;
    font-style: italic;
}

@media (max-width: 700px) {
    .smt__buys-sells,
    .smt__holding-usd,
    .smt__inbound-usd,
    .smt__outbound-usd { display: none; }
}