/* ============================================
   DATE NAVIGATION BUTTONS - DARK MODE
   ============================================ */
html.dark-mode .date-nav-btn, body.dark-mode .date-nav-btn,
html.dark-mode .date-today, body.dark-mode .date-today {
    background: #23272f;
    color: #e0e0e0;
    border-color: #353a40;
}
html.dark-mode .date-nav-btn:hover, body.dark-mode .date-nav-btn:hover,
html.dark-mode .date-today:hover, body.dark-mode .date-today:hover {
    background: #353a40;
    color: #fff;
    border-color: #4a90e2;
}
html.dark-mode .date-today.active, body.dark-mode .date-today.active {
    background: #4a90e2;
    color: #fff;
    border-color: #4a90e2;
}
/* ============================================
   MATCH FILTER BUTTONS - DARK MODE
   ============================================ */
html.dark-mode .filter-button, body.dark-mode .filter-button {
    background: #23272f;
    color: #e0e0e0;
    border-color: #353a40;
}
html.dark-mode .filter-button:hover, body.dark-mode .filter-button:hover {
    background: #353a40;
    color: #fff;
    border-color: #4a90e2;
}
html.dark-mode .filter-button.active, body.dark-mode .filter-button.active {
    background: #4a90e2;
    color: #fff;
    border-color: #4a90e2;
}
html.dark-mode .filter-button.filter-golden, body.dark-mode .filter-button.filter-golden {
    background: linear-gradient(135deg, #bfa100 0%, #ffe066 100%);
    color: #23272f;
    border-color: #ffe066;
}
html.dark-mode .filter-button.filter-golden.active, body.dark-mode .filter-button.filter-golden.active {
    background: linear-gradient(135deg, #ffe066 0%, #bfa100 100%);
    color: #23272f;
    border-color: #ffe066;
}
/* ============================================
   SEARCH RESULTS - DARK MODE
   ============================================ */
html.dark-mode .search-results, body.dark-mode .search-results {
    background: #1a1a1a;
    border-color: #353a40;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}
html.dark-mode .search-result-item, body.dark-mode .search-result-item {
    border-bottom-color: #2a2a2a;
}
html.dark-mode .search-result-item:hover, body.dark-mode .search-result-item:hover {
    background-color: #23272f;
}
html.dark-mode .search-result-name, body.dark-mode .search-result-name {
    color: #e0e0e0;
}
html.dark-mode .search-result-meta, body.dark-mode .search-result-meta {
    color: #888;
}
/* ============================================
   MOBILE MENU & SIDEBAR - DARK MODE
   ============================================ */
html.dark-mode .mobile-menu-panel, body.dark-mode .mobile-menu-panel {
    background: #1a1a1a;
}

html.dark-mode .mobile-menu-item, body.dark-mode .mobile-menu-item {
    border-bottom-color: #2a2a2a;
}

html.dark-mode .mobile-sidebar-clone, body.dark-mode .mobile-sidebar-clone {
    background: transparent !important;
}
/* ============================================
   DARK MODE STYLES
   ============================================ */

/* Główne style dla dark mode */
html.dark-mode,
html.dark-mode body {
    background-color: #181a20;
    color: #f0f0f0;
}

html.dark-mode {
    color-scheme: dark;
}

/* ============================================
   DARK MODE TOGGLE
   ============================================ */

.theme-toggle-mobile {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 0;
    border-top: 1px solid var(--border);
    margin-top: 10px;
}

.theme-toggle-mobile label {
    font-size: 14px;
    color: var(--text-primary);
    font-weight: 500;
}

.theme-switch {
    position: relative;
    width: 50px;
    height: 26px;
    background-color: var(--border);
    border-radius: 13px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.theme-switch::before {
    content: '';
    position: absolute;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: var(--white);
    top: 2px;
    left: 2px;
    transition: transform 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

html.dark-mode .theme-switch, body.dark-mode .theme-switch {
    background-color: var(--secondary-color);
}

html.dark-mode .theme-switch::before, body.dark-mode .theme-switch::before {
    transform: translateX(24px);
}

.theme-icon {
    font-size: 16px;
    transition: opacity 0.3s ease;
}

.theme-icon.sun {
    opacity: 1;
}

.theme-icon.moon {
    opacity: 0.5;
}

html.dark-mode .theme-icon.sun, body.dark-mode .theme-icon.sun {
    opacity: 0.5;
}

html.dark-mode .theme-icon.moon, body.dark-mode .theme-icon.moon {
    opacity: 1;
}

/* League toggle dark mode */
html.dark-mode .league-section, body.dark-mode .league-section {
    background: #20232a;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4);
    border-radius: 8px;
}

html.dark-mode .league-header, body.dark-mode .league-header {
    background: #262626;
    border-bottom-color: #333;
}

html.dark-mode .league-header, body.dark-mode .league-header .country {
    color: #888;
}

html.dark-mode .league-header, body.dark-mode .league-header .league-name {
    color: #e0e0e0;
}

html.dark-mode .league-header, body.dark-mode .league-header .league-name:hover {
    color: #66bb6a;
}

html.dark-mode .toggle-league-btn, body.dark-mode .toggle-league-btn {
    color: #a0a0a0;
}

html.dark-mode .toggle-league-btn:hover, body.dark-mode .toggle-league-btn:hover {
    background: #404040;
    color: #e0e0e0;
}

html.dark-mode .hidden-count, body.dark-mode .hidden-count {
    background: #1a1a1a;
    border-color: #404040;
    color: #a0a0a0;
}

html.dark-mode .table-link, body.dark-mode .table-link {
    background: #23272f;
    border-color: #444;
    color: #4da6ff;
    text-shadow: 0 1px 2px #222;
}

html.dark-mode .table-link:hover, body.dark-mode .table-link:hover {
    background: #0066cc;
    color: #fff;
    border-color: #0066cc;
    box-shadow: 0 2px 8px rgba(77, 166, 255, 0.08);
}

/* Standings table (dark mode) */
html.dark-mode .standings-wrapper, body.dark-mode .standings-wrapper {
    background: #1f1f1f;
    border-color: #404040;
}

html.dark-mode .standings-table, body.dark-mode .standings-table thead th {
    background: #2a2a2a;
    color: #e0e0e0;
    border-bottom-color: #404040;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody td {
    border-bottom-color: #333333;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody tr:hover {
    background: #262626;
}

html.dark-mode .standings-table, body.dark-mode .standings-table .col-pts strong {
    color: #66b3ff;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody tr.promotion-playoff {
    border-left-color: #66bb6a;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody tr.promotion-finals {
    border-left-color: #42a5f5;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody tr.promotion-playoff-quali {
    border-left-color: #9ccc65;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody tr.promotion-relegation-playoff {
    border-left-color: #ffa726;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody tr.promotion-relegation {
    border-left-color: #ef5350;
}

html.dark-mode .standings-table, body.dark-mode .standings-table tbody tr.team-highlight {
    background: rgba(52, 152, 219, 0.2);
}

html.dark-mode .standings-legend, body.dark-mode .standings-legend {
    background: #1a1a1a;
    border-top-color: #404040;
}

html.dark-mode .legend-text, body.dark-mode .legend-text {
    color: #a0a0a0;
}

html.dark-mode .team-league-info, body.dark-mode .team-league-info {
    background: #1a1a1a;
}

html.dark-mode .team-league-info, body.dark-mode .team-league-info h3 {
    color: #e0e0e0;
}

html.dark-mode .overview-section, body.dark-mode .overview-section h3 {
    color: #66b3ff;
}

@media (max-width: 768px) {
    .theme-toggle {
        top: 15px;
        right: 60px;
        padding: 4px;
        gap: 5px;
    }
    
    .theme-toggle-label {
        display: none;
    }
    
    .theme-switch {
        width: 44px;
        height: 24px;
    }
    
    .theme-switch::before {
        width: 20px;
        height: 20px;
    }
    
    html.dark-mode .theme-switch::before, body.dark-mode .theme-switch::before {
        transform: translateX(20px);
    }
}

/* ============================================
   LIVE INDICATOR - DARK MODE
   ============================================ */
html.dark-mode .live-indicator, body.dark-mode .live-indicator {
    color: #ff5252;
    background: rgba(255, 82, 82, 0.15);
}

/* ============================================
   LEAGUE SECTION & MATCHES CONTAINER - DARK MODE
   ============================================ */
html.dark-mode .content, body.dark-mode .content > .matches-container,
html.dark-mode .content, body.dark-mode .content > .league-section {
    background: #1a1a1a;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* ============================================
   TABS - DARK MODE
   ============================================ */
html.dark-mode .tabs, body.dark-mode .tabs {
    background: #1a1a1a;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

html.dark-mode .tabs-header, body.dark-mode .tabs-header {
    border-bottom-color: #333;
}

html.dark-mode .tab-button, body.dark-mode .tab-button {
    color: #a0a0a0;
}

html.dark-mode .tab-button:hover, body.dark-mode .tab-button:hover {
    background: #262626;
    color: #e0e0e0;
}

html.dark-mode .tab-button.active, body.dark-mode .tab-button.active {
    color: #66bb6a;
    border-bottom-color: #66bb6a;
}

/* Golden Tab - dark mode */
html.dark-mode .tab-button.golden-tab, body.dark-mode .tab-button.golden-tab {
    background: linear-gradient(135deg, #d4af37 0%, #f1c40f 100%);
    color: #000;
}

html.dark-mode .tab-button.golden-tab:hover, body.dark-mode .tab-button.golden-tab:hover {
    background: linear-gradient(135deg, #f1c40f 0%, #d4af37 100%);
}

html.dark-mode .tab-button.golden-tab.active, body.dark-mode .tab-button.golden-tab.active {
    border-bottom-color: #d4af37;
    box-shadow: 0 4px 8px rgba(212, 175, 55, 0.5);
}

html.dark-mode .golden-matches-intro, body.dark-mode .golden-matches-intro {
    background: linear-gradient(135deg, #2a2416 0%, #1f1b10 100%);
    border-left-color: #d4af37;
}

html.dark-mode .golden-matches-intro, body.dark-mode .golden-matches-intro p {
    color: #a0a0a0;
}

html.dark-mode .golden-matches-intro, body.dark-mode .golden-matches-intro strong {
    color: #f1c40f;
}

html.dark-mode .polish-matches-intro, body.dark-mode .polish-matches-intro {
    background: linear-gradient(135deg, #2a1616 0%, #1f1010 100%);
    border-left-color: #dc143c;
}

html.dark-mode .polish-matches-intro, body.dark-mode .polish-matches-intro p {
    color: #a0a0a0;
}

html.dark-mode .polish-matches-intro, body.dark-mode .polish-matches-intro strong {
    color: #ff6b6b;
}

/* Golden filter button - dark mode */
html.dark-mode .filter-button.filter-golden, body.dark-mode .filter-button.filter-golden {
    background: linear-gradient(135deg, #d4af37 0%, #f1c40f 100%);
    border-color: #d4af37;
}

html.dark-mode .filter-button.filter-golden:hover, body.dark-mode .filter-button.filter-golden:hover {
    background: linear-gradient(135deg, #f1c40f 0%, #d4af37 100%);
    border-color: #f1c40f;
}

html.dark-mode .filter-button.filter-golden.active, body.dark-mode .filter-button.filter-golden.active {
    background: linear-gradient(135deg, #d4af37 0%, #c9a236 100%);
    border-color: #d4af37;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.6);
}

html.dark-mode .tab-content, body.dark-mode .tab-content {
    color: #e0e0e0;
}

/* ============================================
   PAGE HEADER - DARK MODE
   ============================================ */
html.dark-mode .page-header, body.dark-mode .page-header {
    background: #1a1a1a;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

html.dark-mode .page-header, body.dark-mode .page-header h1 {
    color: #e0e0e0;
}

html.dark-mode .page-header, body.dark-mode .page-header .breadcrumb {
    color: #a0a0a0;
}

html.dark-mode .page-header, body.dark-mode .page-header .breadcrumb a {
    color: #66b3ff;
}

html.dark-mode .page-header, body.dark-mode .page-header .breadcrumb a:hover {
    color: #4da6ff;
}

/* ============================================
   SIDEBAR - DARK MODE
   ============================================ */
html.dark-mode .sidebar, body.dark-mode .sidebar {
    background-color: #1a1a1a;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
}

html.dark-mode .sidebar-header, body.dark-mode .sidebar-header {
    background: linear-gradient(135deg, #0f0f1a 0%, #0a0e1e 100%);
}

html.dark-mode .menu-section, body.dark-mode .menu-section {
    border-bottom-color: #2a2a2a;
}

html.dark-mode .section-header, body.dark-mode .section-header {
    color: #666;
    background: #23272f;
}

html.dark-mode .section-title, body.dark-mode .section-title {
    color: #888;
}

/* Country groups */
html.dark-mode .country-group, body.dark-mode .country-group {
    border-bottom-color: #2a2a2a;
}

html.dark-mode .country-header, body.dark-mode .country-header {
    background: #1a1a1a;
    color: #e0e0e0;
}

html.dark-mode .country-header:hover, body.dark-mode .country-header:hover {
    background: #262626;
}

html.dark-mode .country-name, body.dark-mode .country-name {
    color: #e0e0e0;
}

html.dark-mode .league-count, body.dark-mode .league-count {
    color: #666;
}

html.dark-mode .toggle-icon, body.dark-mode .toggle-icon {
    color: #888;
}

/* Menu items */
html.dark-mode .menu-item, body.dark-mode .menu-item {
    border-bottom-color: rgba(255, 255, 255, 0.03);
}

html.dark-mode .menu-item, body.dark-mode .menu-item a {
    color: rgba(255, 255, 255, 0.6);
}

html.dark-mode .menu-item, body.dark-mode .menu-item a:hover {
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.9);
}

html.dark-mode .menu-item.active, body.dark-mode .menu-item.active a {
    background: rgba(102, 187, 106, 0.15);
    color: #66bb6a;
}

html.dark-mode .star-icon, body.dark-mode .star-icon,
html.dark-mode .star-icon-empty, body.dark-mode .star-icon-empty {
    color: #fbbf24;
}

/* Collapsed menu */
html.dark-mode .menu-list.collapsed, body.dark-mode .menu-list.collapsed {
    border-top-color: #2a2a2a;
}

html.dark-mode .country-group, body.dark-mode .country-group .menu-list {
    background-color: #141414;
}

/* ============================================
   NO MATCHES MESSAGE - DARK MODE
   ============================================ */
html.dark-mode .no-matches, body.dark-mode .no-matches {
    background: #1a1a1a;
    color: #666;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

html.dark-mode .no-matches::before, body.dark-mode .no-matches::before {
    color: #555;
}

/* ============================================
   MATCH HEADER - DARK MODE
   ============================================ */
html.dark-mode .match-header, body.dark-mode .match-header {
    background: linear-gradient(135deg, #4a5568 0%, #2d3748 100%);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

html.dark-mode .match-header, body.dark-mode .match-header .league-info {
    color: #e0e0e0;
}

/* ============================================
   MATCH DETAILS CARD - DARK MODE
   ============================================ */
html.dark-mode .match-details-card, body.dark-mode .match-details-card {
    background: #1a1a1a;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

html.dark-mode .match-details-card, body.dark-mode .match-details-card h3 {
    color: #e0e0e0;
    border-bottom-color: #2a2a2a;
}

html.dark-mode .detail-row, body.dark-mode .detail-row {
    border-bottom-color: #2a2a2a;
    color: #e0e0e0;
}

html.dark-mode .detail-label, body.dark-mode .detail-label {
    color: #888;
}

html.dark-mode .detail-value, body.dark-mode .detail-value {
    color: #e0e0e0;
}

/* ============================================
   FOOTER - DARK MODE
   ============================================ */
html.dark-mode .site-footer, body.dark-mode .site-footer {
    background-color: #0f0f1e;
}

html.dark-mode .footer-bottom, body.dark-mode .footer-bottom {
    background-color: #080812;
}

html.dark-mode .footer-section ul li a, body.dark-mode .footer-section ul li a {
    color: rgba(255, 255, 255, 0.7);
}

html.dark-mode .footer-section ul li a:hover, body.dark-mode .footer-section ul li a:hover {
    color: #4a90e2;
}

html.dark-mode .footer-contact a, body.dark-mode .footer-contact a {
    color: rgba(255, 255, 255, 0.8);
}

html.dark-mode .footer-contact a:hover, body.dark-mode .footer-contact a:hover {
    color: #4a90e2;
}

/* Info pages - dark mode */
html.dark-mode .info-page, body.dark-mode .info-page {
    background: #1a1d23;
    color: #e0e0e0;
}

html.dark-mode .info-section h2, body.dark-mode .info-section h2 {
    color: #fff;
    border-bottom-color: #4a90e2;
}

html.dark-mode .info-section p, body.dark-mode .info-section p,
html.dark-mode .info-section ul, body.dark-mode .info-section ul {
    color: #e0e0e0;
}

html.dark-mode .info-section a, body.dark-mode .info-section a {
    color: #4a90e2;
}



/* Info page container - dark mode */
html.dark-mode .info-page-container, body.dark-mode .info-page-container {
    background: transparent;
}

/* Info pages w layoutcie grid - dark mode */
html.dark-mode .content .info-page h1, body.dark-mode .content .info-page h1 {
    color: #fff;
    border-bottom-color: #4a90e2;
}


/* ============================================================================
   DARK MODE
   ============================================================================ */

html.dark-mode, body.dark-mode {
    --card-bg: #23272f;
    --card-hover: #263040;
    --text-primary: #fafafa;
    --text-secondary: #b0b8c1;
    --border-color: #333;
}

html.dark-mode .news-filters,
body.dark-mode .news-filters {
    background: #23272f;
    border-color: #333;
}

html.dark-mode .filter-btn,
body.dark-mode .linear-gradient(135deg, #1e2229 0%, #242a35 100%)btn {
    background: #2a3142;
    color: #e0e0e0;
}

html.dark-mode .filter-btn:hover,
body.dark-mode .filter-btn:hover {
    background: #323b4f;
}

html.dark-mode .news-card,
body.dark-mode .news-card {
    background: #23272f;
    border-color: #333;
}

html.dark-mode .news-card:hover,
body.dark-mode .news-card:hover {
    background: #263040;
    box-shadow: 0 4px 12px rgba(77,166,255,0.08);
}

html.dark-mode .news-excerpt,
body.dark-mode .news-excerpt {
    background: #1e2229;
    color: #b0b8c1;
}

html.dark-mode .news-content,
body.dark-mode .news-content {
    background: #23272f;
    border-color: #333;
}

html.dark-mode .pagination-btn,
html.dark-mode .pagination-page,
body.dark-mode .pagination-btn,
body.dark-mode .pagination-page {
    background: #23272f;
    border-color: #333;
    color: #e0e0e0;
}

html.dark-mode .pagination-btn:hover,
html.dark-mode .pagination-p,
body.dark-mode .related-news {
    background: #1e2229;
}

html.dark-mode .news-content blockquote,
body.dark-mode .news-content blockquote {
    background: #1e2229;
    color: #b0b8c1ion-page:hover {
    background: #263040;
}

html.dark-mode .btn-back,
body.dark-mode .btn-back {
    background: #23272f;
    border-color: #333;
    color: #e0e0e0;
}

html.dark-mode .btn-back:hover,
body.dark-mode .btn-back:hover {
    background: #263040;
}

html.dark-mode .related-news-card,
body.dark-mode .related-news-card {
    background: #23272f;
    border-color: #333;
}

html.dark-mode .related-news-card:hover,
body.dark-mode .related-news-card:hover {
    background: #263040;
}

/* ============================================
   ARTICLE CONTENT - DARK MODE
   ============================================ */
html.dark-mode .article-body a,
body.dark-mode .article-body a {
    color: #60a5fa;
}

html.dark-mode .article-body a:hover,
body.dark-mode .article-body a:hover {
    color: #93c5fd;
    border-bottom-color: #93c5fd;
}

html.dark-mode .article-body blockquote,
body.dark-mode .article-body blockquote {
    background: #1e293b;
    color: #94a3b8;
    border-left-color: #60a5fa;
}

html.dark-mode .article-body code,
body.dark-mode .article-body code {
    background: #1e293b;
    color: #e2e8f0;
}

html.dark-mode .article-match-result,
body.dark-mode .article-match-result {
    background: #23272f;
}

/* ============================================
   NEWS ARTICLE - DARK MODE
   ============================================ */
html.dark-mode .news-header,
body.dark-mode .news-header {
    border-bottom-color: #333;
}

html.dark-mode .news-content a,
body.dark-mode .news-content a {
    color: #60a5fa;
    border-bottom-color: #60a5fa;
}

html.dark-mode .news-content a:hover,
body.dark-mode .news-content a:hover {
    color: #93c5fd;
    border-bottom-color: #93c5fd;
    background: rgba(96, 165, 250, 0.1);
}

html.dark-mode .news-content h2,
body.dark-mode .news-content h2 {
    color: #60a5fa;
}

html.dark-mode .news-content blockquote,
body.dark-mode .news-content blockquote {
    background: #1e293b;
    color: #94a3b8;
    border-left-color: #60a5fa;
}

html.dark-mode .news-content code,
body.dark-mode .news-content code {
    background: #1e293b;
    color: #e2e8f0;
}

html.dark-mode .news-content table th,
body.dark-mode .news-content table th {
    background: #1e293b;
}

html.dark-mode .team-players-subtitle,
body.dark-mode .team-players-subtitle {
    color: #94a3b8;
}

html.dark-mode .news-content table th,
html.dark-mode .news-content table td,
body.dark-mode .news-content table th,
body.dark-mode .news-content table td {
    border-color: #333;
}

html.dark-mode .news-footer,
body.dark-mode .news-footer {
    border-top-color: #333;
}

html.dark-mode .news-category,
body.dark-mode .news-category {
    background: #60a5fa;
}
/* ============================================
   NEWS SEPARATOR BOX - DARK MODE
   ============================================ */

html.dark-mode .news-separator-header h2,
body.dark-mode .news-separator-header h2 {
    color: #e0e0e0;
}

html.dark-mode .news-all-link,
body.dark-mode .news-all-link {
    color: #4a90e2;
    background: rgba(74, 144, 226, 0.15);
}

html.dark-mode .news-all-link:hover,
body.dark-mode .news-all-link:hover {
    background: rgba(74, 144, 226, 0.25);
}