/* SUREBET_TOOL_20261018 - Punta/Punta: "BACK a confronto" + pannello "Surebet".
   Presentazione soltanto: nessuna regola decide quali quote o combinazioni
   esistono. Tutto e' sotto #pmWorkspace[data-mode="surebet"] (griglia, filtri)
   o sotto .sb-panel (pannello destro). Caricare DOPO workspace-ui.css.
   Direzione: .orchestration/surebet-tool-20261018/DESIGN-DECISIONS.md */

:root[data-theme] {
  /* Identita' della modalita': blu oceano saturo + filo celeste (il confronto
     sharp resta blu ardesia #243b53 con la riga rosa Betfair LAY). */
  --sb-head:#0c4a86; --sb-head-line:#2d679f; --sb-head-sub:#cfe1f5; --sb-head-rule:#4fb3f6;
  --sb-accent:#0b5ba8; --sb-ink:#0b4a86;
  --sb-sum-bg:#eaf2fc;                                   /* riga Payout */
  --sb-best-bg:#edf4fc; --sb-best-line:#8fb3df; --sb-best-ink:#0b4a86;
  --sb-arb-bg:#e2f3e9; --sb-arb-line:#6fb58b; --sb-arb-ink:#145634;
  --sb-verify-bg:#fff8e6; --sb-verify-line:#c99a3f; --sb-verify-ink:#6e4a06;
  --sb-pos:#17663d; --sb-neg:#b42318; --sb-muted:#5d6f85;
  --sb-frame:#8aa9d2; --sb-frame-head:#edf3fb;
}

/* --- Filtri: cio' che appartiene al confronto con lo sharp sparisce -------- */
#pmWorkspace[data-mode="surebet"] :is(.pm-reference-filter,.pm-side-filter,.pm-tolerance-filter:not(.pm-sb-margin),.pm-odds-filter,
  .pm-liquidity-filter,.pm-size-toggle,.pm-scope-choice,.pm-filter-break) { display:none!important; }
/* SUREBET_RANGE_20261018: il filtro margine della griglia (stesso aspetto del VAL) esiste solo in Punta/Punta. */
#pmWorkspace:not([data-mode="surebet"]) .pm-sb-margin, .pm-sb-margin[hidden] { display:none!important; }
/* SUREBET_ROW_20261018 (proprietario: "non si legge bene e metti su una sola riga"): in Punta/Punta i filtri
   stanno su UNA riga (i filtri sharp sono nascosti, la seconda riga a colonne fisse non serve) e il margine ha
   campi leggibili. Solo layout: valori, ordine Tab e comportamento dei controlli invariati. */
#pmWorkspace[data-mode="surebet"] #pmSurebetRange { flex:0 0 auto; width:auto!important; gap:0; }
#pmWorkspace[data-mode="surebet"] #pmSurebetRange > .pm-sr-only { flex:0 0 auto; }
#pmWorkspace[data-mode="surebet"] #pmSurebetRange #pmSurebetUnit { flex:0 0 44px; width:44px!important; padding:0 14px 0 6px; font-size:12px; }
#pmWorkspace[data-mode="surebet"] #pmSurebetRange .pm-range-group { flex:0 0 auto; gap:3px; padding:0 4px; }
#pmWorkspace[data-mode="surebet"] #pmSurebetRange .pm-range-value { flex:0 0 52px; width:52px; min-width:52px; height:22px; font-size:12.5px; text-align:right; padding:0 4px; }
#pmWorkspace[data-mode="surebet"] #pmSurebetRange .pm-range-sep { font-size:12px; padding:0 1px; }
/* SUREBET_LEGS_20261019 (proprietario: "opportunita a 2 gambe a 3 o piu gambe"): accanto a MARG., stesso riquadro;
   tre interruttori a scelta multipla, tutti accesi = tutte le combinazioni. */
