/* 
 * COLOR CONTRAST & READABILITY FIX
 * Ensures all text is readable against backgrounds
 * WCAG 2.1 Level AA compliance
 */

:root {
    /* Text Colors - High Contrast */
    --text-primary-light: #FFFFFF;
    --text-primary-dark: #0a0e27;
    --text-secondary-light: rgba(255, 255, 255, 0.9);
    --text-secondary-dark: rgba(10, 14, 39, 0.9);
    --text-muted-light: rgba(255, 255, 255, 0.7);
    --text-muted-dark: rgba(10, 14, 39, 0.7);
    
    /* Accent Colors */
    --accent-gold: #FFD700;
    --accent-cyan: #00FFC8;
    --accent-green: #39FF14;
    
    /* Background Colors - Fixed contrast */
    --bg-card-dark: rgba(15, 20, 50, 0.7);
    --bg-card-light: rgba(255, 255, 255, 0.95);
    --bg-input-dark: rgba(255, 255, 255, 0.08);
    --bg-input-light: rgba(10, 14, 39, 0.08);
}

/* ===== CARD COMPONENTS ===== */
.card,
.tournament-card,
.event-card,
.league-card,
.player-card {
    background: var(--bg-card-dark);
    color: var(--text-primary-light);
}

.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6,
.tournament-card h1,
.tournament-card h2,
.tournament-card h3,
.event-card h1,
.event-card h2,
.event-card h3,
.league-card h1,
.league-card h2,
.league-card h3 {
    color: var(--accent-gold);
}

.card p,
.card span,
.card a,
.tournament-card p,
.tournament-card span,
.event-card p,
.event-card span,
.league-card p,
.league-card span {
    color: var(--text-secondary-light);
}

/* ===== INPUT FIELDS ===== */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="tel"],
textarea,
select {
    background: var(--bg-input-dark) !important;
    color: var(--text-primary-light) !important;
    border: 1px solid rgba(255, 215, 0, 0.3) !important;
}

input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="password"]::placeholder,
textarea::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
    background: var(--bg-input-dark) !important;
    border-color: var(--accent-cyan) !important;
    color: var(--text-primary-light) !important;
    box-shadow: 0 0 10px rgba(0, 255, 200, 0.3) !important;
}

/* ===== LABELS & TEXT ===== */
label {
    color: var(--text-secondary-light) !important;
    font-weight: 500;
}

.label-dark {
    color: var(--text-primary-dark) !important;
}

.text-light {
    color: var(--text-primary-light) !important;
}

.text-dark {
    color: var(--text-primary-dark) !important;
}

.text-muted {
    color: var(--text-muted-light) !important;
}

/* ===== STATUS BADGES ===== */
.badge,
.status-badge {
    color: var(--text-primary-light);
}

