/* ══════════════════════════════════════════
   FLS Client – Public CSS (Match List)
══════════════════════════════════════════ */
.flsc-container{font-family:'Segoe UI',system-ui,Arial,sans-serif;max-width:880px;margin:0 auto;color:#222}

/* Toolbar */
.flsc-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:18px}
.flsc-search-input{flex:1;min-width:200px;padding:10px 16px;border-radius:8px;border:1.5px solid #d0d8e8;font-size:.95em;outline:none;background:#f8faff;transition:border-color .2s,box-shadow .2s}
.flsc-search-input:focus{border-color:#1565c0;box-shadow:0 0 0 3px rgba(21,101,192,.1);background:#fff}
.flsc-filter-live{display:flex;align-items:center;gap:6px;font-size:.9em;cursor:pointer;user-select:none;color:#444;padding:8px 14px;border:1.5px solid #d0d8e8;border-radius:8px;background:#f8faff;transition:background .15s}
.flsc-filter-live:hover{background:#eef4ff}
.flsc-filter-live input{width:16px;height:16px;cursor:pointer;accent-color:#d32f2f}

/* Live header */
.flsc-live-header{display:flex;align-items:center;gap:8px;font-size:.88em;color:#555;margin-bottom:14px;padding:8px 14px;background:#fff3f3;border:1px solid #ffd0d0;border-radius:8px}

/* League group */
.flsc-league-group{margin-bottom:20px;border-radius:10px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.07)}
.flsc-league-header{display:flex;align-items:center;gap:8px;background:linear-gradient(90deg,#1565c0,#1976d2);color:#fff;padding:9px 14px;font-weight:700;font-size:.9em}
.flsc-league-icon{font-size:1em}
.flsc-league-name{flex:1}
.flsc-league-count{background:rgba(255,255,255,.2);padding:2px 10px;border-radius:20px;font-size:.78em;font-weight:600}

/* Match rows */
.flsc-match-rows{background:#fff;border:1px solid #e0e8f8;border-top:none;border-radius:0 0 10px 10px}
.flsc-match-row{display:grid;grid-template-columns:1fr 110px 1fr;align-items:center;padding:11px 14px;border-bottom:1px solid #f0f4fb;transition:background .15s}
.flsc-match-row:last-child{border-bottom:none}
.flsc-match-row:hover{background:#f0f6ff}
.flsc-match-row.flsc-match-live{background:#fff5f5}
.flsc-match-row.flsc-match-live:hover{background:#ffe8e8}
.flsc-match-row.flsc-hidden{display:none!important}

/* Teams */
.flsc-team{display:flex;align-items:center;gap:8px}
.flsc-team img{width:30px;height:30px;object-fit:contain;flex-shrink:0}
.flsc-team-name{font-weight:700;font-size:.88em;line-height:1.3}
.flsc-team-home{justify-content:flex-start}
.flsc-team-away{justify-content:flex-end;flex-direction:row-reverse}

/* Center */
.flsc-center{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:0 6px}
.flsc-time-date{display:flex;flex-direction:column;align-items:center;gap:1px}
.flsc-kickoff{font-size:1.05em;font-weight:800;color:#1565c0}
.flsc-date{font-size:.7em;color:#999}
.flsc-score{font-size:1.35em;font-weight:900;color:#c62828;letter-spacing:.06em}
.flsc-vs{font-size:.8em;color:#bbb;font-weight:700}

/* Live badge */
.flsc-live-badge{display:inline-flex;align-items:center;gap:4px;background:#d32f2f;color:#fff;font-size:.68em;font-weight:700;padding:2px 8px;border-radius:20px;letter-spacing:.04em;white-space:nowrap;animation:flscPulse 1.5s infinite}
@keyframes flscPulse{0%,100%{opacity:1}50%{opacity:.55}}

/* Watch button */
.flsc-watch-btn{display:inline-flex;align-items:center;gap:4px;background:#1565c0;color:#fff;padding:5px 12px;border-radius:6px;font-size:.78em;font-weight:700;text-decoration:none;white-space:nowrap;transition:background .2s,transform .1s}
.flsc-watch-btn:hover{background:#0d47a1;color:#fff;transform:scale(1.03)}
.flsc-match-live .flsc-watch-btn{background:#c62828}
.flsc-match-live .flsc-watch-btn:hover{background:#b71c1c}

/* Footer */
.flsc-footer-note{text-align:center;font-size:.75em;color:#bbb;margin-top:12px;padding:6px 0}
.flsc-empty{text-align:center;color:#aaa;padding:30px;font-size:1em}

/* Responsive */
@media(max-width:580px){
    .flsc-match-row{grid-template-columns:1fr 90px 1fr;padding:9px 10px}
    .flsc-team-name{font-size:.78em}
    .flsc-team img{width:24px;height:24px}
    .flsc-center{padding:0 4px}
    .flsc-watch-btn{padding:5px 8px;font-size:.72em}
}
@media(max-width:400px){
    .flsc-match-row{grid-template-columns:1fr 80px 1fr;padding:8px}
    .flsc-team-name{font-size:.72em}
    .flsc-team img{display:none}
}