/* =============================================================
   dark-theme.css
   1info — Mode Sombre (Dark / Nuit)
   À inclure APRÈS style.css et main.css dans chaque page :
   <link href="assets/css/dark-theme.css" rel="stylesheet">
   ============================================================= */

/* =============================================================
   BOUTON TOGGLE — apparence par défaut (mode clair)
   ============================================================= */
.theme-toggle {
    background: rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 50%;
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 1rem;
    color: var(--bs-primary);
    flex-shrink: 0;
}
.theme-toggle:hover {
    transform: scale(1.1);
    background: rgba(0, 0, 0, 0.1);
}

/* =============================================================
   BASE BODY — quand .dark-theme est appliqué
   ============================================================= */
body.dark-theme {
    background-color: #0d1117;
    color: #c9d1d9;
}

/* =============================================================
   CLASSES BOOTSTRAP UTILITAIRES
   ============================================================= */
body.dark-theme .bg-white        { background-color: #161b22 !important; }
body.dark-theme .bg-light        { background-color: #0d1117 !important; }
body.dark-theme .text-dark       { color: #c9d1d9 !important; }
body.dark-theme .text-white:not(.text-primary):not(.fa):not(.fas):not(.fab):not(.bi) {
    color: #f0f6fc !important;
}
body.dark-theme .border          { border-color: #30363d !important; }
body.dark-theme .border-primary  { border-color: #30363d !important; }
body.dark-theme .border-end      { border-color: #30363d !important; }
body.dark-theme .border-top-0    { border-top-color: transparent !important; }

/* =============================================================
   TYPOGRAPHIE
   ============================================================= */
body.dark-theme h1,
body.dark-theme h2,
body.dark-theme h3,
body.dark-theme h4,
body.dark-theme h5,
body.dark-theme h6 {
    color: #f0f6fc !important;
}
body.dark-theme .display-1,
body.dark-theme .display-2,
body.dark-theme .display-3,
body.dark-theme .display-4 {
    color: #f0f6fc !important;
}
body.dark-theme .text-primary { color: #58a6ff !important; }

/* --- Paragraphes & textes secondaires --- */
body.dark-theme p         { color: #c9d1d9; }
body.dark-theme .fw-medium { color: #8b949e !important; }
body.dark-theme .small     { color: #8b949e !important; }

/* --- Liens --- */
body.dark-theme a { color: #58a6ff; }

/* --- Icônes FontAwesome colorées --- */
body.dark-theme .fa-check,
body.dark-theme .fa-award,
body.dark-theme .fa-users-cog,
body.dark-theme .fa-users {
    color: #58a6ff !important;
}

/* =============================================================
   SPINNER
   ============================================================= */
body.dark-theme #spinner {
    background-color: #0d1117 !important;
}

/* =============================================================
   HEADER & TOPBAR
   ============================================================= */
body.dark-theme .header-top {
    background-color: #0d1117 !important;
}
body.dark-theme .topbar a {
    color: #c9d1d9 !important;
}
body.dark-theme .topbar a:hover {
    color: #f0f6fc !important;
}
body.dark-theme .nav-bar {
    background-color: #161b22 !important;
}
body.dark-theme .navbar-nav.bg-white {
    background-color: #161b22 !important;
}
body.dark-theme .navbar-light .nav-link {
    color: #c9d1d9 !important;
}
body.dark-theme .navbar-light .nav-link:hover,
body.dark-theme .navbar-light .nav-link.active {
    color: #f0f6fc !important;
}

/* --- Toggle bouton en dark --- */
body.dark-theme .theme-toggle {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.15);
    color: #f0f6fc;
}
body.dark-theme .theme-toggle:hover {
    background: rgba(255, 255, 255, 0.15);
}

/* =============================================================
   BREADCRUMB
   ============================================================= */
body.dark-theme .bg-breadcrumb {
    background-color: #161b22 !important;
}
body.dark-theme .breadcrumb-item a {
    color: #8b949e !important;
}
body.dark-theme .breadcrumb-item a:hover {
    color: #f0f6fc !important;
}
body.dark-theme .breadcrumb-item.active {
    color: #58a6ff !important;
}
body.dark-theme .breadcrumb-item + .breadcrumb-item::before {
    color: #484f58 !important;
}

/* =============================================================
   STATS (compteurs animés)
   ============================================================= */
body.dark-theme .fa-award,
body.dark-theme .fa-users-cog,
body.dark-theme .fa-users {
    color: #58a6ff !important;
}

/* =============================================================
   ABOUT
   ============================================================= */
body.dark-theme .about {
    background-color: #161b22;
}

/* =============================================================
   BANNER
   ============================================================= */
body.dark-theme .banner {
    background-color: #161b22 !important;
}

/* =============================================================
   SERVICES — onglets + cartes carousel
   ============================================================= */
body.dark-theme .service {
    background-color: #0d1117;
}
/* Forcer le texte des onglets services (y compris les <span>) */
body.dark-theme .service .nav a,
body.dark-theme .service .nav a span {
    background-color: #161b22 !important;
    color: #c9d1d9 !important;
    border: 1px solid #30363d !important;
}
body.dark-theme .service .nav a.active,
body.dark-theme .service .nav a.active span,
body.dark-theme .service .nav a:hover,
body.dark-theme .service .nav a:hover span {
    background-color: var(--bs-primary, #0d6efd) !important;
    color: #ffffff !important;
    border-color: var(--bs-primary, #0d6efd) !important;
}
body.dark-theme .service-item .border.border-top-0 {
    background-color: #161b22 !important;
    border-color: #30363d !important;
}

/* =============================================================
   PROJECTS
   ============================================================= */
body.dark-theme .projects .nav-item.bg-white,
body.dark-theme .projects .nav-item.bg-light {
    background-color: #161b22 !important;
}
/* Forcer le texte des onglets projets (titre + span) */
body.dark-theme .projects .nav-item a,
body.dark-theme .projects .nav-item a span,
body.dark-theme .projects .nav-item a.active,
body.dark-theme .projects .nav-item a.active span {
    color: #f0f6fc !important;
}
body.dark-theme .projects-content {
    background-color: #161b22 !important;
}
body.dark-theme .projects-icon {
    background-color: var(--bs-primary, #0d6efd) !important;
}

/* =============================================================
   BLOG
   ============================================================= */
body.dark-theme .blog {
    background-color: #161b22;
}
body.dark-theme .blog-heading a {
    color: #f0f6fc !important;
}
body.dark-theme .blog-heading a:hover {
    color: #58a6ff !important;
}
body.dark-theme .blog-content {
    background-color: #0d1117 !important;
}

/* =============================================================
   TEAM
   ============================================================= */
body.dark-theme .team-content {
    background-color: #0d1117 !important;
}
body.dark-theme .team-content p {
    color: #8b949e !important;
}

/* =============================================================
   TESTIMONIAL
   ============================================================= */
body.dark-theme .testimonial {
    background-color: #161b22;
}
body.dark-theme .testimonial-item {
    background-color: #161b22 !important;
    border-color: #30363d !important;
}
body.dark-theme .testimonial-quote {
    background-color: #0d1117 !important;
}
body.dark-theme .testimonial-quote i {
    color: #58a6ff !important;
}
body.dark-theme .testimonial-inner {
    background-color: #161b22 !important;
}
body.dark-theme .testimonial-inner p {
    color: #8b949e !important;
}
body.dark-theme .customer-text {
    background-color: #0d1117 !important;
    color: #c9d1d9 !important;
}
body.dark-theme .customer-text a {
    color: #58a6ff !important;
}

/* =============================================================
   FAQ / ACCORDION
   ============================================================= */
body.dark-theme .faq-section {
    background-color: #0d1117;
}
body.dark-theme .accordion-item {
    background-color: #161b22 !important;
    border-color: #30363d !important;
}
body.dark-theme .accordion-button {
    background-color: #161b22 !important;
    color: #f0f6fc !important;
    box-shadow: none !important;
}
body.dark-theme .accordion-button:not(.collapsed) {
    background-color: #1c2333 !important;
    color: #58a6ff !important;
}
body.dark-theme .accordion-button::after {
    filter: invert(1);
}
body.dark-theme .accordion-body {
    background-color: #161b22 !important;
    color: #c9d1d9 !important;
}
body.dark-theme .accordion-body a {
    color: #58a6ff !important;
}

/* =============================================================
   SÉLECTEUR LANGUE & LECTEUR AUDIO (page about)
   ============================================================= */

/* Le conteneur lui-même doit être sombre */
body.dark-theme .language-selector {
    background-color: #161b22 !important;
    color: #c9d1d9 !important;
    padding: 1rem !important;
    border-radius: 8px !important;
    border: 1px solid #30363d !important;
    margin-bottom: 1.5rem !important;
}

/* Le label "Langue :" */
body.dark-theme .language-selector label {
    color: #f0f6fc !important;
    font-weight: 500 !important;
    margin-right: 0.5rem !important;
}

/* Le menu déroulant */
body.dark-theme .language-selector select {
    background-color: #0d1117 !important;
    color: #c9d1d9 !important;
    border: 1px solid #30363d !important;
    padding: 0.5rem 1rem !important;
    border-radius: 6px !important;
}
body.dark-theme .language-selector select option {
    background-color: #161b22 !important;
    color: #c9d1d9 !important;
}

/* Le lecteur audio natif */
body.dark-theme audio {
    width: 100% !important;
    background-color: #161b22 !important;
    color: #c9d1d9 !important;
    border: 1px solid #30363d !important;
    border-radius: 12px !important;
    padding: 0.5rem !important;
    display: block !important;
    /* Inverse les couleurs natives (blanc -> noir) sans tourner les teintes */
    filter: invert(1) !important;
}

/* Texte de secours si audio non supporté */
body.dark-theme audio p {
    color: #c9d1d9 !important;
    background-color: #161b22 !important;
    padding: 1rem !important;
    border-radius: 8px !important;
}
body.dark-theme audio p a {
    color: #58a6ff !important;
    font-weight: bold !important;
}

/* =============================================================
   TRANSCRIPTIONS (page about)
   ============================================================= */
body.dark-theme .transcriptions {
    background-color: #161b22 !important;
    border: 1px solid #30363d !important;
    border-radius: 8px !important;
    padding: 1.5rem !important;
    margin-bottom: 1rem !important;
}
body.dark-theme .transcriptions h2 {
    color: #f0f6fc !important;
    margin-bottom: 1rem !important;
}

/* Forcer TOUS les textes à l'intérieur */
body.dark-theme .transcriptions p,
body.dark-theme .transcriptions li,
body.dark-theme .transcriptions span,
body.dark-theme .transcriptions strong,
body.dark-theme .transcriptions em,
body.dark-theme .transcriptions i {
    color: #c9d1d9 !important;
}

/* Listes (pour garantir la transparence du fond) */
body.dark-theme .transcriptions ul {
    background-color: transparent !important;
    padding-left: 0 !important;
    margin: 0 !important;
}
body.dark-theme .transcriptions ul li {
    background-color: transparent !important;
    color: #c9d1d9 !important;
    padding: 0.4rem 0 !important;
    border-bottom: 1px solid #21262d !important;
}
body.dark-theme .transcriptions ul li:last-child {
    border-bottom: none !important;
}

/* Liens */
body.dark-theme .transcriptions a {
    color: #58a6ff !important;
}

/* =============================================================
   PRICING (pages service_price, etc.)
   ============================================================= */
body.dark-theme .pricing.section {
    background-color: #0d1117;
}
body.dark-theme .pricing-item {
    background-color: #161b22 !important;
    border: 1px solid #30363d !important;
    box-shadow: none !important;
}
body.dark-theme .pricing-item.featured {
    border-color: var(--bs-primary, #0d6efd) !important;
}
body.dark-theme .pricing-item h3 {
    color: #f0f6fc !important;
}
body.dark-theme .pricing-item h4 {
    color: #f0f6fc !important;
}
body.dark-theme .pricing-item h4 sup {
    color: #58a6ff !important;
}
body.dark-theme .pricing-item h4 span {
    color: #8b949e !important;
    font-weight: 400 !important;
}

/* Liste des services inclus */
body.dark-theme .pricing-item ul {
    list-style: none;
    padding: 0;
}
body.dark-theme .pricing-item ul li {
    color: #c9d1d9 !important;
    border-bottom-color: #21262d !important;
}
body.dark-theme .pricing-item ul li i {
    color: #58a6ff !important;
}
body.dark-theme .pricing-item ul li a {
    color: #58a6ff !important;
}

/* Lignes non incluses (barrées) */
body.dark-theme .pricing-item ul li.na {
    color: #484f58 !important;
    text-decoration: line-through;
}
body.dark-theme .pricing-item ul li.na i {
    color: #30363d !important;
}

/* Badge "Advanced" */
body.dark-theme .pricing-item .advanced {
    background-color: var(--bs-primary, #0d6efd) !important;
    color: #ffffff !important;
}

/* Bouton d'achat */
body.dark-theme .btn-buy {
    background-color: var(--bs-primary, #0d6efd) !important;
    color: #ffffff !important;
    border: none !important;
}
body.dark-theme .btn-buy:hover {
    opacity: 0.85;
    color: #ffffff !important;
}

/* Sous-titres de page (page-title) */
body.dark-theme .page-title.light-background {
    background-color: #161b22 !important;
}
body.dark-theme .page-title h1 {
    color: #f0f6fc !important;
}

/* =============================================================
   FOOTER & COPYRIGHT
   ============================================================= */
body.dark-theme .footer {
    background-color: #010409 !important;
}
body.dark-theme .copyright {
    background-color: #010409 !important;
    color: #8b949e !important;
}
body.dark-theme .footer-item a,
body.dark-theme .footer a {
    color: #8b949e !important;
}
body.dark-theme .footer-item a:hover,
body.dark-theme .footer a:hover {
    color: #f0f6fc !important;
}

/* =============================================================
   FORMULAIRES
   ============================================================= */
body.dark-theme .form-control {
    background-color: #0d1117 !important;
    border-color: #30363d !important;
    color: #c9d1d9 !important;
}
body.dark-theme .form-control::placeholder {
    color: #484f58 !important;
}
body.dark-theme .form-control:focus {
    border-color: #58a6ff !important;
    box-shadow: 0 0 0 0.2rem rgba(88, 166, 255, 0.25) !important;
}

/* =============================================================
   BOUTONS
   ============================================================= */
body.dark-theme .btn-light {
    background-color: #21262d !important;
    color: #c9d1d9 !important;
    border-color: #30363d !important;
}
body.dark-theme .btn-light:hover {
    background-color: #30363d !important;
    color: #f0f6fc !important;
}

/* =============================================================
   MODAL
   ============================================================= */
body.dark-theme .modal-content {
    background-color: #161b22 !important;
    border-color: #30363d !important;
}
body.dark-theme .modal-header {
    border-color: #30363d !important;
}
body.dark-theme .modal-title {
    color: #f0f6fc !important;
}
body.dark-theme .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

/* =============================================================
   OWL CAROUSEL (dots & nav)
   ============================================================= */
body.dark-theme .owl-dot span {
    background: #30363d !important;
}
body.dark-theme .owl-dot.active span,
body.dark-theme .owl-dot:hover span {
    background: var(--bs-primary, #0d6efd) !important;
}

/* =============================================================
   IMAGES — ne jamais inverser en dark
   ============================================================= */
body.dark-theme img {
    filter: none !important;
}

/* =============================================================
   TRANSITIONS DOUCES au basculement Jour ↔ Nuit
   ============================================================= */
body.dark-theme,
body.dark-theme .container-fluid,
body.dark-theme .container,
body.dark-theme .bg-white,
body.dark-theme .bg-light,
body.dark-theme .navbar-nav,
body.dark-theme .nav-bar,
body.dark-theme .service-item,
body.dark-theme .service-item .border,
body.dark-theme .projects-content,
body.dark-theme .blog-content,
body.dark-theme .blog-heading,
body.dark-theme .team-content,
body.dark-theme .testimonial-item,
body.dark-theme .testimonial-quote,
body.dark-theme .testimonial-inner,
body.dark-theme .customer-text,
body.dark-theme .accordion-item,
body.dark-theme .accordion-button,
body.dark-theme .form-control,
body.dark-theme .modal-content,
body.dark-theme .topbar,
body.dark-theme .header-top,
body.dark-theme .footer,
body.dark-theme .copyright,
body.dark-theme .bg-breadcrumb,
body.dark-theme .faq-section,
body.dark-theme .about,
body.dark-theme .banner,
body.dark-theme .service,
body.dark-theme .blog,
body.dark-theme .testimonial,
body.dark-theme .service .nav a,
body.dark-theme .projects .nav-item,
body.dark-theme .language-selector,
body.dark-theme .language-selector select,
body.dark-theme audio,
body.dark-theme .transcriptions {
    transition: background-color 0.35s ease,
                color 0.35s ease,
                border-color 0.35s ease;
}