/* ============================================
   THEME SWITCHER - DARK/LIGHT MODE
   ============================================ */

/* Light Mode Variables */
[data-theme="light"],
html[data-theme="light"],
body[data-theme="light"] {
    /* Background Colors */
    --color-bg-dark: #FFFFFF;
    --color-bg-darker: #F5F5F5;
    --color-bg-medium: #F5F5F5;
    --color-bg-light: #FAFAFA;
    --color-bg-lighter: #EEEEEE;

    /* Text Colors */
    --color-text-primary: #1A1A1A;
    --color-text-secondary: #4A4A4A;
    --color-text-muted: #757575;
    --color-text-heading: #000000;

    /* Border Colors */
    --color-border-subtle: #E0E0E0;
    --color-border-medium: #BDBDBD;
    --color-border-strong: #9E9E9E;

    /* Primary stays same but with adjusted alpha */
    --color-primary: #FF9800;
    --color-primary-rgb: 255, 152, 0;
    --color-primary-dark: #F57C00;
    --color-primary-light: #FFB74D;

    /* Secondary */
    --color-secondary: #2196F3;
    --color-secondary-rgb: 33, 150, 243;

    /* Shadows for Light Mode */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.15);
    --shadow-glow-primary: 0 0 20px rgba(255, 152, 0, 0.4);
    --shadow-glow-secondary: 0 0 20px rgba(33, 150, 243, 0.4);
    --shadow-glow-accent: 0 0 20px rgba(38, 166, 154, 0.4);
}

/* Dark Mode Variables (Default) */
[data-theme="dark"] {
    /* Keep existing dark mode variables */
    /* These are already defined in design-system-variables.css */
}

/* Apply theme to body element */
body[data-theme="light"] {
    background-color: #FFFFFF !important;
    color: #1A1A1A !important;
}

body[data-theme="dark"] {
    background-color: #0F1419 !important;
    color: #FFFFFF !important;
}

/* Smooth Transition for Theme Changes */
*:not(.preload):not(.preload *) {
    transition: background-color 0.3s ease,
                color 0.3s ease,
                border-color 0.3s ease,
                box-shadow 0.3s ease;
}

/* Prevent transition on page load */
.preload,
.preload * {
    transition: none !important;
}

/* ============================================
   THEME TOGGLE BUTTON
   ============================================ */

.theme-toggle-wrapper {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 10000 !important;
    pointer-events: auto;
}

.theme-toggle {
    position: relative;
    width: 70px;
    height: 34px;
    background: var(--color-bg-medium);
    border: 2px solid var(--color-border-medium);
    border-radius: 50px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
    outline: none;
}

.theme-toggle:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-glow-primary);
    transform: scale(1.05);
}

/* Toggle Icons */
.theme-toggle-icon {
    font-size: 16px;
    z-index: 2;
    transition: opacity 0.3s ease;
}

.theme-toggle-icon.sun {
    opacity: 0.3;
}

.theme-toggle-icon.moon {
    opacity: 1;
}

[data-theme="light"] .theme-toggle-icon.sun {
    opacity: 1;
}

[data-theme="light"] .theme-toggle-icon.moon {
    opacity: 0.3;
}

