.tracker-view { margin-top: 8px; }
body.tracker-active .betslip-panel, body.tracker-active .full-betslip-overlay { display:none !important; }
@media (min-width:1181px) {
  body { padding-right:280px; }
  .betslip-panel { width:265px; }
  main { padding-left:12px; padding-right:12px; }
  .data-table th, .data-table td { padding-left:4px; padding-right:4px; }
}

/* Sidebar is a compact summary; the full betslip keeps the detailed layout. */
#betslip-panel .betslip-items { padding:6px; }
#betslip-panel .betslip-item { position:relative; min-height:64px; padding:6px 7px; margin-bottom:5px; border-radius:6px; border-left-width:3px; }
#betslip-panel .betslip-item.bet-result-loss { border-width:2px !important; border-left-width:3px !important; }
#betslip-panel .betslip-bookie { margin-bottom:3px; padding-right:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9px; line-height:1.15; }
#betslip-panel .betslip-item-top { display:block; }
#betslip-panel .betslip-match-line { display:block; min-width:0; padding-right:18px; line-height:1.2; }
#betslip-panel .betslip-match { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; line-height:1.2; }
#betslip-panel .betslip-pick { display:block; margin-top:3px; padding-right:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; line-height:1.2; }
#betslip-panel .betslip-remove { position:absolute; top:2px; right:2px; z-index:2; color:#ffffff !important; background:transparent !important; border:0 !important; font-size:16px; font-weight:800; padding:0; }
#betslip-panel .betslip-remove:hover { color:#ff2f3b !important; background:transparent !important; }
#betslip-panel .betslip-quote { position:static; display:flex; justify-content:flex-end; margin:6px 0 0; padding:0; border:0; }
#betslip-panel .betslip-fair { display:none; }
#betslip-panel .betslip-quote strong { min-width:46px; padding:3px 5px; border-radius:5px; font-size:13px; }

