/* ───────────────────────────────────────────────────────────────
   Cricket Live Scores – plugin stylesheet
   File: wp-content/plugins/cricket-live-scores/css/live-scores.css
   ─────────────────────────────────────────────────────────────── */

/* ---------- Layout ---------- */
.cls-wrapper{
    display:grid;
    gap:1.25rem;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    margin:1rem 0;
}

.cls-match{
    background:#ffffff;
    border:1px solid #e5e7eb;            /* gray‑200 */
    border-radius:.75rem;
    box-shadow:0 1px 3px rgba(0,0,0,.06);
    padding:1rem 1.25rem;
    transition:transform .15s ease,box-shadow .15s ease;
}
.cls-match:hover{
    transform:translateY(-2px);
    box-shadow:0 4px 8px rgba(0,0,0,.08);
}

/* ---------- Title with logos ---------- */
.cls-title{
    font-size:1.1rem;
    font-weight:600;
    margin:0 0 .35rem;
    line-height:1.3;
}
.cls-vs{
    font-weight:400;
    margin:0 .35rem;
}
.cls-logo{
    width:24px;
    height:24px;
    object-fit:contain;
    vertical-align:middle;
    margin-right:.25rem;
    border-radius:50%;
    box-shadow:0 0 2px rgba(0,0,0,.12);
}

/* ---------- Status badge ---------- */
.cls-status{
    font-size:.95rem;
    font-weight:500;
    margin:0 0 .75rem;
    color:#16a34a;                       /* emerald‑600 (win/finished) */
    position:relative;
    padding-left:1.1rem;
}
.cls-status:before{
    content:"";
    position:absolute;
    left:0;
    top:.4em;
    width:.65rem;
    height:.65rem;
    border-radius:50%;
    background:#16a34a;
}

/* live, draw/no‑result variants */
.cls-status.live   {color:#dc2626;}       /* red */
.cls-status.draw   {color:#d97706;}       /* orange */
.cls-status.live:before {background:#dc2626;animation:pulse 1.5s infinite;}
.cls-status.draw:before {background:#d97706;}

/* subtle pulsing animation for live matches */
@keyframes pulse{
    0%   {transform:scale(.85);opacity:.85;}
    50%  {transform:scale(1);opacity:1;}
    100% {transform:scale(.85);opacity:.85;}
}

/* ---------- Score list ---------- */
.cls-score{
    list-style:none;
    margin:0;
    padding-left:0;
    font-family:monospace;
}
.cls-score li{
    padding:.25rem 0;
}

/* ---------- Dark‑mode tweaks ---------- */
@media(prefers-color-scheme: dark){
    .cls-match{background:#1f2937;border-color:#374151;}
    .cls-title{color:#f9fafb;}
    .cls-status{color:#4ade80;}          /* green‑400 for finished */
    .cls-status:before{opacity:.9;}
}