/* Toggle Slider */
.theme-toggle-slider {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 26px;
    height: 26px;
    background: var(--color-primary);
    border-radius: 50%;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .theme-toggle-slider {
    transform: translateX(36px);
}

/* Alternative: Button Style Toggle */
.theme-toggle-btn {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    background: var(--color-bg-medium);
    border: 2px solid var(--color-border-medium);
    border-radius: var(--radius-base);
    color: var(--color-text-primary);
    font-family: var(--font-display);
    font-weight: var(--font-semibold);
    font-size: var(--text-sm);
    cursor: pointer;
    transition: var(--transition-all);
}

.theme-toggle-btn:hover {
    background: var(--color-bg-light);
    border-color: var(--color-primary);
    color: var(--color-primary);
    box-shadow: var(--shadow-glow-primary);
}

.theme-toggle-btn .icon {
    font-size: 20px;
}

/* ============================================
   MOBILE THEME TOGGLE
   ============================================ */

@media (max-width: 768px) {
    .theme-toggle-wrapper {
        top: var(--space-4);
        right: var(--space-4);
    }

    .theme-toggle {
        width: 60px;
        height: 30px;
    }

    .theme-toggle-slider {
        width: 22px;
        height: 22px;
    }

    [data-theme="light"] .theme-toggle-slider {
        transform: translateX(30px);
    }
}

/* ============================================
   NAVBAR INTEGRATION
   ============================================ */

.navbar .theme-toggle-wrapper {
    position: static;
    margin-left: auto;
}

.navbar .theme-toggle {
    width: 60px;
    height: 30px;
}

.navbar .theme-toggle-slider {
    width: 22px;
    height: 22px;
    top: 2px;
    left: 2px;
}

.navbar [data-theme="light"] .theme-toggle-slider {
    transform: translateX(30px);
}

/* ============================================
   LIGHT MODE SPECIFIC OVERRIDES
   ============================================ */

[data-theme="light"] .navbar {
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .dropdown-menu {
    background: #FFFFFF;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .stat-box,
[data-theme="light"] .card,
[data-theme="light"] .item-card,
[data-theme="light"] .player-card,
[data-theme="light"] .server-card,
[data-theme="light"] .forum-category,
[data-theme="light"] .challenge-card {
    background: #FFFFFF;
    border-color: #E0E0E0;
}

[data-theme="light"] .stat-box:hover,
[data-theme="light"] .card:hover,
[data-theme="light"] .item-card:hover,
[data-theme="light"] .player-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Footer Light Mode */
[data-theme="light"] .footer {
    background: #F5F5F5;
    border-top: 1px solid #E0E0E0;
}

/* Table Light Mode */
[data-theme="light"] .table th {
    background: #F5F5F5;
}

[data-theme="light"] .table tr:hover {
    background: #FAFAFA;
}

/* Badge Light Mode - Keep vibrant colors */
[data-theme="light"] .badge-success {
    background: #4CAF50;
    color: #FFFFFF;
}

[data-theme="light"] .badge-error {
    background: #F44336;
    color: #FFFFFF;
}

[data-theme="light"] .badge-warning {
    background: #FF9800;
    color: #FFFFFF;
}

[data-theme="light"] .badge-info {
    background: #2196F3;
    color: #FFFFFF;
}

/* Button Light Mode */
[data-theme="light"] .btn,
[data-theme="light"] button {
    color: var(--color-text-primary);
}

[data-theme="light"] .btn-primary {
    background: var(--color-primary);
    color: #000000;
}

[data-theme="light"] .btn-secondary {
    background: var(--color-secondary);
    color: #FFFFFF;
}

[data-theme="light"] .btn-outline {
    background: transparent;
    color: var(--color-text-primary);
    border-color: var(--color-border-medium);
}

[data-theme="light"] .btn-outline:hover {
    background: var(--color-primary);
    color: #000000;
}

/* Link Colors Light Mode */
[data-theme="light"] a {
    color: var(--color-primary);
}

[data-theme="light"] a:hover {
    color: var(--color-primary-dark);
}

/* Headings Light Mode */
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4,
[data-theme="light"] h5,
[data-theme="light"] h6 {
    color: var(--color-text-heading);
}

/* Paragraphs and Text Light Mode */
[data-theme="light"] p,
[data-theme="light"] span,
[data-theme="light"] div {
    color: var(--color-text-primary);
}

/* ============================================
   ACCESSIBILITY
   ============================================ */

/* Keyboard Focus for Toggle */
.theme-toggle:focus-visible {
    outline: 3px solid var(--color-primary);
    outline-offset: 2px;
}

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
    [data-theme="light"] {
        --color-text-primary: #000000;
        --color-bg-dark: #FFFFFF;
        --color-border-medium: #000000;
    }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
        animation: none !important;
    }
}

/* ============================================
   CRITICAL FIXES FOR LIGHT MODE
   Prevents white text on white background
   ============================================ */

/* Global Text Color Fix */
[data-theme="light"] * {
    /* Override any hardcoded white colors */
    --text-color-override: var(--color-text-primary);
}

/* Forms Light Mode */
[data-theme="light"] input,
[data-theme="light"] textarea,
[data-theme="light"] select {
    background: #FFFFFF;
    color: #1A1A1A;
    border: 1px solid var(--color-border-medium);
}

[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder {
    color: var(--color-text-muted);
}

/* Lists Light Mode */
[data-theme="light"] ul,
[data-theme="light"] ol,
[data-theme="light"] li {
    color: var(--color-text-primary);
}

/* Labels Light Mode */
[data-theme="light"] label {
    color: var(--color-text-secondary);
}

/* Strong/Bold Text Light Mode */
[data-theme="light"] strong,
[data-theme="light"] b {
    color: var(--color-text-heading);
}

/* Small/Muted Text Light Mode */
[data-theme="light"] small,
[data-theme="light"] .small-text {
    color: var(--color-text-muted);
}

/* Tables Light Mode - Specific Fixes */
[data-theme="light"] table {
    color: var(--color-text-primary);
}

[data-theme="light"] table th {
    color: var(--color-text-heading);
    background: #F5F5F5;
}

[data-theme="light"] table td {
    color: var(--color-text-primary);
}

/* Sidebar Light Mode */
[data-theme="light"] .sidebar,
[data-theme="light"] .widget {
    background: #FFFFFF;
    color: var(--color-text-primary);
}

[data-theme="light"] .widget-title,
[data-theme="light"] .sidebar h3 {
    color: var(--color-text-heading);
}

/* Navigation Light Mode */
[data-theme="light"] nav,
[data-theme="light"] .nav,
[data-theme="light"] .navigation {
    color: var(--color-text-primary);
}

[data-theme="light"] nav a,
[data-theme="light"] .nav a,
[data-theme="light"] .navigation a {
    color: var(--color-text-primary);
}

[data-theme="light"] nav a:hover,
[data-theme="light"] .nav a:hover {
    color: var(--color-primary);
}

/* Stats/Metrics Light Mode */
[data-theme="light"] .stat-value,
[data-theme="light"] .metric-value,
[data-theme="light"] .count {
    color: var(--color-primary);
}

[data-theme="light"] .stat-label,
[data-theme="light"] .metric-label {
    color: var(--color-text-secondary);
}

/* Player Cards Light Mode */
[data-theme="light"] .player-card,
[data-theme="light"] .team-card,
[data-theme="light"] .match-card {
    background: #FFFFFF;
    color: var(--color-text-primary);
    border: 1px solid #E0E0E0;
}

[data-theme="light"] .player-name,
[data-theme="light"] .team-name,
[data-theme="light"] .match-title {
    color: var(--color-text-heading);
}

/* Modal/Dialog Light Mode */
[data-theme="light"] .modal,
[data-theme="light"] .dialog,
[data-theme="light"] .popup {
    background: #FFFFFF;
    color: var(--color-text-primary);
}

[data-theme="light"] .modal-header,
[data-theme="light"] .dialog-header {
    background: #F5F5F5;
    color: var(--color-text-heading);
    border-bottom: 1px solid #E0E0E0;
}

/* Tournament/Match Components */
[data-theme="light"] .tournament-bracket,
[data-theme="light"] .match-bracket {
    background: #FFFFFF;
    color: var(--color-text-primary);
}

[data-theme="light"] .tournament-match,
[data-theme="light"] .bracket-match {
    background: #F5F5F5;
    color: var(--color-text-primary);
    border: 1px solid #E0E0E0;
}

/* Gather System Light Mode */
[data-theme="light"] .gather-card,
[data-theme="light"] .gather-item {
    background: #FFFFFF;
    color: var(--color-text-primary);
}

[data-theme="light"] .gather-title,
[data-theme="light"] .gather-header {
    color: var(--color-text-heading);
}

/* Profile Components Light Mode */
[data-theme="light"] .profile-header,
[data-theme="light"] .user-info {
    background: #F5F5F5;
    color: var(--color-text-primary);
}

[data-theme="light"] .profile-stat,
[data-theme="light"] .user-stat {
    color: var(--color-text-primary);
}

/* Alerts/Notifications Light Mode */
[data-theme="light"] .alert,
[data-theme="light"] .notification {
    color: var(--color-text-primary);
}

[data-theme="light"] .alert-success {
    background: #d4edda;
    color: #155724;
    border-color: #c3e6cb;
}

[data-theme="light"] .alert-warning {
    background: #fff3cd;
    color: #856404;
    border-color: #ffeaa7;
}

[data-theme="light"] .alert-error,
[data-theme="light"] .alert-danger {
    background: #f8d7da;
    color: #721c24;
    border-color: #f5c6cb;
}

[data-theme="light"] .alert-info {
    background: #d1ecf1;
    color: #0c5460;
    border-color: #bee5eb;
}

/* ============================================
   NAVBAR & HEADER LIGHT MODE FIXES
   ============================================ */

/* Main Navbar Background */
[data-theme="light"] .navbar,
[data-theme="light"] .main-navigation,
[data-theme="light"] .site-header,
[data-theme="light"] .primary-navigation,
[data-theme="light"] .navigation,
[data-theme="light"] .menu-wrapper,
[data-theme="light"] #masthead,
[data-theme="light"] .header-navigation,
[data-theme="light"] [class*="navbar"],
[data-theme="light"] [class*="navigation"] {
    background: rgba(255, 255, 255, 0.98) !important;
    border-bottom: 2px solid #E0E0E0 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
}

/* Remove dark gradient shimmer effect in light mode */
[data-theme="light"] .navbar::after,
[data-theme="light"] .main-navigation::after,
[data-theme="light"] .site-header::after {
    background: linear-gradient(90deg, transparent, var(--color-primary), transparent);
    opacity: 0.5;
}

/* Navbar Logo */
[data-theme="light"] .navbar-brand,
[data-theme="light"] .site-logo,
[data-theme="light"] .custom-logo-link,
[data-theme="light"] [class*="logo"] {
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1)) !important;
}

