/* Dark Mode Styles */

/* Curseur personnalisé */
* {
    cursor: url('../img/cursor-auto.png'), auto !important;
}

a,
button,
.dark-mode-toggle,
.btn,
input[type="submit"],
input[type="button"] {
    cursor: url('../img/cursor-pointer.png'), pointer !important;
}

/* Bouton Dark Mode */
.dark-mode-toggle {
    position: relative;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    margin-left: 1rem;
    margin-right: auto;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}

.dark-mode-toggle:hover {
    transform: scale(1.1) rotate(20deg);
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}

.dark-mode-toggle i {
    font-size: 1.2rem;
    color: #fff;
    transition: transform 0.3s ease;
}

/* Cacher sur mobile */
@media (max-width: 1199px) {
    .dark-mode-toggle {
        display: flex !important;
        position: relative;
        right: auto;
        top: auto;
        z-index: 10;
        margin-left: auto;
        margin-right: 15px;
        width: 40px;
        height: 40px;
    }

    .dark-mode-toggle i {
        font-size: 1rem;
    }
}

/* Variables pour le mode sombre */
body.dark-mode {
    --bg-color: #0f0f1e;
    --text-color: #e4e4e7;
    --card-bg: #1a1a2e;
    --navbar-bg: #16161f;
    --gradient-1: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --gradient-2: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --shadow: rgba(0, 0, 0, 0.5);
}

/* Mode sombre - Background et textes */
body.dark-mode {
    background-color: var(--bg-color);
    color: var(--text-color);
}

/* Navbar */
body.dark-mode .navbar {
    background-color: transparent !important;
    box-shadow: none;
    transition: all 0.3s ease;
}

body.dark-mode .navbar.scrolled {
    background-color: var(--navbar-bg) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

body.dark-mode .navbar-brand,
body.dark-mode .nav-link {
    color: #fff !important;
}

body.dark-mode .navbar.scrolled .navbar-brand,
body.dark-mode .navbar.scrolled .nav-link {
    color: var(--text-color) !important;
}

body.dark-mode .navbar-toggler {
    border-color: var(--text-color);
}

body.dark-mode .navbar-toggler-icon {
    filter: invert(1);
}

/* Sections */
body.dark-mode section {
    background-color: var(--bg-color) !important;
}

body.dark-mode .hero-section,
body.dark-mode .about-section,
body.dark-mode .skills-section,
body.dark-mode .experience-section,
body.dark-mode .portfolio-section,
body.dark-mode .contact-section,
body.dark-mode .certifications-section,
body.dark-mode .events-section,
body.dark-mode .veille-section {
    background-color: var(--bg-color) !important;
}

/* Cards */
body.dark-mode .about-card,
body.dark-mode .skill-card,
body.dark-mode .timeline-content,
body.dark-mode .certification-card,
body.dark-mode .portfolio-item,
body.dark-mode .event-card,
body.dark-mode .contact-card,
body.dark-mode .veille-card {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

/* Titres */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode .section-title {
    color: var(--text-color) !important;
}

/* Boutons */
body.dark-mode .btn-custom,
body.dark-mode .btn-cv,
body.dark-mode .btn-cert {
    background: var(--gradient-1);
    color: #fff !important;
}

/* Footer */
body.dark-mode footer,
body.dark-mode .footer {
    background-color: var(--navbar-bg) !important;
    color: var(--text-color) !important;
}

/* Timeline */
body.dark-mode .timeline-dot {
    background: var(--gradient-1);
    box-shadow: 0 0 0 4px var(--card-bg);
}

body.dark-mode .timeline-dot.pro {
    background: var(--gradient-2);
}

/* Dropdown */
body.dark-mode .dropdown-menu {
    background-color: var(--card-bg) !important;
    border-color: rgba(255, 255, 255, 0.1);
}

body.dark-mode .dropdown-item {
    color: var(--text-color) !important;
}

body.dark-mode .dropdown-item:hover {
    background-color: rgba(102, 126, 234, 0.2) !important;
}

/* Skill Preview */
body.dark-mode .skill-preview {
    background: var(--card-bg) !important;
    color: var(--text-color) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
}

body.dark-mode .preview-text {
    color: var(--text-color) !important;
}

/* Formulaire de contact */
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
    background-color: #2a2a3e !important;
    color: var(--text-color) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
    color: rgba(228, 228, 231, 0.5) !important;
}

body.dark-mode input:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
    background-color: #2a2a3e !important;
    color: var(--text-color) !important;
    border-color: #667eea !important;
    box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.2) !important;
}

