:root { --brand: var(--c-brand); --brand-dark: var(--c-brand-d); }
body { background: var(--c-surface-2); color: var(--c-text); font-family: 'Roboto', sans-serif; line-height: 1.5; }
.container-x { width: 100%; max-width: 1200px; margin-inline: auto; padding-inline: 12px; }
@media (min-width: 576px) { .container-x { padding-inline: 16px; } }
.main-wrap { padding-top: 1rem; padding-bottom: 1rem; }
.topbar { background: var(--c-surface-2); border-bottom: 1px solid var(--c-line); font-size: .82rem; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 38px; }
.topbar-links { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; min-width: 0; }
.topbar-links a, .topbar-auth a { color: #4b5563; text-decoration: none; padding: .25rem .55rem; border-radius: 6px; white-space: nowrap; font-weight: 500; }
.topbar-links a:hover, .topbar-auth a:hover { color: var(--brand); background: var(--c-brand-l); }
.topbar-auth { display: flex; align-items: center; gap: 4px; flex: none; }
@media (max-width: 479.98px) { .topbar-auth a span, .topbar-auth { } .topbar-links a i { display: none; } }
.site-header { position: relative; }
.site-header-inner { display: flex; align-items: center; justify-content: space-between; padding: .75rem 0; }
.site-header .brand { color: #fff; text-decoration: none; font-size: 1.25rem; font-weight: 800; letter-spacing: -.01em; }
.site-header .brand-sub { color: var(--c-brand-l); font-size: .85rem; }
@media (max-width: 575.98px) { .site-header .brand-sub { display: none; } }
.menu { background: var(--c-brand-d); position: sticky; top: 0; z-index: 40; box-shadow: 0 2px 8px rgba(0,0,0,.2); }
.menu-inner { display: flex; gap: 2px; overflow-x: auto; }
.menu a {padding: .65rem 1rem; color:#fff; display:inline-flex; align-items:center; gap:6px; }
.menu a img { width:22px; height:22px; object-fit:contain; display:block; flex:none; }
.menu a:hover { background: var(--c-brand-d); color: #fff; }
.menu a.active { color: #ffff00; background: var(--c-brand-d); border-bottom-color: var(--c-brand); }
.site-footer { background: var(--c-ink); color: var(--c-muted); margin-top: 2rem; }
.site-footer .brand-em { color: var(--c-brand); font-weight: 600; }
.layout { display: flex; flex-direction: column; gap: .5rem; padding: 0 0 1rem; }
.center { flex: 1 1 auto; min-width: 0; order: 1; }
.left   { order: 2; }
.right  { order: 3; }
.left, .right { display: block; }
.left > *, .right > * { margin-bottom: 1rem; }
@media (min-width: 1024px) {
  .layout { flex-direction: row; }
  .center, .left, .right { order: 0; }
  .left  { width: 15rem; flex: 0 0 15rem; }
  .right { width: 15rem; flex: 0 0 15rem; }
  .right-sidebar{
    width: 22rem;
    flex: 0 0 22rem;
  }
  .home-layout .left, .home-layout .right {
      width: 12rem;
      flex: 0 0 12rem;
    }
}
.fs-10{font-size: 10px;}
.fs-11{font-size: 11px;}
.fs-12{font-size: 12px;}
.fs-13{font-size: 13px !important;}
.fs-14{font-size: 14px;}
.fs-15{font-size: 15px !important;}
.fs-heading-tab{font-size: 14px !important;}
.bg-gray{background:var(--c-surface-2);}
.box {border-radius: 5px; box-shadow: 0 1px 2px rgba(0,0,0,.06); border: 1px solid var(--c-line)}
.box > h2, .box > h3 {padding: 8px; background: linear-gradient(90deg, var(--c-brand), #22c55e);font-weight: 600; color: #fff; margin: 0;}
.box > h1 .hsub, .box > h2 .hsub, .box > h3 .hsub { font-weight: 400; color: var(--c-brand-l); font-size: .72rem; }
.box > h4 { font-size: .9rem; font-weight: 600; padding: .7rem 1rem 0; color: var(--c-text-2); margin: 0; }
.box ul { list-style: none; margin: 0; padding: 0; }
.box li { padding: .5rem 0; border-top: 1px solid var(--c-surface-2); }
.box li:first-child { border-top: 0; }
.box li img { width: 20px; height: 20px; object-fit: contain; vertical-align: middle; }
.box li span{line-height: 20px;}
table.matches, table.lv-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
table #live-body a{text-decoration: none}
table.matches thead th { padding: .5rem; background: var(--c-surface-2); border-bottom: 1px solid var(--c-line); font-weight: 500;border-top: 1px solid var(--c-line);}
table.matches td, table.lv-table td { padding:.6rem; border-bottom: 1px solid var(--c-surface-2); vertical-align: middle; line-height: 18px }
td.home-card, td.away-card { white-space: normal; }
td.home-card > *, td.away-card > * { vertical-align: middle; }
@media (max-width: 575.98px) { table.matches td, table.matches thead th, table.lv-table td { padding: .4rem .25rem } }
.livescore-yellow-card{background:var(--c-warn);border-radius:3px;padding:0 4px;font-size:11px}
.white-space-nowrap{white-space:nowrap;}
.text-gray{color:var(--c-muted) !important;}
.stat-fill{
  border-radius: 10px;
}
.live-banner{background:#fef2f2;color:var(--c-live);border:1px solid #fecaca;border-radius:6px;padding:8px 12px;font-weight:600;font-size:14px;}
@keyframes mhBlink{0%,100%{opacity:1}50%{opacity:.2}}
.mh-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--c-live);margin-right:5px;vertical-align:middle;animation:mhBlink 1s ease-in-out infinite;}
.live-banner .mh-dot{width:11px;height:11px;}
.lv-league {gap: .5rem;padding:8px 10px 6px}
.lv-league img { width: 20px; height: 20px; object-fit: contain; }
.lv-league a { color: #fff; text-decoration: none; }
.lv-league a:hover { text-decoration: underline; }
.lv-table { border: 1px solid var(--c-line); }
.lv-min  { width: 64px; color: var(--c-live); font-weight: 700; }
.card-header{border-bottom: 1px solid #ececec;}
table.res-table { width: 100%; table-layout: fixed; border-collapse: collapse; }
table.res-table td { padding: 6px 3px; vertical-align: middle; border-bottom: 1px solid var(--c-surface-2); }
table.res-table tbody tr:hover td { background: var(--c-brand-l); }
.res-name {line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical}
.res-name-h { text-align: right; }
.res-logo { width: 24px; }
.res-logo img { width: 18px; height: 18px; object-fit: contain; vertical-align: middle; }
.res-score { width: 42px; text-align: center; }
.lv-home { text-align: right; }
.lv-score{ text-align: center; width: 64px; font-weight: 700; }
.lv-ht   { text-align: center; width: 56px; color: var(--c-muted); font-size: 12px; }
.res-pager button{
  background-color: #f0f0f0;
  width: 31px;
  padding: 0;
  height: 30px;
  line-height: 28px;
}
.table-layout-fixed{
  table-layout:fixed;
}
.sidebar-country-leagues a{
  border-bottom: 1px solid #f4f4f4;
}
.cl-hide{ display:none !important; }
.sidebar-country-leagues a:last-child{
  border-bottom: none;
}
.lv-tabs { display: flex; gap: .5rem; padding: .75rem; flex-wrap: wrap; border-bottom: 1px solid var(--c-line); overflow-x: auto; }
button{color:inherit}
.tab-btn {border-radius: 5px; border: 1px solid var(--c-line); color:var(--c-text)}
.tab-btn:hover { background: var(--c-surface-2); }
.tab-btn.active, .btn-active { background: linear-gradient(90deg, var(--c-brand), #22c55e); color: #fff; border-color: transparent; box-shadow: 0 1px 3px rgba(0,0,0,.15); }
.nd-mid-badge{ background:#ede9fe; color:#6d28d9; font-weight:500; white-space:nowrap;font-size: 10px;border-radius: 3px;padding: 4px 5px; }
.nd-mid-badge:hover{ background:#ddd6fe; color:#5b21b6; }
.nd-mid-badge i{color:#ffdb11;font-size:10px}
.card-red, .card-yellow{
  border-radius: 3px;
  padding: 1px 3px;
  font-size: 10px;
}
.card-red{background:var(--c-live);color:#fff}
.card-yellow{background:var(--c-warn);color:#000}
.blink { animation: blink 1.1s steps(1, end) infinite; }
@keyframes blink { 50% { opacity: .2; } }
.x-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 639.98px) { .hide-sm { display: none !important; } }

td.c-cht{font-size:12px;line-height:1.35;white-space:nowrap}
td.c-cht > span{display:block}
td.c-odd{font-size:12px;line-height:1.35;white-space:nowrap;color:var(--c-text-2)}
td.c-odd .od-ln{display:block;color:#0369a1;font-weight:500}
td.c-odd .od-v:first-child{color:#b45309}
td.c-odd .od-v:last-child{color:#0f766e}
.kb-col.kb-m-hdp .kb-v{color:#b45309}
.kb-col.kb-m-ou .kb-v{color:#0f766e}
td.c-odd .od-v{display:block}
td.c-odd.c-odd-eu .od-v{display:block}
@keyframes odFlash{0%{background:#fef9c3}70%{background:#fefce8}100%{background:transparent}}
td.c-odd.od-flash{animation:odFlash 6s ease-out}
.od-v.od-up{color:var(--c-live) !important;font-weight:500}
.od-v.od-down{color:var(--c-brand) !important;font-weight:500}
.odt-dlg{max-width:430px}
.odt-head{display:flex;align-items:center;gap:6px;min-width:0;font-size:12.5px}
.odt-lg{color:#fff;font-size:11px;padding:1px 6px;border-radius:3px;flex:none;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.odt-tt{flex:1 1 auto;text-align:center;font-weight:700;color:var(--c-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;justify-content:center;gap:5px;min-width:0}
.odt-tt i{font-style:normal;color:var(--c-muted);font-weight:500;font-size:11px}
.odt-logo{width:20px;height:20px;object-fit:contain;flex:none}
#oddsTipModal .odt-tb{font-size:12px}
.odt-tb{width:100%;border-collapse:collapse}
.odt-tb td{border:1px solid var(--c-line);text-align:center;padding:4px 2px;color:var(--c-text-2)}
.odt-h td{background:#e0f2fe;font-weight:600;color:#0c4a6e}
.odt-lb{background:var(--c-surface-2);font-weight:600;width:44px}
.odt-c.odt-i{background:#f0f9ff;color:var(--c-text-2)}
.odt-c.odt-ln{background:#fef08a;font-weight:600}
.odt-c.odt-up{background:#fee2e2;color:var(--c-live);font-weight:600}
.odt-c.odt-dn{background:#dcfce7;color:#15803d;font-weight:600}
.odt-c i{font-size:10px}
.odt-more{display:block;text-align:center;padding:6px;border-top:1px solid var(--c-line);color:var(--c-accent);font-weight:600;text-decoration:none;font-size:13px}
.odt-more:hover{text-decoration:underline;background:#eff6ff}
#odds-cid{border:none;border-radius:3px;font-size:12px;cursor:pointer;background: #125a41;color: #fff}
td.c-odd{cursor:pointer}
.livescore-mobile{
    font-size: 7px;
    background: #fb2939;
    padding: 0px 3px;
    left: 56%;
    border-radius: 2px;
    animation: live-blink .8s ease-in-out infinite;
}
@keyframes live-blink{
    0%, 100%{ opacity: 1; }
    50%{ opacity: .35; }
}
#mainMenu .livescore-mobile{
  left: 20%;
  top: 15%;
}
.kb-head{min-width:640px;padding:6px 0;border-radius:3px}
.kb-head span{text-align:center}
.kb-league{min-width:640px;gap:6px;padding:5px 8px;margin-top:8px;border-radius:3px}
.kb-league img{width:18px;height:18px;object-fit:contain;background:#fff;border-radius:2px}
.kb-lg-lnk{color:var(--c-brand-l);font-size:12px;text-decoration:none;padding:0 6px;flex:none}
.kb-lg-lnk:hover{color:#fff;text-decoration:underline}
.kb-row{min-width:640px;border-bottom:1px solid #eef2f1;padding:4px 0;align-items:center}
.kb-row:nth-child(odd){background:#f6faf7}
.kb-row.kb-live{background:#eff8ff}
.kb-time{width:64px;flex:none;display:flex;flex-direction:column;align-items:center;font-size:12px}
.kb-head .kb-time{display:block}
.kb-sc{color:var(--c-live)}
.kb-team{flex:1 1 auto;min-width:150px;display:flex;flex-direction:column;gap:2px;padding:0 6px}
.kb-head .kb-team{display:block;text-align:left !important}
.kb-tm{color:var(--c-text);font-size:13px;text-decoration:none;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kb-tm:hover{color:#15803d}
.kb-tm:first-child{font-weight:500}
.kb-col{width:62px;flex:none;display:flex;flex-direction:column;align-items:center;gap:2px}
.kb-col.kb-eu{width:70px}
.kb-v{font-weight:400;font-size:12.5px;color:var(--c-text-2);line-height:1.3;min-height:1em}
.kb-ln{font-style:normal;font-size:12px;color:var(--c-text-2);font-weight:700;line-height:1.3}
.kb-ln.kb-u{color:var(--c-muted);font-weight:400}
.kb-head .kb-col2{width:124px;flex:none;text-align:center}
.kb-row.od-flash{animation:odFlash 6s ease-out}
.kb-time .live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--c-live);vertical-align:middle}
.kb-tm.kb-fav{color:var(--c-live);font-weight:600}
.kb-v.od-up{color:var(--c-live) !important;font-weight:500}
.kb-v.od-down{color:var(--c-brand) !important;font-weight:500}
.kb-col{cursor:pointer}
@media (max-width:639.98px){
  .kb-head,.kb-league,.kb-row{min-width:0}
  .kb-time{width:44px;font-size:11px}
  .kb-team{min-width:0;padding:0 4px}
  .kb-tm{font-size:12px}
  .kb-col{width:40px}
  .kb-col.kb-eu{width:46px}
  .kb-head .kb-col2{width:80px}
  .kb-v,.kb-head .kb-col{font-size:11px}
  .kb-lg-lnk{padding:0 4px;font-size:11px}
  .odds-mx th,.odds-mx td{padding:3px 1px !important;font-size:10.5px !important}
  .odds-mx .co{max-width:60px;white-space:normal;word-break:break-word}
  .odds-mx .lbl{font-size:10px}
  .x-scroll table.odds-mx th:first-child,.x-scroll table.odds-mx td:first-child,
  .x-scroll table.hist th:nth-child(2),.x-scroll table.hist td:nth-child(2){
    position:sticky;left:0;background:#fff;z-index:2
  }
  .x-scroll table.odds-mx thead th:first-child,.x-scroll table.hist thead th:nth-child(2){background:var(--c-surface-2)}
  .odds-tabs .ot[data-otab="3in1"]{display:none}
}
@media (max-width: 767.98px) { .d-hide-mobile { display: none !important; } }   
@media (min-width: 768px)    { .d-hide-desktop { display: none !important; } }  
.hsub { font-weight: 400; color: var(--c-brand-l); font-size: .72rem; }
.modal.fade .modal-dialog {
  opacity: 0;
  transform: scale(1.1);
  transition: transform 0.3s ease-out, opacity 0.3s ease-out;
}
.modal.fade.show .modal-dialog {
  opacity: 1;
  transform: scale(1);
}
.btn-gray{
  background: #f0f0f0;
}
.btn-gray:hover, .btn-gray:focus, .btn-gray:active, .btn-gray:focus-visible{
  background: #d3d3d3 !important;
  border: 1px solid #c0c0c0 !important;
}
.vertical-align-bottom{
  vertical-align: bottom !important;
}
.btn:disabled{
  border:1px solid #fff;
}
.btn.fs-14, .btn-active.fs-14{
  padding: 6px 10px 3px;
}
.btn.fs-13, .btn-active.fs-13{
  padding: 3px 8px 3px;
}
.form-control-sm{
  line-height: 20px;
  padding: 4px 5px 3px 10px;
}
.form-control:focus{
  box-shadow: none;
  outline: none;
}
.table-striped tbody tr:nth-child(odd) td {
   background: #ffffff !important;
   --bs-table-bg-type: none;
}
.table-striped tbody tr:nth-child(even) td {
   background-color: var(--c-surface-2);
}
.nav-toggle{ display:none; background:transparent; border:0; color:#fff; font-size:1.25rem; padding:.25rem .5rem; cursor:pointer; line-height:1; }
.header-member{ margin-left:auto; display:flex; align-items:center; gap:.5rem; }
.header-member .hm-login, .header-member .hm-register{ text-decoration:none; font-size:.85rem; font-weight:600; padding:.35rem .7rem; border-radius:6px; white-space:nowrap; }
.header-member .hm-login{ color:#fff; border:1px solid rgba(255,255,255,.55); }
.header-member .hm-login:hover{ background:rgba(255,255,255,.12); }
.header-member .hm-register{ background:#fff; color:var(--c-brand); }
.header-member .hm-register:hover{ background:var(--c-brand-l); }
.header-member .hm-user{ display:flex; align-items:center; gap:.45rem; color:#fff; text-decoration:none; font-weight:600; font-size:.9rem; }
.header-member .hm-avatar{ width:30px; height:30px; border-radius:50%; object-fit:cover; border:2px solid rgba(255,255,255,.55); }
.header-member .hm-name{ max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.menu-member{ color:var(--c-brand) !important; }
@media (min-width:768px){ .menu a.menu-member{ display:none; } }   /* selector đủ mạnh để thắng .menu a{display:inline-flex} */
@media (max-width:767.98px){
  .nav-toggle{ display:inline-flex; align-items:center; }
  .header-member .hm-name{ display:none; }
  .header-member .hm-login, .header-member .hm-register{ padding:.3rem .55rem; font-size:.8rem; }
  .menu{ margin-bottom:.5rem; }
  .menu-inner{ flex-direction:column; gap:0; max-height:0; overflow:hidden; transition:max-height .28s ease; }
  .menu.open .menu-inner{ max-height:70vh; overflow:auto; }
  .menu a{ border-bottom:1px solid var(--c-ink-2); }
}
.tb-menu-btn{ display:none; }
.hdr-quick{ display:none; }
.hdr-acc{ display:none; }
.hdr-sub{ display:none; }
.megamenu{ display:none; }
.botnav{ display:none; }
@media (max-width:767.98px){
  .topbar{ display:none !important; }
  .site-header.bg-white{ background:#fff; }
  .site-header-inner{ background:var(--brand); padding:.45rem .75rem;
    display:grid; grid-template-columns:1fr auto 1fr; align-items:center; }
  .site-header-inner .nav-toggle{ display:none !important; }
  .site-header-inner .hdr-quick{ display:none !important; }
  .tb-menu-btn{ display:inline-flex; align-items:center; justify-self:start; background:transparent; border:0; color:#fff; font-size:1.35rem; cursor:pointer; padding:.1rem .3rem; line-height:1; }
  .site-header-inner .brand{ justify-self:center; display:flex; align-items:center; }
  .hdr-acc{ display:inline-flex; align-items:center; justify-self:end; color:#fff; text-decoration:none; font-size:1.6rem; line-height:1; padding:.1rem .3rem; }
  .hdr-acc .hm-avatar{ width:30px; height:30px; border-radius:50%; object-fit:cover; border:2px solid rgba(255,255,255,.6); }
  .hdr-sub{ display:grid; grid-template-columns:repeat(4,1fr); background:var(--c-brand-d); }
  .hdr-sub a{ display:flex; align-items:center; justify-content:center; gap:2px; padding:8px 4px; color:#fff;
    text-decoration:none; font-size:.78rem; font-weight:600; text-align:center; white-space:nowrap;
    border-right:1px solid rgba(255,255,255,.15); }
  .hdr-sub a:last-child{ border-right:0; }
  .hdr-sub a:active{ background:rgba(0,0,0,.15); }
  #mainMenu{ display:none !important; }
  .megamenu{ display:block; position:absolute; left:0; right:0; top:100%; z-index:60; background:#fff;
    max-height:80vh; overflow:auto; border-bottom:1px solid var(--c-line);
    box-shadow:0 12px 24px rgba(0,0,0,.16);
    opacity:0; visibility:hidden; transform:translateY(-10px);
    transition:opacity .32s cubic-bezier(.4,0,.2,1), transform .32s cubic-bezier(.4,0,.2,1), visibility .32s; }
  .megamenu.open{ opacity:1; visibility:visible; transform:translateY(0); }
  .mm-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:14px 0 8px; }
  .mm-grid a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; padding:14px 6px; border:1px solid var(--c-line); border-radius:10px; color:var(--c-text); text-decoration:none; font-size:.72rem; font-weight:600; text-align:center; }
  .mm-grid a i{ font-size:1.3rem; color:var(--brand); }
  .mm-grid a:hover{ background:var(--c-brand-l); }
  .mm-auth{ display:flex; gap:8px; padding:6px 0 14px; }
  .mm-auth a{ flex:1; text-align:center; padding:10px; border-radius:8px; text-decoration:none; font-weight:700; font-size:.82rem; }
  .mm-auth .reg{ background:var(--brand); color:#fff; }
  .mm-auth .login{ border:1px solid var(--brand); color:var(--brand); }
  .botnav{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:1000;
    background:var(--c-brand-d);
    border-top:0;
    box-shadow:0 -6px 20px rgba(6,95,70,.28); }
  .botnav a{ position:relative; flex:1; display:flex; flex-direction:column; align-items:center; gap:3px;
    padding:8px 2px 6px; color:#ffffff; text-decoration:none; font-size:.68rem; font-weight:600; transition:color .2s, transform .2s;border-right: 1px solid rgba(255, 255, 255, .15); }
  .botnav a i{ font-size:1.2rem; transition:transform .2s; }
  .botnav a:active{ transform:scale(.92); }
  .botnav a.active{ color:var(--c-warn);background: #0b4233; }
  .botnav a.active i{ transform:translateY(-2px) scale(1.12); color:var(--c-warn); filter:drop-shadow(0 2px 4px rgba(0,0,0,.35)); }
  .botnav a.active::before{ content:""; position:absolute; top:-4px; left:50%; transform:translateX(-50%);
    width:100%; height:4px; border-radius:0 0 4px 4px; background:var(--c-warn); box-shadow:0 1px 6px rgba(250,204,21,.6); }
  body{ padding-bottom:64px; }
  .col-time{ width: 80px !important}
}
.col-time{ width: 105px;}
.lv-toggle{ display:none; background:transparent; border:0; color:#fff; cursor:pointer; padding:.1rem .45rem; font-size:1rem; line-height:1; }
.lv-toggle i{ transition:transform .2s; }
.lv-league.open .lv-toggle i{ transform:rotate(180deg); }
@media (max-width:767.98px){
  .kq-results table.matches td.home-card img, .kq-results table.matches td.away-card img{ display:none; }
  .lv-league{ position:relative; }
  .lv-league .lv-actions{
    display:flex !important; flex-direction:column; gap:0 !important;   
    position:absolute; top:calc(100% + 8px); right:0; z-index:35;
    min-width:80px; background:#fff; border:1px solid var(--c-line); border-radius:5px;
    box-shadow:0 8px 20px rgba(0,0,0,.18); padding:1px 0;
    opacity:0; visibility:hidden; transform:translateY(-10px); transform-origin:top right;
    transition:opacity .22s ease, transform .22s ease, visibility .22s;
  }
  .lv-league .lv-actions::before{
    content:""; position:absolute; top:-6px; right:14px; width:0; height:0;
    border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:6px solid #008959;
    filter:drop-shadow(0 -1px 0 var(--c-line));
  }
  .lv-league.open .lv-actions{ opacity:1; visibility:visible; transform:translateY(0); }   
  .lv-league .lv-actions a{padding:5px 10px }
  .lv-toggle{ display:inline-flex; align-items:center; }
  .lv-league{padding:4px;}
  .lv-league a{font-size: 12px;}
}
.league-btns .lq-row{ display:flex; gap:4px; align-items:center; flex:1 1 auto; min-width:170px; }
.league-btns .lq-search{ position:relative; flex:1 1 auto; min-width:120px; }
.league-btns .lq-list{ position:absolute; z-index:30; left:0; right:0; top:100%; background:#fff; border:1px solid var(--c-line); border-radius:6px; max-height:260px; overflow:auto; box-shadow:0 6px 18px rgba(0,0,0,.12); display:none; }
.league-btns .lq-list.open{ display:block; }
.league-btns .lq-item{ padding:7px 10px; cursor:pointer; border-bottom:1px solid var(--c-line-2); }
.league-btns .lq-item:hover, .league-btns .lq-item.active{ background:#eff6ff; }
.league-btns .lq-item .s{ color:var(--c-muted); }
@media (max-width:767.98px){
  .league-btns .lq-row{ display:flex; width:100%; gap:4px; align-items:stretch; }
  .league-btns .lq-search{ flex:1 1 auto; min-width:0; }
  .league-btns .lq-input{ height:30px; }
  .league-btns .lq-go{ flex:0 0 12%; height:30px; display:flex; align-items:center; justify-content:center; }
}
.auth-wrap{ max-width:420px; margin:1.5rem auto; padding:0 1rem; }
.auth-card{ padding:1.5rem; }
.btn-social{ display:flex; align-items:center; justify-content:center; gap:.6rem; font-weight:600; border:1px solid var(--c-line); background:#fff; color:var(--c-text-2); }
.btn-social:hover{ background:var(--c-surface-2); color:var(--c-text-2); }
.btn-facebook{ background:#1877f2; color:#fff; border-color:#1877f2; }
.btn-facebook:hover{ background:#166fe0; color:#fff; }
.auth-or{ text-align:center; border-bottom:1px solid var(--c-line); line-height:.1em; margin:1.1rem 0; }
.auth-or span{ background:#fff; padding:0 .7rem; color:var(--c-muted); font-size:.8rem; }
.mob-only{ display:none; }
.lv-head-mobile, .lv-mob-head{ display:none; }
.mob-toggle{ background:transparent; border:0; color:var(--c-brand); cursor:pointer; padding:.2rem .6rem; font-size:1rem; line-height:1; }
.mob-toggle .fa-chevron-down{ transition:transform .2s; }
.mob-toggle.open .fa-chevron-down{ transform:rotate(180deg); }
.mob-detail-box table{ margin-bottom:6px; }
.lg-mob{ display:none; }
.min-live .live-dot{ display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--c-live); margin-right:4px; vertical-align:middle; }
.lv-lg-tag{ display:inline-block; color:#fff; font-size:10px; line-height:1.5; padding:0 5px; border-radius:3px; vertical-align:middle; white-space:nowrap; text-decoration:none; }
.lv-lg-tag:hover{ color:#fff; opacity:.88; }
@media (max-width:767.98px){
  .lv-head-desktop{ display:none !important; }
  .lv-mob-head{
    display:grid; grid-template-columns:1fr 26px 46px 38px 50px 26px;
    background:var(--c-surface-2); font-size:12px; font-weight:700; color:var(--c-text-2);
  }
  .lv-head-mobile{
    display:grid; grid-template-columns:minmax(0,1fr) 38px 146px;
    background:var(--c-surface-2); font-size:12px; font-weight:700; color:var(--c-text-2);
  }
  .lv-head-mobile th, .lv-mob-head > span{ padding:7px 4px; text-align:center; border:0; white-space:nowrap; font-size:12px; }
  .lv-head-mobile th{ padding:7px 0 !important; overflow:visible; }
  .lv-head-mobile th:first-child, .lv-mob-head > span:first-child{ text-align:left; }
  #live-body, #live-wrap table.matches, #live-wrap table.matches > tbody{ display:block; }
  #live-wrap table.matches{ margin:0; }
  #live-wrap .lv-league{ display:none; }  
  #live-body > tr, #live-wrap table.matches > tbody > tr{
    display:grid;
    grid-template-columns:1fr 26px 46px 38px 50px 26px;
    grid-template-areas:
      "time  exp score ht corner ev"
      "home  exp score ht corner ev"
      "away  exp score ht corner ev";
    align-items:center;
    border-bottom:6px solid var(--c-surface-2);
    padding:4px 0 0;
  }
  #live-wrap table.matches > tbody > tr{
    grid-template-columns:1fr 46px 38px 50px 26px;
    grid-template-areas:
      "time  score ht corner ev"
      "home  score ht corner ev"
      "away  score ht corner ev";
  }
  #live-body > tr.lv-league-row{ display:block; border-bottom:0; padding:0; }
  #live-body > tr.lv-league-row > td{ display:block; padding:0; }
  #live-body > tr > td, #live-wrap table.matches > tbody > tr > td{ display:block; border:0; padding:2px 6px; min-width:0; }
  #live-body > tr.mob-detail, #live-wrap table.matches > tbody > tr.mob-detail,
  #live-body > tr.lv-detail, #live-wrap table.matches > tbody > tr.lv-detail{ display:block; border-bottom:6px solid var(--c-surface-2); }   
  .mob-detail > td, .lv-detail > td{ display:block; background:var(--c-surface-2); padding:8px !important; }
  .c-star{ display:flex !important; grid-area:time; align-self:center; justify-self:start; align-items:center; width:18px; padding:0 0 0 2px !important; z-index:2; }
  td.c-time{ grid-area:time; white-space:nowrap; }
  #live-body > tr > td.c-time, #live-wrap table.matches > tbody > tr > td.c-time{ padding-left:24px; padding-right:2px; }
  td.c-home, td.c-away{
    grid-area:home; text-align:left !important;
    display:flex !important; align-items:center; gap:4px; flex-wrap:nowrap; justify-content:flex-start;
  }
  td.c-away{ grid-area:away; }
  td.c-home .team-link, td.c-away .team-link{ order:0; flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  td.c-home .text-success, td.c-away .text-success{ order:1; flex:0 0 auto; }          
  td.c-home .card-red, td.c-home .card-yellow,
  td.c-away .card-red, td.c-away .card-yellow{ order:2; flex:0 0 auto; }                
  td.c-score{ grid-area:score; align-self:center; text-align:center; font-size:15px; white-space:nowrap; }
  td.c-ht{ grid-area:ht; align-self:center; text-align:center; white-space:nowrap; display:block !important; }
  td.c-corner{ grid-area:corner; align-self:center; text-align:center; white-space:nowrap; display:block !important; }
  td.c-cht{ display:contents !important; }
  .c-cht .c-ht{ grid-area:ht; align-self:center; text-align:center; white-space:nowrap; display:block !important; color:var(--c-muted); font-size:13px; }
  .c-cht .c-corner{ grid-area:corner; align-self:center; text-align:center; white-space:nowrap; display:block !important; color:var(--c-muted); font-size:13px; }
  td.c-arrow, td.c-exp{ grid-area:exp; display:flex !important; align-items:center; justify-content:center; padding:0 !important; border:0; }
  td.c-ev{ grid-area:ev; display:flex !important; align-items:center; justify-content:center; padding:0 !important; border:0; }
}
.site-footer-grid{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:1.5rem; }
.site-footer .ft-col h4{ color:var(--c-line); font-size:.85rem; font-weight:700; margin:0 0 .6rem; text-transform:uppercase; letter-spacing:.03em; }
.site-footer .ft-col a{ display:block; color:var(--c-muted); text-decoration:none; padding:.2rem 0; }
.site-footer .ft-col a:hover{ color:var(--c-brand); }
.site-footer .ft-muted{ display:block; color:var(--c-muted); font-size:.8rem; padding:.2rem 0; }
.site-footer .ft-logo{ font-size:1.1rem; font-weight:800; color:#fff; margin-bottom:.5rem; }
.site-footer .ft-desc{ color:var(--c-muted); font-size:.82rem; line-height:1.5; max-width:340px; }
.site-footer-bottom{ border-top:1px solid var(--c-ink-2); text-align:center; padding:1rem; font-size:.8rem; color:var(--c-muted); }
@media (max-width:767.98px){
  .site-footer-grid{ grid-template-columns:1fr 1fr; gap:1rem; padding:1.5rem 10px}
  .site-footer-grid .ft-brand{ grid-column:1 / -1; }
}
.giai-dau-top-scorer tr:last-child td{
  border-bottom: 0;
}
.hm-user.dropdown-toggle .hm-avatar{
  width: 25px;
  height: 25px;
  border-radius: 50%;
}
@media (max-width:400px){ .site-footer-grid{ grid-template-columns:1fr; } }
@media (max-width: 767.98px) {
  .topbar { font-size: .78rem; }
  .topbar-links { gap: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap; }
  .topbar-links a { padding: .25rem .4rem; }
  main.container{
    padding: 0;
  }
  .card-yellow, .card-red{
    border-radius: 2px;
    padding: 0px 3px;
    font-size: 9px;
            height: 14px;
        line-height: 14px;
  }
  .matches .fs-14 {
    font-size: 12px;
  }
  .box{
    border-radius: 0;
    box-shadow: none;
    border: 0;
  }
  main.center .px-2.py-2{
    padding: 0 5px !important;
  }
  .btn.fs-14, .btn-active.fs-14{
    padding: 2px 5px 2px;
    font-size: 12px;
    margin-bottom: 5px;
  }
  .fs-heading-tab, .box > h2, .box > h3{
    font-size: 14px !important;
  }
  .form-control-sm{
    padding: 5px 5px 5px 10px;
    font-size: 12px;
  }
  nav ol.breadcrumb {
    padding: 5px;
    background: var(--c-surface-2);
  }
  nav ol.breadcrumb li, nav ol.breadcrumb a{
    font-size: 12px;
  }
  .right-sidebar .box li a.fs-15{
    font-size: 13px;
  }
  .right-sidebar,aside.left, aside.right{
    padding: 0 5px;
  }
  .px-lgh-2{
    padding-left: .5rem !important;
    padding-right: .5rem !important ;
  }
  .brand-logo{
      width: 131px;
  }
  .topbar-inner{
    min-height: 32px;
  }
}
html, body { overflow-x: hidden; max-width: 100%; }
input:focus, select:focus, textarea:focus, .form-control:focus, .form-select:focus{
  box-shadow: none;
  outline: none;
}
@media (max-width: 767.98px) {
  input, select, textarea, .form-control, .form-select { font-size: 13px !important; }
  .match-detail{
  padding: 0 5px;
  background: var(--c-surface-2);
}
.btn-active.fs-13, .btn.fs-13{
  padding: 3px 6px;
}
.wc-slider{
    padding: 0 5px;
}
.wc-slider .hd h2{
      font-size: 15px;
}
.wc-slider .hd h2 span{
      font-size: 11px !important;}
}
.c-exp{ width:34px; }
.lv-exp,.lv-ev{ border:0; background:transparent; color:var(--c-muted); cursor:pointer; padding:2px 5px; line-height:1; transition:color .15s; }
.lv-exp:hover,.lv-ev:hover{ color:var(--c-brand); }
.lv-exp i{ transition:transform .22s ease; display:inline-block; 
font-size: 10px;
    padding: 3px;
    color: #fff !important;
    font-weight: normal;
    border-radius: 3px;}
.lv-exp i{
    background: #438E0B;
}
.lv-exp.open i{
    background: #ff921c;
}
.lv-exp.open i,.lv-ev.open i{ transform:rotate(180deg); color:var(--c-brand); }
.c-ev{ display:none; }
.lv-detail>td{ background:var(--c-surface-2); border-top:0; }
.lv-det{ padding:10px; }
.lv-det-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media(max-width:767px){ .lv-det-grid{ grid-template-columns:1fr; } }
.lv-c1 iframe{ border-radius:8px; background:#0b6b34; }
.lv-flash{ height:100%; }
.lv-noanim{ height:340px; display:flex; flex-direction:column; gap:8px; align-items:center; justify-content:center; background:var(--c-line-2); border-radius:8px; color:var(--c-muted); font-size:13px; text-align:center; padding:10px; }
.lv-noanim i{ font-size:30px; }
.lv-detail .lv-det{
  background: #fff;
  border: 3px solid var(--c-surface-2);
  margin-bottom: 5px;
}
.lv-tabsmini button:last-child{margin-left: 5px;}
.lv-btns,.lv-tabsmini{gap:6px; margin-bottom:8px;text-align:center }
.lv-btns button:first-child{border-radius: 5px 0 0 5px;}
.lv-btns button:last-child{border-radius: 0 5px 5px 0}
.lv-btns button,.lv-tabsmini button{ border:1px solid var(--c-line); background:#fff; border-radius:5px; padding:5px 14px; font-size:13px; cursor:pointer; }
.lv-btns button.on{ background:var(--c-brand); color:#fff; border-color:var(--c-brand); }
.lv-tabsmini button{ padding:4px 12px; font-size:12px; }
.lv-tabsmini button.on{    background: #d6d6d6;
    color: #000;
    border-color: #c0c0c0;}
.lv-empty{ padding:14px; color:var(--c-muted); font-size:13px; text-align:center; }
.lvg-note{ font-size:11px; color:var(--c-muted); margin:6px 2px; }
.lvb2{ padding:5px 2px; }
.lvb2-lb{ text-align:center; font-size:12px; color:var(--c-text-2); font-weight:600; margin-bottom:4px; }
.lvb2-row{ display:flex; align-items:center; gap:8px; }
.lvb2-v{ flex:0 0 40px; font-size:13px; font-weight:700; }
.lvb2-v.hc{ text-align:left; color:#ea580c; } .lvb2-v.ac{ text-align:right; color:var(--c-accent); }
.lvb2-bars{ flex:1; display:flex; align-items:center; height:9px; }
.lvb2-l,.lvb2-r{ flex:1; height:100%; background:var(--c-line-2); border-radius:5px; overflow:hidden; display:flex; }
.lvb2-l{ justify-content:flex-end; margin-right:3px; } .lvb2-r{ margin-left:3px; }
.lvb2-l i,.lvb2-r i{ display:block; height:100%; border-radius:5px; transition:width .55s cubic-bezier(.22,1,.36,1); }
.lvb2-l i{ background:#ea580c; } .lvb2-r i{ background:var(--c-accent); }
.lvf-forms{ display:flex; justify-content:space-between; margin-bottom:8px; }
.res-dot{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; font-size:11px; font-weight:700; color:#fff; margin:0 1px; }
.res-dot.res-W{ background:var(--c-brand); } .res-dot.res-D{ background:var(--c-muted); } .res-dot.res-L{ background:var(--c-live); }
.mob-detail-box .lv-det{ padding:0; }
.fav-cnt{ display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px;
  padding:0 5px; margin-left:2px; border-radius:9px; background:var(--c-live); color:#fff; font-size:11px; font-weight:700; line-height:1; }
.tab-btn.active .fav-cnt{ background:#fff; color:var(--c-live); }
.lv-det-grid.lv-det-one{ grid-template-columns:1fr; }
@media (max-width: 639.98px) {
  table.table-layout-fixed { table-layout: auto !important; }
  .res-pane th:first-child, .res-pane td:first-child,
  .sched-pane th:first-child, .sched-pane td:first-child { width: 52px !important; white-space: normal !important; }
}
@media (max-width: 767.98px) {
  nav[aria-label="breadcrumb"] .breadcrumb { flex-wrap: nowrap; overflow: hidden; }
  nav[aria-label="breadcrumb"] .breadcrumb-item { white-space: nowrap; }
  nav[aria-label="breadcrumb"] .breadcrumb-item:last-child {
    display: block !important;           
    min-width: 0; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis;
  }
}
.lv-tabs h1{ flex-basis:100%; margin:0 0 2px; }
@media (max-width:767.98px){
  #live-body > tr:not(.lv-league-row):not(.lv-detail):not(.mob-detail){
    grid-template-columns:minmax(0,1fr) 26px 38px 40px 40px 42px 24px;
    grid-template-areas:
      "time time time corner corner corner ."
      "home exp score odd0 odd1 odd2 ev"
      "away exp score odd0 odd1 odd2 ev";
  }
  #live-body td.c-cht .c-ht{ display:none !important; }
  #live-body td.c-cht .c-corner{ grid-area:corner; align-self:center; justify-self:center; padding:0; font-size:12px; }
  #live-body td.c-cht .c-corner::before{ content:'⛳ '; }
  #live-body td.c-score{ grid-area:score; display:flex !important; flex-direction:column; align-items:center; justify-content:center; font-size:14px; padding:0 !important; }
  #live-body td.c-score .sc-wrap{ display:flex; flex-direction:column; align-items:center; line-height:1.5; }
  #live-body td.c-score .sc-sep{ display:none; }
  #live-body td.c-score .sc-h, #live-body td.c-score .sc-a{ color:var(--c-brand); font-weight:700; }
  #live-body td.c-odd{ display:flex !important; flex-direction:column; align-items:center; justify-content:center; padding:0 1px !important; font-size:11.5px; }
  #live-body td.c-odd{ grid-area:odd0; }
  #live-body td.c-odd ~ td.c-odd{ grid-area:odd1; }
  #live-body td.c-odd ~ td.c-odd ~ td.c-odd{ grid-area:odd2; }
  #live-body td.c-exp{ grid-area:exp; width:auto; display:flex !important; justify-content:center; align-items:center; padding:0 !important; }
  #live-body td.c-ev{ grid-area:ev; display:flex !important; justify-content:center; align-items:center; padding:0 !important; }
}

/* Tabs theo giai (league-tabs): mobile moi hang 3 nut bang nhau */
@media (max-width: 639.98px) {
  .league-tabs a { flex: 0 0 calc((100% - 8px) / 3); text-align: center; padding-left: 2px; padding-right: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* Badge nhan dinh tren trang chu: desktop o cot giua (hide-sm khi mobile), mobile chuyen len c-time canh lv-lg-tag */
.nd-b-time { display: none; }
.nd-b-sm { display: none; }
@media (max-width: 639.98px) {
  .nd-b-time { display: inline-block; margin-left: 4px; }
  .nd-b-sm { display: inline; }
}
