/* Backtest trade list (backtest.html). Colours come from style.css and home.css. */
.home{--pos:#2F7D4F;--neg:#B0413E}
/* Lives on the home page as section.trades#backtest. */
.home section.trades{max-width:1040px;padding-top:24px}
.trades h2{margin:1.4em 0 .4em}.trades>h2:first-of-type{margin-top:0}
.trades .lede{font-size:1.05rem;max-width:none}
.trades h3{font:600 1rem var(--sans);margin:18px 0 8px}

.home .trades .basket{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:8px 20px 20px;margin:32px 0 0}
.trades .basket h2{margin-top:.8em}
.wl{max-height:440px;overflow:auto;margin-top:12px;background:var(--bg)}
.wl .tt th{background:var(--bg)}
.wl tbody tr{cursor:pointer}
.wl tbody tr:hover td,.wl tbody tr:focus-visible td{background:var(--card)}
.wl tbody tr:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}

.filters{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.filters input,.filters select{font:15px var(--sans);color:var(--ink);background:var(--card);
  border:1px solid var(--line);border-radius:8px;padding:9px 10px;min-width:0}
.filters input{flex:1 1 140px;text-transform:uppercase}
.filters input::placeholder{text-transform:none}
.filters select{flex:1 1 150px}
.totals{font:.95rem/1.5 var(--sans);color:var(--muted);margin:0 0 10px;min-height:1.5em}
.totals b{color:var(--ink)}
.years{margin:0 0 16px}
.years summary{font:600 .95rem var(--sans);cursor:pointer;margin:4px 0 8px;color:var(--ink)}
.years .tablewrap{max-width:560px}
.pos{color:var(--pos)!important}.neg{color:var(--neg)!important}

.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--card);scroll-margin-top:16px}
.tt{width:100%;border-collapse:collapse;font:14px/1.4 var(--sans)}
.tt th{text-align:left;font-weight:600;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);
  cursor:pointer;user-select:none;white-space:nowrap;position:sticky;top:0;background:var(--card)}
.tt th[aria-sort=ascending]::after{content:" ↑";color:var(--accent)}
.tt th[aria-sort=descending]::after{content:" ↓";color:var(--accent)}
.tt td{padding:8px 12px;border-bottom:1px solid var(--line)}
.tt tbody tr:last-child td{border-bottom:0}
.tt .num{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.tt .nw{white-space:nowrap;font-variant-numeric:tabular-nums}
.tt .ex{color:var(--muted);font-size:.85rem}
.pat{display:inline-flex;align-items:center;gap:8px;color:var(--ink);text-decoration:none;white-space:nowrap}
.pat:hover{color:var(--accent)}
.pat svg{width:40px;height:18px;flex:none}
.pat svg polyline,symbol polyline{fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}

.pager{display:flex;justify-content:center;align-items:center;gap:16px;margin:16px 0;font:.9rem var(--sans);color:var(--muted)}
.pager button{font:600 .9rem var(--sans);color:var(--ink);background:var(--card);border:1px solid var(--line);
  border-radius:8px;padding:8px 14px;cursor:pointer}
.pager button:disabled{opacity:.4;cursor:default}

@media (max-width:760px){.home .trades .basket{padding:4px 14px 16px}.tt{font-size:13px}.tt td,.tt th{padding:8px}}

.opennow{font:.95rem/1.5 var(--sans);color:var(--muted);margin:0 0 12px}
