/* ==========================================================================
   1. IMPERIUM (CLAIR & VERT TACTIQUE)
   ========================================================================== */
:root,
html[data-theme="imperium"] {
    --bg-app: #f4f6f4;
    --bg-surface: #ffffff;
    --bg-header: #e1e8e2;
    --bg-toprow: #1e382b;
    --text-toprow: #f0fdf4;
    --sidebar-bg: #15241c;
    --sidebar-text: #e2ede6;
    --text-main: #111827;
    --text-muted: #4b5563;
    --text-accent: #1b4332;
    --border-color: #cbd5e1;
    --primary-color: #2d6a4f;
    --primary-hover: #1b4332;
    --primary-text: #ffffff;
    --badge-bg: #e2e8f0;
    --badge-text: #0f172a;
    --checkbox-bg: #ffffff;
    --checkbox-border: #94a3b8;
}

/* ==========================================================================
   2. SPACE WOLVES (BLEU-GRIS DE FENRIS)
   ========================================================================== */
html[data-theme="spacewolves"] {
    --bg-app: #1e293b;
    --bg-surface: #2c3b4d;
    --bg-header: #384c63;
    --bg-toprow: #131c26;
    --text-toprow: #ffffff;
    --sidebar-bg: #0f172a;
    --sidebar-text: #f1f5f9;
    --text-main: #ffffff;
    --text-muted: #cbd5e1;
    --text-accent: #7dd3fc;
    --border-color: #475569;
    --primary-color: #38bdf8;
    --primary-hover: #0284c7;
    --primary-text: #0f172a;
    --badge-bg: #334155;
    --badge-text: #f8fafc;
    --checkbox-bg: #1e293b;
    --checkbox-border: #64748b;
}

/* ==========================================================================
   3. SPACE MARINES (ULTRAMARINES CLASSIQUE)
   ========================================================================== */
html[data-theme="spacemarines"] {
    --bg-app: #0b1329;
    --bg-surface: #132247;
    --bg-header: #1d336a;
    --bg-toprow: #070d1c;
    --text-toprow: #fde047;
    --sidebar-bg: #050a14;
    --sidebar-text: #f8fafc;
    --text-main: #ffffff;
    --text-muted: #cbd5e1;
    --text-accent: #facc15;
    --border-color: #2b4582;
    --primary-color: #3b82f6;
    --primary-hover: #2563eb;
    --primary-text: #ffffff;
    --badge-bg: #1e293b;
    --badge-text: #f8fafc;
    --checkbox-bg: #0b1329;
    --checkbox-border: #475569;
}

/* ==========================================================================
   4. BLOOD ANGELS (ROUGE CRAMOISI & OR)
   ========================================================================== */
html[data-theme="bloodangels"] {
    --bg-app: #180808;
    --bg-surface: #2b0f0f;
    --bg-header: #421616;
    --bg-toprow: #120505;
    --text-toprow: #fde047;
    --sidebar-bg: #0a0303;
    --sidebar-text: #fecaca;
    --text-main: #ffffff;
    --text-muted: #fca5a5;
    --text-accent: #fbbf24;
    --border-color: #5c1d1d;
    --primary-color: #ef4444;
    --primary-hover: #dc2626;
    --primary-text: #ffffff;
    --badge-bg: #450a0a;
    --badge-text: #fef2f2;
    --checkbox-bg: #180808;
    --checkbox-border: #7f1d1d;
}

/* ==========================================================================
   5. NÉCRONS (MÉTAL SOMBRE & VERT GAUSS)
   ========================================================================== */
html[data-theme="necrons"] {
    --bg-app: #060b08;
    --bg-surface: #101c15;
    --bg-header: #192d21;
    --bg-toprow: #040605;
    --text-toprow: #4ade80;
    --sidebar-bg: #020403;
    --sidebar-text: #bbf7d0;
    --text-main: #ffffff;
    --text-muted: #86efac;
    --text-accent: #4ade80;
    --border-color: #234230;
    --primary-color: #22c55e;
    --primary-hover: #16a34a;
    --primary-text: #050807;
    --badge-bg: #14532d;
    --badge-text: #f0fdf4;
    --checkbox-bg: #060b08;
    --checkbox-border: #166534;
}

/* ==========================================================================
   6. TYRANIDES (FLOTTE-RUCHE VIOLET & BIO-MAGENTA)
   ========================================================================== */
html[data-theme="tyranids"] {
    --bg-app: #12071f;
    --bg-surface: #220e3b;
    --bg-header: #35165c;
    --bg-toprow: #0a0312;
    --text-toprow: #f472b6;
    --sidebar-bg: #06020c;
    --sidebar-text: #fbcfe8;
    --text-main: #ffffff;
    --text-muted: #e9d5ff;
    --text-accent: #f472b6;
    --border-color: #582499;
    --primary-color: #d946ef;
    --primary-hover: #c026d3;
    --primary-text: #ffffff;
    --badge-bg: #581c87;
    --badge-text: #fdf4ff;
    --checkbox-bg: #12071f;
    --checkbox-border: #7e22ce;
}

/* ==========================================================================
   7. GRIMDARK 40K (NOIR GOTHIQUE & ROUGE SANG)
   ========================================================================== */