[data-theme="light"] .navbar-brand:hover,
[data-theme="light"] .site-logo:hover,
[data-theme="light"] .custom-logo-link:hover {
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.15)) !important;
}

/* Menu Items - Text Color Fix */
[data-theme="light"] .navbar .menu-item a,
[data-theme="light"] .navbar a,
[data-theme="light"] .main-navigation a,
[data-theme="light"] .nav-menu a,
[data-theme="light"] .menu-item a {
    color: #1A1A1A !important;
    background: transparent !important;
}

/* Menu Items Hover */
[data-theme="light"] .navbar .menu-item a:hover,
[data-theme="light"] .navbar a:hover,
[data-theme="light"] .main-navigation a:hover,
[data-theme="light"] .menu-item a:hover {
    background: #F5F5F5 !important;
    color: var(--color-primary) !important;
    box-shadow: none !important;
}

/* Active/Current Menu Item */
[data-theme="light"] .navbar .menu-item.current-menu-item a,
[data-theme="light"] .navbar .menu-item.current_page_item a,
[data-theme="light"] .main-navigation .current-menu-item a,
[data-theme="light"] .menu-item.current-menu-item a,
[data-theme="light"] .current_page_item a {
    background: #F5F5F5 !important;
    color: var(--color-primary) !important;
    box-shadow: none !important;
    border-bottom: 3px solid var(--color-primary) !important;
}

