/**
 * Tournoi Padel - FindPlayers
 * Mobile Dark Theme - Style alternatif moderne
 * Inspiré du design dark purple avec accents orange
 */

/* ==================== DARK THEME VARIABLES OVERRIDE ==================== */

:root.theme-dark {
    /* Couleurs principales - Dark Purple/Navy */
    --color-primary-50: #6b6880;
    --color-primary-100: #5a5868;
    --color-primary-200: #524e62;
    --color-primary-300: #49455c;
    --color-primary-400: #413d56;
    --color-primary-500: #3f3d56; /* Base dark purple */
    --color-primary-600: #36344a;
    --color-primary-700: #2d2b3e;
    --color-primary-800: #242232;
    --color-primary-900: #1b1926;

    /* Couleurs accent - Orange/Yellow */
    --color-accent-50: #fff3e0;
    --color-accent-100: #ffe0b2;
    --color-accent-200: #ffcc80;
    --color-accent-300: #ffb74d;
    --color-accent-400: #ffa726;
    --color-accent-500: #ff9800; /* Orange principal */
    --color-accent-600: #fb8c00;
    --color-accent-700: #f57c00;
    --color-accent-800: #ef6c00;
    --color-accent-900: #e65100;

    /* Backgrounds dark */
    --bg-primary: #3f3d56;
    --bg-secondary: #36344a;
    --bg-tertiary: #2d2b3e;
    --bg-card: #49455c;

    /* Textes sur dark */
    --text-primary: #ffffff;
    --text-secondary: #b8b6c9;
    --text-tertiary: #8f8da3;
    --text-on-primary: #ffffff;

    /* Borders */
    --border-color: rgba(255, 255, 255, 0.15);
    --border-color-focus: rgba(255, 167, 38, 0.5);

    /* Shadows dark theme */
    --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5);

    /* Success/Warning/Error adaptés au dark */
    --color-success: #66bb6a;
    --color-success-light: rgba(102, 187, 106, 0.15);
    --color-warning: #ffa726;
    --color-warning-light: rgba(255, 167, 38, 0.15);
    --color-error: #ef5350;
    --color-error-light: rgba(239, 83, 80, 0.15);
}

/* ==================== BODY & BASE ==================== */

.theme-dark body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

/* ==================== HEADER ==================== */

.theme-dark .app-header {
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border-color);
}

.theme-dark .app-title {
    color: var(--text-primary);
}

.theme-dark .app-title i {
    color: var(--color-accent-500);
}

/* ==================== WIZARD PROGRESS ==================== */

.theme-dark .step-indicator {
    background-color: var(--bg-tertiary);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

.theme-dark .step-indicator:hover {
    background-color: var(--bg-card);
    border-color: var(--color-accent-500);
}

.theme-dark .step-indicator.active {
    background: linear-gradient(135deg, var(--color-accent-500) 0%, var(--color-accent-400) 100%);
    color: var(--text-primary);
    box-shadow: 0 4px 12px rgba(255, 152, 0, 0.4);
}

.theme-dark .step-indicator.completed {
    background-color: var(--color-success);
    color: white;
}

.theme-dark .step-line {
    background-color: var(--border-color);
}

.theme-dark .step-line.completed {
    background-color: var(--color-success);
}

/* ==================== BOTTOM NAVIGATION ==================== */

.theme-dark .bottom-nav {
    background: var(--bg-secondary);
    border-top: 2px solid var(--border-color);
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.6);
}

.theme-dark .bottom-nav-btn {
    background: linear-gradient(135deg, var(--color-accent-500) 0%, var(--color-accent-400) 100%);
    box-shadow: 0 4px 12px rgba(255, 152, 0, 0.3);
}

.theme-dark .bottom-nav-btn:hover {
    background: linear-gradient(135deg, var(--color-accent-600) 0%, var(--color-accent-500) 100%);
}

.theme-dark .bottom-nav-btn:disabled {
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
    box-shadow: none;
}

.theme-dark .current-step {
    color: var(--color-accent-500);
}

/* ==================== LOGIN SCREEN - DARK ==================== */

.theme-dark .login-container {
    background: linear-gradient(135deg, var(--color-primary-600) 0%, var(--color-primary-900) 100%);
}

.theme-dark .login-card {
    background: var(--bg-secondary);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8);
}

/* ==================== BUTTONS ==================== */

.theme-dark .btn-primary,
.theme-dark .btn-fp-primary {
    background: linear-gradient(135deg, var(--color-accent-500) 0%, var(--color-accent-400) 100%);
    border: none;
    color: var(--text-primary);
    box-shadow: 0 4px 12px rgba(255, 152, 0, 0.3);
}