.status-open,
.status-registration {
    background: linear-gradient(135deg, #10B981, #059669);
    color: #FFFFFF;
}

.status-in-progress {
    background: linear-gradient(135deg, #FFD700, #FFA500);
    color: #1A0C36;
}

.status-completed {
    background: rgba(100, 100, 100, 0.8);
    color: #FFFFFF;
}

.status-pending {
    background: rgba(255, 215, 0, 0.3);
    color: #FFD700;
}

/* ===== BUTTONS ===== */
.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info {
    color: var(--text-primary-light);
}

.btn-primary {
    background: linear-gradient(135deg, #FFD700, #FFA500);
    color: #1A0C36;
    font-weight: 600;
}

.btn-secondary {
    background: rgba(255, 255, 255, 0.1);
    color: var(--accent-cyan);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* ===== MODAL CONTENT ===== */
.modal-content,
.modal-body,
.modal-header,
.drawer-content {
    background: rgba(15, 20, 50, 0.95);
    color: var(--text-primary-light);
}

.modal-header h1,
.modal-header h2,
.modal-header h3,
.modal-title {
    color: var(--accent-gold);
}

.modal-body p,
.modal-body span,
.drawer-content p,
.drawer-content span {
    color: var(--text-secondary-light);
}

/* ===== TABLES ===== */
table,
.table {
    color: var(--text-primary-light);
}

table th,
.table thead th {
    background: rgba(255, 215, 0, 0.15);
    color: var(--accent-gold);
    border-bottom: 2px solid rgba(255, 215, 0, 0.3);
}

table td,
.table tbody td {
    color: var(--text-secondary-light);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

table tr:hover,
.table tbody tr:hover {
    background: rgba(255, 215, 0, 0.08);
}

/* ===== FORM VALIDATION ===== */
input:invalid,
textarea:invalid,
select:invalid {
    border-color: #FF6B6B !important;
}

.form-error,
.error-message {
    color: #FF6B6B;
}

.form-success,
.success-message {
    color: #10B981;
}

.form-warning,
.warning-message {
    color: #FFD700;
}

.form-info,
.info-message {
    color: var(--accent-cyan);
}

/* ===== NAVIGATION ===== */
nav a,
.nav-link,
.navbar a {
    color: var(--text-secondary-light);
    transition: color 0.2s ease;
}

nav a:hover,
.nav-link:hover,
.navbar a:hover {
    color: var(--accent-gold);
}

.nav-link.active,
.navbar .active {
    color: var(--accent-gold);
    border-bottom: 2px solid var(--accent-gold);
}

/* ===== SIDEBAR ===== */
.sidebar {
    background: rgba(15, 20, 50, 0.95);
    color: var(--text-secondary-light);
}

.sidebar a,
.sidebar .nav-item {
    color: var(--text-muted-light);
}

.sidebar a:hover,
.sidebar .nav-item:hover {
    background: rgba(255, 215, 0, 0.1);
    color: var(--accent-gold);
}

.sidebar .active,
.sidebar .nav-item.active {
    background: rgba(255, 215, 0, 0.15);
    color: var(--accent-gold);
}

/* ===== DROPDOWNS ===== */
.dropdown-menu,
.dropdown-content {
    background: rgba(15, 20, 50, 0.95);
    border: 1px solid rgba(255, 215, 0, 0.2);
}

.dropdown-menu a,
.dropdown-item {
    color: var(--text-secondary-light);
}

.dropdown-menu a:hover,
.dropdown-item:hover {
    background: rgba(255, 215, 0, 0.15);
    color: var(--accent-gold);
}

/* ===== EMPTY STATES ===== */
.empty-state,
.no-data,
.placeholder {
    background: rgba(255, 255, 255, 0.05);
    color: var(--text-secondary-light);
    border: 2px dashed rgba(255, 215, 0, 0.3);
}

.empty-state h3,
.empty-state h2,
.no-data h3,
.placeholder h3 {
    color: var(--accent-gold);
}

.empty-state p,
.no-data p,
.placeholder p {
    color: var(--text-muted-light);
}

/* ===== ALERTS ===== */
.alert,
.alert-message {
    color: var(--text-primary-dark);
}

.alert-success {
    background: #10B981;
    color: #FFFFFF;
}

.alert-danger {
    background: #FF6B6B;
    color: #FFFFFF;
}

.alert-warning {
    background: #FFD700;
    color: #1A0C36;
}

.alert-info {
    background: #00FFC8;
    color: #0a0e27;
}

/* ===== ACCESSIBILITY ===== */
:focus {
    outline: 2px solid var(--accent-cyan);
    outline-offset: 2px;
}

:focus:not(:focus-visible) {
    outline: none;
}

:focus-visible {
    outline: 2px solid var(--accent-cyan);
    outline-offset: 2px;
}

/* ===== HOVER STATES ===== */
a {
    color: var(--accent-cyan);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--accent-gold);
    text-decoration: underline;
}

/* ===== UTILITY CLASSES ===== */
.bg-dark {
    background: rgba(15, 20, 50, 0.8) !important;
}

.bg-light {
    background: rgba(255, 255, 255, 0.95) !important;
}

.text-white {
    color: var(--text-primary-light) !important;
}

.text-black {
    color: var(--text-primary-dark) !important;
}

.text-gold {
    color: var(--accent-gold) !important;
}

.text-cyan {
    color: var(--accent-cyan) !important;
}

.text-green {
    color: var(--accent-green) !important;
}

/* ===== SCROLLBARS ===== */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}

::-webkit-scrollbar-thumb {
    background: rgba(255, 215, 0, 0.3);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 215, 0, 0.5);
}

/* ===== DISABLED STATES ===== */
button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
a.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    color: var(--text-muted-light);
}

/* ===== PRINT STYLES ===== */
@media print {
    * {
        background: white !important;
        color: black !important;
    }
}

/* ===== HIGH CONTRAST MODE ===== */
@media (prefers-contrast: more) {
    :root {
        --text-primary-light: #FFFFFF;
        --text-primary-dark: #000000;
        --bg-card-dark: rgba(10, 14, 39, 0.95);
        --accent-gold: #FFD700;
        --accent-cyan: #00FFFF;
    }
}

/* ===== DARK MODE SUPPORT ===== */
@media (prefers-color-scheme: dark) {
    :root {
        --text-primary-light: #FFFFFF;
        --bg-card-dark: rgba(15, 20, 50, 0.8);
    }
}

@media (prefers-color-scheme: light) {
    :root {
        --text-primary-light: #0a0e27;
        --text-primary-dark: #FFFFFF;
        --bg-card-dark: rgba(255, 255, 255, 0.98);
        --bg-input-dark: rgba(10, 14, 39, 0.05);
    }
}