/* Underline Effect - Light Mode */
[data-theme="light"] .navbar .menu-item a::before,
[data-theme="light"] .main-navigation a::before,
[data-theme="light"] .menu-item a::before {
    background: linear-gradient(90deg, var(--color-primary), var(--color-primary-light), var(--color-primary));
}

/* Dropdown Menu Light Mode */
[data-theme="light"] .navbar .sub-menu,
[data-theme="light"] .navbar .dropdown-menu,
[data-theme="light"] .main-navigation .sub-menu,
[data-theme="light"] .menu-item .sub-menu,
[data-theme="light"] .dropdown-menu {
    background: #FFFFFF !important;
    border: 1px solid #E0E0E0 !important;
    border-top: 3px solid var(--color-primary) !important;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1) !important;
}

/* Dropdown Menu Items */
[data-theme="light"] .dropdown-menu a {
    color: var(--color-text-secondary) !important;
    background: transparent !important;
}

[data-theme="light"] .dropdown-menu a:hover {
    background: #F5F5F5 !important;
    color: var(--color-primary) !important;
}

/* Header Search Button */
[data-theme="light"] .header-search button,
[data-theme="light"] .search-bar-btn button {
    background: var(--color-bg-light);
    border: 1px solid var(--color-border-medium);
}

[data-theme="light"] .header-search button:hover,
[data-theme="light"] .search-bar-btn button:hover {
    background: var(--color-primary);
}