/* Contact Info Card */
body.dark-mode .contact-info {
    background: var(--gradient-1);
    color: #fff;
}

body.dark-mode .contact-form {
    background-color: var(--card-bg) !important;
}

/* Icône du bouton change en mode sombre */
body.dark-mode .dark-mode-toggle {
    background: linear-gradient(135deg, #ffd89b 0%, #19547b 100%);
}

body.dark-mode .dark-mode-toggle i::before {
    content: "\f185";
    /* fa-sun */
}

/* Particles background */
body.dark-mode .particles-bg {
    opacity: 0.5;
}

/* Hero Section - Dark Mode */
body.dark-mode .hero-section {
    background: linear-gradient(135deg, rgba(15, 15, 30, 0.95) 0%, rgba(26, 26, 46, 0.95) 100%);
}

body.dark-mode .hero-section::before {
    opacity: 0.3;
}

/* Portfolio overlay */
body.dark-mode .portfolio-overlay {
    background: rgba(15, 15, 30, 0.95);
}

/* Badges */
body.dark-mode .badge {
    background: var(--gradient-1) !important;
}

/* Back button */
body.dark-mode .back-btn {
    background: var(--gradient-1);
}

/* Lead text */
body.dark-mode .lead {
    color: rgba(228, 228, 231, 0.8) !important;
}

/* Description text */
body.dark-mode .description,
body.dark-mode p {
    color: rgba(228, 228, 231, 0.9) !important;
}

/* Institution text */
body.dark-mode .institution {
    color: rgba(228, 228, 231, 0.7) !important;
}

/* Certifications Page - Dark Mode */
body.dark-mode .certifications-section {
    background: linear-gradient(135deg, rgba(15, 15, 30, 0.98) 0%, rgba(26, 26, 46, 0.98) 100%),
        url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?w=1920&q=80');
}

body.dark-mode .certifications-header h1,
body.dark-mode .certifications-header p {
    color: #fff !important;
}

body.dark-mode .certification-card-premium {
    background: var(--card-bg) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5);
}

body.dark-mode .certification-card-premium:hover {
    box-shadow: 0 25px 60px rgba(102, 126, 234, 0.4);
}

body.dark-mode .cert-issuer {
    color: rgba(228, 228, 231, 0.6) !important;
}

body.dark-mode .cert-title {
    color: #fff !important;
}

body.dark-mode .cert-desc {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .cert-tag {
    background: rgba(255, 255, 255, 0.05) !important;
    color: rgba(228, 228, 231, 0.7) !important;
}

body.dark-mode .certification-card-premium:hover .cert-tag {
    background: rgba(108, 92, 231, 0.2) !important;
    color: #8b9cff !important;
}

body.dark-mode .btn-cert-link {
    color: #8b9cff !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .btn-cert-link:hover {
    background: var(--gradient-1) !important;
    color: #fff !important;
    border-color: transparent !important;
}

body.dark-mode .certification-card-full {
    background: var(--card-bg) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5);
}

body.dark-mode .certification-card-full:hover {
    box-shadow: 0 25px 60px rgba(102, 126, 234, 0.4);
}