#pmWorkspace:not([data-mode="surebet"]) .pm-sb-legs, .pm-sb-legs[hidden] { display:none!important; }
.pm-sb-legs { box-sizing:border-box; display:inline-flex; flex:0 0 auto; align-items:center; gap:2px; height:28px; padding:0 3px 0 0;
  border:1px solid #cdd8e8; border-radius:5px; background:#fff; overflow:hidden; }
.pm-sb-legs-caption { align-self:stretch; display:inline-flex; align-items:center; padding:0 6px; margin-right:1px; background:#edf3fb;
  border-right:1px solid #d6e0ee; color:#2c5ea8; font-size:9.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.pm-sb-leg { box-sizing:border-box; min-width:28px; height:22px; padding:0 6px; border:1px solid transparent; border-radius:4px;
  background:transparent; color:#5d6f85; font:inherit; font-size:12px; font-weight:600; line-height:20px; cursor:pointer; }
.pm-sb-leg:hover { background:#f3f7fc; color:#355581; }
.pm-sb-leg[aria-pressed="true"] { background:#e6f0fb; border-color:#8fb0dc; color:var(--sb-ink); }
.pm-sb-leg:focus-visible { outline:2px solid var(--sb-accent); outline-offset:1px; }
@media(min-width:1000px) {
  #pmWorkspace[data-mode="surebet"] #pmFilters.pm-filters { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; gap:4px; padding:4px 6px; }
  #pmWorkspace[data-mode="surebet"] #pmFilters > .pm-one-line,
  #pmWorkspace[data-mode="surebet"] #pmFilters > #pmAdvancedFilters[hidden] { display:contents!important; }
  #pmWorkspace[data-mode="surebet"] #pmAdvancedToggle { display:none!important; }
  /* Leggibilita' prima di tutto: ogni filtro tiene la sua etichetta intera ("Tutti gli sport", "Tutti i campionati");
     una riga sola dove la colonna della griglia ci sta, altrimenti a capo come lo sharp - mai testo troncato. */
  #pmWorkspace[data-mode="surebet"] #pmFilters > .pm-one-line > label:not(.pm-search):not(#pmSurebetRange) { flex:1 1 auto; width:auto; max-width:180px; }
  #pmWorkspace[data-mode="surebet"] #pmFilters > .pm-one-line > label.pm-sport-filter:not(#pmSurebetRange) { flex:1 1 118px; min-width:118px; }
  #pmWorkspace[data-mode="surebet"] #pmFilters > .pm-one-line > label.pm-window-filter:not(#pmSurebetRange) { flex:1 1 80px; min-width:80px; }
  #pmWorkspace[data-mode="surebet"] #pmFilters > .pm-one-line > label.pm-country-filter:not(#pmSurebetRange) { flex:1 1 108px; min-width:108px; }
  #pmWorkspace[data-mode="surebet"] #pmFilters > .pm-one-line > label.pm-league-filter:not(#pmSurebetRange) { flex:1 1 134px; min-width:134px; }
  #pmWorkspace[data-mode="surebet"] #pmFilters .pm-search { flex:1.4 1 112px; min-width:112px; width:auto; }
  #pmWorkspace[data-mode="surebet"] #pmFilters :is(#pmBookPicker,#pmMarketPicker) { flex:0 0 auto; }
}
td.pm-payout[data-state="near"] .pm-payout-value { background:#f3f6fa; box-shadow:inset 0 0 0 1px #b9c6d6; color:#3d4f66; }
.pm-sb-badge[data-state="near"] { background:#eef2f7; color:#4d5f78; box-shadow:inset 0 0 0 1px #c3cfdd; }
.sb-legend-near::before { background:#f3f6fa; box-shadow:inset 0 0 0 1px #b9c6d6; }
#pmWorkspace[data-mode="surebet"] :is(.pm-near-lay-legend,.pm-above-lay-legend,#pmAccaOnly,#pmReferenceNotice) { display:none!important; }
/* Chip di sola vista "Solo con surebet" nella seconda riga. */
.sb-filter-chip { box-sizing:border-box; display:inline-flex; align-items:center; gap:5px; height:28px; padding:0 9px;
  border:1px solid #cdd8e8; border-radius:5px; background:#fff; color:#355581; font:inherit; font-size:11.5px; font-weight:550;
  white-space:nowrap; cursor:pointer; }
.sb-filter-chip::before { content:""; width:8px; height:8px; border-radius:2px; box-shadow:inset 0 0 0 1px #8fa6c4; }
.sb-filter-chip:hover { background:#f3f7fc; }
.sb-filter-chip[aria-pressed="true"] { background:#e6f0fb; border-color:#8fb0dc; color:var(--sb-ink); }
.sb-filter-chip[aria-pressed="true"]::before { background:var(--sb-accent); box-shadow:none; }
.sb-filter-chip:focus-visible { outline:2px solid var(--sb-accent); outline-offset:1px; }
/* Legenda: due campioni, nessuna frase. */
.sb-legend { display:inline-flex; align-items:center; gap:5px; color:var(--text-2); font-size:11px; }
.sb-legend::before { content:""; width:10px; height:10px; border-radius:2px; }
.sb-legend-best::before { background:var(--sb-best-bg); box-shadow:inset 0 0 0 1px var(--sb-best-line); }
.sb-legend-arb::before { background:var(--sb-arb-bg); box-shadow:inset 0 0 0 1px var(--sb-arb-line); }

/* --- Griglia "BACK a confronto" ------------------------------------------- */
/* Testata: blu oceano con filo celeste, distinta dall'ardesia dello sharp. */
#pmWorkspace[data-mode="surebet"] .pm-matrix thead th,
:root:has(#pmWorkspace[data-mode="surebet"]) .pm-head-dock .pm-matrix thead th { background:var(--sb-head); border-color:var(--sb-head-line); }
#pmWorkspace[data-mode="surebet"] .pm-matrix .pm-market-head th,
:root:has(#pmWorkspace[data-mode="surebet"]) .pm-head-dock .pm-matrix .pm-market-head th { box-shadow:inset 0 2px 0 var(--sb-head-rule); }
#pmWorkspace[data-mode="surebet"] .pm-matrix .pm-market-head th:not(.pm-book-head):not(.pm-context),
:root:has(#pmWorkspace[data-mode="surebet"]) .pm-head-dock .pm-matrix .pm-market-head th:not(.pm-book-head):not(.pm-context) { border-left-color:var(--sb-head-line); }
#pmWorkspace[data-mode="surebet"] .pm-matrix thead .pm-market-start { border-left-color:var(--sb-head-line); }
#pmWorkspace[data-mode="surebet"] .pm-matrix .pm-market-head small { color:var(--sb-head-sub); }
#pmWorkspace[data-mode="surebet"] .pm-matrix .pm-outcome-head th,
#pmWorkspace[data-mode="surebet"] .pm-matrix .pm-market-head th.pm-context,
#pmWorkspace[data-mode="surebet"] .pm-matrix thead .pm-book-head { border-bottom-color:#79a9dc; }
:root:has(#pmWorkspace[data-mode="surebet"]) .pm-head-dock { background:var(--sb-head); }

/* Riga Payout: stessa altezza di una riga book (--pm-row-h), bordo blu a
   sinistra come la riga di riferimento dello sharp, fondo oceano chiarissimo. */
#pmWorkspace[data-mode="surebet"] .pm-matrix tr.pm-payout-row > td,
#pmWorkspace[data-mode="surebet"] .pm-matrix tr.pm-payout-row > .pm-book-head,
#pmWorkspace[data-mode="surebet"] .pm-matrix tbody tr.pm-payout-row:hover > td,
#pmWorkspace[data-mode="surebet"] .pm-matrix tbody tr.pm-payout-row:hover > .pm-book-head { background:var(--sb-sum-bg); }
#pmWorkspace[data-mode="surebet"] .pm-matrix tr.pm-payout-row > .pm-book-head { box-shadow:inset 3px 0 0 var(--sb-accent); }
#pmWorkspace[data-mode="surebet"] .pm-matrix tr.pm-payout-row .pm-book-name { color:var(--sb-ink); font-weight:650; }
#pmWorkspace[data-mode="surebet"] .pm-matrix td.pm-payout { padding:0 2px; overflow:hidden; border-left:1px solid var(--border); }
#pmWorkspace[data-mode="surebet"] .pm-matrix td.pm-payout:first-of-type { border-left:0; }
.pm-payout-value { display:block; height:17px; margin:0 1px; border-radius:3px; font-size:11.5px; font-weight:600; line-height:17px;
  color:#3f5672; text-align:center; white-space:nowrap; font-variant-numeric:tabular-nums; letter-spacing:-.1px; }
td.pm-payout[data-state="arb"] .pm-payout-value { background:var(--sb-arb-bg); box-shadow:inset 0 0 0 1px var(--sb-arb-line); color:var(--sb-arb-ink); font-weight:700; }
td.pm-payout[data-state="none"] .pm-payout-value { color:var(--sb-muted); font-weight:500; }
/* Surebet con una gamba vecchia o tennis: mai colorata come attiva. */
td.pm-payout[data-state="arb"][data-verify="true"] .pm-payout-value { background:var(--sb-verify-bg); box-shadow:inset 0 0 0 1px var(--sb-verify-line); color:var(--sb-verify-ink); }
td.pm-payout[data-verify="true"] .pm-payout-value::after { content:"*"; margin-left:1px; }

/* Miglior quota per esito (su .pm-price o sul td che lo contiene). */
/* Quieta di proposito: c'e' una migliore per ogni esito, il verde resta il solo segnale forte. */
#pmWorkspace[data-mode="surebet"] .pm-matrix :is(.pm-price.pm-best,td.pm-best .pm-price) { background:var(--sb-best-bg); box-shadow:none; }
#pmWorkspace[data-mode="surebet"] .pm-matrix :is(.pm-price.pm-best,td.pm-best .pm-price) b { color:var(--sb-best-ink); font-weight:700; }
#pmWorkspace[data-mode="surebet"] .pm-matrix :is(.pm-price.pm-best-arb,td.pm-best-arb .pm-price) { background:var(--sb-arb-bg); box-shadow:inset 0 0 0 1px var(--sb-arb-line); }
#pmWorkspace[data-mode="surebet"] .pm-matrix :is(.pm-price.pm-best-arb,td.pm-best-arb .pm-price) b { color:var(--sb-arb-ink); font-weight:700; }
/* Migliore ma vecchia: resta indicata (tratteggio ambra), numero grigio come ogni quota scaduta. */
#pmWorkspace[data-mode="surebet"] .pm-matrix :is(.pm-price.pm-best,td.pm-best .pm-price):is(.stale,.pm-last-price) { background:#fffaf0; box-shadow:none; outline:1px dashed var(--sb-verify-line); outline-offset:-1px; }
/* Difesa: i colori del confronto con il LAY non devono comparire qui. */
#pmWorkspace[data-mode="surebet"] .pm-matrix .pm-price:is(.pm-near-lay,.pm-above-lay):not(.pm-best):not(.pm-best-arb) { background:none; box-shadow:none; }
#pmWorkspace[data-mode="surebet"] .pm-matrix .pm-price:is(.pm-near-lay,.pm-above-lay):not(.pm-best):not(.pm-best-arb) b { color:var(--text); font-weight:550; }

/* Badge nell'evento: quante surebet il motore ha trovato, combinazioni incluse. */
.pm-sb-badge { display:flex; align-items:center; width:max-content; max-width:100%; height:16px; margin-top:3px; padding:0 5px; box-sizing:border-box;
  border-radius:3px; background:var(--sb-accent); color:#fff; font-size:10px; font-weight:650; line-height:16px; white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums; }
.pm-sb-badge[data-state="verify"] { background:var(--sb-verify-bg); color:var(--sb-verify-ink); box-shadow:inset 0 0 0 1px var(--sb-verify-line); }

/* --- Collocazione del pannello -------------------------------------------- */
/* Il pannello vive in #pmTools; qui ne prende l'aspetto. SUREBET_DESIGN_20261018 (proprietario: "fai sempre la barra
   avvisi che si allarga e rimpicciolisce"): da 1000 px occupa la colonna 2 del workspace come il Centro avvisi
   (stessa griglia dello sharp, sticky, stessa maniglia #pmSidebarResize di workspace-ui.js: 340-560 px, default 560,
   larghezza salvata e condivisa). Nessun codice nuovo: solo la regola che nello sharp gia' esiste. */
#pmTools[data-mode="surebet"] { background:#fff; border-color:#cbd7e7; border-radius:9px; }
#pmTools[data-mode="surebet"] > .pt-heading { display:none; }
#pmTools[data-mode="surebet"] .sb-panel { flex:1 1 0; min-height:0; border:0; border-radius:0; }
@media(min-width:1000px) {
  .pm-shell:has(#pmWorkspace[data-mode="surebet"]) { padding-right:18px; }
  .pm-workspace[data-mode="surebet"] { display:grid; grid-template-columns:minmax(0,1fr) var(--pm-sidebar-width,560px); gap:12px; }
  .pm-workspace[data-mode="surebet"] > .pm-grid-pane { grid-column:1; grid-row:1; }
  #pmWorkspace[data-mode="surebet"] > #pmTools { position:sticky; top:var(--pm-signals-top,8px); left:auto; right:auto; grid-column:2; grid-row:1;
    width:auto; height:var(--pm-signals-height,calc(100vh - 140px)); max-height:var(--pm-signals-height,calc(100vh - 140px)); margin-top:0; z-index:auto; box-shadow:none; }
  #pmWorkspace[data-mode="surebet"] #pmSidebarResize { display:block; }
}
@media(max-width:999px) {
  #pmTools[data-mode="surebet"] { overflow:hidden; }
  #pmTools[data-mode="surebet"] .pt-body { flex:0 0 auto; }
  /* Telefono: il pannello e' in flusso; alto quasi uno schermo cosi' dettaglio e azioni stanno insieme a tre righe. */
  #pmTools[data-mode="surebet"] .sb-panel { flex:0 0 auto; height:min(90dvh,780px); }
}

/* --- Pannello Surebet ------------------------------------------------------ */
.sb-panel { box-sizing:border-box; display:flex; flex-direction:column; min-width:0; min-height:220px; overflow:hidden;
  border:1px solid #cbd7e7; border-radius:9px; background:#fff; color:#1b2d47; font-size:12px; container-type:inline-size; }
.sb-panel :is(button,select,input) { font:inherit; }
.sb-head { display:flex; align-items:center; gap:6px; flex-shrink:0; min-height:39px; padding:0 8px; box-sizing:border-box;
  border-bottom:1px solid #dce4ef; box-shadow:inset 0 2px 0 var(--sb-head-rule); }
.sb-title { margin:0; font-size:14px; font-weight:650; line-height:1.35; color:#10233d; white-space:nowrap; }
.sb-count { min-width:16px; padding:1px 6px; border-radius:4px; background:#e6f0fb; color:var(--sb-ink); font-size:11px; font-weight:650; text-align:center; font-variant-numeric:tabular-nums; }
.sb-scope { flex:1 1 auto; min-width:0; margin-left:auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:right;
  font-size:10px; color:var(--sb-muted); font-variant-numeric:tabular-nums; }
.sb-icon-btn { box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; flex:0 0 28px; width:28px; height:28px; padding:0;
  border:1px solid #d5dfec; border-radius:4px; background:#fff; color:#365982; cursor:pointer; }
.sb-icon-btn:hover { background:#f3f7fc; }
.sb-icon-btn[aria-pressed="true"] { background:#e6f0fb; border-color:#9ab7df; color:var(--sb-ink); }
.sb-close { display:none; font-size:19px; line-height:1; }
@media(max-width:999px) { .sb-close { display:inline-flex; } }

/* Barra comandi 36px: Solo attive | Sport | Ordina. */
.sb-toolbar { display:flex; flex-wrap:nowrap; align-items:center; gap:4px; flex-shrink:0; box-sizing:border-box; height:36px; padding:4px;
  border-bottom:1px solid #e0e7f0; }
.sb-toggle { box-sizing:border-box; display:inline-flex; align-items:center; gap:4px; flex:0 0 auto; height:28px; padding:0 7px;
  border:1px solid #d5dfec; border-radius:4px; background:#fff; color:#365982; font-size:11px; font-weight:600; white-space:nowrap; cursor:pointer; }
.sb-toggle[aria-pressed="true"] { background:#e6f0fb; border-color:#9ab7df; color:var(--sb-ink); }
.sb-toggle-count { font-size:9.5px; font-weight:650; color:inherit; font-variant-numeric:tabular-nums; }
.sb-select { display:flex; flex:1 1 0; min-width:0; max-width:120px; margin:0; }
.sb-select select { box-sizing:border-box; width:100%; min-width:0; height:28px; padding:0 16px 0 5px; border:1px solid #d5dfec; border-radius:4px;
  background-color:#fff; color:#233c5b; font-size:10.5px; }
.sb-sort { position:relative; display:flex; align-items:center; justify-content:center; flex:0 0 28px; width:28px; height:28px; margin:0 0 0 auto; }
.sb-sort svg { position:absolute; pointer-events:none; color:#365982; }
.sb-sort select { box-sizing:border-box; position:relative; z-index:1; width:28px; height:28px; padding:0; border:1px solid #d5dfec; border-radius:4px;
  appearance:none; background:transparent; color:transparent; font-size:0; cursor:pointer; }
.sb-sort select option { color:#233c5b; background:#fff; font-size:12px; }
:is(.sb-toggle,.sb-select select,.sb-sort select,.sb-icon-btn):focus-visible { outline:2px solid var(--sb-accent); outline-offset:1px; }

/* --- Elenco ---------------------------------------------------------------- */
/* SUREBET_DESIGN_20261018: righe del Centro avvisi. Pannello largo (contenitore >= 460 px, il default 560): una riga
   32 px, evento "Casa – Ospite" su una riga con ellissi, combinazione nella colonna flessibile principale che va a capo
   solo fra le gambe (massimo due righe dentro i 32 px). Pannello stretto (340-459 e telefono): due livelli, evento sopra
   e combinazione intera sotto; Ora, Book, Marg. e stato restano allineati a destra come nelle righe larghe. */
.sb-list-section { display:flex; flex-direction:column; flex:1 1 0; min-height:0; }
.sb-columns, .sb-row { display:grid; align-items:center; column-gap:6px; box-sizing:border-box; padding:0 6px 0 7px;
  grid-template-columns:34px minmax(0,.9fr) minmax(0,1.1fr) 62px 58px 18px;
  grid-template-areas:"time event combo books margin state"; }
.sb-col-time, .sb-row-time { grid-area:time; } .sb-col-event, .sb-row-event { grid-area:event; } .sb-col-combo, .sb-row-combo { grid-area:combo; }
.sb-col-books, .sb-row-books { grid-area:books; } .sb-col-margin, .sb-row-margin { grid-area:margin; } .sb-col-state, .sb-row > .sb-state { grid-area:state; }
.sb-columns { flex-shrink:0; height:23px; background:#f1f5fb; border-bottom:1px solid #dce4ef; color:#526784; font-size:9.5px; font-weight:650; line-height:14px; white-space:nowrap; }
.sb-col-margin { text-align:right; } .sb-col-state { text-align:center; }
.sb-list { flex:1 1 auto; min-height:60px; overflow-y:auto; overflow-x:hidden; scrollbar-gutter:stable; }
.sb-row { width:100%; min-height:32px; margin:0; padding-top:2px; padding-bottom:2px; border:0; border-bottom:1px solid #e4eaf3; border-radius:0;
  background:#fff; color:inherit; text-align:left; cursor:pointer; }
.sb-row:hover { background:#f6f9fe; }
.sb-row[aria-pressed="true"] { background:#f3f6ff; box-shadow:inset 3px 0 0 var(--sb-accent); }
.sb-row:focus-visible { outline:2px solid var(--sb-accent); outline-offset:-3px; }
.sb-row > * { min-width:0; }
.sb-row-time { color:#53657e; font-size:10px; line-height:14px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.sb-row-event { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#10233d; font-size:11px; font-weight:650; line-height:14px; }
/* Il trattino e' solo grafica: il testo dell'evento resta "CasaOspite" (i collaudi lo leggono), la riga ha l'aria-label intero. */
.sb-row-home::after { content:" \2013  "; font-weight:500; color:#5d6f85; }
.sb-row-combo { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; white-space:normal;
  color:#1f3a5c; font-size:11px; font-weight:500; line-height:13px; overflow-wrap:normal; padding-right:4px; }
.sb-leg-label { white-space:nowrap; }
.sb-row-books { display:flex; flex-direction:column; color:#44586f; font-size:10px; line-height:12px; }
.sb-row-books > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* Margine blu come lo scarto del Centro avvisi: il verde resta al segno di stato e al profitto del dettaglio. */
.sb-row-margin { text-align:right; color:#2c5d97; font-size:11px; font-weight:700; line-height:14px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.sb-state { display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; height:16px; border-radius:4px; font-size:10px; font-weight:650; line-height:16px; white-space:nowrap; }
.sb-row .sb-state { justify-self:center; width:16px; padding:0; font-size:0; }
.sb-state[data-state="active"] { background:#e9f6ef; color:var(--sb-pos); }
.sb-state[data-state="verify"] { background:#fff3d4; color:#805308; }
.sb-row .sb-state[data-state="active"]::before { content:"\2713"; font-size:11px; }
.sb-row .sb-state[data-state="verify"]::before { content:"!"; font-size:11px; }
/* Quasi surebet (margine negativo): sempre grigia, mai verde, anche con tutte le quote aggiornate. */
.sb-row[data-kind="near"] .sb-state[data-state="active"], .sb-detail[data-kind="near"] .sb-state[data-state="active"] { background:#eef2f7; color:#4d5f78; }
.sb-row[data-kind="near"] .sb-row-combo { color:#3d4f66; }
@container (max-width:459px) {
  .sb-columns, .sb-row { grid-template-columns:32px minmax(0,1fr) 60px 54px 16px; column-gap:5px; padding-left:6px; padding-right:5px;
    grid-template-areas:"time event books margin state" "time combo books margin state"; }
  .sb-columns { grid-template-areas:"time event books margin state"; }
  .sb-col-combo { display:none; }
  .sb-row { min-height:40px; padding-top:4px; padding-bottom:4px; row-gap:1px; }
  .sb-row-combo { align-self:start; font-size:10.5px; }
  .sb-row-event { align-self:end; }
  .sb-row-time { align-self:center; }
  /* Righe da 40 px: il dettaglio lascia comunque almeno tre righe dell'elenco a vista. */
  .sb-panel .sb-detail { max-height:calc(100% - 98px - 3 * 40px - 8px); }
}

/* "Mostra altre": pulsante quieto a fine elenco, solo quando ci sono altre righe (.sb-btn non deve vincere su [hidden]). */
.sb-panel .sb-more { align-self:center; flex-shrink:0; height:26px; margin:5px 0; padding:0 12px; border-color:#cdd8e8; color:#365a8e; font-size:11px; }
.sb-panel .sb-more[hidden] { display:none; }

/* Vuoto: una riga di fatto, un conteggio in piccolo. */
.sb-empty { margin:0; padding:16px 12px; color:#3d4f66; font-size:11.5px; line-height:16px; }
.sb-empty small { display:block; margin-top:2px; color:var(--sb-muted); font-size:10.5px; font-variant-numeric:tabular-nums; }

/* --- Dettaglio: cornice del dettaglio avviso, filo sinistro oceano --------- */
.sb-detail[hidden] { display:none!important; }
.sb-detail { display:flex; flex-direction:column; flex:0 1 auto; min-height:0; max-height:calc(100% - 98px - 3 * 32px - 8px); margin:4px; margin-top:auto; overflow:hidden;
  border:1px solid var(--sb-frame); border-left:3px solid var(--sb-accent); border-radius:6px; background:#fff; }
.sb-detail-head { display:flex; align-items:center; gap:7px; flex-shrink:0; min-height:32px; padding:0 11px; box-sizing:border-box;
  background:var(--sb-frame-head); border-bottom:1px solid #d5e1f0; color:#283f60; font-size:12px; }
.sb-detail-head strong { font-weight:650; }
.sb-detail-head time { margin-left:auto; color:var(--sb-muted); font-size:10.5px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.sb-detail-body { position:relative; overflow:auto; padding:8px 11px 9px; scrollbar-gutter:stable; }
.sb-detail-placeholder { margin:0; padding:4px 0; color:var(--sb-muted); font-size:11.5px; }
/* Evento e stato, come la testa del dettaglio avviso. */
.sb-event { display:flex; align-items:flex-start; gap:10px; margin:0 0 7px; }
.sb-event-text { flex:1 1 auto; min-width:0; }
.sb-event-name { margin:0; color:#172a44; font-size:15px; font-weight:650; line-height:20px; overflow-wrap:anywhere; }
.sb-event-context { margin:2px 0 0; color:#5d6f86; font-size:11px; line-height:15px; }
.sb-when { white-space:nowrap; }
.sb-event-tags { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:4px; flex:0 0 auto; max-width:45%; margin-top:2px; }
.sb-detail .sb-state, .sb-kind { height:18px; padding:0 6px; font-size:10.5px; line-height:18px; }
.sb-kind { display:inline-flex; align-items:center; box-sizing:border-box; border-radius:4px; background:#eef2f7; color:#4d5f78; font-weight:650; white-space:nowrap; }
/* Combinazione e margine: la fascia del mercato del dettaglio avviso. */
.sb-combo { display:flex; align-items:center; gap:10px; padding:6px 9px; border-radius:5px; background:#f2f6fb; }
.sb-combo-label { flex:1 1 auto; min-width:0; color:#24405f; font-size:13px; font-weight:650; line-height:17px; }
.sb-combo-margin { flex:0 0 auto; color:var(--sb-pos); font-size:15px; font-weight:700; line-height:19px; font-variant-numeric:tabular-nums; white-space:nowrap; }
/* Budget e profitto sulla stessa riga: il profitto e' il numero piu' grande del dettaglio. */
.sb-budget { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:6px 12px; margin:9px 0 8px; }
.sb-budget-field { display:flex; flex-direction:column; gap:2px; margin:0; color:#5d6f86; font-size:10.5px; font-weight:600; }
.sb-budget-input { display:flex; align-items:center; box-sizing:border-box; width:108px; height:30px; border:1px solid #bdcee4; border-radius:5px; background:#fff; }
.sb-budget-input:focus-within { outline:2px solid var(--sb-accent); outline-offset:1px; }
.sb-budget-input input { box-sizing:border-box; flex:1 1 auto; min-width:0; height:28px; padding:0 4px 0 8px; border:0; border-radius:5px; background:transparent;
  color:#10233d; font-size:13px; font-weight:650; text-align:right; font-variant-numeric:tabular-nums; outline:0; }
.sb-budget-input span { padding:0 8px 0 2px; color:#5d6f86; font-size:12px; }
.sb-profit { display:flex; flex-direction:column; align-items:flex-end; gap:1px; color:#5d6f86; font-size:10.5px; font-weight:600; }
.sb-profit b { color:var(--sb-pos); font-size:18px; font-weight:700; line-height:22px; font-variant-numeric:tabular-nums; white-space:nowrap; }
/* Una tessera BACK per gamba (stessi colori della tessera BACK del dettaglio avviso; mai il rosa del LAY). */
.sb-leg-tiles { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); gap:6px; margin:0 0 9px; }
.sb-leg { position:relative; display:flex; flex-direction:column; align-items:center; gap:1px; min-width:0; padding:6px 6px 7px; box-sizing:border-box;
  border:1px solid #18212d; border-radius:6px; background:#edf5ff; color:#18212d; text-align:center; }
.sb-leg > * { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* Il segno della gamba e' sempre intero: due righe al massimo, mai ellissi. */
.sb-leg > .sb-leg-sign { color:#10233d; font-size:12.5px; font-weight:700; line-height:15px; white-space:normal; overflow:visible; overflow-wrap:normal; }
@container (max-width:400px) { .sb-leg > .sb-leg-sign { font-size:11px; line-height:13px; } }
.sb-leg-book { color:#47617f; font-size:10.5px; line-height:14px; }
.sb-leg-odds { margin:1px 0 2px; color:#132a46; font-size:21px; font-weight:700; line-height:26px; font-variant-numeric:tabular-nums; }
.sb-leg-stake { display:flex; align-items:baseline; justify-content:center; gap:4px; color:#44586f; font-size:10.5px; line-height:15px; }
.sb-leg-stake b { color:#132a46; font-size:12.5px; font-weight:700; font-variant-numeric:tabular-nums; }
.sb-leg-return { color:#4f6279; font-size:10px; line-height:13px; font-variant-numeric:tabular-nums; }
/* Gamba da verificare: tessera grigia come la tessera avviso da verificare, quota sottolineata a puntini, "!" ambra. */
.sb-leg[data-state="verify"] { background:#f3f4f6; border-color:#c4ccd7; }
.sb-leg[data-state="verify"] .sb-leg-odds { color:#5b4a2a; text-decoration:underline dotted #c99a3f; text-decoration-thickness:2px; text-underline-offset:4px; }
.sb-leg[data-state="verify"]::after { content:"!"; position:absolute; top:5px; right:5px; width:14px; height:14px; border-radius:3px; background:#fff3d4;
  color:#805308; font-size:10px; font-weight:700; line-height:14px; text-align:center; }
/* Tabelle: la tabella delle gambe e' per gli screen reader (contenitore pm-sr-only), gli esiti sono visibili. */
.sb-table { width:100%; margin:0 0 8px; border-collapse:collapse; table-layout:fixed; font-size:11px; font-variant-numeric:tabular-nums; }
.sb-table th { height:21px; padding:0 6px; background:#f1f5fb; color:#526784; font-size:9.5px; font-weight:650; text-align:left; border-bottom:1px solid #dce4ef; }
.sb-table td { height:24px; padding:0 6px; border-bottom:1px solid #e8edf4; color:#1b2d47; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sb-table tbody tr:last-child td { border-bottom:0; }
.sb-table :is(th,td).sb-num { text-align:right; }
.sb-legs col.sb-c-sign { width:22%; } .sb-legs col.sb-c-book { width:23%; } .sb-legs col.sb-c-odds { width:15%; }
.sb-legs col.sb-c-stake { width:20%; } .sb-legs col.sb-c-return { width:20%; }
.sb-outcomes { border:1px solid #e1e8f1; border-radius:5px; border-collapse:separate; border-spacing:0; overflow:hidden; }
.sb-outcomes col.sb-c-outcome { width:52%; } .sb-outcomes col.sb-c-return { width:24%; } .sb-outcomes col.sb-c-profit { width:24%; }
.sb-sign { display:inline-block; max-width:100%; padding:0 4px; border-radius:3px; background:#eef3fa; color:#10233d; font-size:10.5px; font-weight:700;
  line-height:16px; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; }
.sb-odds { font-weight:650; }
.sb-odds[data-age="old"] { color:#7b6a45; text-decoration:underline dotted #c99a3f; text-underline-offset:3px; }
/* L'esito resta sempre scritto (prima, sotto 370 px, le righe senza rimborso restavano vuote). */
.sb-outcome-name { color:#24405f; font-weight:650; }
.sb-refund { display:inline-block; margin-left:5px; padding:0 5px; border-radius:3px; background:#eef2f7; color:#4d5f78; font-size:9.5px; font-weight:600; line-height:15px; vertical-align:1px; }
.sb-pos { color:var(--sb-pos); font-weight:700; } .sb-neg { color:var(--sb-neg); font-weight:700; } .sb-zero { color:var(--sb-muted); }
/* Note: una riga, solo quando servono. Ambra = ricontrollare; grigio = quasi surebet. */
.sb-note { margin:0 0 6px; padding:5px 8px; border-radius:4px; background:#fff6df; color:#7a4f08; font-size:11px; line-height:15px; }
.sb-note[data-tone="near"] { background:#f1f4f8; color:#54677d; }
/* Azioni a griglia come il dettaglio avviso: "Apri <book>" piene, "Mostra in griglia" contornata. */
.sb-actions { display:grid; grid-template-columns:repeat(auto-fit,minmax(96px,1fr)); gap:6px; margin-top:8px; }
.sb-btn { box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; min-width:0; height:28px; padding:0 10px; border:1px solid #bdcee4; border-radius:5px;
  background:#fff; color:#1f4b86; font-size:11.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; text-decoration:none; }
.sb-btn:hover { background:#eef4fd; border-color:#8fb0dc; }
.sb-actions .sb-btn { height:34px; padding:0 8px; font-size:11.5px; }
.sb-actions .sb-btn-open { background:#3563b0; border-color:#3563b0; color:#fff; font-weight:650; }
.sb-actions .sb-btn-open:hover { background:#2b549a; border-color:#2b549a; }
.sb-btn-quiet { border-color:#cdd8e8; color:#365a8e; }
/* Pannello stretto: due colonne; "Mostra in griglia" rimasto solo su una riga la occupa intera. */
@container (max-width:420px) {
  .sb-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sb-actions > .sb-btn-quiet:nth-child(odd) { grid-column:1 / -1; }
}
.sb-btn:disabled, .sb-actions .sb-btn-open:disabled { background:#f3f5f8; border-color:#d5dce6; color:#5d6f85; cursor:default; }
.sb-btn:focus-visible { outline:2px solid var(--sb-accent); outline-offset:1px; }
@media(prefers-reduced-motion:reduce) { .sb-panel * { transition:none!important; } }
/* Vuoto: niente intestazioni di colonna ne conteggio ripetuto in testata. */
.sb-panel:has(.sb-empty:not([hidden])) :is(.sb-columns,.sb-scope) { display:none; }
/* Budget non valido: il campo lo dice, il calcolo resta quello dell'ultimo valore valido. */
.sb-budget-input:has(input[aria-invalid="true"]) { border-color:var(--sb-neg); box-shadow:inset 0 0 0 1px var(--sb-neg); }
/* SUREBET_SIGN_20261019 (proprietario: "profitto fallo in rosso se negativo e verde se positivo"): margine della lista,
   margine del dettaglio, profitto ed esiti colorati dal segno, anche se da verificare o quasi-surebet (lo stato lo dice
   il suo segno a parte). Token esistenti --sb-pos #17663d / --sb-neg #b42318, AA su bianco e sulle righe selezionate. */
.sb-row-margin[data-sign="pos"], .sb-combo-margin[data-sign="pos"] { color:var(--sb-pos); }
.sb-row-margin[data-sign="neg"], .sb-combo-margin[data-sign="neg"] { color:var(--sb-neg); }
.sb-row-margin[data-sign="zero"], .sb-combo-margin[data-sign="zero"] { color:var(--sb-muted); }
.sb-profit b.sb-pos, .sb-table td.sb-pos { color:var(--sb-pos); font-weight:700; }
.sb-profit b.sb-neg, .sb-table td.sb-neg { color:var(--sb-neg); font-weight:700; }
.sb-profit b.sb-zero, .sb-table td.sb-zero { color:var(--sb-muted); }
/* SUREBET_DETAIL_KEEP_20261019: il dettaglio resta aperto; si chiude solo con questo pulsante o con un clic sulla riga. */
.sb-detail-close { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; margin-right:-4px; padding:0;
  border:1px solid transparent; border-radius:4px; background:transparent; color:#4d5f78; font:inherit; font-size:18px; line-height:1; cursor:pointer; }
.sb-detail-close:hover { background:#dfe8f3; color:#163a63; }
.sb-detail-close:focus-visible { outline:2px solid var(--sb-accent); outline-offset:1px; }
.sb-state[data-state="gone"] { background:#eef2f7; color:#4d5f78; }
.sb-note[data-tone="gone"] { background:#eef2f7; color:#3d4f66; }
.sb-detail[data-gone="true"] .sb-leg-tiles { opacity:.72; }
/* SUREBET_ANCHOR_20261019: puntata modificabile in ogni tessera; quella fissata dall'operatore e' evidenziata e le altre
   si ricalcolano da lei. Il Budget diventa "Totale (da <segno>)". */
.sb-leg-stake { align-items:center; }
.sb-stake-input { display:inline-flex; align-items:center; box-sizing:border-box; height:24px; border:1px solid #c6d5e8; border-radius:4px; background:#fff; }
.sb-stake-input:focus-within { outline:2px solid var(--sb-accent); outline-offset:1px; }
.sb-stake-input input { box-sizing:border-box; width:64px; height:22px; padding:0 2px 0 6px; border:0; border-radius:4px; background:transparent;
  color:#132a46; font:inherit; font-size:12.5px; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }
.sb-stake-input input:focus { outline:none; }
.sb-stake-input > span { padding:0 5px 0 1px; color:#5d6f86; font-size:11px; }
.sb-stake-input:has(input[aria-invalid="true"]) { border-color:var(--sb-neg); box-shadow:inset 0 0 0 1px var(--sb-neg); }
.sb-leg[data-anchored="true"] { box-shadow:inset 0 0 0 2px var(--sb-accent); }
.sb-leg[data-anchored="true"] .sb-leg-stake > span:first-child { color:var(--sb-accent); font-weight:700; }
.sb-leg[data-anchored="true"] .sb-stake-input { border-color:var(--sb-accent); background:#eef5fd; }
.sb-budget-field[data-anchored="true"] > span:first-child { color:var(--sb-accent); font-weight:650; }
/* SUREBET_PERCENT_20261019: niente scelta pt/% nel Punta/Punta, il margine e' sempre in %. */
#pmWorkspace[data-mode="surebet"] #pmSurebetRange .pm-sb-unit-suffix { flex:0 0 auto; padding:0 7px 0 1px; color:#355581; font-size:12px; font-weight:600; }