/* Header Icons - Fix SVG Fill */
[data-theme="light"] .header-search svg path,
[data-theme="light"] .header-cart svg path,
[data-theme="light"] .header-menu-toggle svg path {
    fill: #1A1A1A !important;
}

[data-theme="light"] .header-search:hover svg path,
[data-theme="light"] .header-cart:hover svg path,
[data-theme="light"] .header-menu-toggle:hover svg path {
    fill: var(--color-primary) !important;
}

/* Offcanvas/Sidebar Menu Light Mode */
[data-theme="light"] .offcanvas,
[data-theme="light"] .offcanvas-menu-wrap {
    background: #FFFFFF !important;
    color: var(--color-text-primary) !important;
}

[data-theme="light"] .offcanvas-menu-inner {
    background: #FFFFFF !important;
}

[data-theme="light"] .offcanvas-icon svg {
    fill: var(--color-text-primary) !important;
}

/* Sidebar Login Forms */
[data-theme="light"] .sidebar-login-menu h4 {
    color: var(--color-text-heading) !important;
}

[data-theme="light"] .sidebar-wp-login-form label {
    color: var(--color-text-secondary) !important;
}

[data-theme="light"] .sidebar-wp-login-form input {
    background: #FFFFFF !important;
    color: #1A1A1A !important;
    border: 1px solid var(--color-border-medium) !important;
}

/* Mobile Menu Toggle */
[data-theme="light"] .menu.toggle-btn,
[data-theme="light"] .responsive-mobile-menu button {
    background: var(--color-bg-light) !important;
    border: 1px solid var(--color-border-medium) !important;
}

[data-theme="light"] .menu.toggle-btn .icon-left,
[data-theme="light"] .menu.toggle-btn .icon-right {
    background: var(--color-text-primary) !important;
}

/* Navbar Container */
[data-theme="light"] .navbar-container,
[data-theme="light"] .nav-container {
    background: transparent !important;
}

/* Site Title (if no logo) */
[data-theme="light"] .site-title {
    color: var(--color-text-heading) !important;
}

[data-theme="light"] .site-title:hover {
    color: var(--color-primary) !important;
}

/* Cart Badge */
[data-theme="light"] .cart-count,
[data-theme="light"] .qty-badge {
    background: var(--color-primary) !important;
    color: #000000 !important;
}

/* ============================================
   TOURNAMENT SUBNAV LIGHT MODE FIXES
   ============================================ */

/* Tournament Subnav Wrapper */
[data-theme="light"] .tournament-subnav-wrapper {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(250, 250, 250, 0.98)) !important;
    border-bottom: 2px solid var(--color-border-medium) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08) !important;
}

/* Remove dark cosmic background effect */
[data-theme="light"] .tournament-subnav-wrapper::before {
    background: radial-gradient(circle at 20% 50%, rgba(255, 152, 0, 0.03) 1px, transparent 1px),
                radial-gradient(circle at 80% 50%, rgba(255, 152, 0, 0.03) 1px, transparent 1px);
    opacity: 0.3;
}

/* Tournament Subnav Links */
[data-theme="light"] .tournament-subnav-link {
    color: var(--color-text-primary) !important;
    background: transparent !important;
}

/* Tournament Subnav Hover */
[data-theme="light"] .tournament-subnav-link:hover {
    color: var(--color-primary) !important;
    background: rgba(255, 152, 0, 0.08) !important;
}

/* Tournament Subnav Active */
[data-theme="light"] .tournament-subnav-link.active {
    color: var(--color-primary) !important;
    background: rgba(255, 152, 0, 0.12) !important;
    box-shadow: 0 0 15px rgba(255, 152, 0, 0.2) !important;
}

/* Underline Effect Light Mode */
[data-theme="light"] .tournament-subnav-link::before {
    background: linear-gradient(90deg, var(--color-primary), var(--color-primary-light)) !important;
}

/* Active Link Pulse Animation - Lighter */
@keyframes pulse-glow-light {
    0%, 100% {
        box-shadow: 0 0 10px rgba(255, 152, 0, 0.15);
    }
    50% {
        box-shadow: 0 0 20px rgba(255, 152, 0, 0.25);
    }
}

