/* ════════════════════════════════════════════════════════════════════════════
   PREMATCH — TABELLA LARGA MULTI-MERCATO per lega (come Angelo_prematch_riferimento).
   Design D 23/07. Guscio VISIVO self-contained `.lcw` (non tocca la lista `.lc--pm`
   attuale finché B non commuta). Colonne fisse del riferimento:
     ID · ORARIO · EVENTO · 1X2(1/X/2) · DC(1X/12/X2) · Over-Under(O/U/HND) ·
     Over-Under 2.5(O/U/HND) · GG-NG(GG/NG) · Oth(+)
   Intestazioni-gruppo allineate ESATTAMENTE sopra le celle (stessa griglia).

   ⚠️ RICHIEDE DATI DA B (vista): per allineare le colonne servono COLONNE-BANDA
   ordinate per market_ref, uguali per tutti gli eventi della lega, con le celle
   di ogni evento allineate (mancante = `is-locked`). Vedi la spec in
   `design_reference/prematch_wide/markup.html`. Foglio da mettere in FOGLI.
   ──────────────────────────────────────────────────────────────────────────── */
.lcw{--lcw-line:rgba(28,66,103,.10);--lcw-ink:#12314f;--lcw-dim:#5b7793;
  --lcw-cell:#eef3f9;--lcw-accent:#f5a623;
  /* 4 colonne fisse (icona/id/ora/evento) + i blocchi mercato + Oth */
  --lcw-grid:24px 42px 56px minmax(150px,1.3fr)
             repeat(3,minmax(44px,1fr)) repeat(3,minmax(44px,1fr))
             repeat(3,minmax(44px,1fr)) repeat(3,minmax(44px,1fr))
             repeat(2,minmax(44px,1fr)) 38px;
  color:var(--lcw-ink);font-size:12.5px}

/* la banda-lega è una card; su schermo stretto scorre in orizzontale */
.lcw-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.lcw-group{min-width:940px;background:#fff;border:1px solid var(--lcw-line);
  border-radius:10px;margin-bottom:12px;box-shadow:0 1px 3px rgba(18,40,66,.06)}

/* header lega: bandiera + nome + «+ Principale» */
.lcw-lh{display:flex;align-items:center;gap:8px;padding:.5rem .7rem;
  background:#dfe9f4;border-radius:10px 10px 0 0;font-weight:800}
.lcw-lh .fl{width:18px;height:13px;border-radius:2px;background:#26456b;flex:0 0 auto}
.lcw-lh .lcw-add{margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  font-size:12px;font-weight:700;color:#1a5da6;background:#fff;border:1px solid var(--lcw-line);
  border-radius:999px;padding:2px 10px;cursor:pointer}
.lcw-lh .lcw-x{color:#c0392b;cursor:pointer;font-weight:800}

/* sotto-tab mercati (Principali/Primo tempo) + pill (Principale/Over-Under/…) */
.lcw-subtabs{display:flex;gap:14px;padding:8px 10px 0}
.lcw-subtab{border:0;background:none;font-weight:800;font-size:13px;color:var(--lcw-dim);
  padding:0 0 8px;border-bottom:2px solid transparent;cursor:pointer}
.lcw-subtab.is-on{color:var(--lcw-ink);border-bottom-color:#1a5da6}
.lcw-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:8px 10px}
.lcw-tab{border:1px solid var(--lcw-line);background:#f4f8fc;border-radius:999px;
  padding:6px 14px;font-weight:700;font-size:12.5px;color:#26557f;cursor:pointer;white-space:nowrap}
.lcw-tab.is-on{background:#12314f;color:#fff;border-color:#12314f}

/* intestazione «Principale» */
.lcw-sech{padding:8px 10px 2px;font-weight:800;color:var(--lcw-ink)}

/* ── righe (griglia condivisa header↔celle) ──────────────────────────────── */
.lcw-thead,.lcw-day,.lcw-row{display:grid;grid-template-columns:var(--lcw-grid);align-items:center}
/* riga1 intestazioni-GRUPPO (nomi mercato, span sulle loro colonne) */
.lcw-gh{display:grid;grid-template-columns:var(--lcw-grid);background:#f4f8fc;
  border-top:1px solid var(--lcw-line);font-size:11px;font-weight:800;color:var(--lcw-dim);text-transform:uppercase}
.lcw-gh>span{padding:5px 0;text-align:center;border-left:1px solid var(--lcw-line)}
.lcw-gh .g-id{grid-column:1/5;border-left:0}         /* copre icona+id+ora+evento */
.lcw-gh .g-1x2{grid-column:5/8}
.lcw-gh .g-dc{grid-column:8/11}
.lcw-gh .g-ou{grid-column:11/14}
.lcw-gh .g-ou2{grid-column:14/17}
.lcw-gh .g-gg{grid-column:17/19}
.lcw-gh .g-oth{grid-column:19/20}
/* riga2 sotto-etichette colonna */
.lcw-thead{background:#eef3f9;font-size:10.5px;font-weight:800;color:var(--lcw-dim);
  border-top:1px solid var(--lcw-line)}
.lcw-thead>span{padding:5px 2px;text-align:center}
.lcw-thead .t-ev{text-align:left;padding-left:8px}

/* separatore GIORNO */
.lcw-day{background:#e7eef6;font-weight:800;color:#28527d;font-size:12px}
.lcw-day>span{grid-column:1/-1;padding:6px 10px}

/* riga EVENTO */
.lcw-row{border-top:1px solid var(--lcw-line);min-height:40px}
.lcw-row:hover{background:#f7fafd}
.lcw-row .c-ico{display:flex;justify-content:center;color:#8aa3bd;cursor:pointer}
.lcw-row .c-id{color:var(--lcw-dim);font-weight:700;text-align:center;font-variant-numeric:tabular-nums}
.lcw-row .c-time{color:var(--lcw-ink);text-align:center;font-variant-numeric:tabular-nums}
.lcw-row .c-ev{padding:4px 8px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lcw-row .c-ev a{color:inherit;text-decoration:none}
.lcw-row .c-ev:hover a{color:#1a5da6}

/* cella quota */
.lcw-q{margin:3px 2px;min-height:30px;display:flex;align-items:center;justify-content:center;
  background:var(--lcw-cell);border:1px solid rgba(28,66,103,.06);border-radius:6px;
  font-weight:800;color:var(--lcw-ink);font-variant-numeric:tabular-nums;cursor:pointer;
  transition:border-color .12s,background .12s,color .12s}
.lcw-q:hover{border-color:var(--lcw-accent);background:#e3ecf6}
/* selezionata nel coupon = SFONDO ORO pieno (Dav 23/07), come lista/dettaglio */
.lcw-q.on{background:#f5b301;border-color:#e0a200;color:#1a1205;box-shadow:inset 0 0 0 1px #d99400}
.lcw-q.is-locked{color:#b6c2d1;cursor:not-allowed;background:#f1f4f8}
.lcw-q.is-hnd{background:transparent;border-color:transparent;color:var(--lcw-dim);font-weight:700;cursor:default}
.lcw-oth{display:flex;justify-content:center}
.lcw-oth a{color:#1a5da6;font-weight:900;text-decoration:none;font-size:15px}

@media (max-width:900px){
  .lcw{font-size:12px}
  .lcw-group{min-width:900px}   /* sotto questa larghezza scorre in orizzontale */
}