:root {
    --magic-primary: #6c3483;
    --magic-secondary: #8e44ad;
    --magic-bg: #f5f0f8;
    --magic-font: 'Poppins', sans-serif;
    
    --magic-row-margin: 8px;
    --magic-border-radius: 8px;
    --magic-row-shadow: 0 2px 5px rgba(0,0,0,0.08);
    --magic-row-bg: #ffffff;
    --magic-row-alt-bg: #ffffff;
    --magic-text: #333333;
            
}
body {
    font-family: var(--magic-font);
}

.static-page-content h2,
.nav-tab-active,
.widgetLiveScore .standing-h2, 
.callendarDaysActive,
.flex-row.first, 
.flex-table.header,
.header .flex-row.teams,
.widgetCountries-list-group-item.widgetCountries-active,
.first-list-countryes.widgetCountries-active {
    color: white !important; /* Ensure text is white on primary bg */
    background-color: var(--magic-primary) !important;
    border-color: var(--magic-primary) !important;
}

/* Secondary Color Targets */
.widgetLiveScore .titleWidget, 
.callendarDays {
    background-color: var(--magic-secondary) !important;
    border-color: var(--magic-secondary) !important;
}

/* Text Color Targets (Links) */
.header-nav-desktop a, footer a {
    color: var(--magic-primary) !important;
    background: transparent !important; /* Reset bg for links */
}

/* Footer Border */
footer {
    border-top-color: var(--magic-primary) !important;
}

/* --- HOVER STATES --- */
.flex-table:hover, 
.table__body .flex-table:hover .flex-row.teams,
#allGame .flex-table.row:nth-child(odd):hover .flex-row:not(.first),
#liveGame .flex-table.row:nth-child(odd):hover .flex-row:not(.first),
.widgetCountries-list-group-item:hover,
.first-list-countryes:hover {
    background: var(--magic-secondary) !important;
    color: white !important;
    cursor: pointer;
}

/* --- BACKGROUNDS & TEXT --- */
body {
    background-color: var(--magic-bg) !important;
}
.widgetLiveScore, .widgetCountries {
    background-color: var(--magic-bg) !important;
    color: var(--magic-text) !important;
}

/* --- LIST/TABLE SKINS (Main Content & Sidebar) --- */
.flex-table.row,
.widgetCountries-list-group-item,
.first-list-countryes {
    background-color: var(--magic-row-bg) !important;
    margin-bottom: var(--magic-row-margin) !important;
    border-radius: var(--magic-border-radius) !important;
    box-shadow: var(--magic-row-shadow) !important;
    border-bottom: 1px solid rgba(0,0,0,0.1); 
    color: var(--magic-text) !important;
}

/* Striped rows override */
#allGame .flex-table.row:nth-child(odd) .flex-row:not(.first),
#liveGame .flex-table.row:nth-child(odd) .flex-row:not(.first) {
    background: var(--magic-row-alt-bg) !important;
}

/* Sidebar Specific Fixes */
.widgetCountries-inside-ul {
    background-color: var(--magic-bg) !important;
}
.widgetCountries-inside-ul li {
    color: var(--magic-text) !important;
}
.widgetCountriesHr {
    background: linear-gradient(to right, var(--magic-secondary), var(--magic-bg));
}

/* Dark Mode Specific Overrides if needed */


/* --- NATIVE DARK MODE COMPATIBILITY --- */
/* If the user toggles the site's native dark mode, we must override the light theme colors */
html.dark-mode body {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
}

html.dark-mode .widgetLiveScore, 
html.dark-mode .widgetCountries,
html.dark-mode .widgetCountries-inside-ul {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
}

html.dark-mode .flex-table.row,
html.dark-mode .widgetCountries-list-group-item,
html.dark-mode .first-list-countryes {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
    border-color: #333 !important;
}

html.dark-mode #allGame .flex-table.row:nth-child(odd) .flex-row:not(.first),
html.dark-mode #liveGame .flex-table.row:nth-child(odd) .flex-row:not(.first) {
    background-color: #2a2a2a !important;
}

html.dark-mode .header-nav-desktop a, 
html.dark-mode footer a {
    color: #a0cfff !important; /* Light blue for links in dark mode */
}

html.dark-mode .static-page-content h2 {
    color: #a0cfff !important;
}

/* Extra Skin CSS */