html[data-theme="grimdark"] {
    --bg-app: #0c0a09;
    --bg-surface: #1c1917;
    --bg-header: #292524;
    --bg-toprow: #050404;
    --text-toprow: #f5f5f4;
    --sidebar-bg: #050404;
    --sidebar-text: #e7e5e4;
    --text-main: #ffffff;
    --text-muted: #d6d3d1;
    --text-accent: #fbbf24;
    --border-color: #44403c;
    --primary-color: #b91c1c;
    --primary-hover: #991b1b;
    --primary-text: #ffffff;
    --badge-bg: #292524;
    --badge-text: #fafaf9;
    --checkbox-bg: #0c0a09;
    --checkbox-border: #57534e;
}

/* ==========================================================================
   APPLICATION GLOBALE ET RÈGLES DE STRUCTURE
   ========================================================================== */

body,
main,
.page,
article.content {
    background-color: var(--bg-app) !important;
    color: var(--text-main) !important;
}

/* Barre latérale */
.sidebar {
    background-color: var(--sidebar-bg) !important;
    background-image: none !important;
    border-right: 1px solid var(--border-color) !important;
}

    .sidebar .nav-link {
        color: var(--sidebar-text) !important;
    }

        .sidebar .nav-link:hover,
        .sidebar .nav-link.active {
            background-color: var(--bg-header) !important;
            color: var(--primary-color) !important;
        }

/* Bandeau supérieur */
.top-row {
    background-color: var(--bg-toprow) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-toprow) !important;
}

    .top-row span,
    .top-row label,
    .top-row h1, .top-row h2, .top-row h3, .top-row h4 {
        color: var(--text-toprow) !important;
    }

    .top-row .fa-shield-alt,
    .top-row .fa-palette {
        color: var(--primary-color) !important;
    }

/* Cartes et conteneurs */
.card {
    background-color: var(--bg-surface) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
}

.card-header,
.card-footer,
.bg-light {
    background-color: var(--bg-header) !important;
    border-color: var(--border-color) !important;
    color: var(--text-main) !important;
}

/* Tableaux */
.table,
.table > :not(caption) > * > *,
.table tbody tr,
.table tbody td,
.table tbody th {
    background-color: var(--bg-surface) !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}

    .table thead th,
    .table-light {
        background-color: var(--bg-header) !important;
        color: var(--text-main) !important;
        border-color: var(--border-color) !important;
        font-weight: 700;
    }

    .table tbody tr:hover > td,
    .table tbody tr:hover > th {
        background-color: var(--bg-header) !important;
    }

    /* Forçage des textes pour la lisibilité */
    .text-dark,
    .table td .text-dark,
    .table td strong,
    .table td .fw-bold,
    .table td b {
        color: var(--text-main) !important;
        font-weight: 600;
    }

    .text-muted,
    .table td .text-muted,
    .table td small,
    .table td .fst-italic,
    .fst-italic {
        color: var(--text-muted) !important;
    }

    .text-primary,
    .table td .text-primary {
        color: var(--text-accent) !important;
        font-weight: 600;
    }

/* Badges */
.badge.bg-secondary,
.badge.bg-light,
.badge.bg-dark {
    background-color: var(--badge-bg) !important;
    color: var(--badge-text) !important;
    border: 1px solid var(--border-color) !important;
}

/* Modales */
.modal-content {
    background-color: var(--bg-surface) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
}

.modal-header,
.modal-footer {
    background-color: var(--bg-header) !important;
    border-color: var(--border-color) !important;
    color: var(--text-main) !important;
}

/* Formulaires : Champs et listes */
.form-control,
.form-select {
    background-color: var(--bg-surface) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--border-color) !important;
}

    .form-control:focus,
    .form-select:focus {
        background-color: var(--bg-surface) !important;
        color: var(--text-main) !important;
        border-color: var(--primary-color) !important;
    }

.form-label {
    color: var(--text-main) !important;
    font-weight: 600;
}

.input-group-text {
    background-color: var(--bg-header) !important;
    border-color: var(--border-color) !important;
    color: var(--text-main) !important;
}

/* ==========================================================================
   CASES À COCHER (CHECKBOXES & MOTS-CLÉS D'ARMES)
   ========================================================================== */

.form-check {
    color: var(--text-main) !important;
    margin-bottom: 0.35rem;
}

.form-check-label {
    color: var(--text-main) !important;
    cursor: pointer;
    font-weight: 500;
    user-select: none;
}

.form-check-input {
    background-color: var(--checkbox-bg) !important;
    border: 1.5px solid var(--checkbox-border) !important;
    cursor: pointer;
}

    .form-check-input:checked {
        background-color: var(--primary-color) !important;
        border-color: var(--primary-color) !important;
    }

    .form-check-input:focus {
        box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.15) !important;
        border-color: var(--primary-color) !important;
    }

/* Conteneurs avec bordure pour les listes de mots-clés */
.border.rounded.p-2,
.border.rounded.p-3 {
    border-color: var(--border-color) !important;
    background-color: var(--bg-surface) !important;
}

/* Boutons */
.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: var(--primary-text) !important;
}

    .btn-primary:hover,
    .btn-primary:focus {
        background-color: var(--primary-hover) !important;
        border-color: var(--primary-hover) !important;
    }