/* ===== DARK MODE POUR LE BLOG ===== */

/* Body et éléments de base du blog */
[data-theme="dark"] body {
    color: var(--text-primary);
}

/* Navigation menu - Supprimer le rectangle noir */
[data-theme="dark"] .syntexs-primary-menu-navigation {
    background: transparent !important;
}

[data-theme="dark"] .syntexs-navigation-menu-link {
    background: transparent !important;
}

/* Cards d'articles */
[data-theme="dark"] .article-card {
    background-color: var(--card-bg);
    border: 1px solid var(--card-border);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .article-card:hover {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .article-card .card-title {
    color: var(--hero-text-primary);
}

[data-theme="dark"] .article-card .card-text {
    color: var(--hero-text-secondary);
}

/* Métadonnées des articles */
[data-theme="dark"] .article-meta {
    background-color: var(--card-bg);
    border: 1px solid var(--card-border);
    color: var(--hero-text-secondary);
    display: inline-flex;
    width: auto;
    max-width: fit-content;
    padding: 0.75rem 1rem;
}

[data-theme="dark"] .article-meta .text-muted {
    color: var(--hero-text-secondary) !important;
}

[data-theme="dark"] .article-meta .badge.bg-light {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--card-border);
    color: var(--hero-text-primary) !important;
}

/* Contenu des articles */
[data-theme="dark"] .article-excerpt {
    color: var(--hero-text-secondary);
}

[data-theme="dark"] .article-content {
    color: var(--hero-text-secondary);
}

[data-theme="dark"] .article-content h1,
[data-theme="dark"] .article-content h2,
[data-theme="dark"] .article-content h3,
[data-theme="dark"] .article-content h4,
[data-theme="dark"] .article-content h5,
[data-theme="dark"] .article-content h6 {
    color: var(--hero-text-primary);
}

[data-theme="dark"] .article-content h2 {
    border-left-color: var(--accent-primary);
}

[data-theme="dark"] .article-content blockquote {
    background: var(--card-bg);
    border-left-color: var(--accent-primary);
    color: var(--hero-text-secondary);
}

[data-theme="dark"] .article-content code {
    background: var(--card-bg);
    color: var(--hero-text-primary);
}

[data-theme="dark"] .article-content pre {
    background: var(--section-bg-dark);
    color: var(--hero-text-primary);
}

/* Headers du blog */
[data-theme="dark"] .blog-header {
    background: linear-gradient(135deg, #0c0f1a 0%, #1a1f35 50%, #667eea 100%);
}

[data-theme="dark"] .article-header {
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
}

/* Sidebar */
[data-theme="dark"] .sidebar {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
}

[data-theme="dark"] .sidebar h5 {
    color: var(--hero-text-primary);
    border-bottom-color: var(--accent-primary);
}

[data-theme="dark"] .sidebar a {
    color: var(--hero-text-secondary);
}

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

/* Pagination */
[data-theme="dark"] .pagination .page-link {
    background-color: var(--card-bg);
    border-color: var(--card-border);
    color: var(--hero-text-primary);
}

[data-theme="dark"] .pagination .page-item.active .page-link {
    background-color: var(--accent-primary);
    border-color: var(--accent-primary);
}

[data-theme="dark"] .pagination .page-link:hover {
    background-color: var(--card-bg);
    border-color: var(--accent-primary);
    color: var(--accent-primary);
}

/* CTA Section */
[data-theme="dark"] .cta-section {
    background: linear-gradient(135deg, #0c0f1a 0%, #1a1f35 100%);
}

/* Search form */
[data-theme="dark"] .search-form .form-control {
    background-color: var(--card-bg);
    border-color: var(--card-border);
    color: var(--hero-text-primary);
}

[data-theme="dark"] .search-form .form-control:focus {
    background-color: var(--card-bg);
    border-color: var(--accent-primary);
    color: var(--hero-text-primary);
}

[data-theme="dark"] .search-form .form-control::placeholder {
    color: var(--hero-text-secondary);
    opacity: 0.7;
}

/* Badges */
[data-theme="dark"] .badge {
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
}

/* Links */
[data-theme="dark"] a {
    color: var(--accent-primary);
}

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

/* Navigation article précédent/suivant */
[data-theme="dark"] .article-navigation .card.bg-light {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
}

[data-theme="dark"] .article-navigation .card-title {
    color: var(--hero-text-primary);
}

[data-theme="dark"] .article-navigation .text-muted {
    color: var(--hero-text-secondary) !important;
}

[data-theme="dark"] .article-navigation a:hover .card {
    border-color: var(--accent-primary) !important;
    background-color: var(--section-bg-light) !important;
}

/* Breadcrumb si présent */
[data-theme="dark"] nav[aria-label="breadcrumb"] {
    display: inline-block !important;
    width: auto !important;
}

[data-theme="dark"] nav[aria-label="breadcrumb"] .breadcrumb,
[data-theme="dark"] ol.breadcrumb {
    background-color: var(--card-bg) !important;
    padding: 0.75rem 1rem !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    width: auto !important;
    max-width: fit-content !important;
    margin-bottom: 0 !important;
    flex-wrap: nowrap !important;
}

[data-theme="dark"] .breadcrumb-item a {
    color: var(--accent-primary);
}

[data-theme="dark"] .breadcrumb-item.active {
    color: var(--hero-text-secondary);
}

/* Alertes Bootstrap - Renforcement Visibilité */
[data-theme="dark"] .alert-primary {
    background-color: rgba(13, 110, 253, 0.2) !important;
    border-color: #0d6efd !important;
    color: #e0e0e0 !important;
}

[data-theme="dark"] .alert-primary h4,
[data-theme="dark"] .alert-primary .alert-heading,
[data-theme="dark"] .alert-primary strong {
    color: #6ea8fe !important;
}

[data-theme="dark"] .alert-info {
    background-color: rgba(13, 202, 240, 0.2) !important;
    border-color: #0dcaf0 !important;
    color: #e0e0e0 !important;
}

[data-theme="dark"] .alert-info h4,
[data-theme="dark"] .alert-info .alert-heading,
[data-theme="dark"] .alert-info strong {
    color: #3dd5f3 !important;
}

[data-theme="dark"] .alert-success {
    background-color: rgba(25, 135, 84, 0.2) !important;
    border-color: #198754 !important;
    color: #e0e0e0 !important;
}

[data-theme="dark"] .alert-success h4,
[data-theme="dark"] .alert-success .alert-heading,
[data-theme="dark"] .alert-success strong {
    color: #75b798 !important;
}

[data-theme="dark"] .alert-warning {
    background-color: rgba(255, 193, 7, 0.15) !important;
    border-color: #ffc107 !important;
    color: #e0e0e0 !important;
}

[data-theme="dark"] .alert-warning h4,
[data-theme="dark"] .alert-warning .alert-heading,
[data-theme="dark"] .alert-warning strong {
    color: #ffda6a !important;
}

[data-theme="dark"] .alert-danger {
    background-color: rgba(220, 53, 69, 0.2) !important;
    border-color: #dc3545 !important;
    color: #e0e0e0 !important;
}

[data-theme="dark"] .alert-danger h4,
[data-theme="dark"] .alert-danger .alert-heading,
[data-theme="dark"] .alert-danger strong {
    color: #ea868f !important;
}

/* Boutons */
[data-theme="dark"] .btn-light {
    background-color: transparent;
    border: 2px solid var(--hero-text-primary);
    color: var(--hero-text-primary);
}

[data-theme="dark"] .btn-light:hover {
    background-color: var(--hero-text-primary);
    border-color: var(--hero-text-primary);
    color: var(--section-bg-dark);
}

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

[data-theme="dark"] .btn-outline-light:hover {
    background-color: var(--card-bg);
    border-color: var(--accent-primary);
    color: var(--accent-primary);
}

/* Dropdown menu */
[data-theme="dark"] .dropdown-menu {
    background-color: var(--card-bg);
    border: 1px solid var(--card-border);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .dropdown-item {
    color: var(--hero-text-primary);
}

[data-theme="dark"] .dropdown-item:hover,
[data-theme="dark"] .dropdown-item:focus {
    background-color: var(--accent-primary);
    color: white;
}

[data-theme="dark"] .dropdown-toggle {
    background-color: var(--card-bg);
    border-color: var(--card-border);
    color: var(--hero-text-primary);
}

[data-theme="dark"] .dropdown-toggle:hover {
    background-color: var(--card-bg);
    border-color: var(--accent-primary);
    color: var(--accent-primary);
}