.theme-dark .btn-primary:hover,
.theme-dark .btn-fp-primary:hover {
    background: linear-gradient(135deg, var(--color-accent-600) 0%, var(--color-accent-500) 100%);
    color: var(--text-primary);
    box-shadow: 0 6px 16px rgba(255, 152, 0, 0.4);
}

.theme-dark .btn-success {
    background: var(--color-success);
    border: none;
}

.theme-dark .btn-outline-secondary {
    background: transparent;
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
}

.theme-dark .btn-outline-secondary:hover {
    background: var(--bg-card);
    border-color: var(--text-secondary);
    color: var(--text-primary);
}

/* ==================== FORMS - Underline Style ==================== */

.theme-dark .form-control {
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 0;
    color: var(--text-primary);
    padding: var(--space-3) var(--space-2);
}

.theme-dark .form-control::placeholder {
    color: var(--text-tertiary);
}

.theme-dark .form-control:focus {
    background: transparent;
    border-bottom: 2px solid var(--color-accent-500);
    box-shadow: 0 2px 0 0 rgba(255, 167, 38, 0.2);
    outline: none;
}

.theme-dark .form-label {
    color: var(--text-primary);
    font-weight: var(--font-medium);
}

.theme-dark .form-text {
    color: var(--text-tertiary);
}

.theme-dark .form-select {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.theme-dark .form-select:focus {
    background: var(--bg-card);
    border-color: var(--color-accent-500);
    box-shadow: 0 0 0 3px rgba(255, 167, 38, 0.2);
}

.theme-dark .input-group-text {
    background-color: var(--bg-card);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

/* Form check (radio/checkbox) */
.theme-dark .form-check-input {
    background-color: transparent;
    border: 2px solid var(--border-color);
}

.theme-dark .form-check-input:checked {
    background-color: var(--color-accent-500);
    border-color: var(--color-accent-500);
}

.theme-dark .form-check-label {
    color: var(--text-primary);
}

/* ==================== CARDS ==================== */

.theme-dark .card {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-md);
}

.theme-dark .card-header {
    background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%);
    color: var(--text-primary);
    border-bottom: 1px solid var(--border-color);
}

.theme-dark .card-body {
    background: var(--bg-card);
}

/* ==================== CONFIG GROUP ==================== */

.theme-dark .config-group {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
}

.theme-dark .config-label {
    color: var(--text-primary);
}

.theme-dark .config-section-title {
    color: var(--text-secondary);
    border-bottom-color: var(--border-color);
}

