:root {
  --bdd-navy: #071827;
  --bdd-navy-2: #10283b;
  --bdd-green: #18d875;
  --bdd-red: #ff3d4f;
  --bdd-yellow: #ffc857;
  --bdd-text: #17212b;
  --bdd-muted: #6f7c88;
  --bdd-line: #e6ebef;
  --bdd-bg: #f4f7f9;
  --bdd-radius: 14px;
}

.bdd-site-shell { width: min(1440px, calc(100% - 32px)); margin: 28px auto; }
.bdd-data-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr) 310px; gap: 20px; align-items: start; }
.bdd-layout-left, .bdd-layout-right { position: sticky; top: 88px; }
.bdd-layout-main { min-width: 0; }
.bdd-widget-title { display: flex; align-items: center; gap: 9px; padding: 16px 17px; color: #fff; background: var(--bdd-navy); font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: .2px; }
.bdd-title-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--bdd-green); box-shadow: 0 0 0 4px rgba(24,216,117,.16); }
.bdd-left-leagues, .bdd-standings-widget, .bdd-article-sidebar { overflow: hidden; background: #fff; border: 1px solid var(--bdd-line); border-radius: var(--bdd-radius); box-shadow: 0 7px 26px rgba(12,35,52,.06); }
.bdd-league-links a { display: flex; align-items: center; gap: 11px; padding: 12px 14px; color: var(--bdd-text); text-decoration: none; border-bottom: 1px solid var(--bdd-line); transition: .18s ease; }
.bdd-league-links a:last-child { border-bottom: 0; }
.bdd-league-links a:hover { color: #071827; background: #edfff5; padding-left: 18px; }
.bdd-league-links a > span:last-child { display: flex; min-width: 0; flex-direction: column; line-height: 1.25; }
.bdd-league-links strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.bdd-league-links small { margin-top: 3px; color: var(--bdd-muted); font-size: 12px; }
.bdd-league-monogram { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #fff; background: linear-gradient(135deg, var(--bdd-navy-2), #1c4f68); font-size: 11px; font-weight: 900; }

.bdd-tab-nav { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 5px; margin-bottom: 14px; padding: 5px; background: var(--bdd-navy); border-radius: 13px; }
.bdd-tab-button { min-height: 48px; padding: 9px 11px; color: #cdd9e2; background: transparent; border: 0; border-radius: 9px; font: inherit; font-size: 15px; font-weight: 800; cursor: pointer; }
.bdd-tab-button.is-active { color: var(--bdd-navy); background: var(--bdd-green); }
.bdd-tab-panel { display: none; }
.bdd-tab-panel.is-active { display: block; }
.bdd-date-nav { display: grid; grid-template-columns: repeat(3, 1fr) 54px; gap: 7px; margin-bottom: 13px; }
.bdd-date-nav button, .bdd-date-picker { display: flex; min-height: 58px; align-items: center; justify-content: center; flex-direction: column; color: var(--bdd-text); background: #fff; border: 1px solid var(--bdd-line); border-radius: 11px; text-decoration: none; }
.bdd-date-nav button { width: 100%; padding: 6px; font: inherit; cursor: pointer; }
.bdd-date-nav button.is-active { color: #fff; background: var(--bdd-navy); border-color: var(--bdd-navy); }
.bdd-date-nav button:disabled { opacity: .42; cursor: not-allowed; background: #f1f4f6; }
.bdd-date-nav small { color: inherit; opacity: .78; font-size: 12px; font-weight: 700; }
.bdd-date-nav strong { margin-top: 2px; font-size: 17px; }
.bdd-date-picker { position: relative; cursor: pointer; }
.bdd-date-picker input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }

.bdd-match-head, .bdd-match-row { display: grid; grid-template-columns: 62px minmax(150px,1fr) 76px minmax(150px,1fr) 44px; align-items: center; }
.bdd-match-head { padding: 10px 13px; color: var(--bdd-muted); font-size: 12px; font-weight: 800; text-align: center; text-transform: uppercase; }
.bdd-match-head span:nth-child(2) { text-align: right; }
.bdd-match-head span:nth-child(4) { text-align: left; }
.bdd-league-card { overflow: hidden; margin: 0 0 13px; background: #fff; border: 1px solid var(--bdd-line); border-radius: var(--bdd-radius); box-shadow: 0 7px 22px rgba(13,34,50,.05); }
.bdd-day-group { margin: 0 0 22px; }
.bdd-day-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 15px 0 9px; padding: 12px 15px; color: #fff; background: linear-gradient(135deg,var(--bdd-navy),#17475e); border-radius: 11px; }
.bdd-day-heading span { display: flex; flex-direction: column; gap: 2px; }
.bdd-day-heading small { color: var(--bdd-green); font-size: 10px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.bdd-day-heading strong { font-size: 17px; line-height: 1.25; }
.bdd-day-heading em { flex: 0 0 auto; padding: 5px 9px; color: var(--bdd-navy); background: var(--bdd-green); border-radius: 20px; font-size: 12px; font-style: normal; font-weight: 900; }
.bdd-day-group .bdd-league-card { margin-bottom: 0; }
.bdd-league-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 14px; background: #f7f9fa; border-bottom: 1px solid var(--bdd-line); }
.bdd-league-header > span { display: flex; min-width: 0; align-items: center; gap: 8px; }
.bdd-league-header img { width: 25px; height: 25px; object-fit: contain; }
.bdd-league-header strong { font-size: 15px; }
.bdd-league-header small { color: var(--bdd-muted); font-size: 12px; }
.bdd-league-header a { color: #08763f; font-size: 13px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.bdd-match-row { min-height: 70px; padding: 8px 13px; border-bottom: 1px solid var(--bdd-line); font-size: 15px; }
.bdd-match-row:last-child { border-bottom: 0; }
.bdd-match-row time { color: var(--bdd-muted); font-weight: 700; text-align: left; }
.bdd-home-team, .bdd-away-team { display: flex; min-width: 0; align-items: center; gap: 9px; font-weight: 700; }
.bdd-home-team { justify-content: flex-end; text-align: right; }
.bdd-away-team { justify-content: flex-start; text-align: left; }
.bdd-home-team img, .bdd-away-team img { flex: 0 0 30px; width: 30px; height: 30px; object-fit: contain; }
.bdd-score { color: var(--bdd-navy); font-size: 20px; font-weight: 900; text-align: center; }
.bdd-score span { display: inline-grid; width: 31px; height: 26px; place-items: center; color: var(--bdd-muted); background: var(--bdd-bg); border-radius: 8px; font-size: 10px; text-transform: uppercase; }
.bdd-match-row > small { color: var(--bdd-muted); text-align: center; }
.bdd-updated { margin: 11px 2px; color: var(--bdd-muted); font-size: 12px; text-align: right; }
.bdd-empty { display: grid; min-height: 150px; place-items: center; align-content: center; padding: 30px; color: var(--bdd-muted); background: #fff; border: 1px dashed #ccd5dc; border-radius: var(--bdd-radius); text-align: center; }
.bdd-empty span { font-size: 27px; filter: grayscale(1); opacity: .55; }
.bdd-empty p { margin: 8px 0 0; font-size: 15px; }

.bdd-standings-nav { display: grid; grid-template-columns: 34px minmax(0,1fr) 34px; align-items: stretch; border-bottom: 1px solid var(--bdd-line); }
.bdd-standings-scroll { display: grid; min-width: 0; padding: 0; place-items: center; color: #08763f; background: #fff; border: 0; font-size: 24px; font-weight: 900; cursor: pointer; }
.bdd-standings-scroll:first-child { border-right: 1px solid var(--bdd-line); }
.bdd-standings-scroll:last-child { border-left: 1px solid var(--bdd-line); }
.bdd-standings-scroll:disabled { color: #b8c2c8; cursor: default; }
.bdd-standings-tabs { display: flex; overflow-x: auto; padding: 9px; gap: 6px; scrollbar-width: thin; scrollbar-color: #b9c5cc transparent; scroll-behavior: smooth; }
.bdd-standings-tabs::-webkit-scrollbar { display: none; }
.bdd-standings-tabs button { flex: 0 0 auto; padding: 8px 11px; color: var(--bdd-muted); background: #f1f4f6; border: 0; border-radius: 20px; font-size: 12px; font-weight: 800; cursor: pointer; }
.bdd-standings-tabs button.is-active { color: #fff; background: #117642; }
.bdd-standings-target { min-height: 280px; transition: opacity .2s; }
.bdd-standings-target.is-loading { opacity: .45; pointer-events: none; }
.bdd-table-scroll { overflow-x: auto; }
.bdd-standings-table { width: 100%; border: 0; border-collapse: collapse; font-size: 13px; }
.bdd-standings-table th { padding: 9px 5px; color: var(--bdd-muted); background: #fafbfc; border-bottom: 1px solid var(--bdd-line); font-size: 11px; text-transform: uppercase; }
.bdd-standings-table td { padding: 10px 5px; border-bottom: 1px solid var(--bdd-line); text-align: center; }
.bdd-standings-table th:nth-child(2), .bdd-standings-table td:nth-child(2) { text-align: left; }
.bdd-team-name { display: flex; min-width: 105px; align-items: center; gap: 6px; font-weight: 700; }
.bdd-team-name img { width: 20px; height: 20px; object-fit: contain; }
.bdd-rank { display: inline-grid; width: 20px; height: 20px; place-items: center; border-radius: 6px; font-weight: 800; }
.bdd-rank-1, .bdd-rank-2, .bdd-rank-3, .bdd-rank-4 { color: #fff; background: #117642; }
.bdd-widget-more { display: block; padding: 14px; color: #08763f; font-size: 13px; font-weight: 800; text-align: center; text-decoration: none; }

.bdd-odds-head, .bdd-odds-row { display: grid; grid-template-columns: minmax(230px,1.4fr) repeat(3,minmax(100px,1fr)); align-items: center; }
.bdd-odds-head { padding: 10px 12px; color: var(--bdd-muted); font-size: 12px; font-weight: 800; text-align: center; text-transform: uppercase; }
.bdd-odds-head span:first-child { text-align: left; }
.bdd-odds-row { min-height: 74px; padding: 9px 12px; border-bottom: 1px solid var(--bdd-line); }
.bdd-odds-row:last-child { border-bottom: 0; }
.bdd-odds-match { display: flex; min-width: 0; flex-direction: column; gap: 3px; padding-right: 12px; }
.bdd-odds-match time { color: var(--bdd-muted); font-size: 12px; font-weight: 700; }
.bdd-odds-match strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.bdd-market-cell { display: flex; justify-content: center; gap: 4px; }
.bdd-market-cell > span { display: flex; min-width: 43px; padding: 5px; flex-direction: column; color: var(--bdd-text); background: #fff8df; border: 1px solid #f7df90; border-radius: 7px; text-align: center; }
.bdd-market-cell small { color: var(--bdd-muted); font-size: 10px; }
.bdd-market-cell strong { font-size: 14px; }
.bdd-no-odd { color: var(--bdd-muted); background: transparent !important; border: 0 !important; font-size: 12px; font-weight: 700; }

.bdd-league-hero { overflow: hidden; margin-bottom: 14px; color: #fff; background: linear-gradient(135deg,var(--bdd-navy),#153f55); border-radius: 16px; }
.bdd-league-hero > div { padding: 23px 23px 18px; }
.bdd-league-hero span { color: var(--bdd-green); font-size: 13px; font-weight: 800; text-transform: uppercase; }
.bdd-league-hero h1 { margin: 5px 0 0; color: #fff; font-size: clamp(25px,4vw,38px); line-height: 1.2; }
.bdd-league-nav { display: flex; overflow-x: auto; gap: 5px; padding: 8px; background: rgba(0,0,0,.18); }
.bdd-league-nav a { flex: 0 0 auto; padding: 10px 13px; color: #dbe7ed; border-radius: 8px; font-size: 13px; font-weight: 800; text-decoration: none; }
.bdd-league-nav a.is-active { color: var(--bdd-navy); background: var(--bdd-green); }
.bdd-round-filter { display: flex; align-items: center; justify-content: flex-end; gap: 9px; margin-bottom: 13px; }
.bdd-round-filter label { color: var(--bdd-muted); font-size: 13px; font-weight: 800; }
.bdd-round-filter select { max-width: 260px; min-height: 44px; padding: 0 34px 0 13px; color: var(--bdd-text); background: #fff; border: 1px solid var(--bdd-line); border-radius: 9px; font-size: 14px; font-weight: 700; }
.bdd-league-seo { margin-top: 20px; padding: 22px; background: #fff; border: 1px solid var(--bdd-line); border-radius: var(--bdd-radius); }
.bdd-league-seo h2 { margin: 0 0 10px; font-size: 24px; line-height: 1.35; }
.bdd-league-seo p, .bdd-league-seo li { color: #344650; font-size: 16px; line-height: 1.8; }
.bdd-league-seo p { margin: 0 0 12px; text-align: justify; }
.bdd-league-seo p:last-child { margin-bottom: 0; }
.bdd-data-section, .bdd-league-data-target { transition: opacity .2s ease; }
.bdd-data-section.is-loading, .bdd-league-data-target.is-loading { opacity: .45; pointer-events: none; }
.bdd-inline-error { margin: 0 0 10px; padding: 10px 12px; color: #8b1e2b; background: #fff0f2; border: 1px solid #ffc8cf; border-radius: 9px; font-size: 13px; font-weight: 700; }
.bdd-inline-notice { margin: 0 0 12px; padding: 11px 13px; color: #795100; background: #fff8df; border: 1px solid #f2d983; border-radius: 9px; font-size: 13px; font-weight: 700; }

.bdd-news-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.bdd-news-card { overflow: hidden; background: #fff; border: 1px solid var(--bdd-line); border-radius: var(--bdd-radius); }
.bdd-news-card > a { display: block; color: var(--bdd-text); text-decoration: none; }
.bdd-news-card img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.bdd-news-card span { display: block; padding: 14px; }
.bdd-news-card small { color: #117642; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.bdd-news-card h3 { margin: 5px 0; font-size: 16px; line-height: 1.35; }
.bdd-news-card p { margin: 0; color: var(--bdd-muted); font-size: 12px; line-height: 1.55; }

.bdd-sidebar-posts { padding: 5px 13px; }
.bdd-sidebar-post { display: grid; grid-template-columns: 76px minmax(0,1fr); gap: 10px; align-items: center; padding: 10px 0; color: var(--bdd-text); border-bottom: 1px solid var(--bdd-line); font-size: 12px; font-weight: 700; line-height: 1.4; text-decoration: none; }
.bdd-sidebar-post:last-child { border-bottom: 0; }
.bdd-sidebar-thumb img { display: block; width: 76px; height: 55px; object-fit: cover; border-radius: 8px; }

@media (max-width: 1180px) {
  .bdd-data-layout { grid-template-columns: 190px minmax(0,1fr); }
  .bdd-layout-right { position: static; display: block; grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .bdd-site-shell { width: min(100% - 20px, 760px); margin: 14px auto; }
  .bdd-data-layout { display: block; }
  .bdd-layout-left { position: static; margin-bottom: 12px; }
  .bdd-layout-right { margin-top: 14px; }
  .bdd-left-leagues { border-radius: 11px; }
  .bdd-left-leagues .bdd-widget-title { display: none; }
  .bdd-league-links { display: flex; overflow-x: auto; padding: 7px; gap: 7px; scrollbar-width: none; }
  .bdd-league-links a { flex: 0 0 auto; padding: 7px 10px; border: 0; border-radius: 9px; background: #f1f5f7; }
  .bdd-league-links a:hover { padding-left: 10px; }
  .bdd-league-links small { display: none; }
  .bdd-league-monogram { flex-basis: 28px; width: 28px; height: 28px; }
  .bdd-tab-nav { position: sticky; top: 58px; z-index: 8; }
  .bdd-match-head { display: none; }
  .bdd-match-row { grid-template-columns: 42px minmax(92px,1fr) 52px minmax(92px,1fr); min-height: 62px; padding: 7px 8px; }
  .bdd-match-row > small { display: none; }
  .bdd-home-team, .bdd-away-team { gap: 6px; font-size: 13px; line-height: 1.3; }
  .bdd-home-team img, .bdd-away-team img { flex-basis: 25px; width: 25px; height: 25px; }
  .bdd-score { font-size: 15px; }
  .bdd-odds-head { display: none; }
  .bdd-odds-row { grid-template-columns: 1fr; gap: 8px; padding: 11px; }
  .bdd-odds-match { padding: 0; }
  .bdd-odds-match strong { font-size: 14px; white-space: normal; }
  .bdd-market-cell { justify-content: flex-start; overflow-x: auto; }
  .bdd-market-cell::before { display: inline-block; width: 58px; flex: 0 0 58px; align-self: center; color: var(--bdd-muted); font-size: 11px; font-weight: 800; }
  .bdd-market-cell:nth-child(2)::before { content: '1X2'; }
  .bdd-market-cell:nth-child(3)::before { content: 'CHÂU Á'; }
  .bdd-market-cell:nth-child(4)::before { content: 'TÀI/XỈU'; }
  .bdd-news-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .bdd-tab-button { padding: 7px 4px; font-size: 12px; }
  .bdd-date-nav { grid-template-columns: repeat(3,1fr) 45px; }
  .bdd-date-nav button { min-height: 52px; }
  .bdd-league-header small { display: none; }
  .bdd-match-row time { font-size: 11px; }
  .bdd-home-team img, .bdd-away-team img { display: none; }
  .bdd-league-hero > div { padding: 18px; }
  .bdd-league-hero h1 { font-size: 24px; }
}