/* ============================================================================
 * autocontent.css — CSS DỰ PHÒNG tổng hợp cho MỌI khối HTML do AutoContent sinh
 * ----------------------------------------------------------------------------
 * Edge nhúng nội dung bài tự động (bóng đá, live-blog, ghi chú AI) dưới dạng
 * HTML "dual-layer": mỗi phần tử có class + inline-style (hoặc <style> nhúng) nên
 * TỰ hiển thị đúng KHÔNG cần file này. Thêm file này vào Frontend để PHỤC HỒI
 * giao diện khi editor/sanitizer LỘT `style` inline hoặc lọc thẻ <style>/<script>.
 *
 * Cơ chế: inline-style luôn thắng stylesheet ngoài → khi inline còn, các luật dưới
 * bị ghi đè (vô hại); khi inline/<style> bị lột, các luật dưới tái tạo giao diện.
 *
 * Nhóm class (nguồn markup trong src/Services/OneCMS.OneEdge.AutoContent):
 *   1. Live-blog + scoreboard  → FootballNarrative.cs (c-list-live2*, sc-live-*)
 *   2. Ghi chú AI              → AutoContentSettings.AiDisclosureHtml (sc-ai-*)
 *   3. Khối trực quan bóng đá  → FootballVisuals.cs (sc-fb-*)
 *
 * KHÔNG bao gồm `sc-longform-header*` (block-sc-*) — đó là template longform của
 * Frontend, site tự style; Edge chỉ ghi nội dung vào các thẻ đó.
 *
 * ⚠️ Giá trị ĐỘNG không phục hồi được (không có trong CSS): vị trí cầu thủ trên
 * sân + độ dài % các thanh (thống kê/dự đoán/đối đầu). Khi inline bị lột → degrade
 * đọc được (cầu thủ xếp dòng, thanh về mốc mặc định); số liệu chữ vẫn đúng.
 * ==========================================================================*/

:root{
  --scfb-home:#2f74bf; --scfb-away:#e06a17;
  --scfb-win:#2fa869;  --scfb-draw:#c9a53a; --scfb-loss:#d75151;
  --scfb-ink:#1a1d18;  --scfb-muted:#667085; --scfb-faint:#8b93aa;
  --scfb-line:#e6e8e3; --scfb-soft:#eef0ec;  --scfb-pitch:#1f7a4d; --scfb-stripe:#1c7147;
  --scfb-live:#d0021b;
}

/* ============================================================================
 * 0. GHI ĐÈ INLINE CŨ — full-width các box (NGOẠI LỆ cố ý phá luật "inline thắng")
 * ----------------------------------------------------------------------------
 * Code đã bỏ max-width khỏi các box sc-fb-* (đồng bộ full-width). Nhưng bài
 * DailyFootball ĐÃ ĐĂNG còn nướng inline `max-width:520/560/460px` trong Content;
 * inline thường thắng stylesheet ngoài nên bài cũ vẫn bị bó hẹp. `!important` ở
 * external ĐÈ được inline THƯỜNG (inline sinh ra KHÔNG có !important) → ép bài cũ
 * về full-width mà KHÔNG cần migrate DB / re-render (rerender không đụng H2H, BXH,
 * phong độ, dự đoán). Bài MỚI không còn inline max-width → luật này vô hại/dư.
 * Gồm cả .sc-fb-pitch (sân dọc sẽ cao theo aspect-ratio 68/100 khi full-width).
 * CÓ THỂ GỠ khi bài cũ đã hết vòng đời hoặc được rerender/migrate lại.
 * ==========================================================================*/
.sc-fb-card,
.sc-fb-form,
.sc-fb-players,
.sc-fb-pitch{ max-width:none !important; }

/* ============================================================================
 * 1. LIVE-BLOG + SCOREBOARD (bài DailyFootball đang đá / chung cuộc)
 *    Class đổi c-list-live → c-list-live2, onecms__live → onecms__live2 để KHÔNG
 *    đụng component live sẵn có của trang. Bình thường Edge nhúng cùng nội dung
 *    này trong 1 thẻ <style> trong bài; file này là bản dự phòng nếu bị lọc.
 * ==========================================================================*/
