/* ==========================================================================
   7M Core CSS - 99.9% Replica of https://live.7mvn9.com/
   Strict compliance with Global Rules:
   - NO border-radius (border-radius: 0 !important)
   - NO box-shadow, NO text-shadow
   - Root font size 16px, Body font size 100%
   - Compact layout, high information density
   ========================================================================== */

/* Resets & Base Elements */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    padding: 0;
    margin: 0;
}
ol, ul {
    list-style: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

.clear {
    clear: both;
    height: 0;
    line-height: 0;
    font-size: 0;
}
.clearfix::after {
    content: "";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}

/* ==========================================================================
   MODERN AIRY 7M HEADER SYSTEM & HOT MATCHES WIDGET
   Strict compliance with 7M Global Rules:
   - Unified 1250px container width
   - Border radius: 8px on cards, buttons, widgets
   - System Font: Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif
   - Pure white background surfaces (#ffffff), crisp and airy layout
   - No box-shadow, no text-shadow
   - Unified Dynamic Palette: Primary (#c90201), Secondary (#012058), Button (#c90201), Link (#c90201)
   ========================================================================== */

:root {
    --v7m-primary: #c90201;
    --v7m-primary-hover: #a80201;
    --v7m-primary-light: rgba(201, 2, 1, 0.08);
    --v7m-primary-border: rgba(201, 2, 1, 0.25);
    --v7m-secondary: #012058;
    --v7m-secondary-hover: #07173e;
    --v7m-secondary-light: rgba(1, 32, 88, 0.08);
    --v7m-btn-color: #c90201;
    --v7m-btn-hover: #a80201;
    --v7m-link-color: #c90201;
    --v7m-link-hover: #a80201;
}

.v7m-site-header,
.v7m-header-system {
    width: 100% !important;
    max-width: 100% !important;
    position: sticky;
    top: 0;
    z-index: 500;
    background-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    box-sizing: border-box;
}

.v7m-header-container {
    width: 100% !important;
    max-width: 1250px !important;
    margin: 0 auto !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
}

/* 1. TOP BAR (Brand, Tagline, Location, Live Weather, Dynamic Date & Quick Tools) */
.v7m-head-topbar {
    width: 100%;
    background-color: #ffffff;
    border-bottom: 1px solid #f1f3f5;
    padding: 10px 0 8px 0;
    box-sizing: border-box;
}

.v7m-topbar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

/* Left: Brand Box */
.v7m-brand-box {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex-shrink: 0;
    min-width: 175px;
}

.v7m-brand-link {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    line-height: 1;
}

.v7m-brand-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.v7m-brand-7m {
    font-size: 28px;
    font-weight: 800;
    color: var(--v7m-primary, #c90201);
    letter-spacing: -0.5px;
    line-height: 1;
}

.v7m-brand-sport {
    font-size: 11px;
    font-weight: 700;
    background: var(--v7m-secondary, #012058);
    color: #ffffff;
    padding: 3px 6px;
    border-radius: 4px !important;
    letter-spacing: 0.8px;
    line-height: 1;
}

.v7m-brand-img {
    height: 54px !important;
    max-height: 56px !important;
    width: auto !important;
    min-width: 165px;
    max-width: 220px;
    object-fit: contain;
    display: block;
}

.v7m-brand-slogan {
    font-size: 11px;
    color: #6c757d;
    font-weight: 400;
    white-space: nowrap;
    letter-spacing: -0.1px;
    line-height: 1.2;
}

/* Middle: Meta Info (Location, Weather, Date) */
.v7m-head-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    margin-left: 18px;
}

.v7m-top-sep {
    height: 22px;
    width: 1px;
    background-color: #e5e7eb;
    display: inline-block;
}

.v7m-meta-weather {
    display: inline-flex;
    align-items: center;
    position: relative;
}

/* Modern Compact Weather Dropdown */
.v7m-weather-dropdown-wrap {
    position: relative;
}

.v7m-weather-trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: none;
    padding: 3px 6px;
    border-radius: 6px !important;
    cursor: pointer;
    color: inherit;
    font-family: inherit;
    transition: background-color 0.15s ease;
    line-height: 1.2;
}

.v7m-weather-trigger:hover,
.v7m-weather-trigger[aria-expanded="true"] {
    background: rgba(0, 0, 0, 0.04);
}

.v7m-weather-loc {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

.v7m-loc-caret {
    color: #9ca3af;
    transition: transform 0.2s ease;
}

.v7m-weather-trigger[aria-expanded="true"] .v7m-loc-caret,
.v7m-weather-dropdown-wrap.is-open .v7m-loc-caret {
    transform: rotate(180deg);
}

.v7m-weather-meta-info {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.v7m-w-icon-slot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.v7m-w-temp-val {
    font-size: 13.5px;
    font-weight: 600;
    color: #1f2937;
}

/* Compact Weather Dropdown Menu */
.v7m-weather-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 100010;
    min-width: 210px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px !important;
    padding: 6px;
    display: none;
    flex-direction: column;
    box-sizing: border-box;
}

.v7m-weather-dropdown-wrap.is-open .v7m-weather-menu {
    display: flex;
}

.v7m-weather-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 8px 6px;
    border-bottom: 1px solid #f1f5f9;
    margin-bottom: 4px;
}

.v7m-wm-title {
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.v7m-wm-badge {
    font-size: 10px;
    padding: 1px 5px;
    background: #f1f5f9;
    color: #475569;
    border-radius: 4px !important;
    font-weight: 500;
}

.v7m-weather-menu-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.v7m-weather-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 6px 8px;
    border: none;
    background: transparent;
    border-radius: 6px !important;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    color: #334155;
    transition: background 0.12s ease, color 0.12s ease;
    text-align: left;
}

.v7m-weather-item:hover {
    background: #f8fafc;
    color: var(--v7m-primary, #c90201);
}

.v7m-weather-item.is-active {
    background: var(--v7m-primary-light, rgba(201, 2, 1, 0.08));
    color: var(--v7m-primary, #c90201);
    font-weight: 600;
}

.v7m-wi-meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.v7m-wi-icon {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.v7m-wi-temp {
    font-size: 13px;
    font-weight: 600;
    min-width: 26px;
    text-align: right;
}

/* Legacy Fallbacks */
.v7m-meta-loc {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    cursor: default;
}

.v7m-meta-sun {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13.5px;
    font-weight: 600;
    color: #1f2937;
}

.v7m-meta-date {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #4b5563;
    white-space: nowrap;
}

/* Right: Tools & Utilities */
.v7m-head-tools {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.v7m-top-link {
    font-size: 13.5px;
    color: #374151;
    text-decoration: none;
    font-weight: 500;
    padding: 4px 6px;
    border-radius: 6px !important;
    transition: color 0.15s ease;
    white-space: nowrap;
}

.v7m-top-link:hover {
    color: var(--v7m-primary, #c90201);
}

.v7m-top-link-c1 {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--v7m-primary, #c90201);
    font-weight: 600;
}

.v7m-tool-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 10px;
    background: #ffffff;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    color: #374151;
    cursor: pointer;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.15s ease;
    box-shadow: none !important;
}

.v7m-tool-btn:hover {
    border-color: var(--v7m-primary, #c90201) !important;
    color: var(--v7m-primary, #c90201);
    background: var(--v7m-primary-light, rgba(201, 2, 1, 0.08));
}

.v7m-btn-search {
    width: 34px;
    padding: 0;
}

.v7m-btn-user {
    gap: 5px;
    padding: 0 10px;
}

.v7m-btn-bell {
    width: 34px;
    padding: 0;
    position: relative;
}

.v7m-bell-dot {
    position: absolute;
    top: 7px;
    right: 7px;
    width: 6px;
    height: 6px;
    border-radius: 50% !important;
    background-color: #ef4444;
}

.v7m-btn-drawer {
    display: none;
    width: 34px;
    padding: 0;
    border: 1px solid #e5e7eb !important;
}

/* 2. MAIN NAVIGATION BAR (Crisp White, Spacious, High Contrast) */
.v7m-head-navbar {
    width: 100%;
    background-color: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    box-sizing: border-box;
}

.v7m-navbar-inner {
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.v7m-nav-scroll-wrap {
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.v7m-nav-scroll-wrap::-webkit-scrollbar {
    display: none;
}

.v7m-nav-app-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none !important;
    border-radius: 8px !important;
    margin-left: 12px;
    flex-shrink: 0;
    transition: all 0.2s ease;
    box-shadow: none !important;
    height: 32px;
    box-sizing: border-box;
    white-space: nowrap;
}

.v7m-nav-app-btn:hover {
    background: var(--v7m-primary-hover, #a80201) !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.v7m-nav-app-btn svg {
    flex-shrink: 0;
}

.v7m-main-menu,
.v7m-nav-list {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 4px;
    white-space: nowrap;
}

.v7m-main-menu li,
.v7m-nav-list li {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
}

.v7m-main-menu li a,
.v7m-nav-list li a {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: #1f2937;
    text-decoration: none;
    border-radius: 6px !important;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.v7m-main-menu li a:hover,
.v7m-nav-list li a:hover {
    color: var(--v7m-primary, #c90201);
    background-color: var(--v7m-primary-light, rgba(201, 2, 1, 0.08));
}

.v7m-main-menu li.current-menu-item a,
.v7m-main-menu li.current_page_item a,
.v7m-main-menu li.active a,
.v7m-main-menu li.on a,
.v7m-main-menu li a.active,
.v7m-main-menu li a.on,
.v7m-nav-list li.current-menu-item a,
.v7m-nav-list li.current_page_item a,
.v7m-nav-list li.active a,
.v7m-nav-list li.on a,
.v7m-nav-list li a.active,
.v7m-nav-list li a.on {
    color: var(--v7m-primary, #c90201) !important;
    font-weight: 600 !important;
    background-color: var(--v7m-primary-light, rgba(201, 2, 1, 0.08)) !important;
}

/* 3. WIDGET TRẬN HOT NHẤT TUẦN NÀY (Carousel Strip - Stadium Bg & Primary Glassmorphism Overlay) */
.v7m-hot-week-strip {
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: var(--v7m-secondary, #012058);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding: 8px 0;
    box-sizing: border-box;
}

.v7m-hot-week-strip .container {
    position: relative;
    z-index: 2;
}

.v7m-hot-week-card {
    position: relative;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px !important;
    overflow: hidden;
    box-sizing: border-box;
}

.v7m-hot-carousel {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    padding: 0 4px;
}

.v7m-hot-carousel::-webkit-scrollbar {
    display: none;
}

.v7m-hot-item {
    flex: 0 0 178px;
    min-width: 178px;
    max-width: 195px;
    padding: 8px 12px;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    box-sizing: border-box;
    transition: background-color 0.15s ease;
}

.v7m-hot-item:last-child {
    border-right: none;
}

.v7m-hot-item:hover {
    background-color: rgba(255, 255, 255, 0.08);
}

.v7m-hot-status {
    font-size: 11.5px;
    color: rgba(255, 255, 255, 0.75);
    display: flex;
    align-items: center;
    gap: 5px;
    line-height: 1.2;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.v7m-hot-live-dot {
    width: 6px;
    height: 6px;
    border-radius: 50% !important;
    background-color: #ef4444;
    display: inline-block;
    animation: v7m-pulse 1.4s infinite;
}

@keyframes v7m-pulse {
    0% { transform: scale(0.9); opacity: 0.8; }
    50% { transform: scale(1.3); opacity: 1; }
    100% { transform: scale(0.9); opacity: 0.8; }
}

.v7m-hot-team {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    line-height: 1.3;
}

.v7m-hot-team-name {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.v7m-hot-logo {
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex-shrink: 0;
    display: block;
}

.v7m-hot-logo-ph {
    width: 16px;
    height: 16px;
    border-radius: 50% !important;
    background-color: rgba(255, 255, 255, 0.2);
    flex-shrink: 0;
    display: block;
}

.v7m-hot-name-text {
    font-size: 13px;
    color: #ffffff;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.v7m-hot-score {
    font-size: 13px;
    font-weight: 600;
    color: #ffffff;
    flex-shrink: 0;
    min-width: 12px;
    text-align: right;
}

.v7m-hot-score.is-winner {
    color: #f87171;
    font-weight: 700;
}

/* Arrow controls on the hot matches strip */
.v7m-hot-arrow {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.35);
    border: none;
    cursor: pointer;
    z-index: 5;
    color: #ffffff;
    transition: all 0.15s ease;
    box-shadow: none !important;
}

.v7m-hot-prev {
    left: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.v7m-hot-next {
    right: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.v7m-hot-arrow:hover {
    background-color: var(--v7m-primary, #c90201);
    color: #ffffff;
}

.v7m-hot-arrow.is-disabled {
    opacity: 0.25;
    pointer-events: none;
}

/* SIDEBAR WIDGET: TRẬN HOT NHẤT TUẦN NÀY */
.v7m-sb-hot-week {
    border-radius: 8px !important;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    margin-bottom: 14px;
    box-sizing: border-box;
}

.v7m-sb-hot-list {
    display: flex;
    flex-direction: column;
    padding: 4px 0;
}

.v7m-sb-hot-row {
    display: flex;
    flex-direction: column;
    padding: 8px 12px;
    border-bottom: 1px solid #f1f3f5;
    text-decoration: none;
    transition: background 0.15s ease;
}

.v7m-sb-hot-row:last-child {
    border-bottom: none;
}

.v7m-sb-hot-row:hover {
    background-color: #f8fafc;
}

.v7m-sb-hot-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11.5px;
    color: #6b7280;
    margin-bottom: 4px;
}

.v7m-sb-hot-league {
    font-weight: 500;
    color: #4b5563;
}

.v7m-sb-hot-status.is-live {
    color: var(--v7m-primary, #c90201);
    font-weight: 600;
}

.v7m-sb-hot-match {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.v7m-sb-hot-side {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    overflow: hidden;
}

.v7m-sb-hot-side.away-side {
    justify-content: flex-end;
}

.v7m-sb-team-logo {
    width: 18px;
    height: 18px;
    object-fit: contain;
    flex-shrink: 0;
}

.v7m-sb-team-name {
    font-size: 13px;
    color: #1f2937;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.v7m-sb-team-score {
    font-size: 13px;
    font-weight: 700;
    color: var(--v7m-primary, #c90201);
    min-width: 14px;
    text-align: center;
}

.v7m-sb-hot-vs {
    font-size: 11px;
    color: #9ca3af;
    font-style: italic;
    flex-shrink: 0;
}

/* EXPANDABLE SEARCH OVERLAY BAR (Clean Modern Light Theme) */
.v7m-search-bar {
    width: 100%;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb !important;
    box-sizing: border-box;
    position: relative;
    z-index: 99;
    animation: v7mSlideDown 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes v7mSlideDown {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.v7m-search-bar.is-hidden {
    display: none !important;
}

.v7m-search-inner {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100% !important;
    max-width: 1250px !important;
    margin: 0 auto !important;
    padding: 8px 12px !important;
    box-sizing: border-box !important;
}

.v7m-search-form {
    flex: 1;
    min-width: 0;
    margin: 0;
}

.v7m-search-input-wrap {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 8px !important;
    padding: 0 4px 0 10px;
    height: 36px;
    box-sizing: border-box;
    transition: all 0.15s ease;
}

.v7m-search-input-wrap:focus-within {
    border-color: var(--v7m-primary, #c90201);
}

.v7m-search-icon {
    color: var(--v7m-primary, #c90201);
    flex-shrink: 0;
    margin-right: 8px;
}

.v7m-header-search-input {
    flex: 1;
    height: 100%;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    font-size: 13.5px;
    font-weight: 400;
    color: #1f2937;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    padding: 0 6px 0 0;
    min-width: 0;
}

.v7m-header-search-input::placeholder {
    color: #94a3b8;
    font-size: 13px;
}

.v7m-search-clear-btn {
    background: #f1f5f9;
    border: none !important;
    border-radius: 6px !important;
    color: #64748b;
    cursor: pointer;
    width: 22px;
    height: 22px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.v7m-search-clear-btn:hover {
    background: #e2e8f0;
    color: #1e293b;
}

.v7m-search-clear-btn.is-hidden {
    display: none !important;
}

.v7m-search-submit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    padding: 0 12px;
    background: var(--v7m-btn-color, #c90201) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 12.5px;
    font-weight: 500;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: opacity 0.15s ease;
}

.v7m-search-submit-btn:hover {
    background: var(--v7m-btn-hover, #a80201) !important;
}

/* Quick Hot Tags */
.v7m-search-quick-tags {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.v7m-quick-label {
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.v7m-quick-tag {
    background: #ffffff;
    border: 1px solid #e2e8f0 !important;
    border-radius: 6px !important;
    color: #475569;
    font-size: 11.5px;
    font-weight: 500;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    padding: 4px 8px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s ease;
    line-height: 1.2;
}

.v7m-quick-tag:hover {
    border-color: var(--v7m-primary, #c90201) !important;
    color: var(--v7m-primary, #c90201);
    background: var(--v7m-primary-light, rgba(201, 2, 1, 0.08));
}

/* Close Button */
.v7m-search-close-btn {
    width: 32px;
    height: 32px;
    background: #ffffff;
    border: 1px solid #e2e8f0 !important;
    border-radius: 6px !important;
    color: #64748b;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.v7m-search-close-btn:hover {
    border-color: #ef4444 !important;
    color: #ef4444;
    background: #fef2f2;
}

/* Responsive (< 1024px & < 768px) */
@media (max-width: 1024px) {
    .v7m-head-meta {
        display: none !important;
    }
    .v7m-btn-drawer {
        display: inline-flex !important;
    }
    .v7m-top-link {
        display: none !important;
    }
    .v7m-top-sep {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .v7m-head-topbar {
        padding: 6px 0;
    }
    .v7m-brand-box {
        min-width: 120px;
    }
    .v7m-brand-img {
        height: 38px !important;
        max-height: 42px !important;
        min-width: 120px;
        max-width: 150px;
    }
    .v7m-brand-7m {
        font-size: 22px;
    }
    .v7m-brand-slogan {
        display: none;
    }
    .v7m-btn-user span {
        display: none;
    }
    .v7m-btn-user {
        padding: 0;
        width: 34px;
    }
    .v7m-hot-item {
        flex: 0 0 155px;
        min-width: 155px;
        padding: 6px 10px;
    }
    .v7m-search-quick-tags {
        display: none !important;
    }
    .v7m-search-inner {
        padding: 6px 10px !important;
        gap: 8px;
    }
    .v7m-search-input-wrap {
        height: 34px;
        padding: 0 4px 0 8px;
    }
    .v7m-search-submit-btn {
        height: 26px;
        padding: 0 9px;
        font-size: 11.5px;
    }
    .v7m-search-close-btn {
        width: 30px;
        height: 30px;
    }
    .v7m-header-search-input {
        font-size: 12.5px;
    }
    .v7m-header-search-input::placeholder {
        font-size: 12px;
    }
}

/* 4. Secondary Category / Sub-Navigation Strip (Synchronized Swipe) */
.v7m-subnav-strip {
    width: 100%;
    background-color: #0a1c29;
    height: 42px;
    line-height: 42px;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    box-sizing: border-box;
}

.v7m-subnav-inner {
    display: flex;
    align-items: center;
    height: 42px;
    padding: 0 12px;
    width: 100%;
    box-sizing: border-box;
}

.v7m-subnav-scroll {
    display: flex;
    align-items: center;
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.v7m-subnav-scroll::-webkit-scrollbar {
    display: none;
}

.v7m-subnav-list {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 4px;
    flex-wrap: nowrap;
}

.v7m-subnav-list li {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
}

.v7m-subnav-list li a {
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    height: 42px;
    color: #cbd5e1;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    border-radius: 8px !important;
    border: none !important;
    border-bottom: 3px solid transparent !important;
    transition: all 0.15s ease;
    white-space: nowrap;
    box-shadow: none !important;
}

.v7m-subnav-list li a:hover {
    color: #ffffff;
    border-bottom-color: var(--v7m-primary, #c90201) !important;
}

.v7m-subnav-list li.current-menu-item a,
.v7m-subnav-list li.current_page_item a,
.v7m-subnav-list li.active a,
.v7m-subnav-list li.on a,
.v7m-subnav-list li a.active,
.v7m-subnav-list li a.on {
    color: #ffffff !important;
    font-weight: 500 !important;
    border-bottom-color: var(--v7m-primary, #c90201) !important;
    background: rgba(9, 179, 99, 0.16) !important;
}

/* 5. Synchronized Slide-Out Drawer Navigation */
.v7m-drawer-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 9999990 !important;
    opacity: 0;
    visibility: hidden;
    transition: all 0.25s ease;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.v7m-drawer-overlay.is-active {
    opacity: 1;
    visibility: visible;
}

body.v7m-drawer-open {
    overflow: hidden !important;
}

.v7m-drawer-panel {
    position: fixed;
    top: 0;
    right: -320px;
    width: 310px;
    max-width: 86vw;
    height: 100%;
    background: var(--v7m-secondary, #012058) !important;
    z-index: 9999999 !important;
    display: flex;
    flex-direction: column;
    transition: right 0.28s cubic-bezier(0.16, 1, 0.3, 1);
    border-radius: 8px 0 0 8px !important;
    border: none !important;
    box-shadow: -6px 0 28px rgba(0, 0, 0, 0.45) !important;
}

.v7m-drawer-panel.is-active {
    right: 0;
}

.v7m-drawer-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 58px;
    padding: 0 14px;
    background: #ffffff !important;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
    border-radius: 8px 0 0 0 !important;
}

.v7m-drawer-logo a {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.v7m-drawer-logo img,
.v7m-drawer-logo-img {
    height: 38px !important;
    max-height: 38px !important;
    width: auto !important;
    max-width: 180px !important;
    object-fit: contain !important;
    display: block !important;
}

.v7m-drawer-close-btn {
    background: #f1f5f9 !important;
    border: none !important;
    border-radius: 8px !important;
    color: #0f172a !important;
    cursor: pointer;
    width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
}

.v7m-drawer-close-btn:hover {
    background: var(--v7m-primary, #c90201) !important;
    color: #ffffff !important;
}

.v7m-drawer-body {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 12px 14px;
}

.v7m-drawer-section-title {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border-left: 3px solid var(--v7m-primary, #c90201) !important;
    padding: 7px 12px !important;
    border-radius: 4px !important;
    letter-spacing: 0.5px;
    margin: 10px 0 8px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
}

.v7m-drawer-menu {
    list-style: none;
    margin: 0 0 12px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.v7m-drawer-menu li {
    margin: 0;
    padding: 0;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 8px !important;
    overflow: hidden;
}

.v7m-drawer-menu li:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
}

.v7m-drawer-menu li a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 10px 8px;
    color: #ffffff !important;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
    min-height: 42px;
    box-sizing: border-box;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.v7m-drawer-menu li a:hover {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

.v7m-drawer-menu li.current-menu-item a,
.v7m-drawer-menu li.active a,
.v7m-drawer-menu li.on a,
.v7m-drawer-menu li a.active,
.v7m-drawer-menu li a.on {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    border-color: var(--v7m-primary, #c90201) !important;
    box-shadow: 0 2px 8px rgba(201, 2, 1, 0.4) !important;
}

/* Contacts 24/7 Grid */
.v7m-drawer-contacts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 12px;
}

.v7m-drawer-cbtn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 8px;
    border-radius: 8px !important;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer;
    min-height: 42px;
    box-sizing: border-box;
    transition: all 0.15s ease;
}

.v7m-drawer-cbtn:hover {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: var(--v7m-primary, #c90201) !important;
    color: #ffffff !important;
}

.v7m-drawer-cbtn svg {
    flex-shrink: 0;
}

/* Meta status info */
.v7m-drawer-meta-box {
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 8px 12px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12.5px;
}

.v7m-drawer-meta-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.v7m-drawer-meta-label {
    color: #94a3b8;
}

.v7m-drawer-meta-val {
    color: #e2e8f0;
    font-weight: 600;
}

.v7m-drawer-footer {
    margin-top: auto;
    padding: 12px 14px;
    background: rgba(0, 0, 0, 0.3) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0 0 0 8px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 13.5px;
    color: #cbd5e1;
}

.v7m-drawer-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.v7m-drawer-row span {
    color: #e2e8f0;
    font-size: 13px;
    font-weight: 500;
}

.v7m-sound-btn {
    padding: 6px 16px !important;
    background: #334155 !important;
    background-image: none !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    min-width: 60px;
    transition: all 0.15s ease;
}

.v7m-sound-btn.is-on {
    background: var(--v7m-primary, #c90201) !important;
}

.v7m-drawer-cta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 6px 16px !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    border: none !important;
    min-width: 90px;
    transition: opacity 0.15s ease;
}

.v7m-drawer-cta:hover {
    opacity: 0.9;
    color: #ffffff;
}

/* ==========================================================================
   MAIN CONTENT WRAPPER (100% FULL-WIDTH SYNCHRONIZED ACROSS THEME)
   ========================================================================== */
#content {
    width: 100% !important;
    max-width: 1250px !important;
    margin: 8px auto !important;
    text-align: left;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 0 12px !important;
    box-sizing: border-box !important;
}

.v7m-page-container,
.v7m-vip-content-layout {
    width: 100% !important;
    max-width: 1250px !important;
    margin: 8px auto !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
}

.page-full-main,
.v7m-vip-main-container,
#cCenter,
.v7m-main-col {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
    box-sizing: border-box !important;
}

#cRight,
.single-sidebar,
.v7m-sidebar-col,
.site-sidebar {
    width: 310px !important;
    flex: 0 0 310px !important;
    min-width: 310px !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* Float Ads Left / Right for Wide Screens */
.float-ad-left, .float-ad-right {
    position: fixed;
    top: 120px;
    width: 120px;
    z-index: 100;
    display: none;
}
.float-ad-left {
    left: calc(50% - 625px - 135px);
}
.float-ad-right {
    right: calc(50% - 625px - 135px);
}
@media (min-width: 1540px) {
    .float-ad-left, .float-ad-right {
        display: block;
    }
}
.float-ad-left img, .float-ad-right img {
    width: 120px;
    display: block;
    margin-bottom: 8px;
    border: 1px solid #ccc;
}

/* Odds Fluctuations Indicators (Green Drop / Red Rise) */
.odds-up {
    color: #cc0000 !important;
    font-weight: bold !important;
}
.odds-up::after {
    content: " ↑";
    font-size: 10px;
    color: #cc0000;
    font-weight: bold;
}
.odds-down {
    color: #008800 !important;
    font-weight: bold !important;
}
.odds-down::after {
    content: " ↓";
    font-size: 10px;
    color: #008800;
    font-weight: bold;
}
.odds-filter-btn.active {
    color: #cc0000 !important;
    font-weight: bold !important;
}

/* ==========================================================================
   LEFT SIDEBAR: BẢNG KÊ CÁC GIẢI (League Selector)
   ========================================================================== */
#cLeft {
    width: 138px;
    flex-shrink: 0;
}
.league-box {
    background: #ffffff;
    border: 1px solid #9daddb;
    margin-bottom: 8px;
}
.league-box-header {
    background: #4a75b5;
    color: #ffffff;
    font-size: 11px;
    font-weight: bold;
    padding: 5px 6px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.league-box-tools {
    background: #eef3f9;
    border-bottom: 1px solid #d4dde5;
    padding: 3px 6px;
    font-size: 11px;
    display: flex;
    justify-content: space-between;
}
.league-box-tools a {
    color: #0b5fc9;
    font-size: 11px;
    text-decoration: none;
}
.league-box-tools a:hover {
    text-decoration: underline;
}
.league-list {
    max-height: 520px;
    overflow-y: auto;
    padding: 2px 4px;
}
.league-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    padding: 2px 2px;
    border-bottom: 1px dotted #e2e2e2;
    cursor: pointer;
}
.league-item:hover {
    background-color: #f1f6fc;
}
.league-item label {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 105px;
}
.league-item input[type="checkbox"] {
    margin: 0;
}
.league-item .l-badge {
    color: #cc0000;
    font-size: 10px;
    font-family: Arial, sans-serif;
}

/* ==========================================================================
   CENTER COLUMN: MAIN LIVESCORE & ODDS (100% WIDTH FIT)
   ========================================================================== */
#cCenter {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 0;
    min-width: 0;
    box-sizing: border-box !important;
}

/* Control Toolbar (.lfun) - Authoritative High-Contrast Sports Bar */
.lfun {
    background: #0f2637;
    color: #ffffff;
    min-height: 42px;
    padding: 6px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 15px;
    margin-bottom: 8px;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    box-sizing: border-box;
    width: 100% !important;
    flex-wrap: wrap;
    gap: 8px;
}
.lfunLeft {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.lfun-date-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-weight: 700;
    font-size: 14px;
    color: #94a3b8;
}
.lfunLeft a {
    color: #e2e8f0;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    padding: 4px 10px;
    transition: all 0.15s ease;
    border-radius: 0 !important;
}
.lfunLeft a:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
}
.lfunLeft a.active {
    font-weight: 700;
    color: #ffffff;
    background: var(--v7m-primary, #c90201);
    background-image: none;
}
.lfunLeft .sep {
    color: rgba(255, 255, 255, 0.25);
    font-size: 14px;
}
.lfunLeft .hide-count {
    color: #ef4444;
    font-weight: bold;
}

.lfunRight {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #cbd5e1;
    font-weight: 600;
    flex-wrap: wrap;
}
.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 20px;
    cursor: pointer;
    border: 1px solid #bbbbbb;
    background: #ffffff;
    color: #444444;
    border-radius: 0 !important;
    box-shadow: none !important;
    user-select: none;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}
.btn-icon:hover {
    background: #eeeeee;
    border-color: #999999;
}
.btn-icon.active {
    background: #15b25f;
    color: #ffffff;
    border-color: #0f8a49;
}
.btn-icon.active:hover {
    background: #0e964f;
}
.btn-icon.muted {
    background: #f2f2f2;
    color: #888888;
    border-color: #cccccc;
}
.btn-icon svg {
    width: 13px;
    height: 13px;
    display: block;
    fill: currentColor;
    pointer-events: none;
}
/* Universal Hidden Helper */
.is-hidden {
    display: none !important;
}

/* Inline SVG vector helper */
.v7m-inline-icon {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
    pointer-events: none;
}


#btn-sound-toggle .svg-sound-off {
    display: none !important;
}
#btn-sound-toggle .svg-sound-on {
    display: block !important;
}
#btn-sound-toggle.muted .svg-sound-on {
    display: none !important;
}
#btn-sound-toggle.muted .svg-sound-off {
    display: block !important;
}
#btn-win-toggle.muted .svg-win-on {
    display: none !important;
}
#btn-win-toggle.muted .svg-win-off {
    display: block !important;
}
.btn-icon.spinning svg,
#btn-reload-table.spinning svg,
#btn-reload-basket.spinning svg {
    animation: sevenmSpin 0.6s linear infinite;
}
@keyframes sevenmSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.search-team-box {
    margin-left: 6px;
}
.search-team-box input {
    height: 20px;
    font-size: 11px;
    padding: 1px 4px;
    border: 1px solid #999999;
    width: 105px;
}

/* Secondary Function Bar (Ẩn / Hiện trận đã chọn) */
.fun_sec {
    background: #f8f8f8;
    border: 1px solid #dcdcdc;
    border-top: none;
    height: 24px;
    line-height: 24px;
    padding: 0 8px;
    font-size: 11px;
    color: #666666;
    margin-top: -4px;
    margin-bottom: 4px;
}
.fun_sec a {
    color: #0000cc;
    text-decoration: none;
}
.fun_sec a:hover {
    color: #cc0000;
    text-decoration: underline;
}
.fun_sec span {
    color: #cccccc;
    margin: 0 4px;
}

/* Notice Bar */
.notice-bar {
    background: #fffcee;
    border: 1px solid #e0c388;
    padding: 4px 8px;
    font-size: 11px;
    color: #444444;
    margin-bottom: 4px;
    display: flex;
    justify-content: space-between;
}
.notice-bar span.icon-live {
    color: #cc0000;
    font-weight: bold;
}

/* ==========================================================================
   2IN1 LIVESCORE TABLE
   ========================================================================== */
.table-wrap {
    width: 100%;
    background: #ffffff;
    border: 1px solid #cccccc;
    margin-bottom: 8px;
}
table.live {
    width: 100%;
    font-size: 11px;
    border-collapse: collapse;
}

/* Table Header */
table.live tr.tHead td {
    background: #4278ad;
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    height: 24px;
    line-height: 24px;
    padding: 0 2px;
    border: 1px solid #366594;
    font-size: 11px;
}

/* League Section Header */
tr.matchClass td {
    background: #eef3f9;
    color: #003366;
    font-weight: bold;
    height: 22px;
    line-height: 22px;
    padding: 0 4px;
    border-top: 1px solid #b6cde2;
    border-bottom: 1px solid #b6cde2;
    text-align: left;
}
tr.matchClass .color-tag {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 4px;
    vertical-align: middle;
}
tr.matchClass a.toggle-league {
    color: #003366;
    text-decoration: none;
    cursor: pointer;
}

/* Match Rows */
table.live tr.tbg0 td {
    background: #f7f9fc;
    border-bottom: 1px solid #e3e8ee;
    padding: 4px 2px;
    height: 26px;
    line-height: 1.25;
}
table.live tr.tbg1 td {
    background: #ffffff;
    border-bottom: 1px solid #e3e8ee;
    padding: 4px 2px;
    height: 26px;
    line-height: 1.25;
}


/* Highlight Flash Animation when a goal is scored */
@keyframes goalFlash {
    0% { background-color: #ffff66 !important; }
    50% { background-color: #ff9999 !important; }
    100% { background-color: #ffff66 !important; }
}
table.live tr.goal-highlight td {
    animation: goalFlash 1s ease-in-out infinite;
}

/* Cell Alignments & Columns */
table.live td.th_chk { width: 22px; text-align: center; }
table.live td.th_time { width: 38px; text-align: center; font-family: Arial, sans-serif; font-size: 11px; color: #555555; }
table.live td.th_state { width: 50px; text-align: center; font-size: 11px; font-weight: bold; }
table.live td.th_home { width: 155px; text-align: right; padding-right: 6px; }
table.live td.th_score { width: 52px; text-align: center; font-weight: bold; font-family: Arial, sans-serif; }
table.live td.th_away { width: 155px; text-align: left; padding-left: 6px; }
table.live td.th_odds { width: 185px; text-align: center; }
table.live td.th_data { width: 62px; text-align: center; }
table.live td.th_top { width: 24px; text-align: center; }

/* Status Text Colors & Live Pulse */
@keyframes sevenmLiveBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.35; }
}
.status-live {
    color: #cc0000 !important;
    font-weight: bold;
    animation: sevenmLiveBlink 1.8s infinite ease-in-out;
}
.icon-live {
    animation: sevenmLiveBlink 1.5s infinite ease-in-out;
    display: inline-block;
}
.status-ht { color: #0000ff !important; font-weight: bold; }
.status-ft { color: #888888 !important; }
.status-postponed { color: #ff6600 !important; }
.status-upcoming { color: #333333 !important; }

/* Teams & Scores */
.team-name {
    color: #0000cc;
    font-weight: normal;
    text-decoration: none;
}
.team-name:hover {
    color: #ff3300;
    text-decoration: underline;
}
.team-rank {
    font-size: 10px;
    color: #999999;
    font-weight: normal;
    margin: 0 2px;
}
.card-red {
    display: inline-block;
    width: 10px;
    height: 12px;
    background: #e60000;
    color: #ffffff;
    font-size: 9px;
    line-height: 12px;
    text-align: center;
    font-weight: bold;
    margin: 0 2px;
    vertical-align: middle;
}
.card-yellow {
    display: inline-block;
    width: 10px;
    height: 12px;
    background: #ffcc00;
    color: #000000;
    font-size: 9px;
    line-height: 12px;
    text-align: center;
    font-weight: bold;
    margin: 0 2px;
    vertical-align: middle;
}

/* Score display */
.score-main {
    font-size: 13px;
    font-weight: bold;
    color: #0000cc;
    display: block;
}
.score-main.live-goal {
    color: #cc0000;
}
.score-ht {
    font-size: 10px;
    color: #888888;
    font-weight: normal;
}

/* Odds Boxes (Handicap, Over/Under, 1X2) */
.odds-box-wrap {
    display: flex;
    justify-content: center;
    gap: 3px;
    font-size: 10px;
    font-family: Arial, Tahoma, sans-serif;
}
.odds-col {
    width: 58px;
    background: #ffffff;
    border: 1px solid #d4dde5;
    padding: 1px 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.odds-col span {
    font-size: 10px;
    line-height: 1.2;
}
.odds-val {
    color: #005f73;
    font-weight: normal;
}
.odds-line {
    color: #cc0000;
    font-weight: bold;
}
.odds-up {
    color: #cc0000 !important;
}
.odds-down {
    color: #008800 !important;
}

/* Data & Utility Icons */
.data-icons {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
}
.icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 15px;
    height: 14px;
    line-height: 1;
    font-size: 8.5px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-weight: 700;
    text-align: center;
    text-decoration: none !important;
    letter-spacing: -0.4px;
    padding: 0 1px;
    border-radius: 0 !important;
    box-shadow: none !important;
    user-select: none;
}
.icon-ana { background: #337ab7; color: #ffffff !important; } /* PT - Phân tích H2H */
.icon-sta { background: #f0ad4e; color: #ffffff !important; } /* TL - Tỷ lệ kèo */
.icon-bir { background: #d9534f; color: #ffffff !important; } /* TT - Trực tiếp */

.icon-ana:hover { background: #286090; }
.icon-sta:hover { background: #ec971f; }
.icon-bir:hover { background: #c9302c; }

.icon-top {
    color: #999999;
    cursor: pointer;
    font-size: 12px;
}
.icon-top.pinned {
    color: #cc0000;
    font-weight: bold;
}

/* Pinned Row Styling */
tr.is-pinned td {
    background: #fffbe6 !important;
    border-bottom: 2px solid #f0ad4e !important;
}

/* ==========================================================================
   RIGHT SIDEBAR: SETTINGS & TOOLS (LEGACY)
   ========================================================================== */
.side-box {
    background: #ffffff;
    border: 1px solid #9daddb;
    margin-bottom: 8px;
}
.side-box-tabs {
    display: flex;
    background: #eef3f9;
    border-bottom: 1px solid #9daddb;
}
.side-box-tabs .tab-item {
    flex: 1;
    font-size: 11px;
    text-align: center;
    padding: 4px 2px;
    cursor: pointer;
    border-right: 1px solid #d4dde5;
    color: #555555;
}
.side-box-tabs .tab-item.active {
    background: #ffffff;
    font-weight: bold;
    color: #003366;
    border-bottom: 1px solid #ffffff;
}
.tab-content {
    padding: 6px;
    font-size: 11px;
}
.tab-content .field-group {
    margin-bottom: 6px;
}
.tab-content label {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    font-size: 11px;
}
.tab-content select {
    width: 100%;
    font-size: 11px;
    padding: 2px;
    border: 1px solid #cccccc;
}
.font-size-switcher {
    display: flex;
    gap: 4px;
    margin-top: 3px;
}
.font-size-btn {
    flex: 1;
    text-align: center;
    background: #f0f0f0;
    border: 1px solid #cccccc;
    padding: 1px 0;
    cursor: pointer;
    font-size: 10px;
}
.font-size-btn.active {
    background: #4278ad;
    color: #ffffff;
    border-color: #366594;
}

/* App Download Banner */
.side-app-banner {
    background: #ffffff;
    border: 1px solid #cccccc;
    padding: 6px;
    text-align: center;
    margin-bottom: 8px;
}
.side-app-banner h4 {
    font-size: 12px;
    color: #15b25f;
    margin-bottom: 4px;
    font-weight: bold;
}
.side-app-banner img {
    width: 90px;
    height: 90px;
    margin: 4px auto;
    display: block;
}
.side-app-banner p {
    font-size: 10px;
    color: #666666;
}

/* ==========================================================================
   BOTTOM SEO CONTENT & FRIENDSHIP LINKS
   ========================================================================== */
.seo-section {
    background: #ffffff;
    border: 1px solid #cccccc;
    padding: 12px 16px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.6;
    color: #333333;
}
.seo-section h1 {
    font-size: 18px;
    color: #cc0000;
    font-weight: bold;
    text-align: center;
    margin-bottom: 10px;
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 6px;
}
.seo-section h2, .seo-section h3 {
    font-size: 14px;
    color: #003366;
    margin: 10px 0 4px 0;
    font-weight: bold;
}
.seo-section p {
    margin-bottom: 8px;
    text-align: justify;
}
.seo-section ul, .seo-section ol {
    margin: 6px 0 10px 20px;
    list-style: disc;
}
.seo-section li {
    margin-bottom: 4px;
}

/* ==========================================================================
   SEO CONTENT BODY - MAX HEIGHT 350PX & AUTO SCROLL (NO RADIUS, NO SHADOW)
   ========================================================================== */
.seo-content-body {
    max-height: 350px;
    overflow-y: auto;
    padding-right: 8px;
    margin-top: 8px;
    margin-bottom: 12px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    padding: 10px 14px;
    box-sizing: border-box;
}

/* Custom compact scrollbar */
.seo-content-body::-webkit-scrollbar {
    width: 6px;
}
.seo-content-body::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 0 !important;
}
.seo-content-body::-webkit-scrollbar-thumb {
    background: #005a2b;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.seo-content-body::-webkit-scrollbar-thumb:hover {
    background: #003d1d;
}

/* SEO Figure & Images */
.seo-content-body figure {
    margin: 14px auto;
    text-align: center;
    max-width: 100%;
}
.seo-content-body img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 8px auto;
    border: 1px solid #ccd5e0;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.seo-content-body figcaption {
    font-size: 12px;
    font-style: italic;
    color: #555555;
    margin-top: 6px;
    text-align: center;
    line-height: 1.4;
}

/* FAQ Accordion Schema */
.faq-wrap {
    margin-top: 12px;
    border-top: 1px solid #eeeeee;
    padding-top: 8px;
}
.faq-item {
    margin-bottom: 6px;
    border: 1px solid #e2e8ee;
}
.faq-question {
    background: #f7f9fc;
    padding: 6px 10px;
    font-weight: bold;
    font-size: 12px;
    color: #0b5fc9;
    cursor: pointer;
}
.faq-answer {
    padding: 8px 10px;
    font-size: 12px;
    background: #ffffff;
    border-top: 1px solid #e2e8ee;
}

/* Bottom Fast Buttons - Unified 7M Web Style */
.bottomBt {
    text-align: center;
    margin: 16px 0 12px 0;
    padding: 6px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.btn-nav-foot {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 20px !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    margin: 4px !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    line-height: 1.4 !important;
    cursor: pointer;
    transition: background 0.15s ease-in-out, transform 0.15s ease-in-out;
}
.btn-nav-foot:hover {
    background: var(--v7m-primary-hover, #ba0000) !important;
    background-image: none !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* ==========================================================================
   HOMEPAGE PREDICTIONS BLOCK (10 POSTS / 5 COLUMNS)
   Strict Global Rules: border-radius: 0 !important; box-shadow: none !important;
   ========================================================================== */
.hp-predictions-wrap {
    background: #ffffff;
    border: 1px solid #cccccc;
    margin: 8px 0 10px 0;
    padding: 6px;
    box-sizing: border-box;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.hp-block-header {
    background: #0e2238;
    color: #ffffff;
    padding: 6px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-left: 3px solid #00c058;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.hp-block-header-left {
    display: flex;
    align-items: center;
    gap: 6px;
}

.hp-block-icon {
    font-size: 13px;
    line-height: 1;
}

.hp-block-title {
    font-size: 12.5px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: 0.2px;
    text-transform: uppercase;
}

.hp-block-tag {
    background: #00b853;
    color: #ffffff;
    font-size: 9.5px;
    font-weight: 700;
    padding: 1px 6px;
    display: inline-block;
    border-radius: 0 !important;
    letter-spacing: 0.3px;
}

.hp-block-more-link {
    color: #00c058;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
}

.hp-block-more-link:hover {
    color: #ffffff;
    text-decoration: underline;
}

.hp-predictions-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 6px !important;
    margin-top: 6px !important;
}

.hp-pred-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 5px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.hp-pred-card:hover {
    border-color: #00b853 !important;
    background: #ffffff !important;
}

.hp-pred-card-thumb {
    position: relative;
    width: 100%;
    height: 88px;
    overflow: hidden;
    background: #0c1a24;
    border-radius: 0 !important;
}

.hp-pred-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0 !important;
    border: none !important;
}

.hp-pred-badge-league {
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(14, 34, 56, 0.9);
    color: #ffffff;
    font-size: 9px;
    font-weight: 700;
    padding: 1px 5px;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    border-radius: 0 !important;
    max-width: 90%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-left: 2px solid #00c058;
}

.hp-pred-card-body {
    padding: 5px 2px 2px 2px;
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: space-between;
}

.hp-pred-meta {
    font-size: 10.5px;
    color: #64748b;
    margin-bottom: 2px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.hp-pred-title {
    font-size: 11.5px;
    line-height: 1.35;
    margin: 0 0 4px 0;
    height: 31px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-weight: 700;
}

.hp-pred-title a {
    color: #1e293b;
    text-decoration: none;
}

.hp-pred-title a:hover {
    color: #00b853;
}

.hp-pred-action {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 3px;
    border-top: 1px dashed #e2e8f0;
    margin-top: 2px;
}

.hp-pred-btn-read {
    color: #cc0000;
    font-size: 10.5px;
    font-weight: 700;
    text-decoration: none;
}

.hp-pred-btn-read:hover {
    text-decoration: underline;
    color: #b30000;
}

.hp-pred-btn-h2h {
    color: #0088cc;
    font-size: 10px;
    text-decoration: none;
}

.hp-pred-btn-h2h:hover {
    text-decoration: underline;
}

/* Friendship Links (.link) */
.link-box {
    background: #ffffff;
    border: 1px solid #cccccc;
    padding: 8px 12px;
    margin-bottom: 12px;
    font-size: 11px;
}
.link-box .link_title {
    font-weight: bold;
    color: #333333;
    margin-bottom: 4px;
}
.link-box .link_list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
}
.link-box .link_list a {
    color: #555555;
    font-size: 11px;
    text-decoration: none;
}
.link-box .link_list a:hover {
    color: #cc0000;
    text-decoration: underline;
}

/* ==========================================================================
   FOOTER (Exact 7M Original Dark Footer)
   ========================================================================== */
/* ==========================================================================
   FOOTER (Clean & Minimalist 7M Sports Footer - 100% Natural Uncompressed Arial)
   ========================================================================== */
.footer,
.v7m-site-footer,
.v7m-vip-footer {
    width: 100% !important;
    background: var(--v7m-secondary, #012058) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    text-align: left !important;
    margin-top: 24px !important;
    box-sizing: border-box !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    letter-spacing: normal !important;
    font-stretch: normal !important;
    color: #94a3b8 !important;
    position: relative;
    overflow: hidden;
}

.footer .footer-container,
.v7m-footer-container,
.footer-container {
    width: 100% !important;
    max-width: 1250px !important;
    margin: 0 auto !important;
    padding: 28px 12px 20px 12px !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

/* Main Footer Grid */
.v7m-footer-grid {
    display: grid;
    grid-template-columns: 2.2fr 3.2fr 2fr;
    gap: 32px;
    margin-bottom: 24px;
    align-items: start;
}
.v7m-footer-nav-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}

/* Column 1: Brand & Bio */
.v7m-fcol-brand {
    display: flex;
    flex-direction: column;
}
.v7m-fbrand-header {
    margin-bottom: 12px;
}
.v7m-fbrand-logo {
    display: inline-block;
    text-decoration: none;
}
.v7m-fbrand-img {
    max-height: 38px;
    width: auto;
    display: block;
}
.v7m-fbrand-text {
    font-size: 24px;
    font-weight: 700;
    color: #ffffff;
    text-decoration: none;
    letter-spacing: normal !important;
}
.v7m-fbrand-main {
    color: #0088cc;
}
.v7m-fbrand-sub {
    color: #00b853;
}
.v7m-fbrand-desc {
    font-size: 14px !important;
    line-height: 1.65 !important;
    color: #8193a5 !important;
    margin: 0 !important;
    letter-spacing: normal !important;
    font-stretch: normal !important;
}
.v7m-fbrand-desc strong {
    color: #e2e8f0;
    font-weight: 500;
}

/* Columns 2 & 3: Headings & Menus */
.v7m-fcol-heading {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    margin: 0 0 14px 0 !important;
    padding-bottom: 6px !important;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
    display: inline-block;
    letter-spacing: normal !important;
    font-stretch: normal !important;
    text-transform: uppercase;
}
.v7m-fmenu {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.v7m-fmenu li {
    margin: 0 !important;
    padding: 0 !important;
}
.v7m-fmenu li a {
    color: #94a3b8 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-decoration: none;
    display: inline-block;
    letter-spacing: normal !important;
    font-stretch: normal !important;
    transition: color 0.15s ease;
}
.v7m-fmenu li a:hover {
    color: #ffffff !important;
}

/* Column 4: Contact & Support (Flat & Neutral, No Gradients) */
.v7m-fcol-contact {
    display: flex;
    flex-direction: column;
}
.v7m-fcontact-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 12px;
}
.v7m-fbtn {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 8px !important;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
    box-shadow: none !important;
    cursor: pointer;
    text-align: left;
    width: 100%;
    box-sizing: border-box;
    transition: background 0.2s ease, border-color 0.2s ease;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 13.5px !important;
    letter-spacing: normal !important;
    font-stretch: normal !important;
}
.v7m-fbtn:hover {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: var(--v7m-primary, #c90201) !important;
    color: #ffffff !important;
}
.v7m-fbtn-icon {
    flex-shrink: 0;
    color: #94a3b8;
}
.v7m-fbtn:hover .v7m-fbtn-icon {
    color: #ffffff;
}

/* 2. Bottom Copyright & Sub Links */
.v7m-fbottom-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 13px !important;
    letter-spacing: normal !important;
    font-stretch: normal !important;
    color: #64748b;
}
.v7m-fcopyright strong {
    color: #94a3b8;
}
.v7m-fbottom-links {
    display: flex;
    align-items: center;
    gap: 8px;
}
.v7m-fbottom-links a {
    color: #64748b;
    text-decoration: none;
    font-size: 13px;
    letter-spacing: normal !important;
    transition: color 0.15s ease;
}
.v7m-fbottom-links a:hover {
    color: #cbd5e1;
}
.v7m-fdot {
    color: #475569;
}

/* Toast Message */
.v7m-toast-box {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    background: #0f172a;
    color: #ffffff;
    padding: 10px 18px;
    border-radius: 8px !important;
    font-size: 12.5px;
    z-index: 99999;
    border: none !important;
    box-shadow: none !important;
    text-align: center;
    line-height: 1.5;
    transition: opacity 0.3s ease;
}
.v7m-toast-box strong {
    color: #38bdf8;
}

/* ==========================================================================
   MODALS (Timezone, League Selector, Odds Guide)
   ========================================================================== */
.modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    z-index: 9999;
    justify-content: center;
    align-items: center;
}
.modal-box {
    background: #ffffff;
    border: 2px solid #366594;
    width: 500px;
    max-width: 95vw;
}
.modal-header {
    background: #4278ad;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    padding: 6px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.modal-header .btn-close {
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
}
.modal-body {
    padding: 12px;
    font-size: 12px;
    max-height: 70vh;
    overflow-y: auto;
}

/* Goal Popup Toast */
#goal-toast {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #cc0000;
    color: #ffffff;
    padding: 10px 16px;
    font-size: 13px;
    font-weight: bold;
    z-index: 10000;
    border: 2px solid #ffffff;
}

/* ==========================================================================
   7M Match Analysis & Tips Box Styles
   ========================================================================== */
.analysis-topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f0f4f9;
    border: 1px solid #ccd0d4;
    padding: 6px 12px;
    margin-bottom: 8px;
    font-size: 12px;
}
.analysis-topbar .topbar-left {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.analysis-topbar .topbar-left a {
    color: #003366;
    text-decoration: none;
}
.analysis-topbar .topbar-left a:hover {
    text-decoration: underline;
}
.analysis-topbar .topbar-current {
    font-weight: bold;
    color: #cc0000;
}
.analysis-topbar .topbar-right {
    display: flex;
    align-items: center;
    gap: 8px;
}
.analysis-topbar .btn-live-switch {
    color: #15b25f;
    font-weight: bold;
    text-decoration: none;
}
.analysis-topbar .btn-odds-switch {
    color: #005f73;
    font-weight: bold;
    text-decoration: none;
}

.match-banner-box {
    background: #ffffff;
    border: 1px solid #cccccc;
    padding: 16px;
    margin-bottom: 10px;
    text-align: center;
}
.match-banner-league {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 6px;
}
.match-banner-row h2 {
    font-size: 22px;
    color: #0000cc;
    margin-bottom: 4px;
}
.match-team-sub {
    font-size: 12px;
    color: #666666;
}
.team-rank-badge {
    font-size: 13px;
    color: #888888;
}
.banner-score-main {
    font-size: 32px;
    font-weight: bold;
    color: #cc0000;
    line-height: 1;
}
.banner-status-text {
    font-size: 11px;
    font-weight: bold;
    color: #15b25f;
    margin-top: 4px;
}
.banner-ht-text {
    font-size: 11px;
    color: #888888;
}

.analysis-tabs .tabs-track {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    width: 100%;
}
.analysis-tabs a {
    display: inline-block;
    padding: 5px 12px;
    background: #ffffff;
    border: 1px solid #ccd0d4;
    color: #003366;
    font-size: 11.5px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.analysis-tabs a:hover,
.analysis-tabs a.active {
    background: #00385f;
    color: #ffffff;
    border-color: #00385f;
}

.tips-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    font-size: 12px;
}
.tips-table td {
    padding: 6px 10px;
}
.tips-badge {
    display: inline-block;
    padding: 1px 4px;
    font-size: 10.5px;
    font-weight: bold;
    margin: 0 1px;
}
.tips-badge-w { background: #e6f4ea; color: #137333; border: 1px solid #ceead6; }
.tips-badge-d { background: #fef7e0; color: #b06000; border: 1px solid #feefc3; }
.tips-badge-l { background: #fce8e6; color: #c5221f; border: 1px solid #fad2cf; }

.tips-analysis-box {
    background: #fcf8e3;
    border: 1px solid #faebcc;
    border-left: 4px solid #f0ad4e;
    padding: 10px 14px;
    margin: 10px 0 6px 0;
    font-size: 13px;
    line-height: 1.6;
    color: #333333;
}

.h2h-summary-bar {
    background: #eef5fc;
    border: 1px solid #d0e1f9;
    border-left: 4px solid #366594;
    padding: 8px 12px;
    font-size: 11.5px;
    line-height: 1.5;
    color: #1e3a8a;
    margin-bottom: 6px;
}

/* Basketball LiveScore Animations & UI */
.live-glow {
    color: #cc0000 !important;
    font-weight: bold;
    animation: basketLiveGlow 1.2s infinite alternate;
}
@keyframes basketLiveGlow {
    from { opacity: 1; }
    to { opacity: 0.4; }
}

.point-flash {
    background-color: #fee2e2 !important;
    animation: pointFlashAnim 2s ease-out;
}
@keyframes pointFlashAnim {
    0% { background-color: #fca5a5; }
    100% { background-color: transparent; }
}

.search-basket-box input {
    height: 22px;
    line-height: 22px;
    border: 1px solid #ccc;
    font-size: 11px;
    padding: 0 6px;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none;
}

/* ==========================================================================
   SINGLE POST LAYOUT & 7M SPORTS SIDEBAR
   Compliant with Global Rules: border-radius: 0, box-shadow: none
   ========================================================================== */
.single-layout-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    width: 100% !important;
    max-width: 100% !important;
    margin: 6px auto;
    padding: 0 10px;
    box-sizing: border-box !important;
    align-items: flex-start;
}

.single-main-col {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
}

.single-sidebar {
    width: 320px;
    flex: 0 0 320px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.single-article-card {
    background: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    padding: 16px 20px;
    font-size: 13.5px;
    line-height: 1.65;
    color: #24292f;
    margin-bottom: 8px;
}

.single-breadcrumb {
    font-size: 12px;
    color: #64748b;
    margin-bottom: 12px;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 8px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.single-breadcrumb a {
    color: #475569;
    text-decoration: none;
    transition: color 0.15s ease;
}
.single-breadcrumb a:hover {
    color: #0088cc;
}
.single-breadcrumb .breadcrumb-sep {
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}
.single-breadcrumb .breadcrumb-current {
    color: #1e293b;
    max-width: 650px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.single-title {
    font-size: 21px;
    line-height: 1.35;
    color: #0f172a;
    font-weight: 600;
    margin: 8px 0 12px 0;
}

.single-meta {
    font-size: 13px;
    color: #64748b;
    margin-bottom: 16px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    background: #f8fafc;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}
.single-meta-dot {
    color: #cbd5e1;
    font-size: 11px;
    user-select: none;
}
.single-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #64748b;
    font-size: 13px;
    font-weight: 400;
}
.single-meta-item .v7m-inline-icon {
    color: #94a3b8;
    flex-shrink: 0;
}
.single-meta-item a {
    color: #0088cc;
    text-decoration: none;
}
.single-meta-item a:hover {
    color: #006699;
    text-decoration: underline;
}

/* Hide legacy quickbar and league tags if cached */
.single-match-quickbar,
.single-league-tag {
    display: none !important;
}

.single-featured-banner {
    margin-bottom: 16px;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    text-align: center;
    background: #0c1a24;
    overflow: hidden;
}
.single-banner-img {
    width: 100%;
    height: auto;
    display: block;
    border: none !important;
    border-radius: 8px 8px 0 0 !important;
}
.single-banner-caption {
    background: #f8fafc;
    font-size: 13px;
    color: #64748b;
    padding: 6px 12px;
    border: none !important;
    font-style: italic;
    border-radius: 0 0 8px 8px !important;
}

.single-content-body {
    font-size: 16px;
    line-height: 1.8;
    color: #1f2937;
    text-align: justify;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

.v7m-updating-notice {
    font-size: 15px !important;
    color: #64748b !important;
    background: #f8fafc !important;
    border: 1px dashed #cbd5e1 !important;
    border-radius: 8px !important;
    padding: 28px 20px !important;
    text-align: center !important;
    margin: 20px 0 !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    letter-spacing: normal !important;
}
.single-content-body .bottomBt,
.single-content-body .prediction-bottom-actions {
    display: none !important;
}
.single-content-body h2 {
    font-size: 18px;
    font-weight: bold;
    color: #00385f;
    border-left: 5px solid #00b853 !important;
    border-top: none !important;
    border-bottom: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    padding: 8px 12px;
    margin: 22px 0 12px 0;
    background: #f1f5f9;
}
.single-content-body h3 {
    font-size: 17px;
    font-weight: bold;
    color: #166534;
    margin: 16px 0 8px 0;
}
.single-content-body figure.wp-block-image {
    margin: 18px 0;
    text-align: center;
}
.single-content-body figure.wp-block-image img {
    max-width: 100%;
    height: auto;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: block;
    margin: 0 auto;
}
.single-content-body figcaption {
    font-size: 14.5px;
    color: #64748b;
    margin-top: 6px;
    font-style: italic;
}
.single-content-body ul, .single-content-body ol {
    padding-left: 20px;
    margin: 10px 0;
}
.single-content-body li {
    margin-bottom: 4px;
}

/* Expert Recommendation Box - Clean Basic Table with Natural Colors */
.prediction-expert-box {
    background-color: #f8fafc !important;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 22px 0 20px 0 !important;
    overflow: hidden !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.prediction-expert-header {
    background: #1e3a2b !important; /* Natural forest deep slate */
    color: #ffffff !important;
    padding: 10px 16px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    border: none !important;
    border-radius: 8px 8px 0 0 !important;
    box-sizing: border-box !important;
}

.prediction-expert-icon {
    width: 18px !important;
    height: 18px !important;
    stroke: #34d399 !important; /* Soft natural emerald mint */
    flex-shrink: 0 !important;
}

.prediction-expert-title {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
    font-weight: 500 !important; /* Semi-regular, NO bold */
    color: #ffffff !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    line-height: 1.3 !important;
}

.prediction-expert-table-wrap {
    width: 100% !important;
    overflow-x: auto !important;
    border: none !important;
    border-radius: 0 0 8px 8px !important;
}

.prediction-expert-table {
    width: 100% !important;
    max-width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    border: none !important;
    margin: 0 !important;
    font-size: clamp(12px, 0.8vw + 9.5px, 15px) !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

.prediction-expert-table thead tr {
    background-color: #e9f0ec !important; /* Soft natural sage mist */
    border: none !important;
}

.prediction-expert-table th {
    background-color: #e9f0ec !important;
    color: #2d3748 !important;
    padding: 9px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important; /* No bold */
    text-align: left !important;
    border: none !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
}

.pred-col-market {
    width: 42% !important;
}

.pred-col-tip {
    width: 58% !important;
}

.prediction-expert-table tbody tr {
    border: none !important;
    transition: background-color 0.15s ease !important;
}

.prediction-expert-table tbody tr:nth-child(odd) {
    background-color: #ffffff !important;
}

.prediction-expert-table tbody tr:nth-child(even) {
    background-color: #f7faf8 !important; /* Gentle natural off-white sage */
}

.prediction-expert-table tbody tr:hover {
    background-color: #edf4ef !important; /* Subtle natural hover highlight */
}

.prediction-expert-table td {
    padding: 10px 16px !important;
    vertical-align: middle !important;
    border: none !important;
    line-height: 1.5 !important;
}

.pred-cell-market {
    color: #334155 !important; /* Natural slate graphite */
    font-weight: 500 !important;
}

.pred-cell-tip {
    color: #1e293b !important;
}

.pred-pick-badge {
    display: inline-flex !important;
    align-items: center !important;
    background-color: var(--v7m-primary-light, rgba(201, 2, 1, 0.08)) !important;
    color: var(--v7m-primary, #c90201) !important;
    padding: 4px 10px !important;
    border-radius: 8px !important;
    border: none !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    word-break: break-word !important;
}

.pred-score-text {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    color: #334155 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.pred-score-val {
    background-color: #fef2f2 !important; /* Soft natural rose tint */
    color: #dc2626 !important; /* Natural warm red for score */
    padding: 3px 9px !important;
    border-radius: 8px !important;
    border: none !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    display: inline-block !important;
    line-height: 1.3 !important;
}

/* Fallback for legacy list/score if rendered */
.prediction-expert-list {
    margin: 0 !important;
    padding: 12px 20px !important;
    list-style: none !important;
    color: #334155 !important;
    font-size: 14.5px !important;
    line-height: 1.8 !important;
}
.prediction-expert-list li {
    margin-bottom: 6px !important;
}
.prediction-expert-score {
    background-color: #fef2f2 !important;
    color: #dc2626 !important;
    padding: 2px 8px !important;
    border-radius: 8px !important;
    border: none !important;
    font-weight: 500 !important;
}


/* Prediction Bottom Action Buttons - Synced with 7M .btn-nav-foot */
.prediction-bottom-actions {
    text-align: center;
    margin: 16px 0 12px 0;
    padding: 6px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.prediction-bottom-actions br {
    display: none !important;
}
.prediction-bottom-actions .pred-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 10px 22px !important;
    background: #4278ad !important;
    color: #ffffff !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    margin: 4px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    line-height: 1.4 !important;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
}
.prediction-bottom-actions .pred-btn:hover {
    background: #366594 !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

.single-tags-row {
    margin-top: 18px;
    padding-top: 12px;
    border-top: 1px solid #f1f5f9;
    font-size: 12px;
    color: #64748b;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
.single-tags-row .tags-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #475569;
    font-weight: 500;
}
.single-tags-row .tag-link a {
    background: #f1f5f9;
    border: none !important;
    border-radius: 8px !important;
    color: #475569;
    padding: 3px 8px;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}
.single-tags-row .tag-link a:hover {
    background: #0088cc;
    color: #ffffff;
}

.single-prev-next {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #f1f5f9;
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    gap: 12px;
}
.single-prev-next .pn-item {
    flex: 1;
    min-width: 0;
}
.single-prev-next .pn-prev .pn-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #0088cc;
    text-decoration: none;
    max-width: 100%;
}
.single-prev-next .pn-next .pn-link {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    color: #0088cc;
    text-decoration: none;
    max-width: 100%;
    float: right;
}
.single-prev-next .pn-link span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 320px;
}
.single-prev-next .pn-link:hover {
    color: #006699;
    text-decoration: underline;
}

.single-related-box {
    background: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    padding: 14px 16px;
    margin-bottom: 8px;
}
.single-related-header {
    font-size: 13px;
    font-weight: 600;
    color: #00385f;
    border-bottom: 2px solid #00b853;
    padding-bottom: 8px;
    margin-bottom: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.single-related-header .srh-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.single-related-header .srh-all {
    color: #0088cc;
    text-decoration: none;
    font-size: 12px;
    font-weight: 400;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}
.single-related-header .srh-all:hover {
    color: #006699;
    text-decoration: underline;
}
.single-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.single-related-item {
    background: #f8fafc;
    border: none !important;
    border-radius: 8px !important;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.rel-thumb-link {
    display: block;
    overflow: hidden;
    border-radius: 8px !important;
    border: none !important;
    background: #0c1a24;
}
.rel-thumb-img {
    width: 100%;
    height: 100px;
    object-fit: cover;
    display: block;
    border: none !important;
    border-radius: 8px !important;
}
.rel-title {
    font-size: 13px;
    line-height: 1.4;
    margin: 0;
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.rel-title a {
    color: #1e293b;
    text-decoration: none;
}
.rel-title a:hover {
    color: #0088cc;
}
.rel-date {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px;
    color: #94a3b8;
}

/* Sidebar Box Styles */
.sidebar-box {
    display: block !important;
    width: 100% !important;
    background: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    margin-bottom: 14px !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    height: auto !important;
    min-height: min-content !important;
    max-height: none !important;
    box-sizing: border-box !important;
}
.sidebar-box-header {
    background: var(--v7m-secondary, #012058) !important;
    background-image: none !important;
    color: #ffffff;
    padding: 10px 14px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    border: none !important;
    border-radius: 8px 8px 0 0 !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
}
.sidebar-box-header .sb-title {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #ffffff;
    font-weight: 500 !important;
}
.sidebar-box-header .sb-icon {
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    color: var(--v7m-primary, #c90201);
}
.sidebar-box-header .sb-icon svg {
    fill: var(--v7m-primary, #c90201);
}
.sidebar-box-header .sb-more {
    color: rgba(255, 255, 255, 0.85) !important;
    font-size: 11.5px;
    text-decoration: none;
    font-weight: 400;
}
.sidebar-box-header .sb-more:hover {
    color: #ffffff !important;
    text-decoration: underline;
}
.sidebar-box-content {
    display: block !important;
    padding: 0 !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

.sb-post-item {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    border-bottom: 1px solid #f1f5f9;
    align-items: center;
    transition: background-color 0.15s ease;
    height: auto !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
}
.sb-post-item:hover {
    background-color: #f8fafc;
}
.sb-post-item:last-child {
    border-bottom: none;
}
.sb-post-thumb {
    width: 82px !important;
    height: 52px !important;
    flex: 0 0 82px !important;
    overflow: hidden;
    border: none !important;
    border-radius: 5px !important;
    background: #0c1a24;
}
.sb-post-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border: none !important;
}
.sb-post-thumb-fallback {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    font-size: 16px;
    color: #94a3b8;
}
.sb-post-info {
    flex: 1;
    min-width: 0;
}
.sb-post-meta {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 4px;
    font-size: 11px !important;
}
.sb-badge-league {
    background: #0284c7;
    color: #ffffff;
    font-size: 10px !important;
    font-weight: 500 !important;
    padding: 2px 5px !important;
    border-radius: 4px !important;
}
.sb-post-date {
    color: #888888;
    font-size: 10.5px;
}
.sb-post-title {
    font-size: 12.5px !important;
    line-height: 1.35 !important;
    margin: 0;
    font-weight: 500 !important;
}
.sb-post-title a {
    color: #1e293b;
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sb-post-title a:hover {
    color: #0284c7;
}

.sb-match-item {
    display: block !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    padding: 8px 12px !important;
    background: #ffffff;
    border-bottom: 1px solid #edf2f7;
    transition: background-color 0.15s ease;
    height: auto !important;
    min-height: 58px !important;
    box-sizing: border-box !important;
}
.sb-match-item:hover {
    background-color: #f8fafc;
}
.sb-match-item:last-child {
    border-bottom: none;
}
.sb-match-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 22px !important;
    line-height: 22px !important;
    margin-bottom: 5px !important;
    font-size: 11.5px !important;
}
.sb-head-left {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    flex: 1;
}
.sb-match-league {
    font-size: 11px !important;
    font-weight: 500;
    color: #0284c7;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 170px;
}
.sb-head-dot {
    color: #cbd5e1;
    font-size: 8px;
    flex-shrink: 0;
    line-height: 1;
}
.sb-match-time {
    font-size: 11px !important;
    font-weight: 500;
    color: #64748b;
    white-space: nowrap;
    flex-shrink: 0;
}
.sb-match-time.is-live-pulse {
    color: #dc2626;
    background: #fee2e2;
    padding: 0 5px;
    border-radius: 4px;
    animation: liveBlink 1.5s infinite;
}
.sb-head-right {
    display: flex;
    align-items: center;
    margin-left: 6px;
    flex-shrink: 0;
}
.sb-head-right .btn-check-keo {
    position: relative !important;
    z-index: 10 !important;
    pointer-events: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 20px !important;
    padding: 0 !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: opacity 0.15s ease, transform 0.1s ease;
    line-height: 1 !important;
    text-decoration: none !important;
}
.sb-head-right .btn-check-keo:hover {
    opacity: 0.9 !important;
    transform: scale(1.05);
}
.sb-head-right .btn-check-keo svg {
    width: 12px !important;
    height: 12px !important;
    fill: #ffffff !important;
    display: block !important;
}
.sb-match-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 28px !important;
    line-height: 28px !important;
    text-decoration: none;
    color: inherit;
    gap: 6px !important;
}
.sb-match-team {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}
.sb-match-home {
    justify-content: flex-end;
    text-align: right;
}
.sb-match-away {
    justify-content: flex-start;
    text-align: left;
}
.sb-team-logo {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    object-fit: contain;
    border-radius: 4px !important;
    display: block;
    background: #f8fafc;
}
.sb-team-name {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    direction: ltr;
}
.sb-match-body:hover .sb-team-name {
    color: #0284c7;
}
.sb-match-score {
    flex: 0 0 auto;
    min-width: 40px !important;
    height: 22px !important;
    line-height: 22px !important;
    text-align: center;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #64748b;
    background: #f1f5f9;
    border-radius: 5px !important;
    padding: 0 5px !important;
}
.sb-match-score.live-score {
    background: #fee2e2;
    color: #dc2626;
}
.sb-match-score.ft-score {
    background: #e2e8f0;
    color: #0f172a;
}
.sb-empty-msg {
    padding: 14px 10px !important;
    text-align: center;
    font-size: 11.5px !important;
    color: #64748b;
}

/* Sticky Sidebar on Desktop */
@media (min-width: 1025px) {
    #cRight,
    .single-sidebar,
    .v7m-sidebar-col,
    .site-sidebar {
        position: -webkit-sticky !important;
        position: sticky !important;
        top: 60px !important;
        align-self: flex-start !important;
        max-height: calc(100vh - 70px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        scrollbar-width: thin !important;
        scrollbar-color: #cbd5e1 transparent !important;
        padding-bottom: 20px !important;
    }
    #cRight::-webkit-scrollbar,
    .single-sidebar::-webkit-scrollbar,
    .v7m-sidebar-col::-webkit-scrollbar,
    .site-sidebar::-webkit-scrollbar {
        width: 5px !important;
    }
    #cRight::-webkit-scrollbar-track,
    .single-sidebar::-webkit-scrollbar-track,
    .v7m-sidebar-col::-webkit-scrollbar-track,
    .site-sidebar::-webkit-scrollbar-track {
        background: transparent !important;
    }
    #cRight::-webkit-scrollbar-thumb,
    .single-sidebar::-webkit-scrollbar-thumb,
    .v7m-sidebar-col::-webkit-scrollbar-thumb,
    .site-sidebar::-webkit-scrollbar-thumb {
        background-color: #cbd5e1 !important;
        border-radius: 5px !important;
    }
    #cRight::-webkit-scrollbar-thumb:hover,
    .single-sidebar::-webkit-scrollbar-thumb:hover,
    .v7m-sidebar-col::-webkit-scrollbar-thumb:hover,
    .site-sidebar::-webkit-scrollbar-thumb:hover {
        background-color: #94a3b8 !important;
    }
}

/* Sidebar Mini Standings Table (BXH Ngoại Hạng Anh & Top Leagues) */
.sb-mini-table,
.sb-standings-table {
    display: table !important;
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 12px !important;
    border: none !important;
    height: auto !important;
    box-sizing: border-box !important;
}
.sb-mini-table th,
.sb-standings-table th {
    background: #f1f5f9 !important;
    color: #64748b !important;
    padding: 6px 8px !important;
    font-weight: 500 !important;
    text-align: center !important;
    font-size: 11.5px !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
}
.sb-mini-table th.sb-th-team,
.sb-standings-table th.sb-th-team {
    text-align: left !important;
}
/* Alternating zebra row colors for BXH */
.sb-mini-table tbody tr:nth-child(even) td,
.sb-standings-table tbody tr:nth-child(even) td {
    background-color: #f8fafc !important;
}
.sb-mini-table tbody tr:nth-child(odd) td,
.sb-standings-table tbody tr:nth-child(odd) td {
    background-color: #ffffff !important;
}
.sb-mini-table tbody tr:hover td,
.sb-standings-table tbody tr:hover td {
    background-color: #f1f5f9 !important;
}
.sb-mini-table td,
.sb-standings-table td {
    padding: 6px 8px !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 1px solid #edf2f7 !important;
    vertical-align: middle !important;
    font-size: 12px !important;
}
.sb-td-rank {
    width: 24px !important;
    text-align: center !important;
}
.sb-rank-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    height: 20px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    background: #f1f5f9;
    color: #475569;
    border-radius: 5px !important;
}
.sb-rank-badge.sb-rank-top4 {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
}
.sb-rank-badge.sb-rank-top6 {
    background: #0284c7 !important;
    color: #ffffff !important;
}
.sb-team-cell {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
}
.sb-mini-logo {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
    flex-shrink: 0 !important;
    border-radius: 3px !important;
}
.sb-mini-name {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: #0f2637 !important;
    font-weight: 500 !important;
    font-size: 12px !important;
}
.sb-td-p {
    width: 26px !important;
    text-align: center !important;
    color: #64748b !important;
}
.sb-td-pts {
    width: 28px !important;
    text-align: center !important;
    color: #e8503a !important;
    font-weight: 500 !important;
}

/* Sidebar Boxed Items Wrap (Fixtures & Results) */
.sidebar-box-content.sb-boxed-list {
    display: flex !important;
    flex-direction: column !important;
    padding: 6px 8px !important;
    gap: 6px !important;
    box-sizing: border-box !important;
}
.sb-mini-match-row {
    display: flex !important;
    flex-direction: column !important;
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    padding: 6px 8px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 5px !important;
    text-decoration: none !important;
    color: inherit !important;
    transition: background-color 0.15s ease, border-color 0.15s ease !important;
    height: auto !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
    width: 100% !important;
}
/* Alternating zebra items with framed borders */
.sb-mini-match-row:nth-child(even) {
    background-color: #f8fafc !important;
    border-color: #e2e8f0 !important;
}
.sb-mini-match-row:nth-child(odd) {
    background-color: #ffffff !important;
    border-color: #e2e8f0 !important;
}
.sb-mini-match-row:hover {
    background-color: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
}
.sb-mini-match-head {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
    margin-bottom: 5px !important;
}
.sb-mini-head-left {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    min-width: 0 !important;
    flex: 1 !important;
}
.sb-mini-league {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #0284c7 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 160px !important;
}
.sb-mini-dot {
    color: #cbd5e1 !important;
    font-size: 8px !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}
.sb-mini-time {
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #64748b !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}
.sb-mini-head-right {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex-shrink: 0 !important;
}
.sb-mini-hdp-tag {
    background: #e2e8f0 !important;
    color: #334155 !important;
    padding: 1px 5px !important;
    border-radius: 3px !important;
    font-size: 10.5px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}
.sb-mini-ft-tag {
    background: #f1f5f9 !important;
    color: #64748b !important;
    padding: 1px 5px !important;
    border-radius: 3px !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}
.sb-mini-match-body {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 4px !important;
    width: 100% !important;
    height: 22px !important;
}
.sb-mini-team {
    flex: 1 1 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    min-width: 0 !important;
}
.sb-mini-team.sb-team-home {
    justify-content: flex-end !important;
    text-align: right !important;
}
.sb-mini-team.sb-team-away {
    justify-content: flex-start !important;
    text-align: left !important;
}
.sb-mini-team-logo {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
    flex-shrink: 0 !important;
    display: block !important;
    border-radius: 3px !important;
}
.sb-mini-team-name {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    line-height: 1.2 !important;
}
.sb-mini-mid {
    flex-shrink: 0 !important;
    padding: 0 4px !important;
    text-align: center !important;
}
.sb-mini-vs {
    font-size: 10.5px !important;
    font-weight: 500 !important;
    color: #94a3b8 !important;
    background: #f1f5f9 !important;
    padding: 1px 4px !important;
    border-radius: 3px !important;
    line-height: 1.2 !important;
    display: inline-block !important;
}
.sb-mini-score .sb-score-val {
    color: #e8503a !important;
    font-weight: 500 !important;
    font-size: 12.5px !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
    display: inline-block !important;
}

/* ==========================================================================
   7M Prediction Odds & Form Tables (High-Density, 100% Responsive)
   ========================================================================== */
.pred-odds-box,
.pred-form-box {
    background: #ffffff !important;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    margin: 20px 0 !important;
    overflow: hidden !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.pred-odds-header,
.pred-form-header {
    background: var(--v7m-secondary, #012058) !important;
    background-image: none !important;
    color: #ffffff !important;
    padding: 10px 14px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-radius: 8px 8px 0 0 !important;
    line-height: 1.3 !important;
}

.pred-odds-header svg,
.pred-form-header svg {
    flex-shrink: 0 !important;
    fill: #38bdf8 !important;
}

.pred-odds-header-title,
.pred-form-header-title {
    color: #ffffff !important;
    font-weight: 500 !important;
    letter-spacing: 0.3px !important;
    text-transform: uppercase !important;
}

.pred-table-responsive {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin !important;
    border: none !important;
}

.pred-table-responsive::-webkit-scrollbar {
    height: 4px !important;
}

.pred-table-responsive::-webkit-scrollbar-thumb {
    background-color: #cbd5e1 !important;
    border-radius: 4px !important;
}

.pred-odds-matrix-table,
.pred-form-table {
    width: 100% !important;
    min-width: 580px !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    font-size: clamp(12px, 0.8vw + 9.5px, 14px) !important;
    border: none !important;
    margin: 0 !important;
}

.pred-odds-matrix-table th,
.pred-form-table th {
    background: #f1f5f9 !important;
    color: #334155 !important;
    padding: 7px 8px !important;
    font-weight: 500 !important;
    text-align: center !important;
    border: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
    white-space: nowrap !important;
    font-size: 12px !important;
}

.pred-odds-matrix-table th.th-grp {
    background: #e2e8f0 !important;
    color: #1e293b !important;
    font-size: 12px !important;
}

.pred-odds-matrix-table th.th-hdp {
    color: #0284c7 !important;
}

.pred-odds-matrix-table th.th-ou {
    color: #ea580c !important;
}

.pred-odds-matrix-table th.th-1x2 {
    color: var(--v7m-primary, #c90201) !important;
}

.pred-odds-matrix-table td,
.pred-form-table td {
    padding: 8px 8px !important;
    text-align: center !important;
    color: #1e293b !important;
    border: none !important;
    border-bottom: 1px solid #f1f5f9 !important;
    font-size: 12px !important;
    vertical-align: middle !important;
    line-height: 1.4 !important;
}

.pred-odds-matrix-table tbody tr:nth-child(even) {
    background-color: #fafbfc !important;
}

.pred-odds-matrix-table tbody tr:hover,
.pred-form-table tbody tr:hover {
    background-color: #f1f5f9 !important;
}

.pred-odds-matrix-table .cell-company {
    font-weight: 500 !important;
    color: #00385f !important;
    background: #ffffff !important;
    border-right: 1px solid #f1f5f9 !important;
    text-align: left !important;
    padding-left: 12px !important;
    white-space: nowrap !important;
}

.pred-odds-matrix-table .cell-stage {
    font-size: 11px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}

.pred-odds-matrix-table .stage-open {
    color: #64748b !important;
}

.pred-odds-matrix-table .stage-live {
    color: #dc2626 !important;
}

.pred-odds-matrix-table .cell-line {
    font-weight: 500 !important;
    color: #0f172a !important;
    background: #f8fafc !important;
}

.pred-odds-matrix-table .line-live {
    color: #dc2626 !important;
    background: #fee2e2 !important;
}

.pred-odds-matrix-table .rate-live {
    font-weight: 500 !important;
    color: #0369a1 !important;
}

.pred-odds-footer-note {
    padding: 8px 12px !important;
    font-size: 11.5px !important;
    color: #64748b !important;
    background: #f8fafc !important;
    border-top: 1px solid #f1f5f9 !important;
    font-style: italic !important;
}

/* Form Tables Grid */
.pred-form-tables-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 10px !important;
    background: #ffffff !important;
}

.pred-team-form-card {
    background: #f8fafc !important;
    border-radius: 6px !important;
    overflow: hidden !important;
}

.pred-team-form-heading {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 12px !important;
    background: #e2e8f0 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #0f172a !important;
}

.pred-team-form-heading .team-tag {
    font-size: 10.5px !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    color: #ffffff !important;
    font-weight: 500 !important;
}

.pred-team-form-heading .tag-home {
    background: #0284c7 !important;
}

.pred-team-form-heading .tag-away {
    background: var(--v7m-secondary, #012058) !important;
}

.pred-form-table th {
    background: #f1f5f9 !important;
    font-size: 11.5px !important;
}

.pred-form-table td {
    padding: 6px 8px !important;
    font-size: 12px !important;
}

.pred-badge-res {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 20px !important;
    height: 20px !important;
    padding: 0 6px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #ffffff !important;
}

.pred-badge-res.badge-w {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
}

.pred-badge-res.badge-d {
    background: #64748b !important;
}

.pred-badge-res.badge-l {
    background: #dc2626 !important;
}

.sb-odds-promo {
    padding: 10px;
}
.sb-odds-desc {
    font-size: 11.5px;
    color: #475569;
    line-height: 1.45;
    margin-bottom: 8px;
}
.sb-odds-features {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 10px;
    font-size: 11px;
    color: #166534;
    font-weight: 600;
}
.sb-odds-btn {
    display: block;
    background: #00b853;
    color: #ffffff !important;
    text-align: center;
    font-size: 11.5px;
    font-weight: bold;
    padding: 7px 10px;
    text-decoration: none;
}
.sb-odds-btn:hover {
    background: #009e44;
}

.sb-app-promo {
    padding: 10px;
}
.sb-app-flex {
    display: flex;
    gap: 10px;
    align-items: center;
}
.sb-qr-box {
    text-align: center;
}
.sb-qr-inner {
    border: 1px solid #cbd5e1;
    padding: 2px;
    background: #ffffff;
}
.sb-qr-caption {
    display: block;
    font-size: 10px;
    color: #64748b;
    margin-top: 3px;
}
.sb-app-info {
    flex: 1;
}
.sb-app-name {
    font-size: 13px;
    font-weight: bold;
    color: #00385f;
}
.sb-app-slogan {
    font-size: 11px;
    color: #475569;
    line-height: 1.35;
    margin: 2px 0 8px 0;
}
.sb-app-buttons {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.sb-app-btn {
    display: block;
    text-align: center;
    padding: 4px 6px;
    font-size: 10.5px;
    font-weight: bold;
    text-decoration: none;
    color: #ffffff !important;
}
.sb-app-android {
    background: #16a34a;
}
.sb-app-ios {
    background: #00385f;
}

/* ==========================================================================
   7M BASIC NEWS & PREDICTIONS LIST SYSTEM (.v7m-news-*)
   Strict compliance with 7M Global Rules:
   - System Radius: 8px (border-radius: 8px !important)
   - Font: Arial (font-family: Arial, sans-serif !important)
   - Semi-regular typography: font-weight 400 - 500 (NO bold)
   - NO shadow (box-shadow: none !important)
   - NO borders (border: none !important)
   - High information density, compact, fast-loading, mobile-first
   ========================================================================== */
.v7m-news-layout-wrapper {
    display: flex !important;
    justify-content: space-between !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 1250px !important;
    margin: 8px auto !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
    align-items: flex-start !important;
}

.v7m-news-main-col {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: 100% !important;
}

.v7m-news-card-box {
    background: #ffffff !important;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 12px 14px !important;
    margin-bottom: 12px !important;
    box-sizing: border-box !important;
}

.v7m-news-toolbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: #f8fafc !important;
    padding: 8px 12px !important;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
    flex-wrap: nowrap !important;
}

.v7m-news-heading {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
    color: #0f2637 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
}

.v7m-news-head-icon {
    width: 16px !important;
    height: 16px !important;
    color: var(--v7m-primary, #c90201) !important;
    stroke: var(--v7m-primary, #c90201) !important;
    flex-shrink: 0 !important;
}

.v7m-news-filter-pills {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

.v7m-news-filter-pills .v7m-pill {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    padding: 4px 10px !important;
    border-radius: 8px !important;
    border: none !important;
    text-decoration: none !important;
    background: #e2e8f0 !important;
    color: #334155 !important;
    transition: all 0.15s ease !important;
    white-space: nowrap !important;
}

.v7m-news-filter-pills .v7m-pill:hover {
    background: #cbd5e1 !important;
    color: #0f2637 !important;
}

.v7m-news-filter-pills .v7m-pill.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
}

.v7m-news-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.v7m-news-row {
    display: flex !important;
    align-items: stretch !important;
    gap: 12px !important;
    padding: 8px 10px !important;
    background: #f8fafc !important;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    transition: background-color 0.15s ease !important;
    box-sizing: border-box !important;
}

.v7m-news-row:hover {
    background: #f1f5f9 !important;
}

.v7m-news-thumb-wrap {
    flex: 0 0 160px !important;
    width: 160px !important;
    height: 96px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    position: relative !important;
    display: block !important;
    background: #e2e8f0 !important;
}

.v7m-news-thumb-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    border: none !important;
    border-radius: 8px !important;
    transition: transform 0.25s ease !important;
}

.v7m-news-row:hover .v7m-news-thumb-img {
    transform: scale(1.03);
}

.v7m-news-info {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 4px !important;
}

.v7m-news-meta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 11.5px !important;
    color: #64748b !important;
}

.v7m-news-cat,
.v7m-news-badge {
    background: #ecfdf5 !important;
    color: #166534 !important;
    padding: 2px 7px !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
    border: none !important;
}

.v7m-news-date {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    color: #64748b !important;
    font-size: 12px !important;
    white-space: nowrap !important;
}

.v7m-news-date svg {
    width: 12px !important;
    height: 12px !important;
    stroke: #94a3b8 !important;
    vertical-align: middle !important;
}

.v7m-news-title {
    margin: 0 !important;
    line-height: 1.35 !important;
    font-size: clamp(13px, 0.75vw + 10px, 15px) !important;
    font-weight: 500 !important;
}

.v7m-news-title a {
    color: #1e293b !important;
    text-decoration: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    transition: color 0.15s ease !important;
}

.v7m-news-title a:hover {
    color: var(--v7m-primary, #c90201) !important;
}

.v7m-news-excerpt {
    font-size: 12.5px !important;
    color: #64748b !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.v7m-news-pagination {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 5px !important;
    margin-top: 14px !important;
    padding-top: 10px !important;
    flex-wrap: wrap !important;
}

.v7m-news-pagination span.page-numbers,
.v7m-news-pagination a.page-numbers {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 8px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    border: none !important;
    background: #f1f5f9 !important;
    color: #334155 !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
}

.v7m-news-pagination span.page-numbers.current {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
}

.v7m-news-pagination a.page-numbers:hover {
    background: #e2e8f0 !important;
    color: var(--v7m-primary, #c90201) !important;
}

.v7m-news-empty {
    text-align: center !important;
    padding: 30px 15px !important;
    color: #64748b !important;
    font-size: 14px !important;
}

/* ==========================================================================
   7M SPORTS CATEGORY & ARCHIVE MAGAZINE LAYOUT
   Compliant with Global Rules: border-radius: 0 !important, box-shadow: none !important
   ========================================================================== */
.category-layout-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    width: 100% !important;
    max-width: 100% !important;
    margin: 6px auto;
    padding: 0 10px;
    box-sizing: border-box !important;
    align-items: flex-start;
}

.category-main-col {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
}

.category-card-wrap {
    background: #ffffff;
    border: 1px solid #ccd0d4;
    padding: 12px 14px;
    margin-bottom: 8px;
    box-sizing: border-box;
}

/* Breadcrumb */
.cat-breadcrumb {
    font-size: 11.5px;
    color: #64748b;
    margin-bottom: 8px;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 5px;
}
.cat-breadcrumb a {
    color: #475569;
    text-decoration: none;
}
.cat-breadcrumb a:hover {
    color: #0088cc;
}
.cat-breadcrumb .sep {
    margin: 0 4px;
    color: #cbd5e1;
}

/* Category Header Banner */
.cat-header-banner {
    background: #f8fafc;
    border: 1px solid #dbeafe;
    border-left: 4px solid #005a2b;
    padding: 10px 14px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.cat-header-left {
    flex: 1 1 300px;
}
.cat-header-title {
    font-size: 18px;
    font-weight: 800;
    color: #003366;
    margin: 0 0 3px 0;
    display: flex;
    align-items: center;
    gap: 6px;
    text-transform: uppercase;
}
.cat-header-desc {
    font-size: 12px;
    color: #555555;
    margin: 0;
    line-height: 1.4;
}
.cat-header-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}
.cat-count-badge {
    background: #005a2b;
    color: #ffffff;
    font-size: 11px;
    font-weight: bold;
    padding: 3px 8px;
    letter-spacing: 0.3px;
}
.cat-live-status {
    font-size: 10.5px;
    color: #cc0000;
    font-weight: bold;
}

/* Quick Filter Toolbar */
.cat-filter-toolbar {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    padding: 6px 10px;
    margin-bottom: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 12px;
}
.cat-filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}
.cat-filter-label {
    font-weight: bold;
    color: #003366;
    margin-right: 4px;
    font-size: 11.5px;
}
.cat-pill {
    display: inline-block;
    padding: 2px 8px;
    font-size: 11.5px;
    color: #334155;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.15s ease;
}
.cat-pill:hover {
    background: #e2e8f0;
    color: #005a2b;
    border-color: #005a2b;
}
.cat-pill.active {
    background: #005a2b !important;
    color: #ffffff !important;
    border-color: #004622 !important;
    font-weight: bold;
}
.cat-quick-links {
    display: flex;
    gap: 6px;
    align-items: center;
    font-size: 11.5px;
}
.cat-quick-links a {
    color: #0088cc;
    text-decoration: none;
    font-weight: 600;
}
.cat-quick-links a:hover {
    color: #cc0000;
    text-decoration: underline;
}

/* Hero Spotlight Card (First post on page 1) */
.cat-hero-card {
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-left: 4px solid #cc0000;
    padding: 12px;
    margin-bottom: 14px;
    display: flex;
    gap: 14px;
    box-sizing: border-box;
}
.cat-hero-thumb {
    width: 380px;
    height: 220px;
    flex: 0 0 380px;
    position: relative;
    overflow: hidden;
    background: #0c1a24;
}
.cat-hero-thumb a {
    display: block;
    width: 100%;
    height: 100%;
}
.cat-hero-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border: none;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.cat-hero-badge-league {
    position: absolute;
    top: 6px;
    left: 6px;
    background: #0088cc;
    color: #ffffff;
    font-size: 10px;
    font-weight: bold;
    padding: 2px 7px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    z-index: 2;
}
.cat-hero-badge-time {
    position: absolute;
    bottom: 6px;
    right: 6px;
    background: rgba(12, 26, 36, 0.88);
    color: #ffcc00;
    font-size: 10.5px;
    font-weight: bold;
    padding: 2px 7px;
    z-index: 2;
}
.cat-hero-content {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.cat-hero-spotlight-tag {
    font-size: 11px;
    font-weight: 800;
    color: #cc0000;
    margin-bottom: 4px;
    letter-spacing: 0.5px;
}
.cat-hero-title {
    font-size: 16.5px;
    line-height: 1.35;
    font-weight: bold;
    margin: 0 0 6px 0;
}
.cat-hero-title a {
    color: #0000cc;
    text-decoration: none;
}
.cat-hero-title a:hover {
    color: #cc0000;
}
.cat-hero-matchup {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    padding: 4px 8px;
    font-size: 11.5px;
    font-weight: bold;
    color: #003366;
    margin-bottom: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cat-hero-excerpt {
    font-size: 12.5px;
    color: #475569;
    line-height: 1.5;
    margin-bottom: 10px;
}
.cat-hero-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px dashed #e2e8f0;
}
.cat-hero-btn-read {
    background: #cc0000;
    color: #ffffff !important;
    font-size: 11.5px;
    font-weight: bold;
    padding: 5px 12px;
    text-decoration: none;
    display: inline-block;
    transition: background 0.15s ease;
}
.cat-hero-btn-read:hover {
    background: #990000;
}
.cat-hero-shortcuts {
    display: flex;
    gap: 6px;
    align-items: center;
    font-size: 11px;
}
.cat-hero-shortcuts a {
    color: #0088cc;
    text-decoration: none;
    padding: 3px 6px;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    font-weight: 600;
}
.cat-hero-shortcuts a:hover {
    background: #0088cc;
    color: #ffffff;
    border-color: #0088cc;
}

/* Category Posts Grid (2 columns on desktop) */
.cat-posts-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 14px;
}

.cat-grid-card {
    background: #ffffff;
    border: 1px solid #dbeafe;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
    transition: border-color 0.15s ease;
}
.cat-grid-card:hover {
    border-color: #0088cc;
}

.cat-card-thumb-wrap {
    position: relative;
    width: 100%;
    height: 145px;
    overflow: hidden;
    background: #0c1a24;
}
.cat-card-thumb-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border: none;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.cat-badge-league {
    position: absolute;
    top: 5px;
    left: 5px;
    background: #0088cc;
    color: #ffffff;
    font-size: 9.5px;
    font-weight: bold;
    padding: 2px 6px;
    text-transform: uppercase;
    letter-spacing: 0.2px;
    z-index: 2;
}
.cat-badge-time {
    position: absolute;
    top: 5px;
    right: 5px;
    background: rgba(12, 26, 36, 0.85);
    color: #ffffff;
    font-size: 9.5px;
    padding: 2px 6px;
    z-index: 2;
}

.cat-card-body {
    padding: 8px 10px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}
.cat-card-matchup {
    font-size: 11px;
    font-weight: bold;
    color: #003366;
    background: #f8fafc;
    border: 1px solid #eef2f6;
    padding: 3px 6px;
    margin-bottom: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cat-card-title {
    font-size: 13.5px;
    font-weight: bold;
    line-height: 1.4;
    margin: 0 0 6px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cat-card-title a {
    color: #0000cc;
    text-decoration: none;
}
.cat-card-title a:hover {
    color: #cc0000;
}
.cat-card-excerpt {
    font-size: 11.5px;
    color: #64748b;
    line-height: 1.45;
    margin-bottom: 8px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex-grow: 1;
}

.cat-card-footer {
    padding: 6px 10px;
    background: #fafbfc;
    border-top: 1px solid #f1f5f9;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    gap: 6px;
}
.cat-card-meta-left {
    color: #888888;
    font-size: 10.5px;
}
.cat-card-meta-right {
    display: flex;
    gap: 6px;
    align-items: center;
}
.cat-card-read-link {
    color: #cc0000 !important;
    font-weight: bold;
    text-decoration: none;
}
.cat-card-read-link:hover {
    text-decoration: underline;
}
.cat-card-mid-link {
    color: #0088cc !important;
    text-decoration: none;
    font-size: 10.5px;
}
.cat-card-mid-link:hover {
    text-decoration: underline;
}

/* Category Pagination */
.cat-pagination-wrap {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #e2e8f0;
    text-align: center;
}
.cat-pagination {
    display: inline-flex;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.cat-pagination a, 
.cat-pagination span {
    display: inline-block;
    padding: 4px 10px;
    font-size: 12px;
    color: #334155;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    text-decoration: none;
    line-height: 1.4;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.cat-pagination a:hover {
    background: #f1f5f9;
    border-color: #005a2b;
    color: #005a2b;
}
.cat-pagination .current {
    background: #005a2b !important;
    color: #ffffff !important;
    border-color: #004622 !important;
    font-weight: bold;
}
.cat-pagination .dots {
    border: none;
    background: transparent;
    padding: 4px 6px;
}

/* ==========================================================================
   7M SPORTS NEWS MAGAZINE SPECIFIC STYLES
   Compliant with Global Rules: border-radius: 0 !important, box-shadow: none !important
   ========================================================================== */
.news-ticker-bar {
    display: flex;
    align-items: center;
    background: #0c1a24;
    border: 1px solid #1e293b;
    border-left: 4px solid #cc0000;
    margin-bottom: 10px;
    height: 32px;
    overflow: hidden;
    box-sizing: border-box;
}
.news-ticker-badge {
    background: #cc0000;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    padding: 0 10px;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    letter-spacing: 0.4px;
    flex-shrink: 0;
}
.news-ticker-slider {
    flex-grow: 1;
    overflow: hidden;
    white-space: nowrap;
    padding: 0 10px;
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 11.5px;
}
.news-ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.news-ticker-bullet {
    color: #ffcc00;
    font-size: 14px;
}
.news-ticker-item a {
    color: #e2e8f0;
    text-decoration: none;
    transition: color 0.15s ease;
}
.news-ticker-item a:hover {
    color: #ffcc00;
    text-decoration: underline;
}

.news-banner {
    border-left-color: #0088cc !important;
    background: linear-gradient(180deg, #f8fafc 0%, #f0f4f8 100%) !important;
}

.news-source-tag {
    font-size: 10.5px;
    color: #005a2b;
    font-weight: bold;
    background: #e8f5e9;
    padding: 1px 5px;
    border: 1px solid #c8e6c9;
}

/* Hide mobile controls on desktop */
.m-live-control-bar,
.m-league-modal-backdrop,
.m-league-modal-sheet {
    display: none;
}

/* ==========================================================================
   TEAM DETAILS PROFILE & SQUAD STYLES (TONE LIGHT, FLAT 0PX, NO INLINE CSS)
   ========================================================================== */
#content.team-details-wrap, div#content.team-details-wrap, .team-details-wrap {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 4px 6px !important;
    box-sizing: border-box !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    color: #1e293b !important;
    background: transparent !important;
    gap: 8px !important;
    margin: auto;
}

#content.team-details-wrap > *,
.team-details-wrap > * {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.team-details-wrap * {
    box-sizing: border-box;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* Breadcrumbs */
.team-breadcrumb {
    width: 100% !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    background: #ffffff;
    padding: 8px 12px;
    margin-bottom: 0;
    font-size: 15px;
    color: #64748b;
    border: none !important;
}
.team-breadcrumb a {
    color: #00385f;
    font-weight: bold;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.team-breadcrumb a:hover {
    color: #ff3300;
}
.team-breadcrumb-sep {
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
}
.team-breadcrumb-current {
    color: #0284c7;
    font-weight: bold;
}

/* Related Match Notice Bar */
.team-related-match-bar {
    width: 100% !important;
    background: #ffffff;
    padding: 8px 12px;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    border: none !important;
}
.trm-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.trm-badge {
    background: #dc2626;
    color: #ffffff;
    font-weight: bold;
    font-size: 15px;
    padding: 3px 8px;
    text-transform: uppercase;
}
.trm-info {
    color: #0f172a;
    font-size: 16px;
}
.trm-score {
    color: #dc2626;
    font-weight: bold;
    margin: 0 4px;
}
.trm-league {
    color: #64748b;
}
.trm-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.trm-btn-h2h {
    background: #366594;
    color: #ffffff !important;
    font-weight: bold;
    padding: 6px 14px;
    text-decoration: none;
    font-size: 15px;
    border: none !important;
}
.trm-btn-live {
    background: #0284c7;
    color: #ffffff !important;
    font-weight: bold;
    padding: 6px 14px;
    text-decoration: none;
    font-size: 15px;
    border: none !important;
}

/* Hero Profile Card */
.team-hero-card {
    width: 100% !important;
    background: #ffffff;
    padding: 14px 16px;
    border: none !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
}
.team-hero-main {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    min-width: 280px;
}
.team-hero-logo-box {
    width: 80px;
    height: 80px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    flex-shrink: 0;
}
.team-hero-logo-img {
    max-width: 72px;
    max-height: 72px;
    object-fit: contain;
    border: none !important;
}
.team-hero-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}
.team-hero-title-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.team-hero-title {
    font-size: 22px;
    font-weight: bold;
    color: #00385f;
    margin: 0;
    line-height: 1.2;
}
.team-hero-winrate-pill {
    background: #e0f2fe;
    color: #0369a1;
    font-size: 15px;
    font-weight: bold;
    padding: 3px 10px;
}
.team-hero-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 15px;
    color: #475569;
}
.team-hero-meta-row strong {
    color: #0f172a;
}
.team-hero-league {
    color: #0284c7;
    font-weight: bold;
}
.team-hero-submeta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 15px;
    color: #64748b;
}
.team-hero-submeta-row strong {
    color: #334155;
}
.team-hero-submeta-row .highlight-coach {
    color: #b45309;
}

/* Team Kits */
.team-hero-kits {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #f8fafc;
    padding: 8px 14px;
}
.team-kit-item {
    text-align: center;
}
.team-kit-img-box {
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.team-kit-img {
    max-height: 50px;
    object-fit: contain;
    border: none !important;
}
.team-kit-label {
    font-size: 15px;
    font-weight: bold;
    color: #475569;
}
.team-kit-divider {
    width: 1px;
    height: 40px;
    background: #e2e8f0;
}

/* Tabs Navigation */
.team-tabs-bar {
    width: 100% !important;
    display: flex !important;
    align-items: center;
    gap: 4px;
    background: #ffffff;
    padding: 4px;
    border: none !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
}
.team-tab-btn {
    flex: 1 1 0px !important;
    min-width: 0 !important;
    background: #f1f5f9;
    color: #334155;
    font-weight: bold;
    font-size: 15px;
    padding: 10px 8px;
    border: none !important;
    border-radius: 0 !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
    text-align: center;
}
.team-tab-btn:hover {
    background: #e2e8f0;
    color: #00385f;
}
.team-tab-btn.active {
    background: #366594 !important;
    color: #ffffff !important;
}
.team-tab-content {
    display: none !important;
    width: 100% !important;
}
.team-tab-content.active {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
}

/* Tab 1: Summary Cards */
.team-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    width: 100% !important;
}
.team-summary-card {
    background: #ffffff;
    padding: 12px 14px;
    border: none !important;
}
.tsc-label {
    font-size: 15px;
    color: #64748b;
    margin-bottom: 4px;
}
.tsc-value {
    font-size: 20px;
    font-weight: bold;
}
.tsc-win { color: #059669; }
.tsc-draw { color: #d97706; }
.tsc-loss { color: #dc2626; }
.tsc-sub-rate {
    font-size: 15px;
    color: #0284c7;
    margin-top: 4px;
    font-weight: bold;
}
.tsc-sub-ah {
    font-size: 15px;
    color: #d97706;
    margin-top: 4px;
    font-weight: bold;
}
.tsc-sub-text {
    font-size: 15px;
    color: #475569;
    margin-top: 4px;
}
.tsc-venue-list {
    font-size: 15px;
    color: #334155;
    line-height: 1.4;
}
.tsc-venue-home { color: #059669; font-weight: bold; }
.tsc-venue-neutral { color: #0284c7; font-weight: bold; }
.tsc-venue-away { color: #dc2626; font-weight: bold; }

/* Filter Bar */
.team-filter-bar {
    width: 100% !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    background: #ffffff;
    padding: 8px 12px;
    border: none !important;
}
.tfb-group {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.tfb-label {
    font-size: 15px;
    font-weight: bold;
    color: #00385f;
}
.match-filter-btn {
    background: #f1f5f9;
    color: #334155;
    font-size: 15px;
    font-weight: bold;
    padding: 5px 12px;
    border: none !important;
    cursor: pointer;
    transition: background 0.15s ease;
}
.match-filter-btn:hover {
    background: #e2e8f0;
}
.match-filter-btn.active {
    background: #366594 !important;
    color: #ffffff !important;
}
.match-filter-btn[data-filter="W"] { color: #059669; }
.match-filter-btn[data-filter="D"] { color: #d97706; }
.match-filter-btn[data-filter="L"] { color: #dc2626; }
.match-filter-btn.active[data-filter="W"],
.match-filter-btn.active[data-filter="D"],
.match-filter-btn.active[data-filter="L"] {
    color: #ffffff !important;
    background: #366594 !important;
}
.tfb-source-note {
    font-size: 15px;
    color: #64748b;
}

/* Pure Div-based Responsive Match List (Zero Table, Zero Overflow) */
.team-match-list {
    width: 100% !important;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    gap: 0;
    box-sizing: border-box !important;
}
.tml-header-row {
    display: grid;
    grid-template-columns: 85px 120px 1fr 85px 1fr 75px 115px 80px 65px;
    align-items: center;
    background: #366594;
    color: #ffffff;
    font-weight: bold;
    font-size: 15px;
    padding: 10px 8px;
    text-align: center;
    box-sizing: border-box;
}
.tml-match-item {
    display: grid;
    grid-template-columns: 85px 120px 1fr 85px 1fr 75px 115px 80px 65px;
    align-items: center;
    padding: 9px 8px;
    font-size: 15px;
    text-align: center;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    box-sizing: border-box;
    transition: background 0.1s ease;
}
.tml-match-item:nth-child(even) {
    background: #f8fafc;
}
.tml-match-item:hover {
    background: #eff6ff;
}
.match-row.is-hidden {
    display: none !important;
}
.tml-col-date {
    font-weight: bold;
    color: #475569;
    font-size: 15px;
}
.tml-col-league {
    display: flex;
    justify-content: center;
    align-items: center;
}
.tml-league-badge {
    background: #366594;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
    white-space: nowrap;
}
.tml-col-home {
    text-align: right;
    font-weight: bold;
    padding-right: 10px;
    font-size: 15px;
}
.tml-col-away {
    text-align: left;
    font-weight: bold;
    padding-left: 10px;
    font-size: 15px;
}
.tml-focus {
    color: #00385f;
}
.tml-other {
    color: #334155;
}
.tml-red-card {
    background: #dc2626;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    padding: 1px 4px;
    margin-left: 2px;
    display: inline-block;
}
.tml-col-score {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.2;
}
.tml-score-main {
    font-size: 17px;
    font-weight: bold;
    color: #cc0000;
}
.tml-score-ht {
    font-size: 13px;
    color: #94a3b8;
}
.tml-col-res {
    display: flex;
    justify-content: center;
}
.tml-res-w {
    background: #059669;
    color: #ffffff;
    padding: 2px 8px;
    font-weight: bold;
    font-size: 14px;
    display: inline-block;
}
.tml-res-d {
    background: #d97706;
    color: #ffffff;
    padding: 2px 8px;
    font-weight: bold;
    font-size: 14px;
    display: inline-block;
}
.tml-res-l {
    background: #dc2626;
    color: #ffffff;
    padding: 2px 8px;
    font-weight: bold;
    font-size: 14px;
    display: inline-block;
}
.tml-col-ah {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 14px;
}
.tml-ah-val {
    font-weight: bold;
    color: #334155;
}
.tml-ah-win { color: #059669; font-weight: bold; }
.tml-ah-draw { color: #d97706; font-weight: bold; }
.tml-ah-loss { color: #dc2626; font-weight: bold; }
.tml-col-ou {
    font-size: 14px;
    font-weight: bold;
}
.tml-ou-over { color: #d97706; }
.tml-ou-under { color: #0284c7; }
.tml-col-h2h {
    display: flex;
    justify-content: center;
}
.tml-btn-h2h {
    background: #f1f5f9;
    color: #00385f !important;
    font-size: 13px;
    font-weight: bold;
    padding: 3px 8px;
    text-decoration: none;
    display: inline-block;
    transition: background 0.15s ease;
}
.tml-btn-h2h:hover {
    background: #e2e8f0;
}

/* Tab 2: Squad */
.team-squad-section {
    width: 100% !important;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.team-squad-heading {
    color: #ffffff;
    padding: 8px 12px;
    font-size: 16px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.tsh-gk { background: #366594; }
.tsh-df { background: #059669; }
.tsh-mf { background: #d97706; }
.tsh-fw { background: #dc2626; }
.team-squad-count {
    font-size: 15px;
    background: rgba(0,0,0,0.2);
    padding: 2px 8px;
}
.team-squad-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 6px;
}
.team-player-card {
    background: #ffffff;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: none !important;
}
.team-player-avatar {
    width: 46px;
    height: 46px;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}
.team-player-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.team-player-info {
    flex: 1;
    min-width: 0;
}
.team-player-name {
    font-weight: bold;
    font-size: 15px;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.team-player-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 3px;
}
.team-player-num {
    background: #366594;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    padding: 1px 6px;
}
.team-player-id {
    font-size: 14px;
    color: #64748b;
}
.team-empty-state {
    background: #ffffff;
    padding: 30px 20px;
    text-align: center;
    color: #64748b;
    font-size: 16px;
    border: none !important;
}
.team-empty-state svg {
    margin-bottom: 8px;
}

/* Tab 3: Coach */
.team-coach-card {
    background: #ffffff;
    padding: 16px;
    border: none !important;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}
.team-coach-photo-box {
    width: 120px;
    height: 140px;
    background: #f8fafc;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.team-coach-photo-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.team-coach-main {
    flex: 1;
    min-width: 260px;
}
.team-coach-badge {
    background: #366594;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    padding: 3px 8px;
    display: inline-block;
    margin-bottom: 6px;
}
.team-coach-name {
    font-size: 22px;
    font-weight: bold;
    color: #00385f;
    margin: 0 0 8px 0;
}
.team-coach-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 6px;
    font-size: 15px;
    color: #475569;
    margin-bottom: 10px;
}
.team-coach-meta strong {
    color: #0f172a;
}
.team-coach-joined {
    color: #059669 !important;
}
.team-coach-clubs {
    background: #f8fafc;
    padding: 8px 12px;
    font-size: 15px;
    color: #334155;
    margin-bottom: 8px;
}
.team-coach-clubs strong {
    color: #00385f;
}
.team-coach-desc {
    font-size: 15px;
    color: #64748b;
    line-height: 1.5;
    margin: 0;
}

/* Tab 4: Stats */
.team-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 8px;
    width: 100% !important;
}
.team-stats-box {
    background: #ffffff;
    padding: 14px;
    border: none !important;
}
.team-stats-heading {
    font-size: 16px;
    font-weight: bold;
    color: #00385f;
    margin: 0 0 10px 0;
    border-bottom: 2px solid #366594;
    padding-bottom: 6px;
}
.team-stats-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 15px;
}
.team-stats-row {
    display: flex;
    justify-content: space-between;
    background: #f8fafc;
    padding: 7px 10px;
}
.tsr-accent-blue { color: #0284c7; }
.tsr-accent-green { color: #059669; }
.tsr-accent-amber { color: #d97706; }
.tsr-accent-red { color: #dc2626; }

/* Pure Div-based Responsive Fixtures List (Zero Table) */
.team-fixtures-box {
    width: 100% !important;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    border: none !important;
}
.team-fixtures-header {
    background: #366594;
    color: #ffffff;
    padding: 10px 14px;
    font-weight: bold;
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.team-fixture-list {
    width: 100% !important;
    background: #ffffff;
    display: flex;
    flex-direction: column;
}
.tfl-header-row {
    display: grid;
    grid-template-columns: 140px 140px 1fr 60px 1fr;
    align-items: center;
    background: #f1f5f9;
    color: #334155;
    font-weight: bold;
    font-size: 15px;
    padding: 10px;
    text-align: center;
    box-sizing: border-box;
}
.tfl-fixture-item {
    display: grid;
    grid-template-columns: 140px 140px 1fr 60px 1fr;
    align-items: center;
    padding: 10px;
    font-size: 15px;
    text-align: center;
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
    box-sizing: border-box;
}
.tfl-fixture-item:nth-child(even) {
    background: #f8fafc;
}
.tfl-col-time {
    font-weight: bold;
    color: #0f172a;
}
.tfl-col-league {
    display: flex;
    justify-content: center;
}
.tfl-league-tag {
    background: #366594;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
}
.tfl-col-home {
    text-align: right;
    font-weight: bold;
    color: #00385f;
    padding-right: 12px;
}
.tfl-col-vs {
    font-weight: bold;
    color: #dc2626;
}
.tfl-col-away {
    text-align: left;
    font-weight: bold;
    color: #00385f;
    padding-left: 12px;
}

/* Bottom Action Buttons */
.team-bottom-btns {
    width: 100% !important;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    margin-bottom: 16px;
}
.tbb-btn-scores {
    background: #366594;
    color: #ffffff !important;
    font-weight: bold;
    padding: 8px 16px;
    text-decoration: none;
    font-size: 15px;
    border: none !important;
}
.tbb-btn-odds {
    background: #0284c7;
    color: #ffffff !important;
    font-weight: bold;
    padding: 8px 16px;
    text-decoration: none;
    font-size: 15px;
    border: none !important;
}
.tbb-btn-db {
    background: #475569;
    color: #ffffff !important;
    font-weight: bold;
    padding: 8px 16px;
    text-decoration: none;
    font-size: 15px;
    border: none !important;
}

/* ==========================================================================
   7M VIP MASTER MATCH CENTER (99.9999% https://www.7msport.com/vip/live)
   Unified /tran-dau/{id}/: Diễn biến, Kèo 2in1, H2H, Đội hình & Thống kê
   ========================================================================== */
.v7m-match-content {
    width: 100% !important;
    max-width: 1250px !important;
    margin: 8px auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
}

.v7m-match-body-layout {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
}

.v7m-match-main-col {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
}

.v7m-match-sidebar-col {
    width: 310px;
    flex: 0 0 310px;
    min-width: 310px;
}

/* Topbar */
.v7m-topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ffffff;
    padding: 8px 14px;
    font-size: 15px;
    border-bottom: 1px solid #e2e8f0;
    box-sizing: border-box;
}
.v7m-topbar-left {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.v7m-crumb-home, .v7m-crumb-link {
    color: #475569;
    text-decoration: none;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.v7m-crumb-home:hover, .v7m-crumb-link:hover {
    color: var(--v7m-primary, #c90201);
}
.v7m-sep {
    color: #94a3b8;
}
.v7m-crumb-current {
    color: #0f172a;
    font-weight: bold;
}
.v7m-topbar-right {
    display: flex;
    align-items: center;
}
.v7m-btn-back {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    padding: 6px 14px;
    font-weight: 500;
    font-size: 13px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none !important;
    border-radius: 8px !important;
    transition: opacity 0.15s ease;
}
.v7m-btn-back:hover {
    opacity: 0.92;
    color: #ffffff !important;
}

/* Hero Scoreboard Banner */
.v7m-hero-card {
    background: #ffffff;
    width: 100% !important;
    padding: 18px 24px;
    box-sizing: border-box;
    border-radius: 8px !important;
    overflow: hidden;
    border: none !important;
    border-bottom: 3px solid var(--v7m-primary, #c90201) !important;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.v7m-hero-meta {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    font-size: 15px;
    color: #64748b;
    flex-wrap: wrap;
}
.v7m-league-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    max-width: 58px !important;
    height: 22px !important;
    padding: 0 4px !important;
    box-sizing: border-box !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    border-radius: 4px !important;
    border: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    text-decoration: none !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    flex-shrink: 0 !important;
}

/* Authentic Sports Tournament Colors with High Contrast Text */
.v7m-lg-epl { background-color: #38003c !important; color: #ffffff !important; }
.v7m-lg-ucl { background-color: #0e1e5b !important; color: #ffffff !important; }
.v7m-lg-uel { background-color: #f68e1e !important; color: #0f2637 !important; } /* Bright Orange -> Deep Dark Text */
.v7m-lg-uecl { background-color: #009944 !important; color: #ffffff !important; }
.v7m-lg-lal, .v7m-lg-laliga { background-color: #ee192d !important; color: #ffffff !important; }
.v7m-lg-sea, .v7m-lg-seriea { background-color: #024494 !important; color: #ffffff !important; }
.v7m-lg-bun, .v7m-lg-bundesliga { background-color: #d20515 !important; color: #ffffff !important; }
.v7m-lg-l1, .v7m-lg-ligue1 { background-color: #091c3e !important; color: #ffffff !important; }
.v7m-lg-vl1, .v7m-lg-vl2, .v7m-lg-vleague { background-color: #da251d !important; color: #ffffff !important; }
.v7m-lg-spl, .v7m-lg-saudi { background-color: #006837 !important; color: #ffffff !important; }
.v7m-lg-j1, .v7m-lg-j2, .v7m-lg-jleague { background-color: #e60012 !important; color: #ffffff !important; }
.v7m-lg-k1, .v7m-lg-k2, .v7m-lg-kleague { background-color: #002f6c !important; color: #ffffff !important; }
.v7m-lg-cha, .v7m-lg-champ { background-color: #00539f !important; color: #ffffff !important; }
.v7m-lg-fac { background-color: #c8102e !important; color: #ffffff !important; }
.v7m-lg-efl { background-color: #006a4e !important; color: #ffffff !important; }
.v7m-lg-cdr { background-color: #8b1c31 !important; color: #ffffff !important; }
.v7m-lg-cop { background-color: #004c97 !important; color: #ffffff !important; }
.v7m-lg-dfb { background-color: #007a3d !important; color: #ffffff !important; }
.v7m-lg-cdf { background-color: #0c2340 !important; color: #ffffff !important; }
.v7m-lg-ere { background-color: #ff6600 !important; color: #0f2637 !important; } /* Bright Orange -> Deep Dark Text */
.v7m-lg-por { background-color: #1a365d !important; color: #ffffff !important; }
.v7m-lg-mls { background-color: #002244 !important; color: #ffffff !important; }
.v7m-lg-bra { background-color: #f59e0b !important; color: #0f2637 !important; } /* Bright Gold -> Deep Dark Text */
.v7m-lg-arg { background-color: #38bdf8 !important; color: #0f2637 !important; } /* Bright Sky Blue -> Deep Dark Text */
.v7m-lg-wc { background-color: #8a1538 !important; color: #ffffff !important; }
.v7m-lg-eur, .v7m-lg-intl { background-color: #0b3b60 !important; color: #ffffff !important; }
.v7m-lg-cpa { background-color: #b45309 !important; color: #ffffff !important; }
.v7m-lg-afc { background-color: #d97706 !important; color: #ffffff !important; }
.v7m-lg-gh { background-color: #475569 !important; color: #ffffff !important; }
.v7m-lg-nba { background-color: #1d428a !important; color: #ffffff !important; }
.v7m-lg-cba { background-color: #cf102d !important; color: #ffffff !important; }
.v7m-lg-euroleague { background-color: #e35205 !important; color: #ffffff !important; }
.v7m-lg-default { background-color: #334155 !important; color: #ffffff !important; }
.v7m-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-weight: bold;
    color: #334155;
}
.v7m-hero-body {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 20px;
}
.v7m-hero-team {
    display: flex;
    align-items: center;
    gap: 14px;
}
.v7m-hero-home {
    justify-content: flex-end;
    text-align: right;
    flex-direction: row-reverse;
}
.v7m-hero-away {
    justify-content: flex-start;
    text-align: left;
}
.v7m-team-icon-wrap {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.v7m-team-name {
    font-size: 24px;
    font-weight: bold;
    color: #0f2637;
    margin: 0;
    line-height: 1.25;
}
.v7m-rank-tag {
    color: var(--v7m-primary, #c90201);
    font-size: 16px;
    font-weight: bold;
    margin-left: 4px;
}
.v7m-team-formation {
    font-size: 14px;
    color: #64748b;
    margin-top: 4px;
    font-weight: 500;
}
.v7m-hero-score-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 160px;
}
.v7m-score-value {
    font-size: 44px;
    font-weight: bold;
    color: #e8503a;
    line-height: 1;
    letter-spacing: 2px;
}
.v7m-status-wrap {
    margin-top: 6px;
}
.v7m-status-badge {
    padding: 3px 12px;
    font-size: 14px;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.v7m-badge-live {
    background: #e6f7ef;
    color: var(--v7m-primary, #c90201);
}
.v7m-live-dot {
    width: 8px;
    height: 8px;
    background: var(--v7m-primary, #c90201);
    background-image: none;
    border-radius: 50% !important;
    animation: v7mPulse 1.2s infinite;
}
@keyframes v7mPulse {
    0% { transform: scale(0.9); opacity: 0.7; }
    50% { transform: scale(1.3); opacity: 1; }
    100% { transform: scale(0.9); opacity: 0.7; }
}
.v7m-badge-ht {
    background: #fef3c7;
    color: #d97706;
}
.v7m-badge-ft {
    background: #f1f5f9;
    color: #475569;
}
.v7m-badge-upcoming {
    background: #e2e8f0;
    color: #64748b;
}
.v7m-badge-postponed {
    background: #fee2e2;
    color: #dc2626;
}
.v7m-ht-score {
    font-size: 14px;
    color: #64748b;
    margin-top: 4px;
}

/* Fixed / Sticky Match Detail Anchor Navigation Bar */
.v7m-match-nav-anchor {
    position: sticky;
    top: 50px;
    z-index: 490;
    width: 100% !important;
    background: #0f2637;
    border-radius: 8px !important;
    padding: 5px;
    margin-bottom: 12px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    border: none !important;
    box-shadow: none !important;
}
.v7m-match-nav-anchor::-webkit-scrollbar {
    display: none;
}
.v7m-anchor-inner {
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%;
}
.v7m-anchor-item {
    flex: 1 1 0;
    min-width: 0;
    padding: 8px 10px;
    font-size: clamp(13px, 0.4vw + 11px, 14px);
    font-weight: 500;
    color: #cbd5e1;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: nowrap;
    border-radius: 8px !important;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none !important;
    background: transparent;
}
.v7m-anchor-item:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.1);
}
.v7m-anchor-item.active {
    color: #ffffff !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    font-weight: 600;
}
.v7m-anchor-item svg {
    flex-shrink: 0;
}

/* Match Continuous Sections (Linear Stacked Display, No Tabs) */
.v7m-match-section {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    margin-bottom: 14px;
    scroll-margin-top: 105px;
}

/* Cards & Containers */
.v7m-card-block {
    background: #ffffff;
    width: 100% !important;
    border: none !important;
    border-radius: 8px !important;
    overflow: hidden;
    box-sizing: border-box;
}
.v7m-card-header {
    background: #0f2637 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(14px, 0.65vw + 11px, 16px) !important;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
    border-radius: 0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}
.v7m-header-tips {
    background: #0f2637 !important;
}
.v7m-header-sub {
    background: #142e43 !important;
    color: #ffffff !important;
    font-size: clamp(13px, 0.65vw + 11px, 15px) !important;
    font-weight: 600 !important;
    padding: 8px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.v7m-header-home-squad {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}
.v7m-header-away-squad {
    background: #007cff;
    color: #ffffff;
}
.v7m-header-home-profile {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}
.v7m-header-away-profile {
    background: #007cff;
    color: #ffffff;
}
.v7m-card-body {
    padding: 14px;
    box-sizing: border-box;
}
.v7m-no-padding {
    padding: 0 !important;
}
.v7m-grid-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

/* Timeline & Events */
.v7m-timeline-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.v7m-event-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    background: #f8fafc;
    border-left: 3px solid #cbd5e1;
    font-size: 15px;
}
.v7m-event-goal {
    background: #f0fdf4;
    border-left-color: var(--v7m-primary, #c90201);
}
.v7m-event-minute {
    font-weight: bold;
    font-size: 15px;
    color: var(--v7m-primary, #c90201);
    min-width: 32px;
    text-align: center;
}
.v7m-event-badge-box {
    flex-shrink: 0;
}
.v7m-badge-goal {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
}
.v7m-badge-yellow {
    background: #f59e0b;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
}
.v7m-badge-red {
    background: #dc2626;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
}
.v7m-badge-sub {
    background: #0284c7;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
}
.v7m-badge-info {
    background: #64748b;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
}
.v7m-event-content {
    flex: 1;
    min-width: 0;
}
.v7m-event-player {
    color: #0f172a;
}
.v7m-event-score-change {
    font-weight: bold;
    color: #e8503a;
    margin-left: 4px;
}
.v7m-event-detail {
    font-size: 14px;
    color: #64748b;
    margin-top: 2px;
}

/* Tips Box */
.v7m-tip-box {
    background: #f8fafc;
    padding: 12px 16px;
    font-size: 15px;
    line-height: 1.5;
    color: #334155;
    border-left: 3px solid #0f2637;
}
.v7m-tip-summary {
    margin-bottom: 6px;
}
.v7m-tip-confidence {
    color: var(--v7m-primary, #c90201);
    font-size: 14px;
}

/* Tables (Odds & H2H) */
.v7m-table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.v7m-odds-table, .v7m-data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: clamp(13px, 0.75vw + 10px, 15px) !important;
    text-align: center;
}
.v7m-odds-table th, .v7m-data-table th {
    background: #0f2637 !important;
    color: #ffffff !important;
    padding: 9px 8px;
    font-weight: 600 !important;
    font-size: clamp(13px, 0.65vw + 11px, 15px) !important;
    border: none !important;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
}
.v7m-odds-table td, .v7m-data-table td {
    padding: 8px 8px;
    border: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
    color: #0f172a;
    font-weight: 500;
    font-size: clamp(13px, 0.75vw + 10px, 15px) !important;
    line-height: 1.35;
}
.v7m-odds-row:nth-child(even), .v7m-data-table tbody tr:nth-child(even) {
    background: #f8fafc !important;
}
.v7m-odds-table .v7m-th-group {
    background: #0a1924 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}
.v7m-odds-table .v7m-sub-th th {
    background: #142e43 !important;
    color: #cbd5e1 !important;
    font-size: clamp(12px, 0.6vw + 10px, 13px) !important;
    font-weight: 500 !important;
}
.v7m-company-name {
    font-weight: 600;
    color: #0f172a;
    text-align: left;
    padding-left: 12px !important;
}
.v7m-odds-line {
    font-weight: bold;
    color: #dc2626;
    background: #fff1f2;
}
.v7m-odds-over { color: #d97706; font-weight: bold; }
.v7m-odds-under { color: #0284c7; font-weight: bold; }
.v7m-tag-league {
    background: #366594;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    padding: 2px 7px;
    display: inline-block;
}
.v7m-col-date {
    color: #64748b;
    font-size: 14px;
}
.v7m-col-score {
    font-weight: bold;
    color: #e8503a;
}
.v7m-bold {
    font-weight: bold;
    color: #0f2637;
}

/* Form Badges */
.v7m-res-w { background: #059669; color: #ffffff; padding: 2px 7px; font-weight: bold; font-size: 13px; display: inline-block; }
.v7m-res-d { background: #d97706; color: #ffffff; padding: 2px 7px; font-weight: bold; font-size: 13px; display: inline-block; }
.v7m-res-l { background: #dc2626; color: #ffffff; padding: 2px 7px; font-weight: bold; font-size: 13px; display: inline-block; }

/* Visual Pitch */
.v7m-pitch-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
}
.v7m-pitch-field {
    width: 100%;
    max-width: 800px;
    height: 320px;
    background: #237b4b;
    position: relative;
    border: 2px solid #ffffff;
    overflow: hidden;
    display: flex;
    box-sizing: border-box;
}
.v7m-pitch-line-center {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background: rgba(255,255,255,0.7);
}
.v7m-pitch-circle-center {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 90px;
    height: 90px;
    border: 2px solid rgba(255,255,255,0.7);
    border-radius: 50% !important;
}
.v7m-pitch-box-home {
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;
    width: 14%;
    border: 2px solid rgba(255,255,255,0.7);
    border-left: none;
}
.v7m-pitch-box-away {
    position: absolute;
    right: 0;
    top: 20%;
    bottom: 20%;
    width: 14%;
    border: 2px solid rgba(255,255,255,0.7);
    border-right: none;
}
.v7m-pitch-side {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}
.v7m-pitch-team-label {
    background: rgba(0,0,0,0.65);
    color: #ffffff;
    padding: 6px 14px;
    font-weight: bold;
    font-size: 15px;
}

/* Squad Lists */
.v7m-squad-subheading {
    background: #f8fafc;
    color: #64748b;
    font-size: 13px;
    font-weight: bold;
    padding: 6px 12px;
    border-bottom: 1px solid #e2e8f0;
}
.v7m-player-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.v7m-player-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-bottom: 1px solid #f1f5f9;
    font-size: 15px;
}
.v7m-player-row:nth-child(even) {
    background: #f8fafc;
}
.v7m-player-num {
    background: #f1f5f9;
    color: #0f172a;
    font-weight: bold;
    min-width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}
.v7m-player-name {
    flex: 1;
    font-weight: bold;
    color: #1e293b;
}
.v7m-player-pos {
    color: #64748b;
    font-size: 13px;
}

/* Stats Comparison Bars */
.v7m-stats-header {
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    font-size: 15px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e2e8f0;
    margin-bottom: 12px;
    color: #0f172a;
}
.v7m-stat-team-h { color: var(--v7m-primary, #c90201); }
.v7m-stat-team-a { color: #007cff; }
.v7m-stats-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.v7m-stat-row {
    display: grid;
    grid-template-columns: 50px 1fr 50px;
    align-items: center;
    gap: 12px;
}
.v7m-stat-num-h {
    text-align: right;
    font-weight: bold;
    font-size: 15px;
    color: var(--v7m-primary, #c90201);
}
.v7m-stat-num-a {
    text-align: left;
    font-weight: bold;
    font-size: 15px;
    color: #007cff;
}
.v7m-stat-bar-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.v7m-stat-name {
    font-size: 14px;
    color: #475569;
    font-weight: 500;
}
.v7m-stat-track {
    width: 100%;
    display: flex;
    height: 8px;
    background: #e2e8f0;
    overflow: hidden;
}
.v7m-bar-h {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    height: 100%;
    transition: width 0.3s ease;
}
.v7m-bar-a {
    background: #007cff;
    height: 100%;
    transition: width 0.3s ease;
}

/* Club Profiles */
.v7m-profile-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 15px;
}
.v7m-p-label {
    color: #64748b;
}
.v7m-p-val {
    color: #0f172a;
}

/* Bottom Action Navigation */
.v7m-bottom-nav {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
    margin-bottom: 16px;
}
.v7m-nav-btn {
    background: #f1f5f9;
    color: #334155;
    font-weight: 500;
    font-size: 13px;
    padding: 8px 16px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    border: none !important;
    border-radius: 8px !important;
    transition: all 0.15s ease;
}
.v7m-nav-btn:hover {
    background: #e2e8f0;
    color: var(--v7m-primary, #c90201);
}
.v7m-nav-primary {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
}
.v7m-nav-primary:hover {
    opacity: 0.92;
    color: #ffffff !important;
}
.v7m-empty-state {
    padding: 16px;
    text-align: center;
    color: #64748b;
    font-size: 15px;
}

/* SEO Section Featured Banner & FAQ styles */
.seo-featured-banner {
    margin: 10px 0 14px 0;
    overflow: hidden;
    background: #0c1a24;
    border: none !important;
    border-radius: 0 !important;
}
.seo-banner-img {
    width: 100% !important;
    height: auto;
    max-height: 450px;
    object-fit: cover;
    display: block;
    border: none !important;
    border-radius: 0 !important;
}
.faq-title {
    font-size: 16px;
    font-weight: bold;
    color: #0f2637;
    margin-bottom: 8px;
}
.faq-icon {
    vertical-align: middle;
    color: var(--v7m-primary, #c90201);
    margin-right: 6px;
}

/* Pinned Header & Toast Badges */
.v7m-pinned-banner {
    background: #fff7e6;
    color: #cc8800;
    padding-left: 8px;
    font-weight: bold;
    font-size: 15px;
    border: none !important;
}
.v7m-pinned-star {
    vertical-align: middle;
    margin-right: 4px;
}
.v7m-toast-badge {
    background: #e8503a;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    padding: 2px 6px;
    margin-right: 4px;
    display: inline-block;
}

/* ==========================================================================
   7M VIP LIVE & DATABASE / UTILITIES / PREDICTIONS COMPLETE SUITE
   ========================================================================== */

/* 1. Global VIP Aesthetic Consistency */
.v7m-vip-header,
#header,
.site-header {
    background: #0f2637 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.liveHead,
.liveSubNav,
table.live tr.tHead td,
table.live th {
    background: #0f2637 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.v7m-vip-footer,
#footer,
.site-footer {
    background: #0f2637 !important;
    color: #94a3b8 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ==========================================================================
   2. KHO DỮ LIỆU BÓNG ĐÁ (DATABASE) - MODERN FLAT 8PX REDESIGN
   Strict Compliance:
   - border-radius: 8px !important (Cards, modals, inputs, tabs, buttons, chips)
   - box-shadow: none !important (Flat modern)
   - border: none !important (Color contrast separation)
   - Font: Arial, system stack, fluid typography clamp(13px, 0.8vw + 10px, 16px)
   - Gradient buttons: active tabs, round buttons, CTA buttons
   - No unicode icons
   ========================================================================== */

#sevenm-db-container,
.s7m-db-container {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 20px;
}

/* Header & Title Banner */
.s7m-db-header {
    background: #ffffff;
    border-radius: 8px !important;
    padding: 14px 16px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.s7m-db-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

.s7m-db-title-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
}

.s7m-db-icon-box {
    width: 38px;
    height: 38px;
    border-radius: 8px !important;
    background: #f1f5f9;
    color: var(--v7m-primary, #c90201);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.s7m-db-title-text {
    display: flex;
    flex-direction: column;
}

.s7m-db-title {
    margin: 0;
    font-size: clamp(15px, 1vw + 11px, 18px) !important;
    font-weight: 600 !important;
    color: #0f2637;
    line-height: 1.25;
}

.s7m-db-desc {
    margin: 2px 0 0 0;
    font-size: 13px !important;
    color: #64748b;
    line-height: 1.35;
}

.s7m-db-stat-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f1f5f9;
    color: #475569;
    font-size: 13px;
    font-weight: 500;
    padding: 6px 12px;
    border-radius: 8px !important;
    white-space: nowrap;
}

/* Instant Search Box */
.s7m-db-search-box {
    width: 100%;
}

.s7m-search-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.s7m-search-icon {
    position: absolute;
    left: 12px;
    color: #94a3b8;
    pointer-events: none;
}

.s7m-db-search-input {
    width: 100%;
    height: 42px;
    padding: 0 40px 0 38px;
    font-size: clamp(13px, 0.8vw + 10px, 15px) !important;
    color: #0f2637;
    background: #f8fafc;
    border: none !important;
    border-radius: 8px !important;
    outline: none;
    box-sizing: border-box;
    transition: background 0.15s ease;
}

.s7m-db-search-input:focus {
    background: #f1f5f9;
}

.s7m-search-clear-btn {
    position: absolute;
    right: 10px;
    width: 26px;
    height: 26px;
    border: none !important;
    background: #e2e8f0;
    color: #64748b;
    border-radius: 8px !important;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.s7m-search-clear-btn:hover {
    background: #cbd5e1;
    color: #0f2637;
}

/* Continent Tabs */
.s7m-db-nav {
    width: 100%;
}

.s7m-db-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.s7m-db-tabs li {
    margin: 0;
    padding: 0;
}

.s7m-tab-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f1f5f9;
    color: #334155;
    padding: 8px 14px;
    font-size: clamp(13px, 0.8vw + 10px, 14.5px) !important;
    font-weight: 500;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
}

.s7m-tab-btn:hover {
    background: #e2e8f0;
    color: #0f2637;
}

.s7m-db-tabs li.active .s7m-tab-btn {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600;
}

/* Hot Leagues Quick Bar */
.s7m-db-hot-bar {
    background: #f8fafc;
    padding: 8px 12px;
    margin-bottom: 12px;
    border-radius: 8px !important;
    display: flex;
    align-items: center;
    gap: 10px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.s7m-hot-bar-header {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--v7m-primary, #c90201);
    white-space: nowrap;
    flex-shrink: 0;
}

.s7m-hot-bar-chips {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
}

.s7m-hot-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
    color: #0f2637;
    padding: 5px 12px;
    font-size: 13px;
    font-weight: 500;
    border-radius: 8px !important;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.s7m-hot-chip:hover {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.s7m-hot-chip svg {
    color: #ffd800;
    flex-shrink: 0;
}

.s7m-hot-chip:hover svg {
    color: #ffffff;
}

/* Country Grid & Cards */
.s7m-db-body {
    width: 100%;
}

.s7m-tab-panel {
    display: none;
}

.s7m-tab-panel.active {
    display: block;
}

.s7m-country-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 8px;
    margin-bottom: 20px;
}

.s7m-country-card {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #ffffff;
    padding: 9px 12px;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: background 0.15s ease, transform 0.1s ease;
    box-sizing: border-box;
    position: relative;
    user-select: none;
}

.s7m-country-card:hover,
.s7m-country-card:focus {
    background: #ecfdf5 !important;
    outline: none;
}

.s7m-country-card:hover .s7m-country-name {
    color: var(--v7m-primary, #c90201) !important;
}

.s7m-country-card:active {
    transform: scale(0.98);
}

.s7m-country-flag-box {
    width: 32px;
    height: 22px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    border-radius: 4px !important;
    overflow: hidden;
}

.s7m-country-flag-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.2s ease;
}

.s7m-country-card:hover .s7m-country-flag-box img {
    transform: scale(1.08);
}

.s7m-country-name-box {
    flex: 1;
    min-width: 0;
}

.s7m-country-name {
    display: block;
    font-size: clamp(13px, 0.8vw + 10px, 14.5px) !important;
    font-weight: 500;
    color: #0f2637;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
    transition: color 0.15s ease;
}

.s7m-country-meta {
    display: block;
    font-size: 11.5px !important;
    color: #64748b;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.s7m-country-top-league {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px !important;
    color: var(--v7m-primary, #c90201);
    margin-top: 2px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.s7m-cup-mini-icon {
    flex-shrink: 0;
    color: #ffd800;
}

.s7m-country-action {
    color: #94a3b8;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: color 0.15s ease, transform 0.15s ease;
}

.s7m-country-card:hover .s7m-country-action {
    color: var(--v7m-primary, #c90201);
    transform: translateX(3px);
}

/* Fallback box when tournament data is empty */
.s7m-t-no-data-box {
    text-align: center;
    padding: 32px 20px;
    background: #f8fafc;
    border-radius: 8px !important;
    margin: 14px 0;
}

.s7m-t-no-data-box svg {
    margin-bottom: 10px;
}

.s7m-t-no-data-box h3 {
    font-size: clamp(15px, 1vw + 11px, 17px) !important;
    font-weight: 500;
    color: #0f2637;
    margin: 0 0 8px 0;
}

.s7m-t-no-data-box p {
    font-size: 13.5px;
    color: #64748b;
    margin: 0 0 16px 0;
    line-height: 1.5;
}

.s7m-t-suggest-title {
    font-size: 13px;
    font-weight: 500;
    color: #334155;
    margin-bottom: 10px;
}

.s7m-t-suggest-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin-bottom: 20px;
}

.s7m-t-back-action {
    margin-top: 10px;
}

.s7m-btn-back-home {
    display: inline-block;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    padding: 8px 18px;
    border-radius: 8px !important;
    font-size: 13.5px;
    font-weight: 500;
    text-decoration: none !important;
    transition: opacity 0.15s ease;
}

.s7m-btn-back-home:hover {
    opacity: 0.92;
}

/* Other International Section */
.s7m-other-section {
    margin-top: 20px;
    background: #ffffff;
    border-radius: 8px !important;
    padding: 14px 16px;
}

.s7m-other-title {
    background: #0f2637;
    color: #ffffff;
    font-size: clamp(13.5px, 0.8vw + 10px, 15px) !important;
    font-weight: 600;
    padding: 10px 14px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 8px !important;
}

/* ==========================================================================
   MODERN INTERACTIVE TOURNAMENT MODAL (Accessible, Mobile-First, 8px Radius)
   ========================================================================== */
.s7m-modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(15, 23, 42, 0.65);
    backdrop-filter: blur(2px);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
}

.s7m-modal-backdrop.is-hidden {
    display: none !important;
}

.s7m-modal-dialog {
    background: #ffffff;
    width: 100%;
    max-width: 680px;
    max-height: 85vh;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: s7mModalFadeIn 0.18s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes s7mModalFadeIn {
    from {
        opacity: 0;
        transform: scale(0.96) translateY(6px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.s7m-modal-header {
    background: #0f2637;
    color: #ffffff;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
}

.s7m-modal-title-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.s7m-modal-flag-wrap {
    width: 36px;
    height: 24px;
    border-radius: 4px !important;
    overflow: hidden;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.s7m-modal-flag-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.s7m-modal-title {
    margin: 0;
    font-size: clamp(15px, 1vw + 11px, 17px) !important;
    font-weight: 600;
    color: #ffffff;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.s7m-modal-subtitle {
    font-size: 12px !important;
    color: #94a3b8;
    line-height: 1.3;
}

.s7m-modal-close {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    transition: background 0.15s ease;
}

.s7m-modal-close:hover {
    background: rgba(255, 255, 255, 0.22);
}

.s7m-modal-body {
    padding: 16px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    flex: 1;
    min-height: 180px;
}

.s7m-modal-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.s7m-modal-col {
    display: flex;
    flex-direction: column;
}

.s7m-modal-col-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 6px;
    background: transparent;
    color: #0f2637;
    font-size: 13.5px;
    font-weight: 600;
    border-bottom: 2px solid var(--v7m-primary, #c90201);
}

.s7m-modal-col-header svg {
    color: var(--v7m-primary, #c90201);
}

.s7m-badge-pill {
    background: #f1f5f9;
    color: #475569;
    font-size: 11.5px;
    padding: 2px 7px;
    border-radius: 8px !important;
    margin-left: auto;
}

.s7m-modal-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.s7m-modal-item-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: #f8fafc;
    color: #0f2637;
    padding: 8px 12px;
    border-radius: 8px !important;
    text-decoration: none;
    font-size: clamp(13px, 0.8vw + 10px, 14px) !important;
    transition: background 0.15s ease, color 0.15s ease;
}

.s7m-modal-item-link:hover {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}

.s7m-modal-item-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
}

.s7m-modal-item-link svg {
    color: #94a3b8;
    flex-shrink: 0;
    transition: color 0.15s ease;
}

.s7m-modal-item-link:hover svg {
    color: #ffffff;
}

.s7m-modal-empty {
    font-size: 13px;
    color: #94a3b8;
    padding: 8px 12px;
    background: #f8fafc;
    border-radius: 8px !important;
}

.s7m-modal-footer {
    padding: 12px 16px;
    background: #f8fafc;
    display: flex;
    justify-content: flex-end;
    flex-shrink: 0;
}

.s7m-modal-primary-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    padding: 9px 18px;
    border-radius: 8px !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: opacity 0.15s ease;
}

.s7m-modal-primary-btn:hover {
    opacity: 0.92;
}

/* ==========================================================================
   3. TOURNAMENT DETAIL VIEW (#s7m-tourney-wrap) - MODERN 8PX REDESIGN
   ========================================================================== */
#s7m-tourney-wrap,
.s7m-tourney-wrap {
    width: 100% !important;
    max-width: 100% !important;
    background: #ffffff;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    margin-bottom: 20px;
    overflow: hidden;
}

/* Breadcrumbs Top Bar */
.s7m-t-breadcrumb {
    background: #0f2637;
    color: #ffffff;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    font-size: clamp(13px, 0.8vw + 10px, 14.5px) !important;
    border-radius: 8px 8px 0 0 !important;
}

.s7m-t-breadcrumb-left {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}

.s7m-t-breadcrumb a {
    color: #ffd800;
    text-decoration: none;
    font-weight: 500;
}

.s7m-t-breadcrumb a:hover {
    text-decoration: underline;
}

.s7m-crumb-sep {
    color: #64748b;
}

.s7m-crumb-current {
    color: #ffffff;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.s7m-t-btn-back {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 13px;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 8px !important;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.s7m-t-btn-back:hover {
    opacity: 0.92;
}

/* Tournament Header Box */
.s7m-t-header-box {
    background: #f8fafc;
    padding: 14px 16px;
    margin: 12px;
    border-radius: 8px !important;
    display: flex;
    align-items: center;
    gap: 14px;
}

.s7m-t-flag-wrap {
    width: 52px;
    height: 52px;
    border-radius: 8px !important;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.s7m-t-flag-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.s7m-t-header-info {
    flex: 1;
    min-width: 0;
}

.s7m-t-title {
    margin: 0 0 6px 0;
    font-size: clamp(16px, 1.2vw + 12px, 20px) !important;
    font-weight: 600 !important;
    color: #0f2637;
    line-height: 1.3;
}

.s7m-t-meta {
    font-size: 13.5px !important;
    color: #64748b;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
}

.s7m-t-meta-item strong {
    color: #0f2637;
    font-weight: 600;
}

.s7m-t-meta-badge strong {
    color: #e8503a;
}

/* Sibling Tournaments Chips Bar */
.s7m-t-siblings-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 12px;
    margin-bottom: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.s7m-t-siblings-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
    flex-shrink: 0;
}

.s7m-t-siblings-chips {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
}

.s7m-sibling-chip {
    display: inline-block;
    background: #f1f5f9;
    color: #334155;
    padding: 5px 12px;
    font-size: 13px;
    font-weight: 500;
    border-radius: 8px !important;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease;
}

.s7m-sibling-chip:hover {
    background: #e2e8f0;
    color: #0f2637;
}

.s7m-sibling-chip.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600;
}

/* Sub Navigation Tabs */
.s7m-t-nav-tabs {
    display: flex;
    background: #f1f5f9;
    margin: 0 12px 14px 12px;
    padding: 4px;
    list-style: none;
    gap: 4px;
    border-radius: 8px !important;
}

.s7m-t-nav-tabs li {
    flex: 1;
    margin: 0;
    padding: 9px 14px;
    font-size: clamp(13px, 0.8vw + 10px, 14.5px) !important;
    font-weight: 500;
    cursor: pointer;
    background: transparent;
    color: #475569;
    border-radius: 8px !important;
    transition: background 0.15s ease, color 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: nowrap;
}

.s7m-t-nav-tabs li:hover {
    background: #e2e8f0;
    color: #0f2637;
}

.s7m-t-nav-tabs li.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600;
}

/* Tab Panels */
.s7m-t-panel {
    padding: 0 12px 14px 12px;
}

.s7m-t-panel.is-hidden {
    display: none !important;
}

/* Filter Bar */
.s7m-t-filter-box {
    background: #f8fafc;
    padding: 10px 14px;
    margin-bottom: 12px;
    border-radius: 8px !important;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 14px;
}

.s7m-t-filter-group {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.s7m-t-filter-group label {
    font-weight: 600;
    color: #0f2637;
}

.s7m-vs-text {
    font-size: 13px;
    font-weight: 600;
    color: #64748b;
}

.s7m-t-select {
    padding: 7px 12px;
    font-size: 13.5px;
    background: #ffffff;
    color: #0f2637;
    border: none !important;
    border-radius: 8px !important;
    outline: none;
    max-width: 220px;
    height: 36px;
}

/* Rounds Selector (Pills) */
.s7m-t-rounds-section {
    margin-bottom: 14px;
    border-radius: 8px !important;
    overflow: hidden;
    background: #ffffff;
}

.s7m-t-rounds-title {
    background: #0f2637;
    color: #ffffff;
    font-size: 13.5px;
    font-weight: 600;
    padding: 8px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 8px 8px 0 0 !important;
}

.s7m-t-current-round-text {
    font-size: 12.5px;
    color: #ffd800;
}

.s7m-t-rounds-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 10px;
    background: #f8fafc;
    border-radius: 0 0 8px 8px !important;
}

.s7m-t-round-btn {
    display: inline-block;
    min-width: 32px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 13.5px;
    font-weight: 500;
    background: #ffffff;
    color: #0f2637;
    cursor: pointer;
    text-decoration: none;
    padding: 0 6px;
    border: none !important;
    border-radius: 8px !important;
    transition: background 0.15s ease, color 0.15s ease;
}

.s7m-t-round-btn:hover {
    background: #e2e8f0;
    color: var(--v7m-primary, #c90201);
}

.s7m-t-round-btn.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600;
}

/* Match Grid (100% Responsive Div Grid) */
.s7m-t-match-grid {
    width: 100%;
    margin-bottom: 16px;
    border-radius: 8px !important;
    overflow: hidden;
}

.s7m-t-match-head {
    display: flex;
    align-items: center;
    background: #0f2637;
    color: #ffffff;
    padding: 9px 12px;
    font-size: 13.5px;
    font-weight: 600;
    border-radius: 8px 8px 0 0 !important;
}

.s7m-t-match-head .col-round { width: 10%; text-align: center; }
.s7m-t-match-head .col-time { width: 22%; text-align: center; }
.s7m-t-match-head .col-team-h { width: 26%; text-align: right; }
.s7m-t-match-head .col-score { width: 12%; text-align: center; }
.s7m-t-match-head .col-team-a { width: 26%; text-align: left; }
.s7m-t-match-head .col-detail { width: 4%; text-align: center; }

.s7m-t-match-rows {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #f1f5f9;
}

.s7m-t-match-row {
    display: flex;
    align-items: center;
    background: #ffffff;
    padding: 9px 12px;
    font-size: clamp(13px, 0.8vw + 10px, 14.5px) !important;
    transition: background 0.15s ease;
}

.s7m-t-match-row:hover {
    background: #f8fafc;
}

.s7m-t-match-row .col-round { width: 10%; text-align: center; font-weight: 600; color: #475569; }
.s7m-t-match-row .col-time { width: 22%; text-align: center; color: #64748b; font-size: 13px; }
.s7m-t-match-row .col-team-h { width: 26%; text-align: right; font-weight: 500; color: #0f2637; }
.s7m-t-match-row .col-score { width: 12%; text-align: center; font-weight: 600; }
.s7m-t-match-row .col-team-a { width: 26%; text-align: left; font-weight: 500; color: #0f2637; }
.s7m-t-match-row .col-detail { width: 4%; text-align: center; }

.s7m-t-score-ft {
    color: #e8503a;
    font-size: 15px;
    font-weight: 600;
}

.s7m-t-score-ht {
    font-size: 12px;
    color: #64748b;
    margin-left: 3px;
    font-weight: 400;
}

.s7m-t-score-vs {
    display: inline-block;
    background: #f1f5f9;
    color: #64748b;
    font-size: 12.5px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 6px !important;
}

.s7m-t-red-card {
    display: inline-block;
    background: #e8503a;
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 4px;
    margin: 0 4px;
    border-radius: 4px !important;
    line-height: 1;
}

.s7m-t-analysis-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff !important;
    border-radius: 6px !important;
    text-decoration: none;
    transition: opacity 0.15s ease;
}

.s7m-t-analysis-link:hover {
    opacity: 0.88;
}

.s7m-t-empty-cell {
    padding: 18px;
    text-align: center;
    background: #ffffff;
    color: #94a3b8;
    font-size: 14px;
}

/* Standings Grid */
.s7m-t-standings-grid {
    width: 100%;
    border-radius: 8px !important;
    overflow: hidden;
    margin-bottom: 16px;
}

.s7m-t-std-head {
    display: flex;
    align-items: center;
    background: #0f2637;
    color: #ffffff;
    padding: 9px 12px;
    font-size: 13.5px;
    font-weight: 600;
    border-radius: 8px 8px 0 0 !important;
}

.s7m-t-std-rows {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: #e2e8f0;
}

.s7m-t-std-row {
    display: flex;
    align-items: center;
    background: #ffffff;
    padding: 8px 12px;
    font-size: clamp(13px, 0.8vw + 10px, 14px) !important;
    transition: background 0.15s ease;
}

.s7m-t-std-row:nth-child(even) {
    background: #f8fafc;
}

.s7m-t-std-row:hover {
    background: #eef2f6;
}

.s7m-t-std-head .col-rank, .s7m-t-std-row .col-rank { width: 5%; text-align: center; }
.s7m-t-std-head .col-team, .s7m-t-std-row .col-team { width: 28%; text-align: left; font-weight: 500; }
.s7m-t-std-head .col-p, .s7m-t-std-row .col-p { width: 6%; text-align: center; }
.s7m-t-std-head .col-w, .s7m-t-std-row .col-w { width: 6%; text-align: center; }
.s7m-t-std-head .col-d, .s7m-t-std-row .col-d { width: 6%; text-align: center; }
.s7m-t-std-head .col-l, .s7m-t-std-row .col-l { width: 6%; text-align: center; }
.s7m-t-std-head .col-gf, .s7m-t-std-row .col-gf { width: 6%; text-align: center; }
.s7m-t-std-head .col-ga, .s7m-t-std-row .col-ga { width: 6%; text-align: center; }
.s7m-t-std-head .col-gd, .s7m-t-std-row .col-gd { width: 6%; text-align: center; }
.s7m-t-std-head .col-pts, .s7m-t-std-row .col-pts { width: 7%; text-align: center; font-weight: 600; color: #e8503a; }
.s7m-t-std-head .col-memo, .s7m-t-std-row .col-memo { width: 18%; text-align: left; font-size: 12.5px; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.s7m-t-rank-badge {
    display: inline-block;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    font-weight: 600;
    font-size: 12px;
    color: #ffffff;
    border-radius: 6px !important;
}

.rank-ucl { background: var(--v7m-primary, #c90201);
    background-image: none; }
.rank-uel { background: #005a9e; }
.rank-relegation { background: #e8503a; }
.rank-normal { background: #94a3b8; }

.s7m-empty-box {
    padding: 24px;
    text-align: center;
    background: #f8fafc;
    color: #64748b;
    border-radius: 8px !important;
    font-size: 14px;
}

/* Rules / System Box */
.s7m-t-rules-box {
    background: #f8fafc;
    padding: 16px;
    border-radius: 8px !important;
    margin-bottom: 16px;
    font-size: 14.5px;
    line-height: 1.65;
}

.s7m-t-rules-box h3 {
    margin: 0 0 12px 0;
    font-size: 15.5px;
    color: #0f2637;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--v7m-primary, #c90201);
}


/* 4. Widget Generator & Tiện Ích (page-tien-ich.php) */
.widget-intro-desc {
    font-size: 15px;
    color: #64748b;
    margin-bottom: 14px;
    line-height: 1.5;
}

.widget-nav-tabs {
    display: flex;
    flex-wrap: wrap;
    background: #0f2637;
    margin-bottom: 15px;
    list-style: none;
    padding: 0;
    gap: 2px;
}

.widget-nav-tabs .tab-btn {
    padding: 10px 16px;
    font-size: 15px;
    font-weight: bold;
    background: #193850;
    color: #e2e8f0;
    border: none !important;
    cursor: pointer;
    transition: background 0.15s ease;
}

.widget-nav-tabs .tab-btn:hover,
.widget-nav-tabs .tab-btn.active {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}

.widget-tab-pane {
    display: block;
}

.widget-tab-pane.is-hidden {
    display: none;
}

.config-box {
    background: #f8fafc;
    padding: 14px;
    margin-bottom: 15px;
}

.config-row {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 10px;
}

.config-field {
    flex: 1;
    min-width: 180px;
}

.config-field label {
    display: block;
    font-size: 14px;
    font-weight: bold;
    color: #0f2637;
    margin-bottom: 4px;
}

.config-field input,
.config-field select {
    width: 100%;
    padding: 8px 10px;
    font-size: 14px;
    background: #ffffff;
    color: #0f2637;
    border: none !important;
    outline: none;
    box-sizing: border-box;
}

.widget-action-row {
    margin-top: 10px;
}

.preview-box {
    background: #f4f6f8;
    padding: 14px;
    margin-bottom: 15px;
}

.preview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.preview-open-link {
    color: var(--v7m-primary, #c90201);
    font-weight: bold;
    text-decoration: none;
    font-size: 14px;
}

.preview-iframe-wrapper iframe {
    width: 100% !important;
    border: none !important;
    background: #ffffff;
    display: block;
}

.code-box-wrapper {
    background: #0f2637;
    padding: 14px;
    margin-bottom: 15px;
}

.code-label {
    font-size: 14px;
    font-weight: bold;
    color: #cbd5e1;
    margin-bottom: 8px;
}

.widget-textarea {
    width: 100% !important;
    height: 90px;
    background: #193850;
    color: #a7f3d0;
    font-family: monospace;
    font-size: 14px;
    padding: 10px;
    border: none !important;
    box-sizing: border-box;
    resize: vertical;
}

.btn-copy-widget {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
    font-weight: bold;
    font-size: 15px;
    padding: 8px 20px;
    border: none !important;
    cursor: pointer;
    margin-top: 10px;
}

.btn-copy-widget:hover {
    filter: brightness(1.1);
}

.copy-success-badge {
    margin-left: 10px;
    color: var(--v7m-primary, #c90201);
    font-weight: bold;
    font-size: 14px;
}

.widget-guide-box {
    background: #f8fafc;
    padding: 14px;
    margin-top: 15px;
}

.widget-guide-title {
    font-size: 16px;
    font-weight: bold;
    color: #0f2637;
    margin-bottom: 8px;
}

.widget-guide-list {
    margin: 0;
    padding-left: 20px;
    font-size: 15px;
    color: #334155;
    line-height: 1.6;
}

/* 5. Standalone Embed Widget (template-embed-widget.php) */
.sevenm-embed-wrapper {
    width: 100% !important;
    margin: 0;
    padding: 0;
    background: #ffffff;
    box-sizing: border-box;
}

.embed-tb-top {
    background: #0f2637;
    color: #ffffff;
    padding: 6px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
    flex-wrap: wrap;
    gap: 6px;
}

.embed-tb-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.embed-tb-left a {
    color: #e2e8f0;
    font-size: 14px;
    text-decoration: none;
    padding: 2px 8px;
    background: #193850;
}

.embed-tb-left a:hover,
.embed-tb-left a.active {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
    font-weight: bold;
}

.embed-tb-right {
    display: flex;
    align-items: center;
    gap: 6px;
}

.embed-tb-right input[type="text"] {
    background: #ffffff;
    color: #0f2637;
    border: none !important;
    padding: 4px 8px;
    font-size: 14px;
    outline: none;
}

.embed-footer-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #0f2637;
    padding: 6px 12px;
    font-size: 13px;
    color: #94a3b8;
}

.embed-footer-bar a {
    color: #ffd800;
    font-weight: bold;
    text-decoration: none;
}

.embed-footer-bar a:hover {
    color: #ffffff;
}

.embed-pulse-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: var(--v7m-primary, #c90201);
    background-image: none;
    margin-right: 4px;
    vertical-align: middle;
}

/* 6. Predictions Article Layout (.pred-*) */
.pred-summary-box {
    background: #0f2637;
    color: #ffffff;
    padding: 16px;
    margin: 15px 0 20px 0;
}

.pred-league-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    padding-bottom: 8px;
    margin-bottom: 12px;
}

.pred-league-title {
    font-size: 16px;
    font-weight: bold;
    color: var(--v7m-primary, #c90201);
}

.pred-time-tag {
    font-size: 14px;
    color: #e2e8f0;
}

.pred-teams-row {
    display: flex;
    justify-content: space-around;
    align-items: center;
    text-align: center;
    padding: 10px 0;
}

.pred-team-col {
    flex: 1;
}

.pred-team-logo-wrap {
    width: 64px;
    height: 64px;
    margin: 0 auto 8px auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pred-team-logo {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.pred-team-name {
    font-size: 17px;
    font-weight: bold;
    color: #ffffff;
}

.pred-team-rank {
    font-size: 13px;
    color: #94a3b8;
    margin-top: 3px;
}

.pred-vs-box {
    padding: 0 15px;
    font-size: 20px;
    font-weight: bold;
    color: #e8503a;
}

.pred-odds-strip {
    background: #193850;
    padding: 10px;
    margin-top: 12px;
    display: flex;
    justify-content: space-around;
    font-size: 14px;
    color: #e2e8f0;
}

.pred-section-title {
    font-size: 18px;
    font-weight: bold;
    color: #0f2637;
    margin: 20px 0 10px 0;
    padding-bottom: 6px;
    border-bottom: 2px solid var(--v7m-primary, #c90201);
}

.pred-lead-p {
    font-size: 16px;
    line-height: 1.7;
    color: #1e293b;
    margin-bottom: 12px;
}

.pred-p {
    font-size: 15px;
    line-height: 1.6;
    color: #334155;
    margin-bottom: 10px;
}

.pred-analysis-list {
    margin: 0 0 15px 0;
    padding-left: 20px;
    font-size: 15px;
    line-height: 1.6;
    color: #1e293b;
}

.pred-tactics-wrap {
    background: #f8fafc;
    padding: 14px;
    margin: 15px 0;
}

.pred-infographic-fig {
    margin: 15px 0;
    text-align: center;
}

.pred-infographic-img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.pred-infographic-cap {
    font-size: 13px;
    color: #64748b;
    margin-top: 6px;
    font-style: italic;
}


/* 7. Basketball Table & Mobile Card Classes */
.b-cell-time {
    text-align: center;
    font-size: 15px;
}

.b-cell-league {
    text-align: center;
    font-weight: bold;
    font-size: 15px;
}

.b-cell-home {
    text-align: right;
    padding-right: 10px;
    font-weight: bold;
    color: #0000cc;
    font-size: 15px;
}

.b-cell-away {
    text-align: left;
    padding-left: 10px;
    font-weight: bold;
    color: #0000cc;
    font-size: 15px;
}

.b-cell-q {
    text-align: center;
    color: #64748b;
    font-size: 15px;
}

.b-cell-total {
    text-align: center;
    font-weight: bold;
    font-size: 16px;
    color: #e8503a;
}

.b-cell-hdp {
    text-align: center;
    font-weight: bold;
    color: #005f73;
    font-size: 15px;
}

.b-cell-ou {
    text-align: center;
    font-weight: bold;
    color: #854d0e;
    font-size: 15px;
}

.m-basket-card {
    background: #ffffff !important;
    margin-bottom: 6px !important;
    padding: 8px 10px !important;
    border: none !important;
}

.m-basket-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    font-size: 15px !important;
    margin-bottom: 6px !important;
    padding-bottom: 4px !important;
}

.m-basket-league {
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.m-basket-time {
    color: #64748b;
    font-size: 14px;
}

.m-basket-table {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 15px !important;
    text-align: center !important;
}

.m-basket-table th {
    background: #0f2637 !important;
    color: #ffffff !important;
    font-size: 14px !important;
    padding: 4px 2px !important;
    border: none !important;
}

.m-basket-table td {
    padding: 6px 2px !important;
    border: none !important;
    font-size: 15px !important;
}

.m-basket-table td.team-cell {
    text-align: left !important;
    font-weight: bold !important;
    color: #0f2637 !important;
    padding-left: 6px !important;
}

.m-basket-table td.total-cell {
    font-weight: bold !important;
    color: #e8503a !important;
    background: #fff1f2 !important;
}

.m-basket-odds-row {
    display: flex;
    justify-content: space-between;
    margin-top: 6px;
    padding-top: 4px;
    background: #f8fafc;
    padding: 4px 8px;
    font-size: 14px;
    color: #64748b;
}

.m-b-hdp-val {
    color: #005f73;
}

.m-b-ou-val {
    color: #854d0e;
}

/* ==========================================================================
   7M VIP MODERN LIVESCORE UI (100% REPLICA OF https://www.7msport.com/vip/)
   Strict Compliance:
   - border-radius: 0 !important (Flat 0px)
   - box-shadow: none !important; text-shadow: none !important (No shadow)
   - border: none !important (Color contrast background separation)
   - font-family: Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important
   - Fluid typography 16px - 18px (root clamp), body 100%, no fonts < 15px
   - Mint Hover #daf2e3 on match cards
   ========================================================================== */

/* 1. VIP Content Layout */
.v7m-vip-content-layout {
    width: 100% !important;
    max-width: 1250px !important;
    margin: 8px auto !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
    min-height: 85vh;
    display: flex;
    justify-content: space-between;
    gap: 14px;
}

.v7m-vip-main-container {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* 2. Sticky Filters Toolbar - Modern International Standard */
.filters-wrapper {
    position: sticky;
    top: 50px;
    z-index: 90;
    background: var(--v7m-secondary, #012058) !important;
    background-image: none !important;
    padding: 6px 10px;
    margin-bottom: 8px;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    box-sizing: border-box;
    width: 100% !important;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.vip-filter-single-row,
.filter-group {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 0;
}

.vip-filter-actions-strip,
.odds-filter-actions-strip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.vip-league-control-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.vip-tools-group {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.filter-tab {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    flex: 1 1 auto;
    min-width: 0;
}

.filter-tab::-webkit-scrollbar {
    display: none;
}

/* Filter Tab Pills - Sleek Translucent Navy Pills */
.filter-tab-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 9px;
    background: rgba(255, 255, 255, 0.08);
    color: #e2e8f0;
    font-size: 13px;
    font-weight: 500 !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    cursor: pointer;
    border-radius: 6px !important;
    border: none !important;
    user-select: none;
    transition: all 0.15s ease;
    box-shadow: none !important;
    text-decoration: none;
    line-height: 1.2;
    flex-shrink: 0;
}

.filter-tab-item:hover {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
}

.filter-tab-item.selected,
.filter-tab-item.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.filter-tab-item .icon-badge {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 500;
    padding: 1px 5px;
    background: rgba(0, 0, 0, 0.28);
    color: #ffffff;
    border-radius: 6px !important;
    border: none !important;
    line-height: 1.2;
}

.filter-tab-item.selected .icon-badge,
.filter-tab-item.active .icon-badge {
    background: rgba(0, 0, 0, 0.35) !important;
    color: #ffffff !important;
}

.filter-tab-item .icon-badge-live {
    background: #dc2626 !important;
    color: #ffffff !important;
}

.filter-tab-item.selected .icon-badge-live,
.filter-tab-item.active .icon-badge-live {
    background: #dc2626 !important;
    color: #ffffff !important;
}

/* Pulsing live dot */
.live-pulse-dot {
    width: 7px;
    height: 7px;
    border-radius: 50% !important;
    background-color: #ef4444;
    display: inline-block;
    animation: v7mLivePulse 1.4s ease-in-out infinite;
    flex-shrink: 0;
}

.filter-tab-item.selected .live-pulse-dot,
.filter-tab-item.active .live-pulse-dot {
    background-color: #ffffff;
}

@keyframes v7mLivePulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.3; transform: scale(0.75); }
}

.filter-tab-hot svg {
    color: #f59e0b;
    flex-shrink: 0;
}

.filter-tab-hot.selected svg,
.filter-tab-hot.active svg {
    color: #ffffff;
}

.filter-tab-fav svg {
    color: #eab308;
    flex-shrink: 0;
}

.filter-tab-fav.selected,
.filter-tab-fav.active {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
    color: #ffffff !important;
}

.filter-tab-fav.selected svg,
.filter-tab-fav.active svg {
    color: #ffffff;
}

.filter-tab-fav.selected .icon-badge-fav,
.filter-tab-fav.active .icon-badge-fav {
    background: rgba(0, 0, 0, 0.35) !important;
    color: #ffffff !important;
}

/* Date Navigator (< Hôm nay >) */
.calendar-box {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.calendar-box .datePlug {
    display: inline-flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.08);
    padding: 1px 3px;
    height: 28px;
    gap: 2px;
    border: none !important;
    border-radius: 6px !important;
    user-select: none;
}

.btn-date-arrow {
    background: none;
    border: none !important;
    border-radius: 4px !important;
    color: #cbd5e1;
    cursor: pointer;
    padding: 0;
    width: 20px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.btn-date-arrow:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.16);
}

.daseDateBox {
    font-size: 12px !important;
    font-weight: 500;
    color: #e2e8f0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    text-align: center;
    padding: 0 4px;
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.15s ease;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

.daseDateBox:hover {
    color: #ffffff;
}

.daseDateBox.is-offset-date {
    color: #38bdf8;
}

.daseDateBox .v7m-cal-icon {
    display: none !important;
}

.btn-today-quick {
    display: inline-flex;
    align-items: center;
    padding: 2px 6px;
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer;
    transition: opacity 0.15s ease;
    height: 22px;
    font-family: Arial, -apple-system, sans-serif !important;
}

.btn-today-quick:hover {
    opacity: 0.9;
}

.btn-today-quick.is-hidden {
    display: none !important;
}

.vip-datepicker-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.vip-datepicker-wrap .v7m-hidden-date-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.btn-calendar-trigger {
    background: rgba(255, 255, 255, 0.12);
    border: none !important;
    border-radius: 4px !important;
    color: #e2e8f0;
    cursor: pointer;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.btn-calendar-trigger:hover {
    background: rgba(255, 255, 255, 0.22);
    color: #ffffff;
}

/* Sub-Filters Strip */
.filters-sub-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 6px;
    border: none !important;
}

.filter-sub-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.vip-quick-league-wrap {
    display: inline-flex;
}

.vip-quick-league-wrap .vip-select {
    height: 32px;
    padding: 0 10px;
    border: none !important;
    border-radius: 8px !important;
    background-color: #f1f5f9;
    color: #0f2637;
    font-size: 13px;
    font-weight: 500;
    outline: none;
    cursor: pointer;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    max-width: 175px;
    transition: background-color 0.15s ease;
}

.vip-quick-league-wrap .vip-select:hover,
.vip-quick-league-wrap .vip-select:focus {
    background-color: #e2e8f0;
}

/* League Filter Button */
.btn-open-league-filter {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 28px;
    background: rgba(255, 255, 255, 0.08);
    color: #e2e8f0;
    padding: 0 9px;
    font-size: 12.5px;
    font-weight: 500;
    cursor: pointer;
    border: none !important;
    border-radius: 6px !important;
    transition: all 0.15s ease;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    white-space: nowrap;
}

.btn-open-league-filter:hover {
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

.btn-open-league-filter.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
}

.league-active-badge {
    background: rgba(0, 0, 0, 0.28);
    color: #e2e8f0;
    font-size: 10.5px;
    padding: 1px 5px;
    font-weight: 500;
    border-radius: 4px !important;
}

/* Mobile-only Utility Classes & Triggers (Hidden on Desktop) */
.mobile-only-inline {
    display: none !important;
}

.mobile-only-flex {
    display: none !important;
}

.mobile-search-btn {
    display: none;
}

.btn-mobile-search-close {
    display: none;
}

.btn-mobile-odds-trigger {
    display: none;
    align-items: center;
    gap: 4px;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    padding: 4px 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    border: none !important;
    border-radius: 6px !important;
    user-select: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.btn-mobile-odds-trigger:hover,
.btn-mobile-odds-trigger.active {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}

.mobile-odds-count-dot {
    display: inline-block;
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    padding: 0 5px;
    line-height: 16px;
    height: 16px;
    min-width: 16px;
    text-align: center;
    border-radius: 4px !important;
}

.btn-mobile-odds-trigger.active .mobile-odds-count-dot {
    background: #ffffff;
    color: var(--v7m-primary, #c90201);
}

.mobile-odds-count-dot.has-none {
    background: #64748b;
}

.hide-matches-counter {
    display: none;
    font-size: 11.5px;
    color: #f87171;
    white-space: nowrap;
    flex-shrink: 0;
}

.hide-matches-counter.has-hidden {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.btn-show-all-hidden {
    color: #34d399;
    font-weight: 500;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.btn-show-all-hidden:hover {
    text-decoration: underline;
}

.vip-search-box {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.08);
    padding: 0 7px;
    height: 28px;
    width: 120px;
    position: relative;
    gap: 5px;
    border-radius: 6px !important;
    border: none !important;
    transition: width 0.2s ease, background 0.15s ease;
}

.vip-search-box:focus-within {
    background: rgba(255, 255, 255, 0.15);
    width: 150px;
}

.vip-search-icon {
    color: #94a3b8;
    flex-shrink: 0;
}

.vip-search-box input {
    background: transparent;
    border: none !important;
    font-size: 12px;
    outline: none;
    width: 100%;
    color: #ffffff;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

.vip-search-box input::placeholder {
    color: #94a3b8;
}

.btn-search-clear {
    background: none;
    border: none !important;
    color: #cbd5e1;
    cursor: pointer;
    padding: 2px;
    display: inline-flex;
    align-items: center;
}

.btn-search-clear:hover {
    color: #ef4444;
}

.vip-tool-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    cursor: pointer;
    border: none !important;
    border-radius: 6px !important;
    transition: all 0.15s ease;
    padding: 0;
    flex-shrink: 0;
}

.vip-tool-btn:hover {
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

.vip-tool-btn.active {
    color: #ffffff !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
}

.vip-tool-btn.muted {
    color: #64748b !important;
    background: rgba(255, 255, 255, 0.04) !important;
}

.vip-tool-btn svg {
    width: 14px;
    height: 14px;
    display: block;
    flex-shrink: 0;
}

.vip-tool-btn.spinning svg {
    animation: spinVip 0.6s linear infinite;
}

@keyframes spinVip {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* 3. Live Match Table Container */
.container-livetable {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    margin-bottom: 12px;
}

.live-loading-state,
.live-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
    background: #ffffff;
    border-radius: 8px !important;
    text-align: center;
    gap: 12px;
    color: #64748b;
    border: none !important;
}

.live-loading-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid #e2e8f0;
    border-top-color: var(--v7m-primary, #c90201);
    border-radius: 50% !important;
    animation: spinVip 0.8s linear infinite;
}

.btn-vip-reset-filter {
    padding: 8px 18px;
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13.5px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 8px;
    font-family: Arial, -apple-system, sans-serif !important;
}

/* 4. League Group Block & Table Header */
.live-league-block {
    margin-bottom: 8px;
    background: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    width: 100% !important;
    overflow: hidden !important;
}

.live-table-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 38px;
    background-color: #0f2637;
    padding: 0 10px;
    font-size: 13.5px;
    color: #ffffff !important;
    border: none !important;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    box-sizing: border-box;
    width: 100% !important;
    user-select: none;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.pinned-table-header {
    background-color: #1e3a5f !important;
    background: linear-gradient(135deg, #1e3a5f 0%, #0f2637 100%) !important;
    color: #ffffff !important;
    border-bottom: 2px solid #f59e0b !important;
}

.lth-left {
    display: flex;
    align-items: center;
    gap: 7px;
    overflow: hidden;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
}

.lth-icon-pinned {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.btn-fav-league {
    background: rgba(0, 0, 0, 0.22) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 4px !important;
    color: rgba(255, 255, 255, 0.9) !important;
    cursor: pointer;
    padding: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    transition: all 0.15s ease;
}

.btn-fav-league:hover {
    background: rgba(0, 0, 0, 0.4) !important;
    color: #f59e0b !important;
    border-color: #f59e0b !important;
}

.btn-fav-league svg {
    stroke: rgba(255, 255, 255, 0.9) !important;
}

.btn-fav-league:hover svg {
    stroke: #f59e0b !important;
}

.btn-fav-league.active svg {
    fill: #f59e0b !important;
    stroke: #f59e0b !important;
}

.live-table-header .lth-badge-tag {
    height: 20px !important;
    min-width: 32px !important;
    max-width: 52px !important;
    padding: 0 5px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
    flex-shrink: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

.live-table-header .lth-league-name,
.lth-league-name {
    font-size: clamp(13px, 0.6vw + 10px, 15px) !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    line-height: 1.3 !important;
    letter-spacing: 0.2px !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}

.pinned-table-header .lth-league-name {
    color: #fbbf24 !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6) !important;
}

.live-table-header .lth-match-count,
.lth-match-count {
    font-size: 11.5px !important;
    color: #ffffff !important;
    background: rgba(0, 0, 0, 0.35) !important;
    padding: 2px 7px !important;
    border-radius: 4px !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    margin-left: 4px !important;
    line-height: 1.2 !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4) !important;
}

.live-table-header .lth-bxh-link,
.lth-bxh-link {
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    margin-left: 4px !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.22) !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    transition: all 0.15s ease !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35) !important;
}

.live-table-header .lth-bxh-link:hover,
.lth-bxh-link:hover {
    background: #ffffff !important;
    color: #0f2637 !important;
    text-shadow: none !important;
    border-color: #ffffff !important;
}

.live-table-header .lth-right,
.lth-right {
    display: flex;
    align-items: center;
    font-size: 11.5px !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    text-align: center;
    flex-shrink: 0;
    letter-spacing: 0.3px !important;
}

.lth-col-odds,
.lth-col-hdp,
.lth-col-ou,
.lth-col-1x2,
.lth-col-act,
.lth-col-fav {
    display: inline-block;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
    opacity: 0.95;
}

.lth-col-hdp {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
    text-align: center;
}

.lth-col-ou {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
    text-align: center;
}

.lth-col-1x2 {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
    text-align: center;
}

.lth-col-act {
    width: 72px;
    min-width: 72px;
    max-width: 72px;
    text-align: center;
}

.lth-col-fav {
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    text-align: center;
}

.live-match-box {
    width: 100% !important;
}

/* 5. Live Match Card Item (7M VIP Modern Grid Card) */
.live-match-item {
    display: flex;
    align-items: center;
    min-height: 60px;
    padding: 6px 10px;
    background-color: #ffffff;
    border: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-sizing: border-box;
    width: 100% !important;
    transition: background-color 0.15s ease;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.live-match-box .live-match-item:nth-child(even) {
    background-color: #f1f5f9;
}

/* THE FAMOUS 7M VIP MINT HOVER EFFECT */
.live-match-item:hover {
    background-color: #daf2e3 !important;
}

.live-match-item.is-pinned {
    background-color: #fffbeb;
}

.live-match-item.is-pinned:hover {
    background-color: #fef3c7 !important;
}

/* Goal Flash Highlight Animation */
@keyframes vipGoalFlash {
    0%, 100% { background-color: #ffffff; }
    25%, 75% { background-color: #fef08a; }
    50% { background-color: #bbf7d0; }
}

.goal-highlight-vip {
    animation: vipGoalFlash 1.6s ease-in-out 3;
}

/* Col 1: Time, Status, HT Score */
.m-col-time,
.stageOrTime {
    width: 82px;
    min-width: 82px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
}

.m-kickoff {
    font-size: 14px;
    font-weight: 500;
    color: #0f2637;
    line-height: 1.2;
}

.m-status-wrap {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
}

.status-live {
    color: var(--v7m-primary, #c90201) !important;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.live-pulse-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50% !important;
    background-color: var(--v7m-primary, #c90201) !important;
    animation: pulseLive 1.2s infinite;
}

@keyframes pulseLive {
    0% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.3; transform: scale(1.3); }
    100% { opacity: 1; transform: scale(1); }
}

.status-ht {
    color: #2563eb;
    font-weight: 600;
}

.status-ft {
    color: #64748b;
    font-weight: 500;
}

.status-postponed {
    color: #dc2626;
    font-weight: 600;
}

.status-upcoming {
    color: #94a3b8;
    font-size: 13px;
}

.m-ht-corner {
    font-size: 12px;
    color: #94a3b8;
    line-height: 1.1;
}

/* Col 2: Teams (2 Rows: Home & Away) */
.m-col-teams {
    flex: 1 1 auto;
    min-width: 140px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    padding: 0 8px;
    overflow: hidden;
}

.m-team-row {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    white-space: nowrap;
    height: 25px;
}

.m-team-logo-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    min-width: 20px;
    flex-shrink: 0;
}

.m-team-logo {
    max-width: 18px;
    max-height: 18px;
    object-fit: contain;
    border: none !important;
    border-radius: 0 !important;
}

.m-team-name {
    font-size: clamp(13px, 0.6vw + 9.5px, 14.5px);
    font-weight: 500;
    color: #0f172a !important;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: default;
    user-select: text;
    line-height: 1.3;
}

.team-rank {
    font-size: 11px;
    color: #64748b;
    font-weight: normal;
    margin-left: 2px;
}

.card-red {
    display: inline-block;
    background-color: #e8503a;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    padding: 0 3px;
    min-width: 13px;
    text-align: center;
    line-height: 15px;
    border-radius: 2px !important;
    margin-left: 3px;
}

.card-yellow {
    display: inline-block;
    background-color: #f59e0b;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    padding: 0 3px;
    min-width: 13px;
    text-align: center;
    line-height: 15px;
    border-radius: 2px !important;
    margin-left: 3px;
}

/* Col 3: Score (Semi-bold Red Live / Navy FT) */
.m-col-score {
    width: 44px;
    min-width: 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3px;
    text-align: center;
    flex-shrink: 0;
}

.m-score-val {
    font-size: 17px;
    font-weight: 600;
    color: #0f2637;
    line-height: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.m-score-val.live-score {
    color: #e8503a !important;
}

/* Col 4, 5, 6: Odds Columns (HDP, O/U, 1X2) */
.m-col-odds {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    text-align: center;
    font-size: 13px;
    flex-shrink: 0;
}

.live-odds-1 {
    width: 130px;
    min-width: 130px;
}

.live-odds-2 {
    width: 130px;
    min-width: 130px;
}

.live-odds-3 {
    width: 130px;
    min-width: 130px;
}

.m-odds-row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    height: 25px;
}

.m-odds-val {
    color: #0f172a;
    font-weight: 500;
    min-width: 36px;
    text-align: center;
}

.m-odds-line {
    color: #dc2626;
    font-weight: 600;
    min-width: 40px;
    text-align: center;
}

/* Col 7: Action Buttons (Check kèo link button with statistics icon) */
.m-col-actions {
    width: 36px;
    min-width: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-shrink: 0;
    position: relative !important;
    z-index: 5 !important;
    pointer-events: auto !important;
}

.btn-check-keo {
    position: relative !important;
    z-index: 6 !important;
    pointer-events: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 22px !important;
    padding: 0 !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    white-space: nowrap;
    transition: opacity 0.15s ease, background 0.15s ease;
    cursor: pointer !important;
    line-height: 1;
}

.btn-check-keo svg {
    width: 13px !important;
    height: 13px !important;
    fill: currentColor !important;
    display: block !important;
}

.btn-check-keo:hover {
    opacity: 0.9;
    color: #ffffff !important;
}

.btn-vip-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    background: #0f2637;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    border: none !important;
    border-radius: 0 !important;
    transition: background-color 0.15s ease;
}

.btn-vip-action:hover {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}

.btn-vip-sub-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 26px;
    background: #f1f5f9;
    color: #64748b;
    text-decoration: none;
    border: none !important;
    border-radius: 0 !important;
    transition: all 0.15s ease;
}

.btn-vip-sub-action:hover {
    background: #daf2e3;
    color: var(--v7m-primary, #c90201);
}

/* Col 8: Favorite Star Pin */
.m-col-fav {
    width: 44px;
    min-width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.btn-fav-star {
    background: none;
    border: none !important;
    border-radius: 0 !important;
    cursor: pointer;
    padding: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-fav-star:hover svg {
    stroke: #f59e0b;
}

/* 6. VIP Bottom Shortcuts */
.vip-bottom-shortcuts {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0;
    padding: 12px;
    background: #ffffff;
    border: none !important;
}

.vip-shortcut-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #f1f5f9;
    color: #0f2637;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border: none !important;
    border-radius: 0 !important;
    transition: all 0.15s ease;
}

.vip-shortcut-btn:hover {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}

/* 7. Modern VIP League Filter Modal */
.vip-modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 38, 55, 0.7);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(2px);
}

.vip-modal-backdrop.is-hidden {
    display: none !important;
}

.vip-modal-dialog {
    width: 92%;
    max-width: 780px;
    max-height: 85vh;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden;
}

.vip-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 18px;
    background: #0f2637;
    color: #ffffff;
}

.vip-modal-title {
    font-size: 15px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #ffffff;
}

.vip-modal-close {
    background: none;
    border: none !important;
    border-radius: 8px !important;
    color: #ffffff;
    cursor: pointer;
    padding: 4px;
    display: flex;
    align-items: center;
    transition: background 0.15s ease;
}

.vip-modal-close:hover {
    color: #ef4444;
    background: rgba(255, 255, 255, 0.1);
}

.vip-modal-body {
    padding: 14px 18px;
    overflow-y: auto;
    flex: 1;
}

.vip-modal-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.vip-modal-search-input {
    flex: 1;
    min-width: 220px;
    padding: 8px 12px;
    background: #f1f5f9;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13.5px;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    outline: none;
    color: #0f2637;
}

.vip-modal-search-input:focus {
    background: #e2e8f0;
}

.vip-modal-quick-btns {
    display: flex;
    gap: 6px;
}

.vip-quick-btn {
    padding: 6px 12px;
    background: #f1f5f9;
    color: #0f2637;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease;
    font-family: Arial, -apple-system, sans-serif !important;
}

.vip-quick-btn:hover {
    background: #e2e8f0;
}

.vip-quick-btn.vip-quick-hot {
    background: #fee2e2;
    color: #e8503a;
    font-weight: 500;
}

.vip-league-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 6px;
    max-height: 48vh;
    overflow-y: auto;
    padding-right: 4px;
}

.vip-league-item {
    display: flex;
    align-items: center;
    padding: 6px 10px;
    background: #f8fafc;
    border-radius: 8px !important;
    font-size: 13.5px;
    transition: background-color 0.15s ease;
}

.vip-league-item:hover {
    background: #daf2e3;
}

.vip-league-label {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    cursor: pointer;
    overflow: hidden;
    margin: 0;
}

.vip-league-label input[type="checkbox"] {
    accent-color: var(--v7m-primary, #c90201);
    cursor: pointer;
    width: 15px;
    height: 15px;
    margin: 0;
    flex-shrink: 0;
}

.vip-league-text {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #0f2637;
    font-weight: 400;
}

.vip-league-badge {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
    flex-shrink: 0;
}

.vip-modal-footer {
    padding: 12px 18px;
    background: #f8fafc;
    display: flex;
    justify-content: flex-end;
    border: none !important;
}

.btn-vip-apply-filter {
    padding: 8px 22px;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: opacity 0.15s ease;
    font-family: Arial, -apple-system, sans-serif !important;
}

.btn-vip-apply-filter:hover {
    opacity: 0.92;
}

/* ==========================================================================
   UNIFIED 7M VIP DATA GRID SYSTEM (.v7m-data-grid)
   100% Div-Based, Zero Table Tags, 100% Mobile Responsive
   Strict Rules: Flat 0px, No Shadow, No Border, Font Tahoma, Fluid Typography
   ========================================================================== */

.v7m-data-grid {
    width: 100% !important;
    max-width: 100% !important;
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    box-sizing: border-box;
    margin-bottom: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Data Grid Header */
.v7m-grid-head {
    display: flex;
    align-items: center;
    background-color: #0f2637 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(12px, 0.8vw + 9.5px, 16px) !important;
    min-height: 40px;
    padding: 0 10px;
    border: none !important;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    box-shadow: none !important;
    box-sizing: border-box;
    user-select: none;
}

.v7m-grid-head *,
.v7m-grid-head .v7m-col,
.v7m-grid-head .v7m-cell-time,
.v7m-grid-head .v7m-cell-league,
.v7m-grid-head .v7m-cell-team,
.v7m-grid-head .v7m-cell-home,
.v7m-grid-head .v7m-cell-away,
.v7m-grid-head .v7m-cell-score,
.v7m-grid-head .v7m-cell-vs,
.v7m-grid-head .v7m-cell-ht,
.v7m-grid-head .v7m-cell-odds-hdp,
.v7m-grid-head .v7m-cell-odds-ou,
.v7m-grid-head .v7m-cell-status,
.v7m-grid-head .v7m-cell-action {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(12px, 0.8vw + 9.5px, 16px) !important;
}

/* Data Grid Row */
.v7m-grid-row {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 6px 10px;
    background-color: #ffffff;
    color: #0f172a;
    font-size: clamp(12px, 0.8vw + 9.5px, 16px) !important;
    font-weight: 400;
    border: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box;
    text-decoration: none !important;
    transition: background-color 0.12s ease;
}

.v7m-grid-row.v7m-row-alt {
    background-color: #f8fafc !important;
}

.v7m-grid-row:hover,
.basket-row:hover {
    background-color: #daf2e3 !important;
}

/* Data Grid Cells */
.v7m-col {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.35;
}

.v7m-col-center {
    justify-content: center;
    text-align: center;
}

.v7m-col-right {
    justify-content: flex-end;
    text-align: right;
}

.v7m-col-bold {
    font-weight: 600;
}

/* Cell Variants - Crisp High-Contrast Sports Colors (Semi-regular, non-heavy font) */
.v7m-cell-time {
    width: 75px;
    flex-shrink: 0;
    color: #334155 !important;
    font-size: clamp(13px, 0.6vw + 11px, 14px) !important;
    font-weight: 500;
    justify-content: center;
}

.v7m-cell-league {
    width: 140px;
    flex-shrink: 0;
    font-weight: 600;
    font-size: clamp(13px, 0.6vw + 11px, 14px) !important;
}

.v7m-cell-team {
    flex: 1 1 0 !important;
    min-width: 120px;
    font-weight: 500;
    font-size: clamp(13px, 0.8vw + 10px, 15px) !important;
    color: #0f172a !important;
    line-height: 1.35;
}

.v7m-cell-home {
    display: block !important;
    text-align: right !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    direction: ltr !important;
}

.v7m-cell-away {
    display: block !important;
    text-align: left !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    direction: ltr !important;
}

.v7m-cell-score {
    width: 100px;
    flex-shrink: 0;
    justify-content: center;
    font-size: clamp(15px, 0.8vw + 12px, 17px) !important;
    font-weight: 700;
    color: #dc2626 !important;
    line-height: 1.2;
}

.v7m-cell-score a {
    color: #dc2626 !important;
    text-decoration: none;
    font-weight: 700;
}

.v7m-cell-score a:hover {
    text-decoration: underline;
}

.v7m-cell-vs {
    width: 60px;
    flex-shrink: 0;
    justify-content: center;
    font-weight: 600;
    color: #64748b !important;
    font-size: clamp(13px, 0.6vw + 11px, 14px) !important;
}

.v7m-cell-ht {
    width: 80px;
    flex-shrink: 0;
    justify-content: center;
    color: #64748b !important;
    font-weight: 500;
    font-size: clamp(13px, 0.6vw + 11px, 14px) !important;
}

.v7m-cell-status {
    width: 85px;
    flex-shrink: 0;
    justify-content: center;
    font-size: clamp(12px, 0.6vw + 10px, 13px) !important;
    font-weight: 500;
}

.v7m-cell-odds {
    width: 90px;
    flex-shrink: 0;
    justify-content: center;
    font-weight: 500;
    font-size: clamp(13px, 0.6vw + 11px, 14px) !important;
}

.v7m-cell-action {
    width: 50px;
    flex-shrink: 0;
    justify-content: center;
}

/* Status Badges */
.v7m-badge-ft {
    background: #64748b;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px !important;
    text-transform: uppercase;
}

.v7m-badge-live {
    background: #e8503a;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px !important;
    text-transform: uppercase;
    animation: v7mPulse 1.5s infinite;
}

.v7m-badge-sched {
    background: #0f2637;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px !important;
}

@keyframes v7mPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* Standings Specific Grid (.v7m-grid-standings) */
.v7m-grid-standings .v7m-col-rank {
    width: 50px;
    flex-shrink: 0;
    justify-content: center;
}

.v7m-grid-standings .v7m-col-team {
    flex: 2;
    min-width: 140px;
    font-weight: 600;
    font-size: clamp(12px, 0.8vw + 9.5px, 15px) !important;
}

.v7m-grid-standings .v7m-col-p,
.v7m-grid-standings .v7m-col-w,
.v7m-grid-standings .v7m-col-d,
.v7m-grid-standings .v7m-col-l,
.v7m-grid-standings .v7m-col-gf,
.v7m-grid-standings .v7m-col-ga,
.v7m-grid-standings .v7m-col-gd {
    width: 55px;
    flex-shrink: 0;
    justify-content: center;
    font-size: clamp(12px, 0.8vw + 9.5px, 14px) !important;
}

.v7m-grid-standings .v7m-col-pts {
    width: 65px;
    flex-shrink: 0;
    justify-content: center;
    font-weight: 700;
    color: #e8503a;
    font-size: clamp(13px, 0.8vw + 10px, 16px) !important;
}

.v7m-grid-standings .v7m-col-form {
    width: 90px;
    flex-shrink: 0;
    justify-content: center;
    font-weight: 600;
    font-size: clamp(11.5px, 0.6vw + 9.5px, 13px) !important;
    letter-spacing: 1px;
}

/* Standings Rank Badges */
.v7m-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-weight: 800;
    font-size: 13px;
    border-radius: 6px !important;
    border: none !important;
}

.v7m-rank-top4 {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
}

.v7m-rank-mid {
    background: #e2e8f0;
    color: #1e293b;
}

.v7m-rank-relegation {
    background: #e8503a;
    color: #ffffff;
}

/* Match Grids Desktop Display: Contents */
@media (min-width: 1025px) {
    .v7m-grid-match-list .v7m-m-strip-top,
    .v7m-grid-match-list .v7m-m-strip-teams,
    .v7m-grid-match-list .v7m-m-strip-bottom {
        display: contents !important;
    }
    .v7m-grid-match-list .v7m-grid-head,
    .v7m-grid-match-list .v7m-grid-row {
        min-width: 960px !important;
        width: 100% !important;
    }
    .v7m-grid-match-list .v7m-cell-time {
        order: 1 !important;
        width: 75px !important;
        flex: 0 0 75px !important;
        text-align: center !important;
        justify-content: center !important;
    }
    .v7m-grid-match-list .v7m-cell-league {
        order: 2 !important;
        width: 130px !important;
        flex: 0 0 130px !important;
    }
    .v7m-grid-match-list .v7m-cell-home {
        order: 3 !important;
        flex: 1 1 0 !important;
        min-width: 120px !important;
        text-align: right !important;
        display: block !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        direction: ltr !important;
    }
    .v7m-grid-match-list .v7m-cell-score,
    .v7m-grid-match-list .v7m-cell-vs {
        order: 4 !important;
        width: 80px !important;
        flex: 0 0 80px !important;
        text-align: center !important;
        justify-content: center !important;
    }
    .v7m-grid-match-list .v7m-cell-away {
        order: 5 !important;
        flex: 1 1 0 !important;
        min-width: 120px !important;
        text-align: left !important;
        display: block !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        direction: ltr !important;
    }
    .v7m-grid-match-list .v7m-cell-ht {
        order: 6 !important;
        width: 85px !important;
        flex: 0 0 85px !important;
        justify-content: center !important;
        text-align: center !important;
    }
    .v7m-grid-match-list .v7m-cell-odds-hdp {
        order: 6 !important;
        width: 100px !important;
        flex: 0 0 100px !important;
        justify-content: center !important;
        text-align: center !important;
        font-weight: 600;
        font-size: 14px;
    }
    .v7m-grid-match-list .v7m-cell-odds-ou {
        order: 7 !important;
        width: 100px !important;
        flex: 0 0 100px !important;
        justify-content: center !important;
        text-align: center !important;
        font-weight: 600;
        font-size: 14px;
    }
    .v7m-grid-match-list .v7m-cell-status {
        order: 8 !important;
        width: 80px !important;
        flex: 0 0 80px !important;
        justify-content: center !important;
        text-align: center !important;
    }
    .v7m-grid-match-list .v7m-cell-action {
        order: 9 !important;
        width: 85px !important;
        flex: 0 0 85px !important;
        justify-content: center !important;
        text-align: center !important;
    }
}

.v7m-act-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 8px;
    background: #0f2637;
    color: #ffffff !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
    border-radius: 0 !important;
    border: none !important;
    transition: background-color 0.15s ease;
}

.v7m-act-link:hover {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff !important;
}

.v7m-team-link,
.v7m-vs-link,
.kq-score-link {
    color: inherit !important;
    text-decoration: none !important;
    transition: color 0.15s ease;
}

.v7m-team-link:hover,
.v7m-vs-link:hover,
.kq-score-link:hover {
    color: var(--v7m-primary, #c90201) !important;
    text-decoration: none !important;
}

/* Empty State */
.v7m-grid-empty {
    padding: 30px 16px;
    text-align: center;
    color: #64748b;
    font-size: 15px;
    font-weight: 600;
    background: #ffffff;
}

/* ==========================================================================
   INTERNATIONAL-STANDARD FIXTURES TOOLBAR (.fixtures-toolbar-wrapper)
   Compact 2-Strip Design: Date Navigator Carousel + Instant Filters & Search
   ========================================================================== */
.fixtures-toolbar-wrapper {
    display: flex;
    flex-direction: column;
    background: #0f2637;
    border-radius: 8px !important;
    padding: 5px 8px;
    margin-bottom: 8px;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    box-sizing: border-box;
}

/* Row 1: Date Navigator */
.fixtures-date-navigator {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    width: 100%;
}

.btn-date-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 38px;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    border-radius: 6px !important;
    border: none !important;
    text-decoration: none !important;
    flex-shrink: 0;
    transition: all 0.15s ease;
    cursor: pointer;
}

.btn-date-nav:hover {
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

.fixtures-date-carousel {
    display: flex;
    align-items: center;
    gap: 5px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    flex: 1 1 auto;
    padding: 2px 0;
}

.fixtures-date-carousel::-webkit-scrollbar {
    display: none;
}

.fixture-date-pill {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 66px;
    height: 38px;
    padding: 2px 6px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all 0.15s ease;
    flex-shrink: 0;
    box-sizing: border-box;
}

.fixture-date-pill:hover {
    background: rgba(255, 255, 255, 0.14);
}

.fixture-date-pill.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
}

.fixture-date-pill .fdp-dow {
    font-size: 11px;
    font-weight: 500;
    color: #94a3b8;
    line-height: 1.1;
}

.fixture-date-pill .fdp-date {
    font-size: 13px;
    font-weight: 600;
    color: #f1f5f9;
    line-height: 1.2;
}

.fixture-date-pill.active .fdp-dow,
.fixture-date-pill.active .fdp-date {
    color: #ffffff !important;
}

.fixture-date-pill.is-today .fdp-dow {
    color: #38bdf8;
    font-weight: 600;
}

.fixture-date-pill.active.is-today .fdp-dow {
    color: #ffffff !important;
}

.fixtures-date-actions {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
}

.btn-calendar-trigger {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 38px;
    padding: 0 8px;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    border-radius: 6px !important;
    border: none !important;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.btn-calendar-trigger:hover {
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

.btn-calendar-trigger input[type="date"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.btn-today-quick {
    display: inline-flex;
    align-items: center;
    height: 38px;
    padding: 0 8px;
    background: rgba(56, 189, 248, 0.15);
    color: #38bdf8 !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    font-size: 12px;
    font-weight: 600;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.btn-today-quick:hover {
    background: rgba(56, 189, 248, 0.25);
    color: #7dd3fc !important;
}

/* Row 2: Utility & Instant Filter Strip */
.fixtures-control-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    flex-wrap: wrap;
}

.fixtures-filter-left {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    flex: 1 1 auto;
    min-width: 0;
}

.fixtures-tab-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 9px;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    font-size: 12.5px;
    font-weight: 500;
    border: none !important;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
    flex-shrink: 0;
}

.fixtures-tab-pill:hover {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
}

.fixtures-tab-pill.active {
    background: rgba(255, 255, 255, 0.22);
    color: #ffffff;
    font-weight: 600;
}

.fixtures-tab-pill .icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1px 5px;
    min-width: 16px;
    height: 16px;
    font-size: 10.5px;
    font-weight: 600;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    line-height: 1;
}

.fixtures-tab-pill .icon-badge-hot {
    background: #f59e0b;
}

.fixtures-league-select-wrap {
    display: inline-flex;
    align-items: center;
    position: relative;
    flex-shrink: 0;
}

.fixtures-select {
    height: 28px;
    padding: 0 22px 0 8px;
    background-color: rgba(255, 255, 255, 0.1);
    color: #f1f5f9;
    border: none !important;
    border-radius: 6px !important;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    outline: none !important;
    appearance: none;
    -webkit-appearance: none;
    max-width: 180px;
}

.fixtures-select option {
    background: #0f2637;
    color: #ffffff;
}

.fixtures-league-select-wrap::after {
    content: '';
    position: absolute;
    right: 8px;
    pointer-events: none;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid #94a3b8;
}

.fixtures-filter-right {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.fixtures-search-wrap {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px !important;
    padding: 0 8px;
    height: 28px;
    width: 170px;
    flex-shrink: 0;
    position: relative;
}

.fixtures-search-icon {
    color: #94a3b8;
    margin-right: 4px;
    flex-shrink: 0;
}

.fixtures-search-wrap input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #ffffff !important;
    font-size: 12px !important;
    width: 100% !important;
    padding: 0 !important;
    outline: none !important;
}

.fixtures-search-wrap input::placeholder {
    color: #94a3b8 !important;
}

.fixtures-meta-count {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
}

.fixtures-count-badge {
    display: inline-block;
    padding: 2px 7px;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    border-radius: 4px !important;
    font-weight: 600;
    font-size: 11.5px;
}

.fixtures-empty-notice {
    padding: 30px 16px;
    text-align: center;
    background: #ffffff;
    color: #64748b;
    font-size: 14px;
    font-weight: 500;
    border-radius: 8px !important;
    margin: 8px 0;
    width: 100% !important;
    box-sizing: border-box;
}

.fixtures-empty-notice a {
    color: var(--v7m-primary, #c90201);
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

/* ==========================================================================
   STREAMLINED RESULTS TOOLBAR (.results-toolbar-wrapper)
   Ultra-Compact 1-Row Desktop / 2-Row Mobile Design
   ========================================================================== */
.results-toolbar-wrapper {
    display: flex;
    flex-direction: column;
    background: var(--v7m-secondary, #012058) !important;
    background-image: none !important;
    border-radius: 8px !important;
    padding: 5px 8px;
    margin-bottom: 8px;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    box-sizing: border-box;
}

.results-toolbar-single-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    width: 100%;
    flex-wrap: nowrap;
}

/* Date Navigator Group */
.results-date-group {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.results-date-group .btn-date-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 28px;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    border-radius: 6px !important;
    border: none !important;
    text-decoration: none !important;
    flex-shrink: 0;
    transition: all 0.15s ease;
    cursor: pointer;
}

.results-date-group .btn-date-nav:hover {
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

.results-date-carousel {
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    flex: 0 1 auto;
}

.results-date-carousel::-webkit-scrollbar {
    display: none;
}

.result-date-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 28px;
    padding: 0 8px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all 0.15s ease;
    flex-shrink: 0;
    white-space: nowrap;
    box-sizing: border-box;
    font-size: 11.5px;
    font-weight: 500;
    color: #cbd5e1;
}

.result-date-pill:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
}

.result-date-pill.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600;
}

.result-date-pill .rdp-dow {
    color: inherit;
    line-height: 1;
}

.result-date-pill .rdp-date {
    font-size: 11px;
    opacity: 0.85;
    line-height: 1;
}

.result-date-pill.is-today:not(.active) .rdp-dow {
    color: #38bdf8;
    font-weight: 600;
}

/* Quick Datepicker Pill (Fixtures & Results) */
.btn-quick-datepicker {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    width: auto !important;
    min-width: unset !important;
    max-width: unset !important;
    height: 28px !important;
    padding: 0 10px !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #cbd5e1 !important;
    border-radius: 6px !important;
    border: none !important;
    box-shadow: none !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    position: relative !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    transition: all 0.15s ease !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

.btn-quick-datepicker:hover {
    background: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

.btn-quick-datepicker.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.btn-quick-datepicker .v7m-inline-icon {
    width: 13px !important;
    height: 13px !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

.btn-quick-datepicker span {
    display: inline !important;
    color: inherit !important;
    font-size: 11.5px !important;
    font-weight: inherit !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.btn-quick-datepicker input[type="date"] {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;
    cursor: pointer !important;
    z-index: 2 !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.results-date-group .btn-today-quick {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 7px;
    background: rgba(56, 189, 248, 0.15);
    color: #38bdf8 !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    font-size: 11px;
    font-weight: 600;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.results-date-group .btn-today-quick:hover {
    background: rgba(56, 189, 248, 0.25);
    color: #7dd3fc !important;
}

/* Actions Group (Filter Tabs + League Select + Search) */
.results-actions-group {
    display: flex;
    align-items: center;
    gap: 5px;
    flex: 1 1 auto;
    justify-content: flex-end;
    min-width: 0;
}

.results-tabs-wrap {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.results-tab-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 28px;
    padding: 0 8px;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    font-size: 11.5px;
    font-weight: 500;
    border: none !important;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
    flex-shrink: 0;
}

.results-tab-pill:hover {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
}

.results-tab-pill.active {
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 600;
}

.results-tab-pill .icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    min-width: 15px;
    height: 15px;
    font-size: 10px;
    font-weight: 600;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    line-height: 1;
}

.results-tab-pill .icon-badge-hot {
    background: #f59e0b;
}

.results-league-select-wrap {
    display: inline-flex;
    align-items: center;
    position: relative;
    flex-shrink: 0;
}

.results-select {
    height: 28px;
    padding: 0 20px 0 8px;
    background-color: rgba(255, 255, 255, 0.08);
    color: #cbd5e1;
    border: none !important;
    border-radius: 6px !important;
    font-size: 11.5px;
    font-weight: 500;
    cursor: pointer;
    outline: none !important;
    appearance: none;
    -webkit-appearance: none;
    max-width: 140px;
    transition: background-color 0.15s ease;
}

.results-select:hover {
    background-color: rgba(255, 255, 255, 0.14);
    color: #ffffff;
}

.results-select option {
    background: #0f2637;
    color: #ffffff;
}

.results-league-select-wrap::after {
    content: '';
    position: absolute;
    right: 7px;
    pointer-events: none;
    border-left: 3.5px solid transparent;
    border-right: 3.5px solid transparent;
    border-top: 4px solid #94a3b8;
}

.results-search-wrap {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 6px !important;
    padding: 0 6px;
    height: 28px;
    width: 120px;
    flex-shrink: 0;
    position: relative;
    transition: width 0.2s ease;
}

.results-search-wrap:focus-within {
    width: 155px;
    background: rgba(255, 255, 255, 0.12);
}

.results-search-icon {
    color: #94a3b8;
    margin-right: 3px;
    flex-shrink: 0;
}

.results-search-wrap input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #ffffff !important;
    font-size: 11.5px !important;
    width: 100% !important;
    padding: 0 !important;
    outline: none !important;
}

.results-search-wrap input::placeholder {
    color: #94a3b8 !important;
}

.results-meta-count {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.results-count-badge {
    font-size: 11px;
    color: #94a3b8;
    font-weight: 500;
    white-space: nowrap;
    padding: 0 2px;
}

/* ==========================================================================
   ODDS FILTER TOOLBAR (.odds-toolbar-wrapper) - 100% RESPONSIVE & COMPACT
   ========================================================================== */
.odds-toolbar-wrapper {
    background: var(--v7m-secondary, #012058) !important;
    background-image: none !important;
    border-radius: 8px !important;
    padding: 6px 10px;
    margin-bottom: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
    width: 100% !important;
    border: none !important;
    box-shadow: none !important;
}

.odds-toolbar-single-row,
.odds-view-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
    flex-wrap: nowrap;
    box-sizing: border-box;
}

.odds-tools-group {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.odds-tabs-group {
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    flex: 1 1 auto;
    min-width: 0;
}

.odds-tabs-group::-webkit-scrollbar {
    display: none;
}

.odds-tab-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    border-radius: 6px !important;
    background: rgba(255, 255, 255, 0.08);
    color: #e2e8f0;
    font-size: 13px;
    font-weight: 500;
    border: none !important;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s ease;
    line-height: 1.2;
    flex-shrink: 0;
}

.odds-tab-pill:hover {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
}

.odds-tab-pill.active {
    background: var(--v7m-primary, #c90201);
    background-image: none;
    color: #ffffff;
    font-weight: 600;
}

.odds-tab-pill .icon-badge {
    font-size: 11px;
    padding: 1px 5px;
    border-radius: 6px !important;
    background: rgba(0, 0, 0, 0.25);
    color: #ffffff;
}

.odds-tab-pill .icon-badge-live {
    background: #dc2626;
}

.odds-tab-pill .icon-badge-hot {
    background: #f59e0b;
}

.hot-flame-icon {
    color: #f59e0b;
}

.odds-status-meta {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.odds-live-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--v7m-primary, #c90201);
    background: rgba(9, 179, 99, 0.12);
    padding: 3px 8px;
    border-radius: 6px !important;
}

.odds-control-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.odds-type-toggles {
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    flex: 1 1 auto;
    min-width: 0;
}

.odds-type-toggles::-webkit-scrollbar {
    display: none;
}

.odds-type-pill {
    padding: 4px 8px;
    border-radius: 6px !important;
    background: transparent;
    color: #94a3b8;
    font-size: 12.5px;
    font-weight: 500;
    border: none !important;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.odds-type-pill:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}

.odds-type-pill.active {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
    font-weight: 600;
}

.odds-search-wrap {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px !important;
    padding: 0 8px;
    height: 30px;
    width: 145px;
    flex-shrink: 0;
    position: relative;
    transition: width 0.2s ease;
}

.odds-search-wrap:focus-within {
    width: 180px;
}

.odds-search-icon {
    color: #94a3b8;
    margin-right: 4px;
    flex-shrink: 0;
}

.odds-search-wrap input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #ffffff !important;
    font-size: 12px !important;
    width: 100% !important;
    padding: 0 !important;
    outline: none !important;
}

.odds-search-wrap input::placeholder {
    color: #94a3b8 !important;
}

.btn-clear-search {
    background: transparent;
    border: none;
    color: #94a3b8;
    font-size: 16px;
    cursor: pointer;
    padding: 0 2px;
    line-height: 1;
}

.btn-clear-search:hover {
    color: #ffffff;
}

/* Visibility classes */
.v7m-odds-row.is-filtered-out,
.v7m-grid-row.is-filtered-out,
.live-match-item.is-filtered-out,
.live-league-block.is-filtered-out,
.basket-row.is-filtered-out,
.v7m-standings-row.is-filtered-out,
.is-filtered-out {
    display: none !important;
}

.col-odds.odds-col-hidden {
    display: none !important;
}

.v7m-odds-empty {
    padding: 30px 16px;
    text-align: center;
    background: #ffffff;
    color: #64748b;
    font-size: 14px;
    font-weight: 500;
    border-radius: 8px !important;
    margin: 8px 0;
    width: 100% !important;
}

/* ==========================================================================
   UNIFIED ODDS GRID (.v7m-odds-grid) - 100% DIV
   ========================================================================== */
.v7m-odds-grid {
    width: 100% !important;
    max-width: 100% !important;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box;
    margin-bottom: 12px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.v7m-odds-head {
    display: flex;
    background-color: #0f2637 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(12px, 0.8vw + 9.5px, 16px) !important;
    min-height: 40px;
    align-items: center;
    padding: 0 10px;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    border: none !important;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
    user-select: none;
}

.v7m-odds-head * {
    color: #ffffff !important;
    font-weight: 600 !important;
}

.v7m-odds-head .v7m-col,
.v7m-odds-head .v7m-cell-time,
.v7m-odds-head .v7m-cell-league,
.v7m-odds-head .v7m-cell-team,
.v7m-odds-head .v7m-cell-home,
.v7m-odds-head .v7m-cell-away,
.v7m-odds-head .v7m-cell-score,
.v7m-odds-head .v7m-cell-action {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(12px, 0.8vw + 9.5px, 16px) !important;
}

.v7m-odds-head .v7m-odds-group {
    background: transparent !important;
}

.v7m-odds-head .v7m-odds-val {
    color: #cbd5e1 !important;
    font-weight: 500 !important;
    font-size: clamp(12px, 0.6vw + 10px, 14px) !important;
}

.v7m-odds-head .v7m-odds-line {
    color: #38bdf8 !important;
    font-weight: 600 !important;
    font-size: clamp(12px, 0.6vw + 10px, 14px) !important;
}

.v7m-odds-row {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 6px 10px;
    background: #ffffff;
    border: none !important;
    border-bottom: 1px solid #e2e8f0 !important;
    cursor: pointer;
    transition: background 0.12s ease;
    font-size: clamp(12px, 0.8vw + 9.5px, 16px) !important;
    color: #0f172a;
}

.v7m-odds-row:hover {
    background: #e2e8f0 !important;
}

.v7m-odds-row.v7m-row-alt {
    background: #f8fafc !important;
}

.v7m-odds-info {
    display: flex;
    align-items: center;
    flex: 1.5;
    gap: 8px;
    min-width: 0;
}

.v7m-odds-group {
    display: flex;
    align-items: center;
    width: 190px;
    flex-shrink: 0;
    justify-content: space-around;
    padding: 0 4px;
}

.v7m-odds-val {
    flex: 1;
    text-align: center;
    font-weight: 500;
    font-size: clamp(13px, 0.6vw + 11px, 14px) !important;
    color: #0f172a;
    padding: 2px 3px;
    border-radius: 0 !important;
    transition: all 0.25s ease;
    line-height: 1.3;
}

.v7m-odds-line {
    flex: 1;
    text-align: center;
    font-weight: 600;
    font-size: clamp(13px, 0.6vw + 11px, 14px) !important;
    color: #dc2626;
    padding: 2px 3px;
    border-radius: 0 !important;
    transition: all 0.25s ease;
    line-height: 1.3;
}

.odds-down { color: #16a34a !important; font-weight: 600; }
.odds-up { color: #dc2626 !important; font-weight: 600; }

/* Realtime Odds Fluctuations Keyframes & Flash Effects */
@keyframes oddsFlashUp {
    0% { background-color: #fee2e2; color: #dc2626; }
    30% { background-color: #fca5a5; color: #b91c1c; }
    70% { background-color: #fee2e2; color: #dc2626; }
    100% { background-color: transparent; }
}

@keyframes oddsFlashDown {
    0% { background-color: #dcfce7; color: #16a34a; }
    30% { background-color: #86efac; color: #15803d; }
    70% { background-color: #dcfce7; color: #16a34a; }
    100% { background-color: transparent; }
}

@keyframes oddsFlashLine {
    0% { background-color: #fef3c7; color: #d97706; }
    30% { background-color: #fde68a; color: #b45309; }
    70% { background-color: #fef3c7; color: #d97706; }
    100% { background-color: transparent; }
}

@keyframes oddsScoreFlash {
    0% { background-color: #fee2e2; color: #dc2626; transform: scale(1.15); }
    50% { background-color: #dc2626; color: #ffffff; }
    100% { background-color: transparent; transform: scale(1); }
}

.odds-flash-up {
    animation: oddsFlashUp 2.2s ease-in-out !important;
    font-weight: 800 !important;
    color: #dc2626 !important;
}

.odds-flash-down {
    animation: oddsFlashDown 2.2s ease-in-out !important;
    font-weight: 600 !important;
    color: #16a34a !important;
}

.odds-flash-line {
    animation: oddsFlashLine 2.2s ease-in-out !important;
    font-weight: 600 !important;
    color: #d97706 !important;
}

.odds-score-flash {
    animation: oddsScoreFlash 2.5s ease-in-out !important;
    font-weight: 700 !important;
    color: #dc2626 !important;
}

.odds-live-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #dc2626;
    color: #ffffff;
    padding: 3px 8px;
    font-weight: 600;
    font-size: 12px;
    border-radius: 0 !important;
}

.odds-pulse-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50% !important;
    background: #ffffff;
    animation: pulseLive 1.2s infinite;
}

.odds-legend-up {
    color: #dc2626;
    font-weight: 600;
}

.odds-legend-down {
    color: #16a34a;
    font-weight: 600;
}

.odds-filter-btn {
    color: #cbd5e1;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    padding: 4px 10px;
    transition: all 0.15s ease;
    border-radius: 0 !important;
}

.odds-filter-btn:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
}

.odds-filter-btn.active {
    font-weight: 600;
    color: #ffffff !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
}

/* Odds Grid Desktop Column Alignment (Exact Match with Header) */
.v7m-odds-head .v7m-cell-time {
    width: 65px !important;
    flex: 0 0 65px !important;
    justify-content: center !important;
    text-align: center !important;
}
.v7m-odds-head .v7m-cell-league {
    width: 65px !important;
    flex: 0 0 65px !important;
    justify-content: center !important;
    text-align: center !important;
}
.v7m-odds-head .v7m-cell-home {
    flex: 1 1 0 !important;
    min-width: 120px !important;
    text-align: right !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    direction: ltr !important;
}
.v7m-odds-head .v7m-cell-score {
    width: 75px !important;
    flex: 0 0 75px !important;
    justify-content: center !important;
    text-align: center !important;
}
.v7m-odds-head .v7m-cell-away {
    flex: 1 1 0 !important;
    min-width: 120px !important;
    text-align: left !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    direction: ltr !important;
}
.v7m-odds-head .col-ah,
.v7m-odds-head .col-ou,
.v7m-odds-head .col-1x2 {
    width: 175px !important;
    flex: 0 0 175px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-around !important;
    padding: 0 4px !important;
}
.v7m-odds-head .v7m-cell-action {
    width: 75px !important;
    flex: 0 0 75px !important;
    justify-content: center !important;
    text-align: center !important;
}

/* Mobile structure helper defaults on Desktop */
@media (min-width: 1025px) {
    .v7m-odds-info,
    .v7m-odds-m-top,
    .v7m-odds-m-match,
    .v7m-odds-m-box {
        display: contents !important;
    }
    .v7m-odds-head,
    .v7m-odds-row {
        min-width: 960px !important;
        width: 100% !important;
    }
    .v7m-odds-grid .v7m-cell-time {
        order: 1 !important;
        width: 65px !important;
        flex: 0 0 65px !important;
        justify-content: center !important;
        text-align: center !important;
    }
    .v7m-odds-grid .v7m-cell-league {
        order: 2 !important;
        width: 65px !important;
        flex: 0 0 65px !important;
        justify-content: center !important;
        text-align: center !important;
    }
    .v7m-odds-grid .v7m-cell-home {
        order: 3 !important;
        flex: 1 1 0 !important;
        min-width: 120px !important;
        text-align: right !important;
        display: block !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        direction: ltr !important;
    }
    .v7m-odds-grid .v7m-cell-score {
        order: 4 !important;
        width: 75px !important;
        flex: 0 0 75px !important;
        justify-content: center !important;
        text-align: center !important;
    }
    .v7m-odds-grid .v7m-cell-away {
        order: 5 !important;
        flex: 1 1 0 !important;
        min-width: 120px !important;
        text-align: left !important;
        display: block !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        direction: ltr !important;
    }
    .v7m-odds-grid .col-ah {
        order: 6 !important;
        width: 175px !important;
        flex: 0 0 175px !important;
    }
    .v7m-odds-grid .col-ou {
        order: 7 !important;
        width: 175px !important;
        flex: 0 0 175px !important;
    }
    .v7m-odds-grid .col-1x2 {
        order: 8 !important;
        width: 175px !important;
        flex: 0 0 175px !important;
    }
    .v7m-odds-grid .v7m-cell-action {
        order: 9 !important;
        width: 75px !important;
        flex: 0 0 75px !important;
        justify-content: center !important;
        text-align: center !important;
    }
    .v7m-odds-m-line {
        display: flex !important;
        width: 175px !important;
        flex: 0 0 175px !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        background: transparent !important;
    }
    .v7m-odds-m-line .v7m-odds-group {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-around !important;
    }
    .v7m-odds-m-lbl,
    .odds-type-badge,
    .v7m-odds-m-top-right {
        display: none !important;
    }
    .v7m-odds-m-act-desktop {
        order: 9 !important;
        width: 75px !important;
        flex: 0 0 75px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
}

/* ==========================================================================
   BASKETBALL GRID (.v7m-grid-basket) - 100% DIV
   ========================================================================== */
.v7m-grid-basket .v7m-col-bk-q {
    width: 45px;
    flex-shrink: 0;
    justify-content: center;
    color: #64748b;
    font-size: clamp(12px, 0.8vw + 9.5px, 14px) !important;
}

.v7m-grid-basket .v7m-col-bk-tot {
    width: 90px;
    flex-shrink: 0;
    justify-content: center;
    font-weight: 700;
    font-size: clamp(13px, 0.8vw + 10px, 16px) !important;
    color: #e8503a;
}

.v7m-grid-basket .v7m-q-lbl {
    display: none;
}

@media (min-width: 1025px) {
    .v7m-grid-basket .v7m-m-strip-top,
    .v7m-grid-basket .v7m-m-strip-teams,
    .v7m-grid-basket .v7m-basket-quarters,
    .v7m-grid-basket .v7m-m-strip-bottom {
        display: contents !important;
    }
    .v7m-grid-basket .v7m-cell-time { order: 1; }
    .v7m-grid-basket .v7m-cell-league { order: 2; }
    .v7m-grid-basket .v7m-cell-status { order: 3; }
    .v7m-grid-basket .v7m-cell-home { order: 4; }
    .v7m-grid-basket .b-q1 { order: 5; }
    .v7m-grid-basket .b-q2 { order: 6; }
    .v7m-grid-basket .b-q3 { order: 7; }
    .v7m-grid-basket .b-q4 { order: 8; }
    .v7m-grid-basket .b-total { order: 9; }
    .v7m-grid-basket .v7m-cell-away { order: 10; }
    .v7m-grid-basket .v7m-cell-odds:first-of-type { order: 11; }
    .v7m-grid-basket .v7m-cell-odds:last-of-type { order: 12; }
}
/* ==========================================================================
   V7M DATA GRIDS (MATCH DETAIL, KHO DU LIEU, EMBED WIDGETS)
   ========================================================================== */
/* Match Detail - Tab Odds (Desktop Fixed Table & Mobile Card Rows) */
.v7m-odds-desktop-wrap {
    display: block !important;
    width: 100% !important;
}
.v7m-odds-mobile-wrap {
    display: none !important;
}

/* Desktop 100% Fixed Table Alignment & High Contrast */
.v7m-odds-detail-table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: fixed !important;
    font-size: clamp(12px, 0.75vw + 9.5px, 14px) !important;
    background: #ffffff;
    border: none !important;
}
.v7m-odds-detail-table th,
.v7m-odds-detail-table td {
    padding: 8px 4px !important;
    text-align: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    line-height: 1.4 !important;
    border: none !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

/* Header Top: Navy background, White high-contrast text */
.v7m-odds-detail-table thead .v7m-od-head-top th {
    background: #0f2637 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(12.5px, 0.65vw + 10px, 13.5px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.v7m-odds-detail-table thead .v7m-od-th-company {
    width: 16% !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    text-align: left !important;
    padding-left: 14px !important;
    border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.v7m-odds-detail-table thead .v7m-od-th-group {
    border-right: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.v7m-odds-detail-table thead .v7m-od-th-group:last-child {
    border-right: none !important;
}

/* Header Sub: Slate Navy background, soft white text */
.v7m-odds-detail-table thead .v7m-od-head-sub th {
    background: #142e43 !important;
    color: #e2e8f0 !important;
    font-size: clamp(11.5px, 0.6vw + 9.5px, 12.5px) !important;
    font-weight: 500 !important;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* Body Rows: Zebra & Hover */
.v7m-odds-detail-table tbody tr {
    transition: background-color 0.12s ease;
}
.v7m-odds-detail-table tbody tr:nth-child(even) {
    background-color: #f8fafc !important;
}
.v7m-odds-detail-table tbody tr:hover {
    background-color: #f1f5f9 !important;
}

/* Company cell: dark font, bold, left aligned */
.v7m-odds-detail-table td.v7m-od-td-company {
    width: 16% !important;
    text-align: left !important;
    padding-left: 14px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    border-right: 1px solid #f1f5f9 !important;
}

/* Odds Values & Colors */
.v7m-odds-detail-table td.v7m-odds-num {
    color: #0f172a !important;
    font-weight: 500 !important;
    font-variant-numeric: tabular-nums;
}
.v7m-odds-detail-table td.v7m-odds-line {
    font-weight: 700 !important;
    color: #dc2626 !important;
    background: #fff1f2 !important;
    font-variant-numeric: tabular-nums;
}
.v7m-odds-detail-table td.v7m-odds-over {
    color: #d97706 !important;
    font-weight: 600 !important;
}
.v7m-odds-detail-table td.v7m-odds-under {
    color: #0284c7 !important;
    font-weight: 600 !important;
}
.v7m-odds-detail-table td.v7m-od-empty {
    padding: 24px 12px !important;
    color: #64748b !important;
    text-align: center !important;
}

/* Mobile Card Rows View (<= 768px) */
.v7m-od-m-row {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px !important;
    padding: 10px 12px;
    margin-bottom: 8px;
    box-sizing: border-box;
}
.v7m-od-m-company {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 6px;
    margin-bottom: 8px;
    border-bottom: 1px dashed #e2e8f0;
}
.v7m-od-m-company-name {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #012058 !important;
}
.v7m-od-m-company-badge {
    font-size: 11px !important;
    color: #64748b;
    background: #f1f5f9;
    padding: 2px 6px;
    border-radius: 4px !important;
    font-weight: 500;
}
.v7m-od-m-groups {
    display: flex;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
}
.v7m-od-m-group {
    flex: 1;
    min-width: 0;
    background: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 6px !important;
    padding: 6px 4px;
    display: flex;
    flex-direction: column;
    text-align: center;
    box-sizing: border-box;
}
.v7m-od-m-label {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #64748b;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.v7m-od-m-values {
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    font-size: 12.5px !important;
    gap: 2px;
}
.v7m-od-m-val {
    flex: 1;
    text-align: center;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    min-width: 0;
}
.v7m-od-m-val.v7m-odds-line {
    color: #dc2626 !important;
    background: #fff1f2 !important;
    border-radius: 4px !important;
    font-weight: 700 !important;
    padding: 1px 2px;
}
.v7m-od-m-val.v7m-odds-over {
    color: #d97706 !important;
}
.v7m-od-m-val.v7m-odds-under {
    color: #0284c7 !important;
}

/* Match Detail - Tab H2H */
.v7m-h2h-grid {
    display: flex;
    flex-direction: column;
    width: 100% !important;
    background: #ffffff;
    font-size: 15px;
}
.v7m-h2h-head {
    display: flex;
    width: 100%;
    background: #0f2637 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(13px, 0.65vw + 11px, 14px) !important;
    text-align: center;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
}
.v7m-h2h-row {
    display: flex;
    width: 100%;
    align-items: center;
    text-align: center;
    background: #ffffff;
    min-height: 40px;
    border-bottom: 1px solid #f1f5f9;
}
.v7m-h2h-row:nth-child(even) {
    background: #f8fafc;
}
.v7m-h2h-row:hover {
    background: #f1f5f9;
}
.v7m-h2h-col-league { flex: 0 0 14%; padding: 6px 8px; }
.v7m-h2h-col-date { flex: 0 0 12%; padding: 6px 8px; color: #64748b; font-size: 14px; }
.v7m-h2h-col-home { flex: 0 0 22%; padding: 6px 8px; text-align: right; }
.v7m-h2h-col-score { flex: 0 0 8%; padding: 6px 8px; font-weight: 700; color: #dc2626 !important; }
.v7m-h2h-col-away { flex: 0 0 22%; padding: 6px 8px; text-align: left; }
.v7m-h2h-col-hdp { flex: 0 0 11%; padding: 6px 8px; font-weight: 500; }
.v7m-h2h-col-ou { flex: 0 0 11%; padding: 6px 8px; font-weight: 500; }
.v7m-h2h-empty {
    padding: 24px;
    text-align: center;
    color: #64748b;
    font-size: 15px;
}

@media (min-width: 769px) {
    .v7m-h2h-strip-top,
    .v7m-h2h-strip-teams,
    .v7m-h2h-strip-bottom {
        display: contents !important;
    }
}

/* Match Detail - Tab Form */
.v7m-form-grid {
    display: flex;
    flex-direction: column;
    width: 100% !important;
    background: #ffffff;
    font-size: 15px;
}
.v7m-form-head {
    display: flex;
    width: 100%;
    background: #0f2637 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: clamp(13px, 0.65vw + 11px, 14px) !important;
    text-align: center;
    border-bottom: 2px solid var(--v7m-primary, #c90201) !important;
}
.v7m-form-row {
    display: flex;
    width: 100%;
    align-items: center;
    text-align: center;
    background: #ffffff;
    min-height: 38px;
    border-bottom: 1px solid #f1f5f9;
}
.v7m-form-row:nth-child(even) {
    background: #f8fafc;
}
.v7m-form-col-date { flex: 0 0 22%; padding: 6px; font-size: 14px; color: #64748b; }
.v7m-form-col-opp { flex: 1; padding: 6px; text-align: left; font-weight: 500; }
.v7m-form-col-score { flex: 0 0 20%; padding: 6px; font-weight: bold; }
.v7m-form-col-res { flex: 0 0 18%; padding: 6px; }
.v7m-form-empty {
    padding: 20px;
    text-align: center;
    color: #64748b;
    font-size: 14px;
}

/* Kho Du Lieu Detail - Matches Grid */
.s7m-t-match-grid {
    display: flex;
    flex-direction: column;
    width: 100% !important;
    background: #ffffff;
}
.s7m-t-match-head {
    display: flex;
    width: 100%;
    background: #366594;
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    font-size: 15px;
}
.s7m-t-match-row {
    display: flex;
    width: 100%;
    align-items: center;
    text-align: center;
    background: #ffffff;
    min-height: 42px;
    border-bottom: 1px solid #f1f5f9;
    font-size: 15px;
}
.s7m-t-match-row:nth-child(even) {
    background: #f8fafc;
}
.s7m-t-match-row:hover {
    background: #f1f5f9;
}
.s7m-t-match-grid .col-round { flex: 0 0 10%; padding: 6px; }
.s7m-t-match-grid .col-time { flex: 0 0 20%; padding: 6px; color: #64748b; font-size: 14px; }
.s7m-t-match-grid .col-team-h { flex: 1; padding: 6px; text-align: right; font-weight: 500; }
.s7m-t-match-grid .col-score { flex: 0 0 14%; padding: 6px; font-weight: bold; }
.s7m-t-match-grid .col-team-a { flex: 1; padding: 6px; text-align: left; font-weight: 500; }
.s7m-t-match-grid .col-detail { flex: 0 0 10%; padding: 6px; }

@media (min-width: 769px) {
    .s7m-t-m-strip-top,
    .s7m-t-m-strip-teams {
        display: contents !important;
    }
}

/* Kho Du Lieu Detail - Standings Grid */
.s7m-t-standings-grid {
    display: flex;
    flex-direction: column;
    width: 100% !important;
    background: #ffffff;
}
.s7m-t-std-head {
    display: flex;
    width: 100%;
    background: #0f2637 !important;
    color: #ffffff !important;
    font-weight: 700;
    text-align: center;
    font-size: 15px;
    min-height: 40px;
    align-items: center;
}
.s7m-t-std-row {
    display: flex;
    width: 100%;
    align-items: center;
    text-align: center;
    background: #ffffff;
    min-height: 44px;
    border-bottom: 1px solid #e2e8f0;
    font-size: 15px;
}
.s7m-t-std-row:nth-child(even) {
    background: #f1f5f9 !important;
}
.s7m-t-std-row:hover {
    background: #e2e8f0 !important;
}
.s7m-t-standings-grid .col-rank { flex: 0 0 6%; padding: 6px; }
.s7m-t-standings-grid .col-team { flex: 1; min-width: 140px; padding: 6px 10px; text-align: left; font-weight: 700; color: #000000; }
.s7m-t-standings-grid .col-p { flex: 0 0 7%; padding: 6px; }
.s7m-t-standings-grid .col-w { flex: 0 0 7%; padding: 6px; }
.s7m-t-standings-grid .col-d { flex: 0 0 7%; padding: 6px; }
.s7m-t-standings-grid .col-l { flex: 0 0 7%; padding: 6px; }
.s7m-t-standings-grid .col-gf { flex: 0 0 7%; padding: 6px; }
.s7m-t-standings-grid .col-ga { flex: 0 0 7%; padding: 6px; }
.s7m-t-standings-grid .col-gd { flex: 0 0 8%; padding: 6px; font-weight: bold; }
.s7m-t-standings-grid .col-pts { flex: 0 0 8%; padding: 6px; font-weight: bold; color: #dc2626; }
.s7m-t-standings-grid .col-memo { flex: 0 0 15%; padding: 6px; font-size: 13px; color: #64748b; }

/* ==========================================================================
   BASKETBALL 2 IN 1 DATA TABLE (SYNCHRONIZED WITH 7M VIP LIVE GRID)
   ========================================================================== */
.live-match-item.basket-row {
    min-height: 58px;
    padding: 6px 10px;
    border-bottom: 1px solid #e2e8f0 !important;
}

.live-match-item.basket-row:hover {
    background-color: #daf2e3 !important;
}

.lth-col-bk-q,
.col-bk-q {
    width: 170px;
    min-width: 170px;
    text-align: center;
    font-size: 11.5px;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
    letter-spacing: 0.3px;
}

.lth-col-bk-tot,
.col-bk-tot {
    width: 65px;
    min-width: 65px;
    text-align: center;
    font-size: 11.5px;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45) !important;
    letter-spacing: 0.3px;
}

.m-col-quarters {
    width: 170px;
    min-width: 170px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bk-quarters-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    width: 100%;
    text-align: center;
}

.bk-q-subcol {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    background: #f1f5f9;
    border-radius: 4px !important;
    padding: 2px 2px;
    transition: background-color 0.15s ease;
}

.live-match-item:hover .bk-q-subcol {
    background: rgba(255, 255, 255, 0.75) !important;
}

.bk-q-lbl {
    font-size: 9.5px;
    font-weight: 600;
    color: #64748b;
    line-height: 1;
}

.bk-q-val {
    font-size: 11.5px;
    font-weight: 500;
    color: #1e293b;
    line-height: 1.2;
}

.m-col-bk-tot {
    width: 65px;
    min-width: 65px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3px;
    text-align: center;
    flex-shrink: 0;
}

.m-col-bk-tot .m-score-val {
    font-size: 15px;
    font-weight: 700;
    color: #0f2637;
    line-height: 22px;
    height: 22px;
}

.m-col-odds-bk {
    width: 110px;
    min-width: 110px;
    max-width: 110px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    text-align: center;
    font-size: 12px;
    flex-shrink: 0;
}

.m-col-odds-bk .m-odds-row {
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.m-col-odds-bk .m-odds-line {
    font-size: 12px;
    font-weight: 500;
    color: #334155;
}

/* ==========================================================================
   7M VIP LIVE ODDS HOVER TOOLTIP & POPUP MATRIX
   Strictly complies with Global Rules:
   - System Radius 5px (border-radius: 5px !important)
   - No bold > 500 (font-weight: 400 - 500)
   - No shadow (box-shadow: none !important, text-shadow: none !important)
   - Gradient CTA Button (background: linear-gradient(...) !important)
   - Vector inline SVG only
   ========================================================================== */
.v7m-odds-tooltip {
    position: absolute;
    z-index: 99990;
    background-color: #ffffff;
    border: 1px solid #cbd5e1 !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    text-shadow: none !important;
    width: 530px;
    max-width: calc(100vw - 20px);
    padding: 8px 10px;
    box-sizing: border-box !important;
    font-family: inherit;
    font-size: 12px;
    line-height: 1.4;
    color: #1e293b;
    pointer-events: auto;
    transition: opacity 0.15s ease, transform 0.15s ease;
}

.v7m-odds-tooltip.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(4px);
}

.v7m-tt-arrow {
    position: absolute;
    top: -6px;
    left: 50%;
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-top: 1px solid #cbd5e1;
    border-left: 1px solid #cbd5e1;
    transform: rotate(45deg);
    z-index: 10;
}

.v7m-odds-tooltip.pos-top .v7m-tt-arrow {
    top: auto;
    bottom: -6px;
    border-top: none;
    border-left: none;
    border-bottom: 1px solid #cbd5e1;
    border-right: 1px solid #cbd5e1;
}

.v7m-tt-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 6px;
    margin-bottom: 6px;
    border-bottom: 1px solid #f1f5f9;
}

.v7m-tt-header-left {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    min-width: 0;
}

.v7m-tt-badge {
    display: inline-block;
    padding: 2px 6px;
    background-color: #2563eb;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    border-radius: 4px !important;
    white-space: nowrap;
    flex-shrink: 0;
}

.v7m-tt-title {
    font-size: 12.5px;
    font-weight: 500;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.v7m-tt-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: transparent;
    border: none !important;
    border-radius: 4px !important;
    color: #64748b;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.v7m-tt-close:hover {
    background-color: #f1f5f9;
    color: #0f172a;
}

.v7m-tt-body {
    overflow-x: auto;
    width: 100%;
    margin-bottom: 8px;
    -webkit-overflow-scrolling: touch;
}

.v7m-tt-table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0;
    font-size: 11.5px;
    text-align: center;
}

.v7m-tt-table th {
    font-weight: 500;
    padding: 4px 3px;
    background-color: #f8fafc;
    color: #475569;
    border: 1px solid #e2e8f0;
    white-space: nowrap;
    line-height: 18px;
}

.v7m-tt-table th.th-running {
    background-color: #fef9c3 !important;
    color: #854d0e !important;
    border-color: #fef08a !important;
}

.v7m-tt-table td {
    padding: 4px 3px;
    border: 1px solid #f1f5f9;
    line-height: 18px;
    height: 24px;
    white-space: nowrap;
    font-size: 11.5px;
}

.v7m-tt-table .td-type {
    font-weight: 500;
    background-color: #f8fafc;
    color: #1e293b;
    border-color: #e2e8f0;
    width: 58px;
}

.v7m-tt-table .td-num {
    color: #1e293b;
}

.v7m-tt-table .td-num.is-up {
    background-color: #dcfce7 !important;
    color: #15803d !important;
    font-weight: 500;
}

.v7m-tt-table .td-num.is-down {
    background-color: #fee2e2 !important;
    color: #b91c1c !important;
    font-weight: 500;
}

.v7m-tt-table .td-line {
    font-weight: 500;
}

.v7m-tt-table .text-red {
    color: #dc2626 !important;
}

.v7m-tt-table .text-orange {
    color: #ea580c !important;
}

.v7m-tt-table .td-trend {
    width: 54px;
    border-color: #f1f5f9;
}

.v7m-tt-trend {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    font-size: 10.5px;
    padding: 1px 4px;
    border-radius: 3px !important;
}

.v7m-tt-trend.is-up {
    background-color: #dcfce7;
    color: #15803d;
    font-weight: 500;
}

.v7m-tt-trend.is-down {
    background-color: #fee2e2;
    color: #b91c1c;
    font-weight: 500;
}

.v7m-tt-trend.is-flat {
    color: #94a3b8;
}

.v7m-tt-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 6px;
    border-top: 1px solid #f1f5f9;
    flex-wrap: wrap;
    gap: 6px;
}

.v7m-tt-legend {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 11px;
    color: #64748b;
}

.v7m-tt-legend-box {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 2px !important;
    margin-right: 4px;
    vertical-align: -1px;
}

.v7m-tt-legend-box.is-up {
    background-color: #22c55e;
}

.v7m-tt-legend-box.is-down {
    background-color: #ef4444;
}

.v7m-tt-btn-details {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    font-size: 11.5px;
    font-weight: 500;
    color: #ffffff !important;
    background: var(--v7m-primary, #c90201) !important;
    background-image: none !important;
    border-radius: 5px !important;
    border: none !important;
    text-decoration: none !important;
    transition: opacity 0.15s ease;
}

.v7m-tt-btn-details:hover {
    opacity: 0.92;
    color: #ffffff !important;
}

/* ==========================================================================
   NEXT.JS PROGRESSIVE TOP NAVIGATION LOADER
   ========================================================================== */
#v7m-next-toploader {
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 3px;
    background: linear-gradient(90deg, var(--v7m-primary, #c90201) 0%, var(--v7m-secondary, #012058) 100%);
    box-shadow: 0 0 10px rgba(56, 189, 248, 0.7), 0 0 5px rgba(2, 132, 199, 0.5);
    z-index: 9999999;
    pointer-events: none;
    transition: width 0.18s cubic-bezier(0.1, 0.9, 0.2, 1), opacity 0.25s ease;
    opacity: 0;
}
#v7m-next-toploader.is-active {
    opacity: 1;
}
#v7m-next-toploader.is-done {
    width: 100% !important;
    opacity: 0;
    transition: width 0.12s ease, opacity 0.3s ease 0.12s;
}

#v7m-next-spinner {
    position: fixed;
    top: 12px;
    right: 14px;
    width: 15px;
    height: 15px;
    z-index: 9999999;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
}
#v7m-next-spinner.is-active {
    opacity: 1;
}
.v7m-spinner-icon {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border: 2px solid rgba(2, 132, 199, 0.2);
    border-top-color: #0284c7;
    border-right-color: var(--v7m-primary, #c90201);
    border-radius: 50% !important;
    animation: v7mNextSpin 0.5s linear infinite;
}
@keyframes v7mNextSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ==========================================================================
   NEXT.JS-STYLE MATCH DETAIL SKELETON & STREAMING TRANSITION
   ========================================================================== */
.v7m-match-skeleton {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 20px;
    transition: opacity 0.2s ease;
}
.v7m-match-skeleton.is-hidden {
    display: none !important;
    opacity: 0;
    pointer-events: none;
}

.v7m-match-real-content {
    transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    opacity: 1;
    transform: translateY(0);
}
.v7m-match-real-content.is-loading {
    display: none;
    opacity: 0;
    transform: translateY(4px);
}
.v7m-match-real-content.is-ready {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

/* Skeleton Shimmer Base Elements */
.v7m-skel-line,
.v7m-skel-pill,
.v7m-skel-circle,
.v7m-skel-score-pill,
.v7m-skel-nav-tab,
.v7m-skel-box-head,
.v7m-skel-row,
.v7m-skel-stat-bar,
.v7m-skel-side-box {
    background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 50%, #f1f5f9 100%);
    background-size: 200% 100%;
    animation: v7mSkelShimmer 1.4s infinite linear;
    border-radius: 5px !important;
}

@keyframes v7mSkelShimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* Skeleton Breadcrumb */
.v7m-skel-crumb {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    margin-bottom: 10px;
}
.v7m-skel-w-60 { width: 60px; height: 14px; }
.v7m-skel-w-70 { width: 70px; height: 16px; }
.v7m-skel-w-80 { width: 80px; height: 14px; }
.v7m-skel-w-90 { width: 90px; height: 18px; }
.v7m-skel-w-120 { width: 120px; height: 14px; }
.v7m-skel-w-140 { width: 140px; height: 14px; }
.v7m-skel-w-160 { width: 160px; height: 20px; }
.v7m-skel-w-180 { width: 180px; height: 14px; }
.v7m-skel-w-200 { width: 200px; height: 16px; }

/* Skeleton Hero Card */
.v7m-skel-hero-card {
    background: #ffffff;
    border-radius: 8px !important;
    padding: 14px 18px;
    margin-bottom: 12px;
}
.v7m-skel-hero-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f8fafc;
}
.v7m-skel-hero-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 10px;
}
.v7m-skel-team-block {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}
.v7m-skel-team-block.v7m-skel-home {
    justify-content: flex-end;
}
.v7m-skel-team-block.v7m-skel-away {
    justify-content: flex-start;
}
.v7m-skel-circle {
    width: 44px;
    height: 44px;
    border-radius: 50% !important;
    flex-shrink: 0;
}
.v7m-skel-score-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 0 24px;
}
.v7m-skel-score-pill {
    width: 80px;
    height: 36px;
    border-radius: 6px !important;
}

/* Skeleton Nav Strip */
.v7m-skel-nav-strip {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px;
    background: #ffffff;
    border-radius: 8px !important;
    margin-bottom: 12px;
}
.v7m-skel-nav-tab {
    height: 30px;
    flex: 1;
    border-radius: 5px !important;
}

/* Skeleton Layout Grid */
.v7m-skel-layout {
    display: flex;
    gap: 14px;
    width: 100%;
}
.v7m-skel-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.v7m-skel-sidebar {
    width: 310px;
    flex: 0 0 310px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.v7m-skel-box {
    background: #ffffff;
    border-radius: 8px !important;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.v7m-skel-box-head {
    height: 24px;
    width: 40%;
    margin-bottom: 6px;
}
.v7m-skel-row {
    height: 34px;
    width: 100%;
}
.v7m-skel-stat-bar {
    height: 22px;
    width: 100%;
}
.v7m-skel-side-box {
    background: #ffffff;
    border-radius: 8px !important;
    height: 220px;
    width: 100%;
}

@media (max-width: 1024px) {
    .v7m-skel-layout {
        flex-direction: column;
    }
    .v7m-skel-sidebar {
        width: 100%;
        flex: 1 1 100%;
    }
    .v7m-skel-hero-body {
        padding: 8px 0;
    }
    .v7m-skel-circle {
        width: 36px;
        height: 36px;
    }
    .v7m-skel-score-center {
        padding: 0 10px;
    }
}

/* ==========================================================================
   STANDARD PAGE ENTRY & THE_CONTENT STYLES
   Strict adherence to 7M Global Rules: 8px border-radius, Arial font,
   no box-shadow, no hard borders, fluid/comfortable reading contrast.
   ========================================================================== */
.standard-page-card,
.v7m-page-entry {
    background: #ffffff;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: none !important;
    margin-top: 12px;
    margin-bottom: 16px;
    padding: 16px 20px;
    box-sizing: border-box;
    font-family: 'Montserrat', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    color: #222222;
}

.standard-page-title {
    font-size: 20px;
    font-weight: 600;
    color: #0f2637;
    margin-bottom: 14px;
    line-height: 1.4;
    border-bottom: 1px solid #f0f2f5;
    padding-bottom: 10px;
}

.page-entry,
.page-entry-body {
    font-size: 15px;
    line-height: 1.7;
    color: #333333;
    word-break: break-word;
}

.page-entry p,
.page-entry-body p {
    margin-bottom: 12px;
}

.page-entry p:last-child,
.page-entry-body p:last-child {
    margin-bottom: 0;
}

.page-entry h2,
.page-entry-body h2 {
    font-size: 18px;
    font-weight: 600;
    color: #0f2637;
    margin-top: 18px;
    margin-bottom: 10px;
}

.page-entry h3,
.page-entry-body h3 {
    font-size: 16px;
    font-weight: 600;
    color: #0f2637;
    margin-top: 14px;
    margin-bottom: 8px;
}

.page-entry ul,
.page-entry-body ul,
.page-entry ol,
.page-entry-body ol {
    margin: 8px 0 14px 20px;
    line-height: 1.6;
}

.page-entry li,
.page-entry-body li {
    margin-bottom: 4px;
}

.page-entry a,
.page-entry-body a {
    color: var(--v7m-primary, #c90201);
    text-decoration: none;
}

.page-entry a:hover,
.page-entry-body a:hover {
    text-decoration: underline;
}

.v7m-updating-notice {
    font-size: 14px;
    color: #777777;
    font-style: italic;
    padding: 12px 14px;
    background: #f8fafc;
    border-radius: 8px !important;
    text-align: center;
    margin: 6px 0;
}

@media (max-width: 768px) {
    .standard-page-card,
    .v7m-page-entry {
        padding: 12px 14px;
        margin-top: 10px;
        margin-bottom: 12px;
    }
    .standard-page-title {
        font-size: 18px;
    }
}