[data-theme="light"] .tournament-subnav-link.active {
    animation: pulse-glow-light 2s ease-in-out infinite !important;
}

/* Tournament Subnav Icons */
[data-theme="light"] .tournament-subnav-icon {
    filter: grayscale(0) !important;
}

/* Count Badges Light Mode */
[data-theme="light"] .tournament-subnav-count {
    background: rgba(0, 0, 0, 0.1) !important;
    color: var(--color-text-secondary) !important;
}

[data-theme="light"] .tournament-subnav-link.active .tournament-subnav-count {
    background: rgba(255, 152, 0, 0.2) !important;
    color: var(--color-primary) !important;
}

/* Mobile Tournament Subnav Light Mode */
@media (max-width: 768px) {
    [data-theme="light"] .tournament-subnav-link {
        border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    }
}

/* ============================================
   PUBG STATS LIGHT MODE FIXES
   ============================================ */

/* Main PUBG Container */
[data-theme="light"] .pubg-advanced-container {
    background: linear-gradient(135deg, #FFFFFF 0%, #F5F5F5 100%) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
}

/* PUBG Header */
[data-theme="light"] .pubg-advanced-header {
    background: linear-gradient(135deg, #F5F5F5 0%, #EEEEEE 100%) !important;
    border-bottom: 3px solid var(--color-primary) !important;
}

[data-theme="light"] .pubg-advanced-header::before {
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,152,0,0.1)" stroke-width="0.5"/></pattern><rect width="100" height="100" fill="url(%23grid)"/></svg>') !important;
}

/* PUBG Title */
[data-theme="light"] .pubg-advanced-title {
    color: var(--color-primary) !important;
    text-shadow: 0 2px 6px rgba(255, 152, 0, 0.3) !important;
}

/* PUBG Subtitle */
[data-theme="light"] .pubg-advanced-subtitle {
    color: var(--color-text-secondary) !important;
}

/* Player Stats Boxes */
[data-theme="light"] .pubg-advanced-player-stat {
    background: rgba(255, 152, 0, 0.05) !important;
    border: 1px solid rgba(255, 152, 0, 0.2) !important;
}

[data-theme="light"] .pubg-advanced-player-stat:hover {
    background: rgba(255, 152, 0, 0.1) !important;
    border-color: rgba(255, 152, 0, 0.4) !important;
}

[data-theme="light"] .pubg-advanced-player-stat-label {
    color: var(--color-text-secondary) !important;
}

[data-theme="light"] .pubg-advanced-player-stat-value {
    color: var(--color-primary) !important;
}

/* PUBG Tabs Navigation */
[data-theme="light"] .pubg-advanced-tabs {
    background: linear-gradient(180deg, #EEEEEE 0%, #F5F5F5 100%) !important;
    border-bottom: 3px solid rgba(255, 152, 0, 0.2) !important;
}

[data-theme="light"] .pubg-advanced-tab {
    color: var(--color-text-secondary) !important;
}

[data-theme="light"] .pubg-advanced-tab:hover {
    background: rgba(255, 152, 0, 0.08) !important;
    color: var(--color-primary) !important;
}

[data-theme="light"] .pubg-advanced-tab.active {
    color: var(--color-primary) !important;
    background: rgba(255, 152, 0, 0.12) !important;
}

[data-theme="light"] .pubg-advanced-tab::before {
    background: linear-gradient(90deg, var(--color-primary), var(--color-primary-light)) !important;
}

/* PUBG Tab Content */
[data-theme="light"] .pubg-advanced-tab-content {
    background: linear-gradient(135deg, #FFFFFF 0%, #F5F5F5 100%) !important;
}

/* Match Cards */
[data-theme="light"] .pubg-match-card {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(250, 250, 250, 0.95) 100%) !important;
    border: 2px solid rgba(255, 152, 0, 0.15) !important;
}

[data-theme="light"] .pubg-match-card::before {
    background: linear-gradient(90deg, transparent, rgba(255, 152, 0, 0.1), transparent) !important;
}

[data-theme="light"] .pubg-match-card:hover {
    border-color: var(--color-primary) !important;
    box-shadow: 0 15px 30px rgba(255, 152, 0, 0.2) !important;
}

/* Match Card Header */
[data-theme="light"] .pubg-match-header {
    border-bottom: 2px solid rgba(255, 152, 0, 0.2) !important;
}

[data-theme="light"] .pubg-match-map {
    color: var(--color-primary) !important;
}

[data-theme="light"] .pubg-match-mode {
    background: rgba(255, 152, 0, 0.12) !important;
    color: var(--color-primary) !important;
    border: 1px solid rgba(255, 152, 0, 0.3) !important;
}

/* Match Stats */
[data-theme="light"] .pubg-match-stat {
    background: rgba(255, 152, 0, 0.05) !important;
    border: 1px solid rgba(255, 152, 0, 0.1) !important;
}

[data-theme="light"] .pubg-match-stat-label {
    color: var(--color-text-secondary) !important;
}

[data-theme="light"] .pubg-match-stat-value {
    color: var(--color-text-heading) !important;
}

[data-theme="light"] .pubg-match-stat-value.rank {
    color: var(--color-primary) !important;
    text-shadow: 0 2px 6px rgba(255, 152, 0, 0.3) !important;
}

[data-theme="light"] .pubg-match-stat-value.kills {
    color: #DC143C !important;
}

[data-theme="light"] .pubg-match-stat-value.damage {
    color: #2196F3 !important;
}

/* Match Footer */
[data-theme="light"] .pubg-match-footer {
    border-top: 1px solid rgba(255, 152, 0, 0.1) !important;
}

[data-theme="light"] .pubg-match-time {
    color: var(--color-text-muted) !important;
}

[data-theme="light"] .pubg-match-view-btn {
    background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light)) !important;
    color: #000000 !important;
    box-shadow: 0 4px 12px rgba(255, 152, 0, 0.3) !important;
}