/* Full betslip: complete information in a viewport-safe two-column workspace. */
.full-betslip-overlay { z-index:10000; }
.full-betslip-modal { height:min(760px,94vh); max-height:94vh; }
.full-betslip-head { flex:0 0 auto; padding:11px 18px; }
.full-betslip-title { font-size:22px; }
.full-betslip-content { min-height:0; overflow:hidden; grid-template-columns:minmax(0,1fr) 260px; }
.full-betslip-items { min-height:0; overflow-y:auto; padding:8px 10px 10px; }
.full-betslip-item { padding:7px 9px; margin-bottom:6px; border-radius:7px; }
.full-betslip-bookie { margin-bottom:2px; font-size:9px; }
.full-betslip-match-line { gap:5px; line-height:1.2; }
.full-betslip-match { font-size:13.5px; line-height:1.25; }
.full-betslip-pick { font-size:10px; }
.full-betslip-fair { font-size:9px; }
.full-betslip-odds { padding:4px 7px; font-size:13px; }
.full-betslip-remove { right:4px; bottom:4px; color:#ffffff !important; }
.full-betslip-remove:hover { color:#ff5b63 !important; }
.full-betslip-summary { min-height:0; overflow-y:auto; padding:11px 12px; }
.full-betslip-metrics-label { margin-bottom:4px; font-size:9px; }
.full-betslip-summary-row { margin:6px 0; }
.full-betslip-combined-row, .full-betslip-fair-combined-row { padding:8px 9px; }
.full-betslip-summary label { margin:8px 0 3px; font-size:10px; }
#full-betslip-stake { padding:7px 8px; }
.full-betslip-metrics-model { margin-top:13px; padding-top:11px; }
.full-betslip-ticket-actions { margin-top:12px; gap:6px; }
.full-betslip-ticket-actions .full-betslip-save-selection,
.full-betslip-ticket-actions .full-betslip-share-community { min-height:35px; padding:7px 9px; border-radius:7px; font-size:12px; }
@media (max-width:760px) {
  .full-betslip-modal { height:96vh; }
  .full-betslip-content { overflow-y:auto; grid-template-columns:1fr; }
  .full-betslip-items, .full-betslip-summary { overflow:visible; }
}
.tracker-toolbar, .tracker-list-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.tracker-toolbar h2, .tracker-panel h3 { margin:0; }
.tracker-toolbar p { margin:2px 0 0; color:var(--muted); }
.tracker-slot-toggle { display:flex; gap:6px; margin:10px 0 0; }
.tracker-slot-btn { padding:7px 14px; border:1px solid var(--border); background:var(--surface); color:var(--muted); border-radius:999px; font:inherit; font-size:12px; font-weight:600; cursor:pointer; }
.tracker-slot-btn.active { color:#fff !important; border-color:#22c55e !important; background-color:#22c55e !important; }
.tracker-settings { display:flex; align-items:flex-end; gap:8px; margin:14px 0; padding:10px 12px; border:1px solid var(--border); background:var(--surface); }
.tracker-settings label { display:flex; flex-direction:column; gap:3px; color:var(--muted); font-size:11px; }
.tracker-settings label span { display:flex; align-items:center; gap:7px; }
.tracker-settings input { width:110px; padding:7px 8px; color:var(--ink); background:var(--page); border:1px solid var(--border); border-radius:5px; font:inherit; }
.tracker-settings output { min-width:60px; padding-bottom:7px; color:var(--good); font-size:12px; }
.tracker-kpis { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:16px 0; }
.tracker-kpi, .tracker-panel { background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:14px; }
.tracker-kpi span { display:block; color:var(--muted); font-size:12px; }
.tracker-kpi strong { display:block; margin-top:4px; font-size:22px; }
.tracker-positive { color:var(--good); } .tracker-negative { color:var(--series-neg); }
.tracker-charts { display:grid; grid-template-columns:2fr 1fr; gap:12px; margin-bottom:12px; }
.tracker-panel h3 { font-size:15px; margin-bottom:12px; }
.tracker-profit-panel { background:#050706; border-color:#26312a; color:#f4f7f5; padding:0; overflow:hidden; }
.tracker-chart-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:15px 18px 5px; }
.tracker-chart-heading span { color:#707974; font-size:9px; font-weight:700; }
.tracker-chart-heading h3 { margin:2px 0 0; font-size:14px; }
.tracker-chart-heading strong { color:#25e766; font-size:18px; font-variant-numeric:tabular-nums; }
.tracker-profit-panel #tracker-profit-chart { position:relative; padding:0 8px; }
.tracker-chart-legend { display:flex; justify-content:center; gap:18px; padding:7px 14px 13px; border-top:1px solid #172019; color:#a8b0ab; font-size:10px; }
.tracker-chart-legend i { display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:1px; background:#22e65f; }
.tracker-chart-legend i.tracker-expected-key { background:#f4f7f5; }
.tracker-hover-card { position:absolute; z-index:3; min-width:220px; padding:11px 13px; color:#f4f7f5; background:#171a18; border:1px solid #2d332f; border-radius:4px; box-shadow:0 8px 24px rgba(0,0,0,.45); pointer-events:none; }
.tracker-hover-card strong { display:block; margin-bottom:7px; }
.tracker-hover-row { display:grid; grid-template-columns:10px 1fr auto; gap:7px; align-items:center; font-size:11px; }
.tracker-hover-row + .tracker-hover-row { margin-top:4px; }
.tracker-hover-row i { width:7px; height:7px; background:#22e65f; border-radius:1px; }
.tracker-hover-row.expected i { background:#f4f7f5; }
.tracker-chart-empty, .tracker-empty { color:var(--muted); padding:30px 0; text-align:center; }
.tracker-svg { width:100%; height:250px; display:block; overflow:visible; }
.tracker-axis-label { fill:#68716c; font-size:10px; }
.tracker-chart-value { fill:#f2f6f3; font-size:11px; font-weight:700; }
.tracker-list-head { margin-bottom:10px; }
.tracker-list-tools { display:flex; align-items:center; gap:7px; }
#tracker-reset { color:var(--series-neg); border-color:color-mix(in srgb,var(--series-neg) 55%,transparent); }
.tracker-list { display:flex; flex-direction:column; gap:8px; }
.tracker-row { display:grid; grid-template-columns:120px minmax(220px,1fr) 90px 90px 100px 150px; align-items:center; gap:10px; padding:10px; border-top:1px solid var(--border); border-left:3px solid transparent; }
.tracker-row-main strong, .tracker-row-main span { display:block; }
.tracker-row-main span, .tracker-row-date { color:var(--muted); font-size:12px; }
.tracker-row-meta { margin-top:2px; }
.tracker-row-main span.tracker-row-result { display:block; margin-top:2px; color:#f5c451; font-weight:600; }
.tracker-status { text-transform:capitalize; }
.tracker-row-actions { display:flex; gap:5px; }
.tracker-row-actions button { padding:5px 8px; }
.tracker-combo-details { margin-top:6px; color:var(--muted); font-size:11px; }
.tracker-combo-details summary { width:max-content; color:var(--series-1); cursor:pointer; }
.tracker-combo-items { display:grid; gap:4px; margin-top:7px; padding:8px; border-left:2px solid var(--series-1); background:var(--ghost); }
.tracker-combo-item { display:grid; grid-template-columns:minmax(180px,1fr) minmax(90px,.5fr) 60px; gap:8px; }
.tracker-combo-item-meta { grid-column:1/-1; color:var(--muted); font-size:10.5px; }
.tracker-combo-item-result { grid-column:1/-1; color:#f5c451; font-size:10.5px; font-weight:600; }
.tracker-awaiting { color:var(--bookie); font-size:11px; }

/* Result tint: same soft-green as the app's hover convention for wins,
   matching red for losses, and a neutral gray wash for voided bets. */
.tracker-row.tracker-row-won {
  background:linear-gradient(90deg, rgba(34, 197, 94, .16), rgba(34, 197, 94, .02)) !important;
  border-left-color:#62d83b;
}
.tracker-row.tracker-row-lost {
  background:linear-gradient(90deg, rgba(239, 68, 68, .16), rgba(239, 68, 68, .02)) !important;
  border-left-color:#ef4444;
}
.tracker-row.tracker-row-void {
  background:rgba(174, 184, 193, .08) !important;
  border-left-color:#6b7680;
}
.tracker-track-actions { display:flex; gap:4px; justify-content:flex-end; }
.tracker-button { padding:5px 8px; font-size:12px; }
.tracker-button.tracked { color:#041308; background:#25df61; border-color:#25df61; }
.tracker-table-button { min-width:58px; height:25px; padding:1px 9px; color:var(--muted) !important; background:transparent !important; background-color:transparent !important; border:1px solid var(--border) !important; border-radius:999px; font-size:10px; font-weight:600; box-shadow:none; }
.tracker-table-button:hover:not(:disabled) { color:var(--ink) !important; background:linear-gradient(90deg, rgba(34, 197, 94, .22), rgba(34, 197, 94, .03)) !important; background-color:transparent !important; border-color:rgba(34, 197, 94, .45) !important; box-shadow:none; }
html[data-theme="dark"] .tracker-button.tracker-table-button.tracked { color:#2196f3 !important; background:transparent !important; background-color:transparent !important; border-color:#2196f3 !important; box-shadow:0 0 8px rgba(33,150,243,.36); font-size:10px; }
html[data-theme="light"] .tracker-button.tracker-table-button.tracked { color:#126db5 !important; background:transparent !important; background-color:transparent !important; border-color:#126db5 !important; box-shadow:0 0 7px rgba(18,109,181,.25); font-size:10px; }
.tracker-modal { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:16px; background:rgba(0,0,0,.62); }
.tracker-modal[hidden] { display:none; }
.tracker-dialog { width:min(520px,100%); max-height:90vh; overflow:auto; background:var(--surface); border:1px solid var(--border); border-radius:8px; padding:18px; }
.tracker-dialog-head { display:flex; justify-content:space-between; align-items:center; }
.tracker-dialog-head h2 { margin:0; font-size:19px; }
.tracker-dialog-head button { font-size:22px; border:0; }
.tracker-form-summary { margin:14px 0; padding:10px; background:var(--ghost); }
.tracker-form-summary div + div { margin-top:5px; }
.tracker-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.tracker-dialog label { display:flex; flex-direction:column; gap:4px; margin-top:10px; color:var(--muted); font-size:12px; }
.tracker-dialog input,.tracker-dialog textarea,.tracker-list-head select { color:var(--ink); background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:8px; font:inherit; }
.tracker-form-error { color:var(--series-neg); min-height:20px; margin-top:8px; }
.tracker-dialog-actions { display:flex; justify-content:flex-end; gap:8px; }
@media(max-width:700px){.tracker-kpis{grid-template-columns:repeat(2,1fr)}.tracker-charts{grid-template-columns:1fr}.tracker-row{grid-template-columns:1fr 55px 78px 88px}.tracker-row-date{display:none}.tracker-row-odds{font-size:12px}.tracker-form-grid{grid-template-columns:1fr}.tracker-view{padding:8px}.tracker-row-actions{grid-column:1/-1}.tracker-track-actions{justify-content:stretch}.tracker-track-actions button{flex:1}.tracker-settings{flex-wrap:wrap}}
