@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

:root { --brand: #059669; --brand-dark: #047857; }
body { background: #f1f5f9; color: #1f2937; font-family: 'Roboto', sans-serif; line-height: 1.5; }

/* Container căn giữa, 2 bên trống */
.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; }

/* Header + menu */

/* Topbar (thanh trên cùng): liên kết nhanh bên trái, đăng nhập/đăng ký bên phải */
.topbar { background: #f8fafc; border-bottom: 1px solid #e5e7eb; 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: #ecfdf5; }
.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: #d1fae5; font-size: .85rem; }
@media (max-width: 575.98px) { .site-header .brand-sub { display: none; } }

.menu { background: #065f46; 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: .75rem 1rem; font-size: .9rem; color:#fff;}
.menu a:hover { background: #065f46; color: #fff; }
.menu a.active { color: #ffff00; background: #065f46; border-bottom-color: #34d399; }

/* Footer */
.site-footer { background: #0f172a; color: #94a3b8; margin-top: 2rem; }
.site-footer .brand-em { color: #34d399; font-weight: 600; }

/* Layout 3 cột */
.layout { display: flex; flex-direction: column; gap: 1rem; padding: 1rem 0; }
.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;
  }
}
.fs-10{font-size: 10px;}
.fs-11{font-size: 11px;}
.fs-12{font-size: 12px;}
.fs-13{font-size: 13px;}
.fs-14{font-size: 14px;}
.fs-15{font-size: 15px;}
.fs-heading-tab{font-size: .93rem !important;}
.bg-gray{background:#f1f1f1;}

/* Box (card) */
.box {border-radius: 5px; box-shadow: 0 1px 2px rgba(0,0,0,.06); border: 1px solid #e2e8f0}
.box > h2, .box > h3 {padding:10px 8px 9px; background: linear-gradient(90deg, #059669, #22c55e); font-size: 13px; font-weight: 600; color: #fff; margin: 0;}
.box > h1 .hsub, .box > h2 .hsub, .box > h3 .hsub { font-weight: 400; color: #d1fae5; font-size: .72rem; }
.box > h4 { font-size: .9rem; font-weight: 600; padding: .7rem 1rem 0; color: #334155; margin: 0; }
.box ul { list-style: none; margin: 0; padding: 0; }
.box li { padding: .5rem .75rem; border-top: 1px solid #f1f5f9; }
.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;}
.live-red-card, .live-yellow-card { border-radius: 3px; padding: 0 3px}
.home-card .live-red-card, .home-card .live-yellow-card{display: inline-block;transform: rotate(351deg);transform-origin: center;}
.away-card .live-red-card, .away-card .live-yellow-card{display: inline-block;transform: rotate(-351deg);transform-origin: center;}
/* Bảng trận */
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: #f8fafc; border-bottom: 1px solid #e2e8f0;}
table.matches td, table.lv-table td { padding:.6rem; border-bottom: 1px solid #f1f5f9; vertical-align: middle; line-height: 18px }
@media (max-width: 575.98px) { table.matches td, table.matches thead th, table.lv-table td { padding: .5rem .35rem; } }
.livescore-yellow-card{background:#facc15;border-radius:3px;padding:0 4px;font-size:11px}
.white-space-nowrap{white-space:nowrap;}
.text-gray{color:#6b7280 !important;}
/* Livescore nhóm theo giải */
.lv-league {gap: .5rem;padding:7px 8px 8px}
.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 #e2e8f0; }
.lv-min  { width: 64px; color: #dc2626; font-weight: 700; }
.card-header{border-bottom: 1px solid #ececec;}
/* Bảng "Kết quả bóng đá" trong sidebar (gọn, cột đều, tên tối đa 2 dòng) */
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 #f1f5f9; }
table.res-table tbody tr:hover td { background: #ecfdf5; }
.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: #94a3b8; 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;
}
.sidebar-country-leagues a:last-child{
  border-bottom: none;
}
/* Tabs lọc */
.lv-tabs { display: flex; gap: .5rem; padding: .75rem; flex-wrap: wrap; border-bottom: 1px solid #e2e8f0; overflow-x: auto; }
.tab-btn {border-radius: 5px; border: 1px solid #cbd5e1}
.tab-btn:hover { background: #f1f5f9; }
.tab-btn.active, .btn-active { background: linear-gradient(90deg, #059669, #22c55e); color: #fff; border-color: transparent; box-shadow: 0 1px 3px rgba(0,0,0,.15); }
/* Badge "Nhận định" ở giữa cặp đấu (thay chữ vs) — nền tím nhạt, chữ tím đậm */
.nd-mid-badge{ background:#ede9fe; color:#6d28d9; font-weight:600; white-space:nowrap; }
.nd-mid-badge:hover{ background:#ddd6fe; color:#5b21b6; }
.card-red{background:#dc2626;color:#fff;border-radius:3px;padding:2px 4px;font-size:11px;}
.card-yellow{background:#facc15;color:#000;border-radius:3px;padding:2px 4px;font-size:11px;}
/* Phút trực tiếp + nhấp nháy */
.blink { animation: blink 1.1s steps(1, end) infinite; }
@keyframes blink { 50% { opacity: .2; } }

/* Tiện ích responsive */
.x-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 639.98px) { .hide-sm { display: none !important; } }
@media (max-width: 767.98px) { .d-hide-mobile { display: none !important; } }   /* ẩn trên di động */
@media (min-width: 768px)    { .d-hide-desktop { display: none !important; } }  /* ẩn trên desktop */
.hsub { font-weight: 400; color: #d1fae5; 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.fs-14, .btn-active.fs-14{
  padding: 6px 10px 3px;
}
.btn.fs-13, .btn-active.fs-13{
  padding: 5px 8px 2px;
}
.form-control-sm{
  line-height: 20px;
  padding: 7px 5px 5px 10px;
}
.form-control:focus{
  box-shadow: none;
  outline: none;
}
/* ============ Header: khu vực thành viên + nút menu di động ============ */
.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:#059669; }
.header-member .hm-register:hover{ background:#ecfdf5; }
.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:#34d399 !important; }
@media (min-width:768px){ .menu-member{ display:none; } }
@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 #1e293b; }
}

/* ============ Header responsive (mobile): topbar Menu, megamenu, quick icons, bottom nav ============ */
.tb-menu-btn{ display:none; }
.hdr-quick{ display:none; }
.megamenu{ display:none; }
.botnav{ display:none; }

@media (max-width:767.98px){
  /* Topbar: auth bên trái, nút Menu bên phải; ẩn các liên kết nhanh */
  .topbar-links{ display:none !important; }
  .topbar-auth{ flex:1; }
  .tb-menu-btn{ display:inline-flex; align-items:center; gap:6px; background:transparent; border:0; color:#374151; font-weight:700; font-size:.82rem; cursor:pointer; padding:.3rem .4rem; }
  .tb-menu-btn i{ font-size:1.05rem; }

  /* Header chính: nền xanh, logo trái + lối tắt (icon trên, text dưới) phải */
  .site-header.bg-white{ background:#fff; }
  .site-header-inner{ background:var(--brand); padding:.55rem .75rem; gap:8px; }
  .site-header-inner .nav-toggle{ display:none !important; }
  .site-header-inner .brand{ color:#fff; font-size:1.05rem; flex:none; }
  .hdr-quick{ display:flex; align-items:flex-start; gap:10px; margin-left:auto; }
  .hdr-quick a{ display:flex; flex-direction:column; align-items:center; gap:3px; color:#fff; text-decoration:none; font-size:.6rem; font-weight:600; line-height:1.1; text-align:center; white-space:nowrap; }
  .hdr-quick a span{ white-space:nowrap; }
  .hdr-quick a i{ font-size:1.05rem; }

  /* Ẩn thanh menu xanh ngang -> dùng megamenu */
  #mainMenu{ display:none !important; }

  /* Megamenu sổ xuống (dạng lưới đầy đủ) */
  /* Megamenu: phủ LÊN nội dung (absolute), hiệu ứng mượt bằng opacity + trượt */
  .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 #e5e7eb;
    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 #e5e7eb; border-radius:10px; color:#111; 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:#ecfdf5; }
  .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); }

  /* Thanh điều hướng cố định dưới cùng */
  .botnav{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:1000; background:#fff; border-top:1px solid #e5e7eb; box-shadow:0 -2px 10px rgba(0,0,0,.08); }
  .botnav a{ flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; padding:7px 2px; color:#64748b; text-decoration:none; font-size:.64rem; font-weight:600; }
  .botnav a i{ font-size:1.15rem; }
  .botnav a.active{ color:var(--brand); }
  body{ padding-bottom:58px; }
}

/* ============ Trang Kết quả: thu gọn trên di động ============ */
.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){
  /* Ẩn logo đội bóng (cho gọn) trong danh sách kết quả */
  .kq-results table.matches td.home-card img, .kq-results table.matches td.away-card img{ display:none; }
  /* lv-league: chỉ hiện tên giải + mũi tên; bấm -> Lịch/KQ/BXH xổ dạng dropdown */
  .lv-league{ position:relative; }
  .lv-league .lv-actions{
    display:flex !important; flex-direction:column; gap:0 !important;   /* thắng .d-flex của Bootstrap */
    position:absolute; top:calc(100% + 8px); right:0; z-index:35;
    min-width:80px; background:#fff; border:1px solid #e5e7eb; 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;
  }
  /* Thanh mũi tên (caret) chỉ lên phía nút */
  .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 #e5e7eb);
  }
  .lv-league.open .lv-actions{ opacity:1; visibility:visible; transform:translateY(0); }   /* thả từ trên xuống */
  .lv-league .lv-actions a{padding:5px 10px }
  .lv-league .lv-actions a:hover{ background:#ecfdf5; color:#059669 !important; text-decoration:none; }
  .lv-toggle{ display:inline-flex; align-items:center; }
  .lv-league{padding:4px;}
  .lv-league a{font-size: 12px;
    font-weight: normal !important;}
}

/* ============ Ô tìm giải đấu (partials/league-buttons.php) — dùng chung mọi trang ============ */
.league-btns .lq-row{ display:contents; }
.league-btns .lq-search{ position:relative; min-width:250px; }
.league-btns .lq-list{ position:absolute; z-index:30; left:0; right:0; top:100%; background:#fff; border:1px solid #e5e7eb; 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 #f3f4f6; }
.league-btns .lq-item:hover, .league-btns .lq-item.active{ background:#eff6ff; }
.league-btns .lq-item .s{ color:#9ca3af; }
/* Di động: input + nút tìm giải cùng 1 hàng, full chiều ngang, cao bằng nhau 30px (input ~80%, nút ~20%) */
@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; }
}

/* ============ Trang đăng nhập / đăng ký ============ */
.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 #e2e8f0; background:#fff; color:#334155; }
.btn-social:hover{ background:#f8fafc; color:#334155; }
.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 #e2e8f0; line-height:.1em; margin:1.1rem 0; }
.auth-or span{ background:#fff; padding:0 .7rem; color:#94a3b8; font-size:.8rem; }

/* ============ Mobile: livescore dạng thẻ (chỉ #live-body & #live-wrap) ============ */
.mob-only{ display:none; }
.lv-head-mobile, .lv-mob-head{ display:none; }
.mob-toggle{ background:transparent; border:0; color:#059669; 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; }

@media (max-width:767.98px){
  /* Header 4 cột cho di động */
  .lv-head-desktop{ display:none !important; }
  .lv-head-mobile, .lv-mob-head{
    display:grid; grid-template-columns:1fr 58px 46px 54px;
    background:#f1f5f9; font-size:12px; font-weight:700; color:#475569;
  }
  .lv-head-mobile th, .lv-mob-head > span{ padding:7px 6px; text-align:center; border:0; }
  .lv-head-mobile th:first-child, .lv-mob-head > span:first-child{ text-align:left; }

  /* Mỗi trận = 1 thẻ lưới (chỉ trong danh sách livescore) */
  #live-body, #live-wrap table.matches, #live-wrap tbody{ display:block; }
  #live-wrap table.matches{ margin:0; }
  #live-wrap .lv-league{ display:none; }  /* gộp phẳng trên di động (giải hiện ở mỗi thẻ) */

  #live-body > tr, #live-wrap tbody > tr{
    display:grid;
    grid-template-columns:auto 1fr 58px 46px 54px;
    grid-template-areas:
      "time   league score ht corner"
      "home   home   score ht corner"
      "away   away   score ht corner"
      "arrow  arrow  arrow  arrow  arrow";
    align-items:center;
    border-bottom:6px solid #f1f5f9;
    padding:4px 0 0;
  }
  #live-body > tr > td, #live-wrap tbody > tr > td{ display:block; border:0; padding:2px 6px; min-width:0; }
  #live-body > tr.mob-detail, #live-wrap tbody > tr.mob-detail{ display:block; border-bottom:6px solid #f1f5f9; }
  .mob-detail > td{ display:block; background:#f8fafc; padding:8px !important; }

  .c-star{ display:none !important; }
  td.c-time{ grid-area:time; white-space:nowrap; padding-right:2px; }
  td.c-league{ grid-area:league; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; color:#334155; }
  td.c-home{ grid-area:home; text-align:left !important; }
  td.c-away{ grid-area:away; text-align:left !important; }
  td.c-score{ grid-area:score; align-self:center; text-align:center; font-size:15px; }
  td.c-ht{ grid-area:ht; align-self:center; text-align:center; display:block !important; }
  td.c-corner{ grid-area:corner; align-self:center; text-align:center; display:block !important; }
  td.c-arrow{ grid-area:arrow; display:block !important; text-align:center; border-top:1px solid #eef2f6; padding:2px 0 !important; }
  .c-league .lg-badge{ display:none; }
  .c-league .lg-mob{ display:inline; }
}

/* ============ Footer responsive ============ */
.site-footer-grid{ display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:1.5rem; padding:2rem 0 1rem; }
.site-footer .ft-col h4{ color:#e2e8f0; font-size:.85rem; font-weight:700; margin:0 0 .6rem; text-transform:uppercase; letter-spacing:.03em; }
.site-footer .ft-col a{ display:block; color:#94a3b8; text-decoration:none; font-size:.85rem; padding:.2rem 0; }
.site-footer .ft-col a:hover{ color:#34d399; }
.site-footer .ft-muted{ display:block; color:#64748b; 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:#94a3b8; font-size:.82rem; line-height:1.5; max-width:340px; }
.site-footer-bottom{ border-top:1px solid #1e293b; text-align:center; padding:1rem; font-size:.8rem; color:#64748b; }
@media (max-width:767.98px){
  .site-footer-grid{ grid-template-columns:1fr 1fr; gap:1rem; padding:1.5rem 0 .5rem; }
  .site-footer-grid .ft-brand{ grid-column:1 / -1; }
}
.giai-dau-top-scorer tr:last-child td{
  border-bottom: 0;
}
@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: 1px 3px;
    font-size: 9px;
  }
  .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;
  }
  body{
    background: #fff;
  }
  .fs-heading-tab{
    margin: 0 5px !important;
    font-size: 13px !important;
  }
  .form-control-sm{
    padding: 5px 5px 5px 10px;
    font-size: 12px;
  }
  nav ol.breadcrumb {
    padding: 5px;
    background: #f1f1f1;
  }
  nav ol.breadcrumb li, nav ol.breadcrumb a{
    font-size: 12px;
  }
  .right-sidebar .box li a.fs-15{
    font-size: 13px;
  }
  .sidebar-bxh{
    padding: 0 5px;
  }
  .px-lgh-2{
    padding-left: .5rem !important;
    padding-right: .5rem !important ;
  }
}