/*
 * Kely's Tours Plus - mode sombre (noir pur, orienté OLED).
 * Chargé APRÈS style.css et currency.css. Tout est limité à .dark-mode (classe posée sur <html> par theme-script.js).
 * Palette : fond #000, surfaces #0a0a0a / #111, bordures #262626, texte #e6e6e6, texte discret #a3a3a3.
 * Les couleurs de marque (turquoise #0d91a5, rouge #cf3425) sont conservées pour les boutons et accents.
 */
.dark-mode {
  --k-bg: #000;
  --k-surface: #0a0a0a;
  --k-surface-2: #121212;
  --k-border: #262626;
  --k-text: #e6e6e6;
  --k-muted: #a3a3a3;
  --k-accent: #22b5cc;
  color-scheme: dark;
}

/* ---------- Base ---------- */
.dark-mode,
.dark-mode body {
  background: var(--k-bg) !important;
  color: var(--k-text);
}
.dark-mode #loader-wrapper { background: var(--k-bg); }
.dark-mode ::selection { background: var(--k-accent); color: #000; }
.dark-mode body a { color: #f2f2f2; }
.dark-mode body a:hover { color: var(--k-accent); }
.dark-mode body p,
.dark-mode body span,
.dark-mode body li,
.dark-mode body label,
.dark-mode body small { color: var(--k-text); }
.dark-mode body h1, .dark-mode body h2, .dark-mode body h3,
.dark-mode body h4, .dark-mode body h5, .dark-mode body h6,
.dark-mode body .text-dark,
.dark-mode body .home-eight-title { color: #fff !important; }
.dark-mode body .text-gray-5,
.dark-mode body .text-gray-6,
.dark-mode body .text-gray-7,
.dark-mode body .text-muted { color: var(--k-muted) !important; }
.dark-mode hr { border-color: var(--k-border); opacity: 1; }
.dark-mode body .border,
.dark-mode body .border-bottom,
.dark-mode body .border-top,
.dark-mode body .border-start,
.dark-mode body .border-end { border-color: var(--k-border) !important; }

/* ---------- Sections : fond noir, plus aucun dégradé clair ---------- */
.dark-mode .content,
.dark-mode .section,
.dark-mode .deliver-sec,
.dark-mode .trending-list,
.dark-mode .destinations-sec,
.dark-mode .recommended-sec,
.dark-mode .guide-section,
.dark-mode .testimonials-eight,
.dark-mode .article-section,
.dark-mode .clients-sec-eight,
.dark-mode .support-sec-outer {
  background: var(--k-bg) !important;
  background-image: none !important;
}
.dark-mode .why-choose-sec {
  background: var(--k-bg) !important;
  background-image: none !important;
  border-top: 1px solid var(--k-border);
  border-bottom: 1px solid var(--k-border);
}
.dark-mode .why-choose-sec p,
.dark-mode .why-choose-sec h3 { color: var(--k-text) !important; }
.dark-mode .support-section.bg-dark { background: #000 !important; border-top: 1px solid var(--k-border); }
.dark-mode .support-section.bg-primary { background: #07323a !important; }
.dark-mode .support-section h3 { color: #fff !important; }
.dark-mode .bg-white,
.dark-mode .bg-light,
.dark-mode .bg-light-100,
.dark-mode .bg-light-200,
.dark-mode .bg-light-300,
.dark-mode .bg-gray-100,
.dark-mode .bg-gray-200 { background: var(--k-surface) !important; }
.dark-mode .bg-dark:not(.support-section) { background: var(--k-surface-2) !important; }

/* Hero : l'image reste, mais assombrie pour que le texte et la carte ressortent */
.dark-mode .hero-sec-eight { box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.55); }
.dark-mode .breadcrumb-bar { box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.5); }

/* ---------- Cartes et blocs ---------- */
.dark-mode .card,
.dark-mode .banner-form.card,
.dark-mode .guide-list-item,
.dark-mode .guide-content,
.dark-mode .recommended-list-item,
.dark-mode .recommended-content,
.dark-mode .testimonials-item,
.dark-mode .trending-list-item,
.dark-mode .article-item,
.dark-mode .location-wrap,
.dark-mode .accordion-item,
.dark-mode .modal-content {
  background: var(--k-surface) !important;
  border-color: var(--k-border) !important;
  color: var(--k-text);
  box-shadow: none !important;
}
.dark-mode .card.bg-light-200 { background: var(--k-surface) !important; }
.dark-mode .banner-form.card { background: rgba(10, 10, 10, 0.82) !important; backdrop-filter: blur(8px); }
.dark-mode .accordion-button { background: var(--k-surface) !important; color: #fff !important; box-shadow: none; }
.dark-mode .accordion-button:not(.collapsed) { color: var(--k-accent) !important; }
.dark-mode .accordion-button::after { filter: invert(1); }
.dark-mode .avatar.bg-light { background: var(--k-surface-2) !important; }

/* Libellés posés sur les photos (destinations) */
.dark-mode .loc-name-bottom { background: transparent !important; }
.dark-mode .loc-name-bottom h3,
.dark-mode .location-wrap .loc-view-bottom { background: rgba(0, 0, 0, 0.82) !important; border: 1px solid var(--k-border); color: #fff !important; }
.dark-mode .location-wrap .loc-view-bottom i { color: #fff !important; }

/* ---------- Boutons et badges ---------- */
.dark-mode .btn-light,
.dark-mode .btn-white,
.dark-mode .badge.badge-light {
  background: var(--k-surface-2) !important;
  border-color: var(--k-border) !important;
  color: #fff !important;
}
.dark-mode .btn-light:hover,
.dark-mode .btn-white:hover { background: #1c1c1c !important; border-color: var(--k-accent) !important; }
.dark-mode .btn-light span,
.dark-mode .btn-light i { color: #fff !important; }
.dark-mode .btn-dark {
  background: #161616 !important;
  border-color: #333 !important;
  color: #fff !important;
}
.dark-mode .btn-dark:hover { background: #222 !important; border-color: var(--k-accent) !important; }
.dark-mode .btn-primary { color: #fff !important; }
.dark-mode .btn-outline-primary { color: var(--k-accent); border-color: var(--k-accent); }

/* ---------- Formulaires ---------- */
.dark-mode .form-control,
.dark-mode .form-select,
.dark-mode input,
.dark-mode textarea,
.dark-mode select {
  background-color: #0b0b0b !important;
  border-color: #2e2e2e !important;
  color: #f2f2f2 !important;
}
.dark-mode .form-control::placeholder,
.dark-mode textarea::placeholder { color: #737373; }
.dark-mode .form-control:focus,
.dark-mode .form-select:focus,
.dark-mode textarea:focus {
  background-color: #000 !important;
  border-color: var(--k-accent) !important;
  box-shadow: 0 0 0 3px rgba(34, 181, 204, 0.22) !important;
}
.dark-mode .form-select { --bs-form-select-bg-img: none; }
.dark-mode option { background: #0b0b0b; color: #f2f2f2; }
.dark-mode .form-check-input { background-color: #0b0b0b; border-color: #525252; }
.dark-mode .form-check-input:checked { background-color: var(--k-accent); border-color: var(--k-accent); }
.dark-mode .form-label { color: #f2f2f2 !important; }
.dark-mode .invalid-feedback,
.dark-mode .text-danger { color: #ff6b6b !important; }
.dark-mode .form-control.is-invalid,
.dark-mode .form-select.is-invalid { border-color: #ff6b6b !important; }
.dark-mode .alert-success { background: #04210f; border-color: #14532d; color: #86efac; }
.dark-mode .alert-danger { background: #2a0707; border-color: #7f1d1d; color: #fca5a5; }
.dark-mode .alert-info { background: #04222a; border-color: #155e75; color: #a5f3fc; }
.dark-mode .alert * { color: inherit !important; }

/* ---------- En-tête, menu, menu mobile ---------- */
.dark-mode .main-header,
.dark-mode .header-topbar,
.dark-mode header,
.dark-mode header .header-nav {
  background: #000 !important;
  border-color: var(--k-border) !important;
}
.dark-mode body .header-topbar,
.dark-mode body .header-topbar.bg-transparent { background: #000 !important; border-bottom: 1px solid var(--k-border); }
.dark-mode .header-topbar,
.dark-mode .header-topbar a,
.dark-mode .header-topbar span,
.dark-mode .header-topbar i { color: #d4d4d4 !important; }
.dark-mode header .main-nav > li > a { color: #f2f2f2 !important; }
.dark-mode header .main-nav > li > a:hover { color: var(--k-accent) !important; }
.dark-mode header .main-nav > li > a.active { color: #fff !important; }
.dark-mode .header-eight,
.dark-mode header.fixed,
.dark-mode .header-eight.fixed {
  background: rgba(0, 0, 0, 0.78) !important;
  border-color: var(--k-border) !important;
  /* pas de backdrop-filter ici : il rendrait le menu mobile (position: fixed) relatif à l'en-tête */
}
.dark-mode .header-eight .header-nav .main-menu-wrapper .main-nav > li > a { color: #f2f2f2 !important; }
.dark-mode .header-eight .header-nav .main-menu-wrapper .main-nav > li > a:hover,
.dark-mode .header-eight .header-nav .main-menu-wrapper .main-nav > li.active > a,
.dark-mode .header-eight .header-nav .main-menu-wrapper .main-nav > li > a.active { color: #fff !important; }
.dark-mode .main-nav .submenu,
.dark-mode .dropdown-menu {
  background: #0a0a0a !important;
  border: 1px solid var(--k-border) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.8) !important;
}
.dark-mode .main-nav .submenu li a,
.dark-mode .dropdown-item { color: #e6e6e6 !important; }
.dark-mode .main-nav .submenu li a:hover,
.dark-mode .dropdown-item:hover { background: #161616 !important; color: var(--k-accent) !important; }
.dark-mode .offcanvas-info,
.dark-mode .offcanvas-wrap,
.dark-mode .offcanvas-detail { background: #000 !important; }
.dark-mode .offcanvas-info { border-left: 1px solid var(--k-border); }
.dark-mode .mobile-menu a,
.dark-mode .mobile-menu li { color: #f2f2f2 !important; border-color: var(--k-border) !important; }
.dark-mode .offcanvas-close { color: #fff; }
.dark-mode .theme-toggle { color: #fff !important; }

/* Cadres déroulants du menu */
.dark-mode .megamenu-wrapper,
.dark-mode .main-nav .submenu .megamenu-wrapper { background: #0a0a0a !important; }
.dark-mode .main-nav .megamenu-wrapper h6 { color: #fff !important; }
.dark-mode .main-nav .megamenu-wrapper li a { color: #e6e6e6 !important; background: transparent !important; }
.dark-mode .main-nav .megamenu-wrapper li a:hover { color: var(--k-accent) !important; }
.dark-mode .menu-img img { border-color: #262626; box-shadow: none; }

/* Logo : toujours la version claire sur fond noir */
.dark-mode header .header-logo.logo-white,
.dark-mode body header.fixed .header-logo.logo-white { display: flex !important; }
.dark-mode header .header-logo.logo-dark,
.dark-mode body header.fixed .header-logo.logo-dark { display: none !important; }

/* En-tête des pages intérieures (barre du haut + logo) : le template force le blanc via :has() */
.dark-mode .main-header:has(.header-topbar),
.dark-mode .main-header:has(.header-topbar) > header,
.dark-mode .main-header:has(.header-topbar) .header-nav { background: #000 !important; border-color: var(--k-border) !important; }
.dark-mode .main-header:has(.header-topbar) .header-topbar { background-color: #000 !important; border-bottom: 1px solid var(--k-border); }
.dark-mode .main-header:has(.header-topbar) .header-topbar p,
.dark-mode .main-header:has(.header-topbar) .header-topbar p a,
.dark-mode .main-header:has(.header-topbar) .header-topbar .dropdown > a,
.dark-mode .main-header:has(.header-topbar) .header-topbar i { color: #d4d4d4 !important; }
.dark-mode .main-header:has(.header-topbar) header .navbar-logo .header-logo:has(img[src$="kelys-tours-logo-web.png"]) { display: none !important; }
.dark-mode .main-header:has(.header-topbar) header .navbar-logo .header-logo:has(img[src$="kelys-tours-logo-light-web.png"]) { display: flex !important; }

/* ---------- Pied de page ---------- */
.dark-mode .footer-eight,
.dark-mode .footer-eight .footer-top,
.dark-mode .footer-eight .footer-bottom { background: #000 !important; border-color: var(--k-border) !important; }
.dark-mode .footer-eight .footer-top::before,
.dark-mode .footer-eight .footer-top::after { display: none !important; }
.dark-mode .footer-eight .footer-bg { opacity: 0.06; }
.dark-mode .footer-eight .footer-subscribe,
.dark-mode .footer-eight .footer-about,
.dark-mode .footer-eight .customer-info { background: var(--k-surface) !important; border-color: var(--k-border) !important; }
.dark-mode .footer-eight a { color: #d4d4d4; }
.dark-mode .footer-eight a:hover { color: var(--k-accent); }

/* ---------- Sélecteur de devise ---------- */
.dark-mode .kelys-cur__btn,
.dark-mode .kelys-cur__panel { background: #0a0a0a !important; color: #fff !important; border-color: #333 !important; }
.dark-mode .kelys-cur__list a:hover { background: #1a1a1a; }
.dark-mode .kelys-cur__list a.is-active { background: #10343b; }
.dark-mode .kelys-cur__note { color: var(--k-muted); }

/* ---------- Divers ---------- */
.dark-mode .back-to-top-icon { box-shadow: 0 0 0 2px #000; }
.dark-mode table,
.dark-mode .table { --bs-table-bg: transparent; --bs-table-color: var(--k-text); border-color: var(--k-border); }
.dark-mode ::-webkit-scrollbar { width: 12px; height: 12px; }
.dark-mode ::-webkit-scrollbar-track { background: #000; }
.dark-mode ::-webkit-scrollbar-thumb { background: #2b2b2b; border-radius: 6px; border: 2px solid #000; }
.dark-mode ::-webkit-scrollbar-thumb:hover { background: #3d3d3d; }

/* Respecte la préférence « réduire les animations » */
@media (prefers-reduced-motion: reduce) {
  .dark-mode * { transition: none !important; }
}

/* Sélecteur de langue */
.dark-mode .kelys-lang { background: #0a0a0a; border-color: #2a2a2a; }
.dark-mode .kelys-lang__opt { color: #cfcfcf !important; }
.dark-mode .kelys-lang__opt:hover { background: #1a1a1a; color: #fff !important; }
.dark-mode .kelys-lang__opt.is-active { background: linear-gradient(135deg, #12a6bc, #0a7586); color: #fff !important; box-shadow: 0 0 0 1px rgba(34, 181, 204, 0.5), 0 3px 12px rgba(18, 166, 188, 0.3); }
.dark-mode .kelys-lang__opt img { box-shadow: 0 0 0 1px #333; }

/* Pagination (page Hôtels) */
.dark-mode #hl-pages .page-link { background: #0a0a0a !important; border-color: #262626 !important; color: #e6e6e6 !important; }
.dark-mode #hl-pages .page-item.active .page-link { background: #0d91a5 !important; border-color: #0d91a5 !important; color: #fff !important; }
.dark-mode #hl-pages .page-link:hover { background: #1a1a1a !important; }

/* Cartes catégories et pages de catégories */
.dark-mode .kelys-cat { box-shadow: 0 0 0 1px #262626; background: linear-gradient(145deg, #0a0a0a 0%, #0a4452 100%); }
.dark-mode .kelys-cat.is-link:hover { box-shadow: 0 0 0 1px #22b5cc, 0 18px 38px rgba(0, 0, 0, 0.8); }
.dark-mode .kelys-cat__label { color: #fff !important; }
.dark-mode .kelys-cat__go { background: #fff; color: #000 !important; }
.dark-mode .kelys-back { color: #22b5cc !important; }
.dark-mode .kelys-hero-photo, .dark-mode .kelys-thumb { box-shadow: 0 0 0 1px #262626; }
.dark-mode .kelys-nophoto { background: #0a0a0a; border-color: #2a4a52; }
.dark-mode .kelys-nophoto i { color: #22b5cc; }
.dark-mode .kelys-checks i { color: #22b5cc; }

/* Accueil : carte de réservation */
.dark-mode .kelys-book__inner { background: linear-gradient(160deg, rgba(14, 14, 14, .78), rgba(4, 4, 4, .62)); border-color: rgba(255, 255, 255, .14); box-shadow: 0 34px 80px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 255, 255, .12); }
.dark-mode .kelys-book__glow { opacity: .55; }
.dark-mode .kelys-tile { background: rgba(255, 255, 255, .06); border-color: #2a2a2a; color: #f2f2f2 !important; box-shadow: none; }
.dark-mode .kelys-tile__label { color: #f2f2f2 !important; }
.dark-mode .kelys-tile:hover, .dark-mode .kelys-tile:focus-visible { color: #fff !important; background: linear-gradient(150deg, var(--c), var(--c2)); box-shadow: 0 22px 40px -10px var(--c), 0 0 0 1px rgba(255, 255, 255, .3); }
.dark-mode .kelys-tile:hover .kelys-tile__label { color: #fff !important; }
.dark-mode .kelys-book__eyebrow, .dark-mode .kelys-book__note { color: #fff !important; }
.dark-mode .kelys-book__note { color: rgba(255, 255, 255, .85) !important; }