/* Center Court Theme System */ /* Usage: var(--token-name) in page styles */ /* Toggle: set data-theme="dark" on */ :root { /* Backgrounds */ --bg-body: #f0f2f5; --bg-card: #fff; --bg-table-header: #f8f9fa; --bg-input: #fff; --bg-filter: #f8f9fa; --bg-hover: #f8f9fa; --bg-row-fast: #f0fff4; --bg-drop-zone: #fafbfc; --bg-drop-zone-hover: #f0f3ff; --bg-drop-zone-active: #e8ecff; /* Text */ --text-primary: #333; --text-secondary: #666; --text-muted: #999; --text-heading: #1a1a2e; --text-label: #555; /* Borders */ --border-default: #eee; --border-input: #ddd; --border-dashed: #ccc; /* Shadows */ --shadow-card: 0 1px 3px rgba(0,0,0,0.1); /* Accents */ --accent-blue: #4361ee; --accent-blue-hover: #3a56d4; --accent-blue-bg: #e2e3f1; --accent-blue-light: #f0f3ff; --accent-green: #06d6a0; --accent-red: #ef476f; --accent-red-hover: #d63d5f; --accent-orange: #856404; /* Badges */ --badge-success-bg: #d4edda; --badge-success-text: #155724; --badge-danger-bg: #f8d7da; --badge-danger-text: #721c24; --badge-warning-bg: #fff3cd; --badge-warning-text: #856404; --badge-score-bg: #e2e3f1; --badge-score-text: #4361ee; --badge-neutral-bg: #f8f9fa; --badge-neutral-text: #999; /* Stat cards */ --stat-green: #155724; --stat-blue: #4361ee; --stat-orange: #856404; --stat-red: #721c24; --stat-teal: #06d6a0; /* Links */ --link: #4361ee; --link-hover: #3a56d4; /* Focus */ --focus-ring: #4361ee; /* Charts */ --chart-grid: #eee; --chart-text: #666; /* Misc */ --pagination-bg: #fff; --pagination-border: #ddd; --pagination-active-bg: #4361ee; --pagination-active-text: #fff; --upload-border: #4361ee; } [data-theme="dark"] { /* Backgrounds */ --bg-body: #1a1a2e; --bg-card: #242445; --bg-table-header: #2a2a4e; --bg-input: #2a2a4e; --bg-filter: #2a2a4e; --bg-hover: #2a2a4e; --bg-row-fast: #1a2e2a; --bg-drop-zone: #242445; --bg-drop-zone-hover: #2a2a4e; --bg-drop-zone-active: #2e2e55; /* Text */ --text-primary: #e0e0e0; --text-secondary: #aaa; --text-muted: #777; --text-heading: #fff; --text-label: #aaa; /* Borders */ --border-default: #333; --border-input: #444; --border-dashed: #555; /* Shadows */ --shadow-card: 0 1px 3px rgba(0,0,0,0.3); /* Accents */ --accent-blue: #5b7bff; --accent-blue-hover: #4a6aee; --accent-blue-bg: #2a2a4e; --accent-blue-light: #2a2a4e; --accent-green: #06d6a0; --accent-red: #ef476f; --accent-red-hover: #d63d5f; --accent-orange: #d4a84a; /* Badges */ --badge-success-bg: #1a3d2a; --badge-success-text: #4ade80; --badge-danger-bg: #3d1a2a; --badge-danger-text: #f87171; --badge-warning-bg: #3d3a1a; --badge-warning-text: #fbbf24; --badge-score-bg: #2a2a4e; --badge-score-text: #5b7bff; --badge-neutral-bg: #2a2a4e; --badge-neutral-text: #777; /* Stat cards */ --stat-green: #4ade80; --stat-blue: #5b7bff; --stat-orange: #fbbf24; --stat-red: #f87171; --stat-teal: #06d6a0; /* Links */ --link: #7b93ff; --link-hover: #5b7bff; /* Focus */ --focus-ring: #5b7bff; /* Charts */ --chart-grid: #333; --chart-text: #aaa; /* Misc */ --pagination-bg: #242445; --pagination-border: #444; --pagination-active-bg: #5b7bff; --pagination-active-text: #fff; --upload-border: #5b7bff; } /* Smooth transitions between themes */ body, .card, .stat-card, .filter-form, table th, table td, input, select, textarea, .badge, .btn, .pagination a, .pagination span { transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; }