.theme-dark .config-field-inline {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

/* ==================== PLAYER CARDS ==================== */

.theme-dark .player-card {
    background-color: var(--bg-secondary);
}

.theme-dark .player-card:hover {
    background-color: var(--bg-tertiary);
}

.theme-dark .player-pair-row {
    background-color: var(--bg-card);
}

.theme-dark .player-pair-row:hover {
    background-color: var(--bg-secondary);
}

.theme-dark .player-number-badge,
.theme-dark .player-input-group .player-number {
    background-color: var(--color-accent-500);
    color: var(--text-primary);
}

/* ==================== COURT CARDS ==================== */

.theme-dark .court-card {
    background: linear-gradient(135deg, var(--bg-card) 0%, var(--bg-secondary) 100%);
    border-color: var(--border-color);
}

.theme-dark .court-card:hover {
    border-color: var(--color-accent-500);
}

.theme-dark .court-card .court-header {
    color: var(--color-accent-500);
    border-bottom-color: var(--border-color);
}

.theme-dark .court-card .team {
    background-color: var(--bg-secondary);
}

/* ==================== MATCH RESULT CARDS ==================== */

.theme-dark .match-result-card,
.theme-dark .match-score-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-dark .match-result-card.result-entered,
.theme-dark .match-score-card.score-complete {
    border-color: var(--color-success);
}

.theme-dark .match-result-card .court-label,
.theme-dark .match-score-card .court-label {
    background: linear-gradient(135deg, var(--color-accent-500) 0%, var(--color-accent-400) 100%);
    color: var(--text-primary);
}

.theme-dark .team-btn {
    background-color: var(--bg-secondary);
    color: var(--text-primary);
}

.theme-dark .team-btn:hover {
    background-color: var(--bg-tertiary);
}

.theme-dark .team-btn.winner {
    background-color: var(--color-success-light);
    border-left-color: var(--color-success);
}

.theme-dark .team-btn.loser {
    background-color: var(--bg-tertiary);
    color: var(--text-tertiary);
}

/* ==================== SCORE ENTRY TABLE ==================== */

.theme-dark .score-entry-table {
    color: var(--text-primary);
}

.theme-dark .score-entry-table thead th {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    border-bottom-color: var(--border-color);
}

.theme-dark .score-entry-table tbody td {
    border-bottom-color: var(--border-color);
}

.theme-dark .set-input {
    background: var(--bg-secondary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.theme-dark .set-input:focus {
    border-color: var(--color-accent-500);
    box-shadow: 0 0 0 3px rgba(255, 167, 38, 0.2);
}

.theme-dark .set-input.winner {
    background-color: var(--color-success-light);
    border-color: var(--color-success);
}

.theme-dark .set-input.loser {
    background-color: var(--bg-tertiary);
    color: var(--text-tertiary);
}

.theme-dark .tiebreak-input {
    background: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.theme-dark .match-result-summary {
    background: var(--bg-secondary);
    border-top-color: var(--border-color);
}

/* ==================== TABLES ==================== */

.theme-dark .table {
    color: var(--text-primary);
}

.theme-dark .table thead th {
    background: var(--bg-secondary);
    color: var(--text-primary);
    border-bottom-color: var(--border-color);
}

.theme-dark .table tbody tr {
    border-bottom-color: var(--border-color);
}

.theme-dark .table tbody tr:hover {
    background-color: var(--bg-tertiary);
}

.theme-dark .table-light {
    background: var(--bg-secondary) !important;
}

/* Ranking badges dark */
.theme-dark .rank-gold {
    background-color: rgba(255, 215, 0, 0.1) !important;
}

.theme-dark .rank-silver {
    background-color: rgba(192, 192, 192, 0.1) !important;
}

.theme-dark .rank-bronze {
    background-color: rgba(205, 127, 50, 0.1) !important;
}

/* ==================== ACCORDIONS ==================== */

.theme-dark .accordion-button {
    background: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.theme-dark .accordion-button:not(.collapsed) {
    background: var(--bg-secondary);
    color: var(--color-accent-500);
    border-color: var(--color-accent-500);
}

.theme-dark .accordion-button:focus {
    box-shadow: 0 0 0 3px rgba(255, 167, 38, 0.2);
}

.theme-dark .accordion-body {
    background: var(--bg-card);
    color: var(--text-primary);
}

/* ==================== STATS CARDS ==================== */

.theme-dark .stat-card {
    background: linear-gradient(135deg, var(--bg-card) 0%, var(--bg-secondary) 100%);
    border-color: var(--border-color);
}

.theme-dark .diversity-score-card,
.theme-dark .comparison-card {
    background: linear-gradient(135deg, var(--bg-card) 0%, var(--bg-secondary) 100%);
    border-color: var(--border-color);
}

.theme-dark .stats-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-dark .stats-card-header {
    background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%);
    border-bottom-color: var(--border-color);
}

.theme-dark .info-item {
    background-color: var(--bg-secondary);
}

/* Encounter matrix */
.theme-dark .matrix-container {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-dark .encounter-matrix thead th,
.theme-dark .encounter-matrix tbody th {
    background: linear-gradient(135deg, var(--bg-tertiary) 0%, var(--bg-secondary) 100%);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.theme-dark .encounter-matrix td {
    border-color: var(--border-color);
    color: var(--text-primary);
}

.theme-dark .matrix-diagonal {
    background-color: var(--bg-tertiary) !important;
}

/* ==================== BADGES & ALERTS ==================== */

.theme-dark .badge {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.theme-dark .alert {
    background-color: var(--bg-card);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.theme-dark .alert-warning {
    background-color: var(--color-warning-light);
    border-color: var(--color-warning);
    color: var(--text-primary);
}

.theme-dark .alert-info {
    background-color: rgba(59, 130, 246, 0.15);
    border-color: #3b82f6;
}

.theme-dark .resting-badge {
    background-color: var(--color-warning-light);
    border-color: var(--color-warning);
    color: var(--text-primary);
}

/* ==================== MODALS ==================== */

.theme-dark .modal-content {
    background: var(--bg-card);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
}

.theme-dark .modal-header {
    border-bottom-color: var(--border-color);
}

.theme-dark .modal-footer {
    border-top-color: var(--border-color);
}

/* ==================== BOOTSTRAP OVERRIDES ==================== */

.theme-dark .text-muted {
    color: var(--text-secondary) !important;
}

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

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

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

.theme-dark .text-danger {
    color: var(--color-error) !important;
}

.theme-dark .bg-light {
    background-color: var(--bg-secondary) !important;
}

.theme-dark .border {
    border-color: var(--border-color) !important;
}

/* ==================== SCROLL INDICATOR ==================== */

.theme-dark .scroll-indicator {
    background: linear-gradient(135deg, var(--color-accent-500) 0%, var(--color-accent-400) 100%);
    box-shadow: 0 4px 12px rgba(255, 152, 0, 0.4);
}

.theme-dark .scroll-indicator.visible {
    opacity: 0.8;
}

.theme-dark .scroll-indicator:hover {
    opacity: 1;
    box-shadow: 0 6px 16px rgba(255, 152, 0, 0.5);
}

/* ==================== SCROLLBARS (WebKit) ==================== */

.theme-dark ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.theme-dark ::-webkit-scrollbar-track {
    background: var(--bg-tertiary);
}

.theme-dark ::-webkit-scrollbar-thumb {
    background: var(--color-accent-500);
    border-radius: 4px;
}

.theme-dark ::-webkit-scrollbar-thumb:hover {
    background: var(--color-accent-600);
}

/* ==================== FIXED PAIR INFO BANNER (DARK MODE) ==================== */

.theme-dark .fixed-pair-info {
    background: linear-gradient(135deg, rgba(255, 152, 0, 0.2) 0%, rgba(251, 140, 0, 0.15) 100%);
    color: var(--color-accent-300);
    border-left: 4px solid var(--color-accent-500);
    border-bottom: 1px solid rgba(255, 152, 0, 0.3);
    box-shadow: inset 0 1px 0 rgba(255, 152, 0, 0.1);
}

.theme-dark .fixed-pair-info i {
    color: var(--color-accent-500);
}

/* Orange checkboxes in dark mode */
.theme-dark .fixed-pair-checkbox {
    accent-color: var(--color-accent-500);
    border-color: var(--color-accent-500);
}

.theme-dark .fixed-pair-checkbox:checked {
    background-color: var(--color-accent-500);
    border-color: var(--color-accent-500);
}

/* Labels orange in dark mode */
.theme-dark #screen-players .player-pair-row .form-check-label {
    color: var(--color-accent-400);
}

.theme-dark #screen-players .player-pair-row .form-check-label i {
    color: var(--color-accent-500);
}

/* ==================== RECAP INFO COMPACT (DARK MODE) ==================== */

.theme-dark .recap-info-compact {
    background: var(--bg-tertiary);
    border-color: var(--border-color);
}

.theme-dark .recap-info-row {
    border-bottom-color: var(--border-color);
}

.theme-dark .recap-info-row:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

.theme-dark .recap-info-label {
    color: var(--text-secondary);
}

.theme-dark .recap-info-value {
    color: var(--text-primary);
}

/* ==================== PLAYERS COLLAPSE BUTTON (DARK MODE) ==================== */

.theme-dark .players-collapse-btn {
    background: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.theme-dark .players-collapse-btn:hover {
    background: var(--bg-card);
    border-color: var(--color-accent-500);
}

.theme-dark .players-collapse-btn:not(.collapsed) {
    background: rgba(255, 152, 0, 0.15);
    border-color: var(--color-accent-500);
    color: var(--color-accent-300);
}

.theme-dark .players-collapse-btn .bi-chevron-down {
    color: var(--text-tertiary);
}

.theme-dark .players-collapse-btn:not(.collapsed) .bi-chevron-down {
    color: var(--color-accent-500);
}

/* ==================== TOURNAMENT MANAGER (DARK MODE) ==================== */

.theme-dark .tournament-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

.theme-dark .tournament-card:hover {
    border-color: var(--color-accent-500);
}

.theme-dark .tournament-card.border-primary {
    border-color: var(--color-accent-500);
    background: rgba(255, 152, 0, 0.1);
}

.theme-dark #tournaments-modal .modal-body {
    background: var(--bg-card);
}

.theme-dark .tournament-card-header h6 {
    color: var(--text-primary);
}

/* ==================== GUEST MODE BANNER - DARK THEME ==================== */

.theme-dark .guest-mode-banner {
    background: linear-gradient(135deg, var(--color-accent-600) 0%, var(--color-accent-700) 100%);
    box-shadow: 0 2px 8px rgba(255, 152, 0, 0.4);
}

.theme-dark .guest-mode-banner a {
    color: var(--color-primary-900);
    font-weight: var(--font-bold);
}

.theme-dark .guest-mode-banner a:hover {
    color: var(--color-primary-800);
    text-shadow: 0 0 8px rgba(63, 61, 86, 0.5);
}