[data-theme="light"] .pubg-match-view-btn:hover {
    box-shadow: 0 6px 20px rgba(255, 152, 0, 0.5) !important;
}

/* Weapon Stats Cards */
[data-theme="light"] .pubg-weapon-card,
[data-theme="light"] .weapon-card {
    background: #FFFFFF !important;
    border: 1px solid rgba(255, 152, 0, 0.15) !important;
}

[data-theme="light"] .pubg-weapon-card:hover,
[data-theme="light"] .weapon-card:hover {
    border-color: var(--color-primary) !important;
    box-shadow: 0 8px 16px rgba(255, 152, 0, 0.15) !important;
}

[data-theme="light"] .weapon-name,
[data-theme="light"] .pubg-weapon-name {
    color: var(--color-text-heading) !important;
}

[data-theme="light"] .weapon-stat-label,
[data-theme="light"] .pubg-weapon-stat-label {
    color: var(--color-text-secondary) !important;
}

[data-theme="light"] .weapon-stat-value,
[data-theme="light"] .pubg-weapon-stat-value {
    color: var(--color-primary) !important;
}

/* Charts & Graphs */
[data-theme="light"] .pubg-chart-container,
[data-theme="light"] .chart-container {
    background: #FFFFFF !important;
    border: 1px solid var(--color-border-subtle) !important;
}

[data-theme="light"] .chart-title {
    color: var(--color-text-heading) !important;
}

/* Stats Grid */
[data-theme="light"] .pubg-stats-grid,
[data-theme="light"] .stats-grid {
    gap: 20px;
}

[data-theme="light"] .pubg-stat-box,
[data-theme="light"] .stat-box {
    background: #FFFFFF !important;
    border: 1px solid rgba(255, 152, 0, 0.15) !important;
    color: var(--color-text-primary) !important;
}

[data-theme="light"] .pubg-stat-box:hover,
[data-theme="light"] .stat-box:hover {
    border-color: var(--color-primary) !important;
    box-shadow: 0 4px 12px rgba(255, 152, 0, 0.15) !important;
}

/* Loading States */
[data-theme="light"] .pubg-loading,
[data-theme="light"] .loading-spinner {
    color: var(--color-primary) !important;
}

/* No Data Messages */
[data-theme="light"] .pubg-no-data,
[data-theme="light"] .no-data-message {
    color: var(--color-text-muted) !important;
    background: #F5F5F5 !important;
    border: 2px dashed var(--color-border-medium) !important;
}