body.dark-mode .category-header {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .category-icon {
    background: rgba(255, 255, 255, 0.2) !important;
}

body.dark-mode .cert-details h4,
body.dark-mode .cert-details h5,
body.dark-mode .cert-details p {
    color: var(--text-color) !important;
}

body.dark-mode .cert-title {
    color: var(--text-color) !important;
}

body.dark-mode .cert-description {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .cert-issuer {
    color: #8b9cff !important;
}

body.dark-mode .year-badge {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .cert-badge {
    background: rgba(102, 126, 234, 0.2) !important;
    color: #8b9cff !important;
}

body.dark-mode .cert-badge.cisco,
body.dark-mode .cert-badge.openclassrooms {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .cert-date {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .skill-badge {
    background: rgba(102, 126, 234, 0.2) !important;
    color: #8b9cff !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .skill-badge:hover {
    background: rgba(102, 126, 234, 0.3) !important;
    border-color: rgba(102, 126, 234, 0.5) !important;
}

body.dark-mode .btn-cert-view {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .cert-item {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .cert-item:hover {
    background: rgba(102, 126, 234, 0.15) !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .cert-icon {
    background: var(--gradient-1) !important;
}

/* Cartes compactes */
body.dark-mode .certification-card-compact {
    background: var(--card-bg) !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .certification-card-compact:hover {
    border-color: rgba(102, 126, 234, 0.6) !important;
    box-shadow: 0 10px 30px rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .cert-title-compact {
    color: var(--text-color) !important;
}

body.dark-mode .cert-date-compact {
    color: rgba(228, 228, 231, 0.6) !important;
}

body.dark-mode .cert-description-compact {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .cert-icon-compact {
    background: var(--gradient-1) !important;
}

body.dark-mode .btn-view-cert-compact {
    background: var(--gradient-1) !important;
}

/* Category Box */
body.dark-mode .certification-category-box {
    background: rgba(26, 26, 46, 0.95) !important;
    border-color: rgba(102, 126, 234, 0.4) !important;
}

body.dark-mode .certification-category-box:hover {
    border-color: rgba(102, 126, 234, 0.7) !important;
    box-shadow: 0 25px 70px rgba(102, 126, 234, 0.5) !important;
}

/* Events Page - Dark Mode */
body.dark-mode .events-section {
    background: linear-gradient(135deg, rgba(15, 15, 30, 0.98) 0%, rgba(26, 26, 46, 0.98) 100%),
        url('https://images.unsplash.com/photo-1451187580459-43490279c0fa?w=1920&q=80');
}

body.dark-mode .events-header h1,
body.dark-mode .events-header p {
    color: #fff !important;
}

body.dark-mode .event-card-modern {
    background: var(--card-bg) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5);
}

body.dark-mode .event-card-modern:hover {
    box-shadow: 0 25px 60px rgba(102, 126, 234, 0.4);
}

body.dark-mode .event-category {
    color: #fd79a8 !important;
}

body.dark-mode .event-title {
    color: #fff !important;
}

body.dark-mode .event-description,
body.dark-mode .event-meta {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .event-tag {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #8b9cff !important;
}

body.dark-mode .event-card-modern:hover .event-tag {
    background: rgba(108, 92, 231, 0.2) !important;
}

body.dark-mode .event-date-badge {
    background: rgba(26, 26, 46, 0.9) !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

body.dark-mode .event-date-badge .year {
    color: #fff !important;
}

body.dark-mode .event-card {
    background: var(--card-bg) !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5);
}

body.dark-mode .event-card:hover {
    box-shadow: 0 25px 60px rgba(102, 126, 234, 0.4);
}

body.dark-mode .event-badge {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .event-date {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .event-title {
    color: var(--text-color) !important;
}

body.dark-mode .event-location {
    color: #8b9cff !important;
}

body.dark-mode .event-description {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .event-highlight {
    color: rgba(228, 228, 231, 0.9) !important;
}

body.dark-mode .event-tags .badge {
    background: rgba(102, 126, 234, 0.2) !important;
    color: #8b9cff !important;
}

body.dark-mode .event-image {
    border-color: rgba(102, 126, 234, 0.3) !important;
}

/* Veille Technologique Page - Dark Mode */
body.dark-mode .veille-section {
    background: linear-gradient(135deg, rgba(15, 15, 30, 0.98) 0%, rgba(26, 26, 46, 0.98) 100%),
        url('https://images.unsplash.com/photo-1434030216411-0b793f4b4173?w=1920&q=80');
}

body.dark-mode .veille-header h1,
body.dark-mode .veille-header p {
    color: #fff !important;
}

body.dark-mode .intro-card {
    background: var(--card-bg) !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .intro-card h2 {
    color: #8b9cff !important;
}

body.dark-mode .intro-card p {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .domain-card {
    background: var(--card-bg) !important;
    border-color: rgba(102, 126, 234, 0.2) !important;
}

body.dark-mode .domain-card:hover {
    border-color: #667eea !important;
    box-shadow: 0 25px 60px rgba(102, 126, 234, 0.4) !important;
}

body.dark-mode .domain-card h3 {
    color: #8b9cff !important;
}

body.dark-mode .domain-card p {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .domain-tags .tag {
    background: rgba(102, 126, 234, 0.15) !important;
    color: #8b9cff !important;
}

body.dark-mode .sources-category {
    background: var(--card-bg) !important;
    border-color: rgba(102, 126, 234, 0.2) !important;
}

body.dark-mode .sources-category h3 {
    color: #8b9cff !important;
}

body.dark-mode .source-link {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #8b9cff !important;
    border-color: rgba(102, 126, 234, 0.2) !important;
}

body.dark-mode .source-link:hover {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .discovery-card-modern {
    background: var(--card-bg) !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
}

body.dark-mode .discovery-card-modern:hover {
    box-shadow: 0 25px 50px rgba(102, 126, 234, 0.4);
}

body.dark-mode .discovery-content h4 {
    color: #fff !important;
}

body.dark-mode .discovery-content p {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .read-more {
    color: #8b9cff !important;
}

body.dark-mode .discovery-date-badge {
    background: rgba(26, 26, 46, 0.9) !important;
    color: #8b9cff !important;
}

body.dark-mode .section-title {
    color: var(--text-color) !important;
}

body.dark-mode .intro-card {
    background: rgba(26, 26, 46, 0.85) !important;
    border-color: rgba(102, 126, 234, 0.4) !important;
    backdrop-filter: blur(10px);
}

body.dark-mode .intro-card h2 {
    color: #8b9cff !important;
}

body.dark-mode .intro-card p {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .domain-card {
    background: var(--card-bg) !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .domain-card:hover {
    border-color: rgba(102, 126, 234, 0.6) !important;
    box-shadow: 0 25px 60px rgba(102, 126, 234, 0.4) !important;
}

body.dark-mode .domain-card h3 {
    color: #8b9cff !important;
}

body.dark-mode .domain-card p {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .domain-tags .tag {
    background: rgba(102, 126, 234, 0.2) !important;
    color: #8b9cff !important;
}

body.dark-mode .sources-category {
    background: var(--card-bg) !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .sources-category h3 {
    color: #8b9cff !important;
}

body.dark-mode .source-item {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(102, 126, 234, 0.2) !important;
}

body.dark-mode .source-item:hover {
    background: rgba(102, 126, 234, 0.15) !important;
    border-color: rgba(102, 126, 234, 0.4) !important;
}

body.dark-mode .source-item h4 {
    color: var(--text-color) !important;
}

body.dark-mode .source-item p {
    color: rgba(228, 228, 231, 0.7) !important;
}

body.dark-mode .discovery-card {
    background: var(--card-bg) !important;
    border-color: rgba(102, 126, 234, 0.3) !important;
}

body.dark-mode .discovery-card:hover {
    border-color: rgba(102, 126, 234, 0.6) !important;
    box-shadow: 0 25px 60px rgba(102, 126, 234, 0.4) !important;
}

body.dark-mode .discovery-date {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

body.dark-mode .discovery-card h3 {
    color: var(--text-color) !important;
}

body.dark-mode .discovery-card p {
    color: rgba(228, 228, 231, 0.8) !important;
}

body.dark-mode .discovery-link {
    color: #8b9cff !important;
}

body.dark-mode .discovery-tags .tag {
    background: rgba(102, 126, 234, 0.2) !important;
    color: #8b9cff !important;
}

/* Back button */
body.dark-mode .back-btn {
    background: var(--card-bg) !important;
    color: #8b9cff !important;
}

body.dark-mode .back-btn:hover {
    background: var(--gradient-1) !important;
    color: #fff !important;
}

/* Mode mobile - Navbar toujours visible en mode sombre */
@media (max-width: 767px) {
    body.dark-mode .navbar {
        background-color: var(--navbar-bg) !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
    }

    body.dark-mode .navbar-brand,
    body.dark-mode .nav-link {
        color: var(--text-color) !important;
    }

    /* Menu déroulant mobile - fond assombri */
    body.dark-mode .navbar-collapse {
        background: rgba(15, 15, 30, 0.95) !important;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.8) !important;
        backdrop-filter: blur(10px);
    }

    body.dark-mode .nav-link {
        color: var(--text-color) !important;
    }

    body.dark-mode .nav-link:hover {
        color: #8b9cff !important;
    }

    /* Masquer le séparateur blanc en mode sombre */
    body.dark-mode .navbar-nav::after {
        display: none !important;
    }

    /* Veille Technologique - Fond assombri sur mobile */
    body.dark-mode .veille-section {
        background: var(--bg-color) !important;
    }
}

/* Mode sombre - Vagues des sections Certifications et Projets */
body.dark-mode .certifications-bg-wrapper::after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z' fill='%230f0f1e'/%3E%3C/svg%3E") no-repeat !important;
}

body.dark-mode .certifications-bg-wrapper>.row:last-child::after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z' fill='%230f0f1e'/%3E%3C/svg%3E") no-repeat !important;
}

body.dark-mode .portfolio-bg-wrapper::after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z' fill='%230f0f1e'/%3E%3C/svg%3E") no-repeat !important;
}

body.dark-mode .portfolio-bg-wrapper>.container>.row:last-child::after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z' fill='%230f0f1e'/%3E%3C/svg%3E") no-repeat !important;
}