/* League One Match Centre preview v3: subdued pre-match season averages + form + xG. */

.l1mc-match-row .l1mc-row-prematch{
  color:#8f96b2;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  flex-wrap:wrap;
}
.l1mc-match-row .l1mc-row-prematch-label{
  color:#aab1ca;
  font-weight:800;
  margin-right:1px;
}
.l1mc-prematch-metric{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:2px 5px;
  border-radius:5px;
  background:rgba(255,255,255,.025);
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.l1mc-prematch-metric-icon{
  font-size:10px;
  line-height:1;
}
.l1mc-prematch-metric-pair{
  color:#b7bdd2;
  font-weight:750;
}
.l1mc-prematch-metric-total{
  color:#858eab;
  font-weight:700;
}
.l1mc-match-row .l1mc-row-xg{
  margin-top:-1px;
  color:#7f89a8;
  font-weight:600;
}
.l1mc-match-row .l1mc-row-xg-label{
  color:#a0aac8;
  font-weight:800;
}
.l1mc-match-row:hover .l1mc-row-prematch,
.l1mc-match-row:focus-visible .l1mc-row-prematch,
.l1mc-match-row:hover .l1mc-row-xg,
.l1mc-match-row:focus-visible .l1mc-row-xg{
  color:#c6cbe0;
}
.l1mc-match-row:hover .l1mc-row-prematch-label,
.l1mc-match-row:focus-visible .l1mc-row-prematch-label,
.l1mc-match-row:hover .l1mc-row-xg-label,
.l1mc-match-row:focus-visible .l1mc-row-xg-label{
  color:#e2e5f1;
}
.l1mc-match-row:hover .l1mc-prematch-metric,
.l1mc-match-row:focus-visible .l1mc-prematch-metric{
  background:rgba(255,255,255,.045);
}

/* Upcoming fixtures keep the primary team/time line uncluttered. The current
   Last-6 sits directly beneath each club name using the same W/D/L language as
   the league table. */
.l1mc-row-side{
  display:flex;
  min-width:0;
  flex-direction:column;
  justify-content:center;
}
.l1mc-row-side-home{align-items:flex-end;}
.l1mc-row-side-away{align-items:flex-start;}
.l1mc-row-teamline{
  display:flex;
  align-items:baseline;
  gap:5px;
  min-width:0;
}
.l1mc-row-teamline-home{justify-content:flex-end;}
.l1mc-row-teamline-away{justify-content:flex-start;}
.l1mc-row-position{
  flex:0 0 auto;
  color:#aeb6d1;
  font-size:9px;
  font-weight:800;
  letter-spacing:.01em;
  opacity:.9;
}
.l1mc-match-row:hover .l1mc-row-position,
.l1mc-match-row:focus-visible .l1mc-row-position{
  color:#e0e5f4;
  opacity:1;
}
.l1mc-prematch-form{
  display:flex!important;
  align-items:center;
  gap:3px;
  margin-top:4px;
  min-height:8px;
  opacity:1;
}
.l1mc-prematch-form-dot{
  display:block!important;
  flex:0 0 auto;
  width:8px;
  height:6px;
  border-radius:2px;
  background:#6b718d;
  border:1px solid rgba(255,255,255,.13);
  box-sizing:border-box;
  box-shadow:0 1px 2px rgba(0,0,0,.18);
}
.l1mc-prematch-form-dot.w{background:#42c99a;}
.l1mc-prematch-form-dot.d{background:#e5b94f;}
.l1mc-prematch-form-dot.l{background:#df7184;}
.l1mc-match-row:hover .l1mc-prematch-form-dot,
.l1mc-match-row:focus-visible .l1mc-prematch-form-dot{filter:brightness(1.08);}

@media (max-width:700px){
  /* On narrow screens the season-average metrics become a fixed visual grid.
     Three common metrics stay on one row; when a red-card metric is relevant,
     four metrics become a balanced 2x2 grid instead of squeezing across. */
  .l1mc-match-row{
    gap:6px 4px;
    padding:10px 7px;
  }
  .l1mc-row-team{
    font-size:12px;
    line-height:1.2;
  }
  .l1mc-row-centre{
    font-size:12px;
  }
  .l1mc-row-teamline{gap:4px;}
  .l1mc-row-position{
    font-size:9.5px;
    color:#c0c7dc;
  }
  .l1mc-prematch-form{
    gap:2.5px;
    margin-top:4px;
    min-height:8px;
  }
  .l1mc-prematch-form-dot{
    width:8px;
    height:6px;
    border-radius:1.5px;
  }
  .l1mc-match-row .l1mc-row-prematch{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:5px;
    width:100%;
    margin-top:2px;
    padding:0 1px;
    white-space:normal;
  }
  .l1mc-match-row .l1mc-row-prematch.l1mc-prematch-has-red{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .l1mc-row-prematch-label{
    display:none;
  }
  .l1mc-prematch-metric{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    grid-template-rows:auto auto;
    align-items:center;
    justify-items:center;
    column-gap:3px;
    row-gap:1px;
    min-width:0;
    padding:4px 3px 3px;
    border-radius:6px;
    background:rgba(255,255,255,.03);
  }
  .l1mc-prematch-metric-icon{
    grid-row:1/3;
    align-self:center;
    font-size:12px;
  }
  .l1mc-prematch-metric-pair{
    font-size:10.5px;
    line-height:1.08;
    color:#c1c6d9;
  }
  .l1mc-prematch-metric-total{
    font-size:9.2px;
    line-height:1.05;
    color:#939bb9;
  }
  .l1mc-match-row .l1mc-row-xg{
    font-size:10.2px;
    line-height:1.3;
    margin-top:1px;
    padding:0 2px;
    white-space:normal;
    color:#aab3cf;
  }
  .l1mc-row-xg-label{
    color:#c0c8df;
  }
}