.c-list-live2{ margin:8px 0 24px; }
.c-list-live2 .onecms__live2{ list-style:none; margin:0; padding:0; }
.c-list-live2 .onecms__live2 > li{
  position:relative; padding:0 0 16px 20px; border-left:2px solid #e3e8ef; margin-left:6px;
}
.c-list-live2 .onecms__live2 > li:last-child{ border-left-color:transparent; padding-bottom:0; }
.c-list-live2 .onecms__live2 > li::before{
  content:''; position:absolute; left:-7px; top:4px; width:12px; height:12px;
  border-radius:50%; background:#fff; border:3px solid var(--scfb-live);
}
.c-list-live2__head{ display:flex; align-items:baseline; gap:8px; margin-bottom:4px; }
.c-list-live2__time{ font-weight:700; color:var(--scfb-live); font-size:13px; min-width:42px; flex-shrink:0; }
.c-list-live2__title{ font-weight:700; font-size:15px; color:#1a1a1a; }
.c-list-live2__content{ font-size:14px; color:#333; }
.c-list-live2__content p{ margin:0; }

/* Scoreboard (tên 2 đội + tỷ số + nhãn trạng thái) */
.c-list-live2__scoreboard{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:6px 14px;
  max-width:520px; margin:0 auto 16px; padding:14px 18px; text-align:center; line-height:1.3;
}
.c-list-live2__scoreboard-team{ flex:1; min-width:90px; font-size:18px; font-weight:700; color:#1a1a1a; }
.c-list-live2__scoreboard-team.is-home{ text-align:right; }
.c-list-live2__scoreboard-team.is-away{ text-align:left; }
.c-list-live2__scoreboard-score{ font-size:26px; font-weight:800; color:var(--scfb-live); padding:0 6px; white-space:nowrap; }
.c-list-live2__scoreboard-pen{ font-size:13px; font-weight:600; color:var(--scfb-muted); white-space:nowrap; }
.c-list-live2__scoreboard-status{ flex-basis:100%; font-size:13px; font-weight:600; }

/* Chấm "LIVE" + nhãn TRỰC TIẾP nhúng trong <h1> (badge) và scoreboard */
.sc-live-dot{
  display:inline-block; width:9px; height:9px; border-radius:50%; background:currentColor;
  vertical-align:middle; position:relative; margin-right:6px;
}
.sc-live-dot::after{
  content:''; position:absolute; left:0; top:0; width:100%; height:100%; border-radius:50%;
  background:currentColor; animation:sc-live-ping 1.4s cubic-bezier(0,0,.2,1) infinite;
}
@keyframes sc-live-ping{ 0%{ transform:scale(1); opacity:.55; } 80%,100%{ transform:scale(2.6); opacity:0; } }
@media (prefers-reduced-motion:reduce){ .sc-live-dot::after{ display:none; } }
.sc-live-badge{
  display:inline-block; background:var(--scfb-live); color:#fff; font-size:0.5em; font-weight:700;
  line-height:1.4; vertical-align:middle; padding:1px 8px 1px 9px; border-radius:3px;
  margin-right:8px; letter-spacing:0.4px;
}

/* ============================================================================
 * 2. GHI CHÚ AI (chèn cuối MỌI bài AutoContent — AutoContentSettings.AiDisclosureHtml)
 * ==========================================================================*/
.sc-ai-disclosure{ margin:16px 0 4px; }
.sc-ai-disclosure p{ margin:0; color:#999; font-size:12px; padding-left:1em; text-indent:-1em; }
.sc-ai-disclosure i, .sc-ai-disclosure em{ font-style:italic; }
.sc-ai-disclosure .sc-ai-star{ display:inline-block; vertical-align:-0.15em; }

/* ============================================================================
 * 3. KHỐI TRỰC QUAN BÓNG ĐÁ (FootballVisuals.cs — sc-fb-*)
 * ==========================================================================*/

/* -------- Thẻ khung + tiêu đề -------- */
.sc-fb-card{
  margin:18px auto; background:#fff; border:1px solid var(--scfb-line);
  border-radius:14px; overflow:hidden; box-shadow:0 1px 3px rgba(20,30,15,.06);
  font-size:14px; line-height:1.5;
}
.sc-fb-card__title{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:13px 16px; border-bottom:1px solid var(--scfb-soft);
  font-weight:800; font-size:15px; color:var(--scfb-ink);
}
.sc-fb-card__sub{ font-weight:600; font-size:12px; color:var(--scfb-muted); }

/* -------- Ô kết quả T/H/B dùng chung -------- */
.sc-fb-wdl{
  display:inline-flex; align-items:center; justify-content:center;
  width:18px; height:18px; border-radius:4px; color:#fff; font-size:10px; font-weight:800;
}
.sc-fb-wdl--w{ background:var(--scfb-win); }
.sc-fb-wdl--d{ background:var(--scfb-draw); }
.sc-fb-wdl--l{ background:var(--scfb-loss); }
.sc-fb-wdl--n{ background:var(--scfb-faint); }
.sc-fb-wdl-strip{ display:inline-flex; gap:4px; }
.sc-fb-dot{ width:11px; height:11px; border-radius:50%; display:inline-block; }

/* -------- 3a. Đội hình — sơ đồ sân -------- */
.sc-fb-lineup__legend{
  display:flex; justify-content:space-between; align-items:flex-start; gap:10px;
  padding:14px 16px; border-bottom:1px solid var(--scfb-soft); font-size:13px; line-height:1.35;
}
.sc-fb-lineup__team.is-away{ text-align:right; }
.sc-fb-lineup__pitchwrap{ padding:12px; }
.sc-fb-pitch{
  position:relative; width:100%; margin:0 auto; aspect-ratio:68/100;
  border:2px solid rgba(255,255,255,.5); border-radius:8px; overflow:hidden;
  background-color:var(--scfb-pitch);
  background-image:repeating-linear-gradient(180deg,var(--scfb-pitch) 0,var(--scfb-pitch) 10%,var(--scfb-stripe) 10%,var(--scfb-stripe) 20%);
}
/* Fallback khi toạ độ tuyệt đối bị lột: cầu thủ xếp dòng, không đè lên nhau.
   Inline `position:absolute;left;top` (khi còn) ghi đè `position:static` này. */
.sc-fb-pitch__player{
  position:static; display:inline-block; width:66px; text-align:center; vertical-align:top; margin:3px;
}
.sc-fb-pitch__num{
  width:31px; height:31px; line-height:31px; margin:0 auto; border-radius:50%;
  color:#fff; font-weight:800; font-size:13px; border:2px solid rgba(255,255,255,.9);
  box-shadow:0 2px 4px rgba(0,0,0,.35);
}
.sc-fb-pitch__player--home .sc-fb-pitch__num{ background:var(--scfb-home); }
.sc-fb-pitch__player--away .sc-fb-pitch__num{ background:var(--scfb-away); }
.sc-fb-pitch__name{
  margin-top:2px; font-size:10px; font-weight:700; color:#fff; line-height:1.05;
  text-shadow:0 1px 2px rgba(0,0,0,.9);
}
.sc-fb-lineup__note{ padding:0 16px 12px; font-size:12px; color:var(--scfb-faint); font-style:italic; }
.sc-fb-subs{ border-top:1px solid var(--scfb-soft); padding:12px 16px; }
.sc-fb-subs__head{
  font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--scfb-faint); margin-bottom:8px;
}
.sc-fb-subs__col{ flex:1; min-width:180px; }
.sc-fb-subs__team{ font-size:12px; font-weight:700; margin-bottom:5px; }
.sc-fb-subs__list{ font-size:12px; color:#4a5245; line-height:1.7; }
.sc-fb-subs__item{ display:inline-block; margin-right:10px; }

/* -------- 3b. Thống kê trận -------- */
.sc-fb-stats{ padding:16px 18px; }
.sc-fb-stats__head{
  display:flex; justify-content:space-between; align-items:center; margin-bottom:14px;
  font-weight:800; font-size:14px;
}
.sc-fb-stats__row{ display:flex; align-items:center; gap:8px; margin:11px 0; }
.sc-fb-stats__num{ width:40px; font-weight:800; font-size:14px; color:var(--scfb-ink); }
.sc-fb-stats__num--home{ text-align:right; }
.sc-fb-stats__track{ flex:1; height:7px; background:var(--scfb-soft); border-radius:4px; }
.sc-fb-stats__num--home + .sc-fb-stats__track{ display:flex; justify-content:flex-end; }
.sc-fb-stats__fill{ width:50%; border-radius:4px; height:100%; }
.sc-fb-stats__fill--home{ background:var(--scfb-home); }
.sc-fb-stats__fill--away{ background:var(--scfb-away); }
.sc-fb-stats__label{ width:110px; text-align:center; font-size:11.5px; color:var(--scfb-muted); }

/* -------- 3c. Bảng xếp hạng -------- */
.sc-fb-standings__table{ width:100%; border-collapse:collapse; font-size:13px; min-width:460px; }
.sc-fb-standings__table thead tr{
  color:var(--scfb-faint); font-size:11px; text-transform:uppercase; letter-spacing:.04em;
}
.sc-fb-standings__table th{ padding:8px 6px; font-weight:700; }
.sc-fb-standings__table td{ padding:10px 6px; }
.sc-fb-standings__row{ border-top:1px solid #f0f2ee; }
.sc-fb-standings__row.is-home{ background:#f4f8fc; }
.sc-fb-standings__row.is-away{ background:#fdf5ee; }
.sc-fb-standings__row.is-home td:first-child{ border-left:3px solid var(--scfb-home); }
.sc-fb-standings__row.is-away td:first-child{ border-left:3px solid var(--scfb-away); }
.sc-fb-standings__row.is-qual td:first-child{ border-left:3px solid var(--scfb-win); }
.sc-fb-standings__row.is-third td:first-child{ border-left:3px solid var(--scfb-draw); }
.sc-fb-standings__row.is-playoff td:first-child{ border-left:3px solid var(--scfb-draw); }  /* C1/C2/C3: hạng 9-24 play-off */
.sc-fb-standings__row.is-out td:first-child{ border-left:3px solid var(--scfb-loss); }      /* C1/C2/C3: hạng 25-36 bị loại */
.sc-fb-standings__gap td{ text-align:center; padding:6px; color:var(--scfb-faint); font-weight:700; letter-spacing:2px; }
.sc-fb-standings__legend{
  padding:9px 16px; border-top:1px solid var(--scfb-soft); font-size:11.5px;
  color:var(--scfb-faint); display:flex; gap:16px; flex-wrap:wrap;
}

/* -------- 3d. Lịch sử đối đầu (H2H) -------- */
.sc-fb-h2h__summary{ padding:16px; border-bottom:1px solid var(--scfb-soft); }
.sc-fb-h2h__bar{ display:flex; height:9px; border-radius:5px; overflow:hidden; }
.sc-fb-h2h__bar-h{ width:34%; background:var(--scfb-home); }
.sc-fb-h2h__bar-d{ width:33%; background:#c8cdbf; }
.sc-fb-h2h__bar-a{ width:33%; background:var(--scfb-away); }
.sc-fb-h2h__list{ font-size:13px; }
.sc-fb-h2h__row{ display:flex; align-items:center; gap:10px; padding:11px 16px; border-bottom:1px solid #f4f5f1; }
.sc-fb-h2h__row:last-child{ border-bottom:none; }
.sc-fb-h2h__date{ width:74px; flex:none; color:var(--scfb-faint); font-size:11px; line-height:1.3; }
.sc-fb-h2h__team{ flex:1; font-weight:600; color:var(--scfb-ink); }
.sc-fb-h2h__team:first-of-type{ text-align:right; }
.sc-fb-h2h__score{
  flex:none; font-weight:800; color:var(--scfb-ink); background:var(--scfb-soft);
  border-radius:6px; padding:3px 9px; white-space:nowrap;
}
.sc-fb-h2h__tag{ width:52px; flex:none; text-align:right; }

/* -------- 3e. Phong độ & chỉ số đội -------- */
.sc-fb-form{ margin:18px auto; display:flex; gap:14px; flex-wrap:wrap; }
.sc-fb-form__card{
  flex:1; min-width:230px; background:#fff; border:1px solid var(--scfb-line);
  border-radius:14px; padding:16px; box-shadow:0 1px 3px rgba(20,30,15,.06);
}
.sc-fb-form__card.is-home{ border-top:3px solid var(--scfb-home); }
.sc-fb-form__card.is-away{ border-top:3px solid var(--scfb-away); }
.sc-fb-form__name{ font-weight:800; font-size:15px; color:var(--scfb-ink); margin-bottom:12px; }
.sc-fb-form__label{
  font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--scfb-faint); margin-bottom:6px;
}
.sc-fb-form__streak{ margin-bottom:14px; }
.sc-fb-form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px 8px; }
.sc-fb-form__stat-num{ font-size:20px; font-weight:800; color:var(--scfb-ink); }
.sc-fb-form__stat-cap{ font-size:11px; color:var(--scfb-faint); }

/* -------- 3f. Dự đoán & tỷ lệ -------- */
.sc-fb-pred{ padding:18px; }
.sc-fb-pred__head{ display:flex; justify-content:space-between; font-size:12px; font-weight:700; margin-bottom:8px; }
.sc-fb-pred__bar{
  display:flex; height:26px; border-radius:7px; overflow:hidden;
  font-size:11px; font-weight:800; color:#fff; text-align:center; line-height:26px;
}
.sc-fb-pred__seg{ width:33%; }
.sc-fb-pred__seg--home{ background:var(--scfb-home); }
.sc-fb-pred__seg--draw{ background:#b8bdb0; }
.sc-fb-pred__seg--away{ background:var(--scfb-away); }
.sc-fb-pred__advice{
  margin-top:14px; padding:11px 13px; background:#f4f8fc; border-radius:9px;
  font-size:13px; color:#33465a;
}

/* -------- 3g. Cầu thủ nổi bật -------- */
.sc-fb-players{ margin:18px auto; }
.sc-fb-players > div{ display:flex; gap:12px; flex-wrap:wrap; }
.sc-fb-players__card{
  flex:1; min-width:150px; background:#fff; border:1px solid var(--scfb-line);
  border-radius:14px; padding:14px; text-align:center; box-shadow:0 1px 3px rgba(20,30,15,.06);
}
.sc-fb-players__ava{
  width:52px; height:52px; border-radius:50%; object-fit:cover;
  margin:0 auto 8px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:800; font-size:18px;
}
.sc-fb-players__name{ font-weight:700; font-size:14px; color:var(--scfb-ink); }
.sc-fb-players__team{ font-size:11px; color:var(--scfb-faint); margin-bottom:8px; }
.sc-fb-players__stat{ font-size:12px; color:#33465a; font-weight:600; }

/* -------- 3h. Lực lượng -------- */
.sc-fb-inj{ display:flex; gap:20px; flex-wrap:wrap; padding:14px 16px; }
.sc-fb-inj__col{ flex:1; min-width:200px; }
.sc-fb-inj__name{ font-size:12px; font-weight:700; margin-bottom:6px; }
.sc-fb-inj__item{ font-size:12.5px; color:#4a5245; padding:3px 0; }