
/*
 SPORTS INTEL MOBILE APP UI V8
 Single-card mobile match UI: score + AI + odds + movement + analysis.
*/
@media(max-width:720px){

:root{
 --si8-bg:#020a11;
 --si8-panel:#07131e;
 --si8-panel2:#0a1926;
 --si8-line:#18364d;
 --si8-text:#f4f8fb;
 --si8-muted:#7c93a6;
 --si8-blue:#1688ff;
 --si8-green:#37dd89;
 --si8-red:#ff414d;
 --si8-amber:#efba4f;
}

/* V8 owns mobile match rendering */
.si7-match-card{display:none!important}
.si8-match-card{display:block!important}

/* hard-hide legacy card even if old CSS has !important */
.match-row,
.multisport-row{
 display:none!important;
}

/* ---------- card ---------- */
.si8-match-card{
 width:100%;
 margin:0 0 10px;
 overflow:hidden;
 border:1px solid #18384f;
 border-radius:15px;
 background:linear-gradient(145deg,#081925,#05121b);
 color:var(--si8-text);
 box-shadow:none;
}
.si8-match-card.live{border-color:#1e6e54}
.si8-match-card.live:before{
 content:"";
 position:absolute;left:0;top:0;bottom:0;width:3px;
 background:var(--si8-red);
}
.si8-match-card{position:relative}

.si8-head{
 height:30px;
 padding:7px 10px 0;
 display:flex;align-items:flex-start;justify-content:space-between;gap:8px;
}
.si8-head-left{
 min-width:0;
 display:flex;align-items:center;gap:6px;
}
.si8-live{
 padding:3px 6px;
 border-radius:5px;
 background:var(--si8-red);
 color:#fff;
 font-size:8px;font-weight:950;line-height:1;
}
.si8-meta{
 min-width:0;
 color:#8197a9;
 font-size:8px;font-weight:850;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.si8-state{
 flex:0 0 auto;
 color:#ff626c;
 font-size:9px;font-weight:950;
}
.si8-time{
 flex:0 0 auto;
 color:#a7b8c4;
 font-size:9px;font-weight:900;
}

/* ---------- HOME | SCORE | AWAY ---------- */
.si8-main{
 min-height:72px;
 padding:2px 10px 8px;
 display:grid;
 grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr);
 align-items:center;
 gap:5px;
}
.si8-team{
 min-width:0;
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 gap:4px;text-align:center;
}
.si8-team img{
 width:36px;height:36px;object-fit:contain;
 filter:drop-shadow(0 3px 7px rgba(0,0,0,.25));
}
.si8-team b{
 width:100%;
 color:#f1f6fa;
 font-size:10px;line-height:1.12;font-weight:900;
 white-space:normal;overflow-wrap:anywhere;
}
.si8-score{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 text-align:center;
}
.si8-score strong{
 color:#fff;
 font-size:26px;line-height:1;font-weight:950;letter-spacing:-1px;
 white-space:nowrap;
}
.si8-score small{
 margin-top:5px;
 color:#758da0;
 font-size:7px;font-weight:850;
}
.si8-match-card.live .si8-score small{color:#ff626d}

/* ---------- AI strip ---------- */
.si8-ai{
 min-height:37px;
 margin:0 10px;
 padding:7px 8px;
 display:grid;
 grid-template-columns:minmax(0,1fr) auto auto;
 gap:8px;
 align-items:center;
 border-top:1px solid #163149;
 border-bottom:1px solid #163149;
}
.si8-probs{
 min-width:0;
 display:flex;align-items:center;gap:6px;
 color:#7891a4;font-size:8px;font-weight:850;
}
.si8-probs .home{color:#42df99}
.si8-probs .draw{color:#d2b45e}
.si8-probs .away{color:#5db4ff}
.si8-pick,.si8-conf{text-align:center}
.si8-pick small,.si8-conf small{
 display:block;color:#6f889a;font-size:6px;font-weight:850;
}
.si8-pick b{
 display:block;margin-top:2px;color:#47a9ff;font-size:10px;font-weight:950;
}
.si8-conf b{
 display:block;margin-top:2px;color:#37dd89;font-size:11px;font-weight:950;
}

/* ---------- odds + movement ---------- */
.si8-market{
 padding:8px 10px 9px;
}
.si8-market-title{
 margin-bottom:5px;
 display:flex;align-items:center;justify-content:space-between;gap:8px;
}
.si8-market-title span{
 color:#7c94a6;font-size:7px;font-weight:900;
}
.si8-move{
 padding:3px 6px;
 border-radius:6px;
 background:#0a1d2a;
 color:#9eb0bd;
 font-size:7px;font-weight:900;
}
.si8-move.down{color:#43df91;background:rgba(55,221,137,.08)}
.si8-move.up{color:#ff737c;background:rgba(255,65,77,.08)}
.si8-odds{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:5px;
}
.si8-odd{
 min-width:0;
 height:34px;
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 border:1px solid #17384f;
 border-radius:9px;
 background:#081824;
}
.si8-odd small{color:#718a9d;font-size:6px;font-weight:850}
.si8-odd b{margin-top:2px;color:#eef5fa;font-size:10px;font-weight:950}
.si8-odd.disabled{opacity:.35}

.si8-actions{
 margin-top:7px;
 display:grid;
 grid-template-columns:minmax(0,1fr) auto;
 gap:7px;
 align-items:center;
}
.si8-edge{
 min-width:0;
 color:#758da0;
 font-size:7px;font-weight:850;
}
.si8-edge b{color:#37dd89;font-size:9px}
.si8-analysis{
 height:32px;
 min-width:78px;
 padding:0 12px;
 display:flex;align-items:center;justify-content:center;
 border-radius:9px;
 background:linear-gradient(145deg,#0f8bff,#1688ff);
 color:#fff;
 text-decoration:none;
 font-size:9px;font-weight:950;
 box-shadow:0 5px 14px rgba(22,136,255,.16);
}

/* ---------- tighter feed ---------- */
.schedule-zone,.country-zone{
 margin-left:12px!important;
 margin-right:12px!important;
 width:calc(100% - 24px)!important;
}
.time-cell{min-height:30px!important;padding:5px 2px!important}

/* ---------- detail page polish ---------- */
.si7-detail-hero{
 margin-bottom:10px!important;
}
.probability-card,
.sport-analysis-card,
.detail-page .panel2{
 border-color:#18384f!important;
 background:linear-gradient(145deg,#081824,#06121b)!important;
}
.si-match-tabs button.active{
 background:var(--si8-blue)!important;
}

/* narrow screens */
@media(max-width:390px){
 .si8-main{
   grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr);
   gap:3px;
 }
 .si8-score strong{font-size:22px}
 .si8-team img{width:31px;height:31px}
 .si8-team b{font-size:9px}
 .si8-ai{gap:5px;padding-left:6px;padding-right:6px}
 .si8-probs{gap:4px;font-size:7px}
}
}
@media(min-width:721px){
 .si8-match-card{display:none!important}
}
