/* ============================================================
   TEMPLATE : NEON (Cyberpunk néon / Interface technique)
   ============================================================
   Override du site pour un look néon sombre avec accents cyan
   et fuchsia. Combiné avec les composants React neon variants
   pour un rendu structurellement différent des autres presets.

   IMPORTANT : Les overrides sont scopés au contenu du site public
   (section, nav, footer, main > article) pour ne PAS saigner
   dans l'interface d'administration (sidebar, SaveBar, modals).
   ============================================================ */

/* ── Variables Globales ── */
[data-theme="neon"] {
    /* Le thème Néon utilise les variables injectées par le CMS.
       On définit ici les tokens spécifiques au style structurel (cyberpunk)
       mais on laisse les couleurs de base être pilotées par l'utilisateur. */

    --radius-main: 0px;
    --radius-card: 0px;
    --radius-button: 0px;
    --shadow-main: 0 0 20px rgba(var(--neon-cyan-rgb), 0.15);
    --shadow-card: 0 0 15px rgba(var(--neon-cyan-rgb), 0.1);
    --border-width: 1px;

    /* Couleurs techniques du thème (Fallbacks si non pilotés par l'utilisateur) */
    --neon-cyan: var(--color-primary, #22d3ee);
    --neon-fuchsia: #d946ef;
    --neon-cyan-rgb: 34, 211, 238;
    --neon-fuchsia-rgb: 217, 70, 239;
}

/* On ne force plus les variables ici pour respecter le panneau de config */
body[data-theme="neon"] {
    background-color: var(--color-bg, #020617) !important;
    background-image: none !important;
}

/* Supprimer les halos/dégradés parasites des autres thèmes (ex: Aurora ou dégradés radiaux globaux) */
/* Cible précisément les divs injectées par l'IA ou les thèmes classiques qui utilisent des gradients radiaux indigo/bleus */
body[data-theme="neon"] .fixed.inset-0.pointer-events-none:not(#neon-grid-overlay),
body[data-theme="neon"] [data-ai-background],
body[data-theme="neon"] .bg-aurora {
    background-image: none !important;
    background-color: transparent !important;
    display: none !important;
}

/* Neutralisation des variables globales héritées */
[data-theme="neon"] {
    --color-bg-gradient: none !important;
    --color-secondary-gradient: none !important;
    --color-primary-gradient: none !important;
}

/* Surcharge des composants de marque (Brand) pour éliminer le vert */
[data-theme="neon"] .bg-brand-primary {
    background-color: var(--color-primary);
}

[data-theme="neon"] .bg-brand-secondary {
    background-color: var(--color-secondary) !important;
}

[data-theme="neon"] .bg-brand-accent {
    background-color: var(--color-accent) !important;
}

[data-theme="neon"] .text-brand-primary {
    color: var(--color-primary) !important;
}

[data-theme="neon"] .text-brand-secondary {
    color: var(--color-text) !important;
}

/* Purge massive du vert 'sage' */
[data-theme="neon"] :is(.bg-sage-50, .bg-sage-100, .bg-sage-200, .bg-sage-300, .bg-sage-400, .bg-sage-500, .bg-sage-600, .bg-sage-700, .bg-sage-800, .bg-sage-900) {
    background-color: var(--color-bg) !important;
}

[data-theme="neon"] :is(.text-sage-50, .text-sage-100, .text-sage-200, .text-sage-300, .text-sage-400, .text-sage-500, .text-sage-600, .text-sage-700, .text-sage-800, .text-sage-900) {
    color: var(--color-text) !important;
}

/* Titres : scopés au site public uniquement */
[data-theme="neon"] section h1,
[data-theme="neon"] section h2,
[data-theme="neon"] section h3,
[data-theme="neon"] section h4,
[data-theme="neon"] footer h1,
[data-theme="neon"] footer h2,
[data-theme="neon"] footer h3,
[data-theme="neon"] footer h4 {
    font-family: 'JetBrains Mono', 'Fira Code', monospace !important;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #f1f5f9 !important;
}

/* Paragraphes et textes : scopés au site public */
[data-theme="neon"] section p,
[data-theme="neon"] section li,
[data-theme="neon"] footer p,
[data-theme="neon"] footer li {
    color: #94a3b8;
}

/* Spans : utiliser :where() pour que les classes Tailwind gagnent */
[data-theme="neon"] :where(section, footer) span:not([class*="text-"]) {
    color: #94a3b8;
}

/* Sélection de texte — accent cyan */
[data-theme="neon"] ::selection {
    background-color: rgba(6, 182, 212, 0.3);
    color: #e2e8f0;
}

/* ── NAVBAR ── */
[data-theme="neon"] nav:not([data-admin-nav]) {
    background: rgba(2, 6, 23, 0.95) !important;
    border-bottom: 1px solid rgba(34, 211, 238, 0.2) !important;
    backdrop-filter: blur(20px) !important;
    box-shadow: 0 0 30px rgba(34, 211, 238, 0.05);
}

[data-theme="neon"] nav:not([data-admin-nav]) a,
[data-theme="neon"] nav:not([data-admin-nav]) span {
    color: #94a3b8 !important;
    font-family: 'JetBrains Mono', monospace !important;
    letter-spacing: 0.15em;
    font-size: 0.8rem !important;
    text-transform: uppercase;
}

[data-theme="neon"] nav:not([data-admin-nav]) a:hover {
    color: var(--neon-cyan) !important;
    text-shadow: 0 0 10px rgba(34, 211, 238, 0.5);
}

/* Logo / titre nav */
[data-theme="neon"] nav:not([data-admin-nav]) img {
    filter: brightness(1.2) contrast(1.1);
}

/* Menu mobile (le menu fullscreen est un fixed.inset-0 spécifique à la nav publique) */
[data-theme="neon"] nav:not([data-admin-nav])+div.fixed {
    background-color: #020617 !important;
}

/* ── SECTIONS — FOND ── */
/* Scopé aux <section> du site, pas aux éléments admin */
[data-theme="neon"] section.bg-white,
[data-theme="neon"] section.bg-gray-50 {
    background: var(--color-bg) !important;
}

[data-theme="neon"] section .bg-white {
    background-color: rgba(15, 23, 42, 0.8) !important;
}

[data-theme="neon"] section .bg-white.shadow-sm,
[data-theme="neon"] section .bg-white.shadow-lg,
[data-theme="neon"] section .bg-white.shadow-xl {
    background-color: rgba(15, 23, 42, 0.9) !important;
    border: 1px solid rgba(34, 211, 238, 0.15) !important;
}

[data-theme="neon"] section .bg-white\/50,
[data-theme="neon"] section .bg-white\/80,
[data-theme="neon"] section .bg-white\/90,
[data-theme="neon"] section .bg-white\/95 {
    background-color: rgba(15, 23, 42, 0.7) !important;
}

[data-theme="neon"] section .bg-sage-50,
[data-theme="neon"] section .bg-sage-50\/30,
[data-theme="neon"] .bg-sage-50\/30 {
    background-color: rgba(34, 211, 238, 0.03) !important;
}

[data-theme="neon"] section .bg-sage-100 {
    background-color: rgba(34, 211, 238, 0.08) !important;
}

[data-theme="neon"] section .bg-sage-900 {
    background: linear-gradient(135deg, rgba(34, 211, 238, 0.08), rgba(217, 70, 239, 0.05)) !important;
    border: 1px solid rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] section .bg-gray-50,
[data-theme="neon"] section .bg-gray-100 {
    background-color: rgba(15, 23, 42, 0.5) !important;
}

[data-theme="neon"] section .bg-\[var\(--color-bg\)\] {
    background-color: #020617 !important;
}

/* ── TEXTES (scopés aux sections du site) ── */
[data-theme="neon"] section .text-gray-600 {
    color: #64748b !important;
}

[data-theme="neon"] section .text-gray-700 {
    color: #94a3b8 !important;
}

[data-theme="neon"] section .text-gray-800 {
    color: #cbd5e1 !important;
}

[data-theme="neon"] section .text-gray-500 {
    color: #64748b !important;
}

[data-theme="neon"] section .text-sage-50 {
    color: #e2e8f0 !important;
}

[data-theme="neon"] section .text-sage-100 {
    color: #cbd5e1 !important;
}

[data-theme="neon"] section .text-sage-200 {
    color: #94a3b8 !important;
}

[data-theme="neon"] section .text-sage-400 {
    color: var(--neon-cyan) !important;
    filter: drop-shadow(0 0 4px rgba(34, 211, 238, 0.4));
}

[data-theme="neon"] section .text-sage-600 {
    color: #94a3b8 !important;
}

[data-theme="neon"] section .text-sage-700 {
    color: var(--neon-cyan) !important;
}

[data-theme="neon"] section .text-sage-800 {
    color: #e2e8f0 !important;
}

[data-theme="neon"] section .text-sage-900 {
    color: #f1f5f9 !important;
}

[data-theme="neon"] section .text-\[var\(--color-text\)\] {
    color: #e2e8f0 !important;
}

/* ── BORDURES (scopées) ── */
[data-theme="neon"] section .border-sage-50,
[data-theme="neon"] section .border-sage-100,
[data-theme="neon"] section .border-sage-200 {
    border-color: rgba(34, 211, 238, 0.1) !important;
}

[data-theme="neon"] section .border-white\/10,
[data-theme="neon"] section .border-white\/20 {
    border-color: rgba(34, 211, 238, 0.15) !important;
}

/* ── IMAGES (scopées) ── */
[data-theme="neon"] section img.rounded-\[var\(--radius-main\)\] {
    border-radius: 0 !important;
    clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}

[data-theme="neon"] section .border-\[var\(--color-secondary\)\] {
    border-color: rgba(34, 211, 238, 0.25) !important;
    border-radius: 0 !important;
}

/* ── BADGES (scopés) ── */
[data-theme="neon"] section span.bg-sage-50 {
    background: rgba(34, 211, 238, 0.08) !important;
    border: 1px solid rgba(34, 211, 238, 0.25) !important;
    border-radius: 0 !important;
    color: var(--neon-cyan) !important;
    font-family: 'JetBrains Mono', monospace !important;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-size: 0.7rem !important;
}

/* ── BOUTONS (scopés au site public) ── */
[data-theme="neon"] section a[href="/contact"],
[data-theme="neon"] main>a[href="/contact"] {
    background: transparent !important;
    border: 1px solid var(--neon-cyan) !important;
    color: var(--neon-cyan) !important;
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-family: 'JetBrains Mono', monospace !important;
    transition: all 0.3s !important;
}

[data-theme="neon"] section a[href="/contact"]:hover {
    background: var(--neon-cyan) !important;
    color: #020617 !important;
    box-shadow: 0 0 25px rgba(34, 211, 238, 0.5);
}

/* ── FORMULAIRES (Global site public) ── */
[data-theme="neon"] .neon-input,
[data-theme="neon"] :is(section, main, .w-full) input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
[data-theme="neon"] :is(section, main, .w-full) textarea,
[data-theme="neon"] :is(section, main, .w-full) select,
[data-theme="neon"] input:-webkit-autofill {
    background: rgba(4, 8, 18, 0.95) !important;
    background-color: rgba(4, 8, 18, 0.95) !important;
    border: 1px solid rgba(34, 211, 238, 0.25) !important;
    border-radius: 4px !important;
    color: #f1f5f9 !important;
    font-family: 'JetBrains Mono', monospace !important;
    transition: all 0.2s ease-in-out !important;
    -webkit-text-fill-color: #f1f5f9 !important;
}

/* Neutralisation RADICALE de l'autofill (Y compris au focus) */
[data-theme="neon"] input:-webkit-autofill,
[data-theme="neon"] input:-webkit-autofill:hover,
[data-theme="neon"] input:-webkit-autofill:focus,
[data-theme="neon"] input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px rgba(2, 6, 23, 1) inset !important;
    -webkit-text-fill-color: #f1f5f9 !important;
    color: #f1f5f9 !important;
    transition: background-color 5000s ease-in-out 0s !important;
}

[data-theme="neon"] .neon-input:focus,
[data-theme="neon"] :is(section, main, .w-full) input:focus,
[data-theme="neon"] :is(section, main, .w-full) textarea:focus,
[data-theme="neon"] :is(section, main, .w-full) select:focus {
    border-color: var(--neon-cyan) !important;
    /* On fusionne le Halo extérieur (Cyan) et le masque intérieur (Noir) pour préserver l'obscurité pendant la saisie */
    box-shadow: 0 0 20px rgba(34, 211, 238, 0.4), 0 0 0 1000px rgba(2, 6, 23, 1) inset !important;
    background-color: #020617 !important;
    color: #f1f5f9 !important;
    -webkit-text-fill-color: #f1f5f9 !important;
    outline: none !important;
    caret-color: var(--neon-cyan) !important;
}

/* Cas particulier : Icônes dans les inputs (Login, etc.) */
[data-theme="neon"] :is(section, main) .relative svg {
    color: var(--neon-cyan) !important;
    filter: drop-shadow(0 0 5px rgba(34, 211, 238, 0.4));
}

/* Bouton oeil PasswordInput — scopé aux champs input uniquement */
[data-theme="neon"] .relative:has(> input) button svg {
    color: #94a3b8 !important;
}

[data-theme="neon"] .relative:has(> input) button:hover svg {
    color: var(--neon-cyan) !important;
}

/* ── CONTACT PAGE ── */
[data-theme="neon"] section form.bg-white,
[data-theme="neon"] main form {
    background: rgba(15, 23, 42, 0.9) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(34, 211, 238, 0.3) !important;
    border-radius: 8px !important;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="neon"] section button.bg-\[var\(--color-secondary\)\] {
    background: transparent !important;
    border: 1px solid var(--neon-cyan) !important;
    color: var(--neon-cyan) !important;
    border-radius: 0 !important;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-family: 'JetBrains Mono', monospace !important;
}

[data-theme="neon"] section button.bg-\[var\(--color-secondary\)\]:hover {
    background: var(--neon-cyan) !important;
    color: #020617 !important;
    box-shadow: 0 0 20px rgba(34, 211, 238, 0.4);
}

/* ── PRICING (scopé) ── */
[data-theme="neon"] section .rounded-\[3rem\] {
    border-radius: 0 !important;
}

[data-theme="neon"] section div[class*="bg-white"][class*="rounded-[3rem]"] {
    background: rgba(15, 23, 42, 0.95) !important;
    border: 1px solid rgba(34, 211, 238, 0.15) !important;
}

[data-theme="neon"] section .bg-sage-800 {
    background: rgba(34, 211, 238, 0.1) !important;
    border-bottom: 1px solid rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] section .bg-sage-800 h3,
[data-theme="neon"] section .bg-sage-800 span,
[data-theme="neon"] section .bg-sage-800 p {
    color: #f1f5f9 !important;
}

/* ── USER DASHBOARD (Profil & Booking) ── */
[data-theme="neon"] :is(main, section, div) .bg-white.rounded-xl.border-gray-100 {
    background: rgba(15, 23, 42, 0.95) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(34, 211, 238, 0.15) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="neon"] :is(main, section, div) .bg-gray-50,
[data-theme="neon"] :is(main, section, div) .bg-gray-100,
[data-theme="neon"] :is(main, section, div) .bg-gray-50\/50 {
    background: rgba(4, 8, 18, 0.5) !important;
    border: 1px solid rgba(34, 211, 238, 0.1) !important;
}

[data-theme="neon"] :is(main, section, div) .text-gray-800,
[data-theme="neon"] :is(main, section, div) h4.text-gray-800 {
    color: #f1f5f9 !important;
}

[data-theme="neon"] :is(main, section, div) .text-gray-500,
[data-theme="neon"] :is(main, section, div) .text-gray-400 {
    color: #94a3b8 !important;
}

[data-theme="neon"] :is(main, section, div) .border-gray-50,
[data-theme="neon"] :is(main, section, div) .border-gray-100,
[data-theme="neon"] :is(main, section, div) .border-gray-200 {
    border-color: rgba(34, 211, 238, 0.1) !important;
}

/* Badges et Labels dans le dashboard */
[data-theme="neon"] :is(main, section, div) .bg-blue-50 {
    background: rgba(34, 211, 238, 0.1) !important;
    color: var(--neon-cyan) !important;
    border: 1px solid rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] :is(main, section, div) .bg-purple-50 {
    background: rgba(34, 211, 238, 0.05) !important;
    color: #bc13fe !important;
    border: 1px solid rgba(188, 19, 254, 0.2) !important;
}

[data-theme="neon"] :is(main, section, div) .bg-yellow-50 {
    background: rgba(234, 179, 8, 0.1) !important;
    color: #eab308 !important;
    border: 1px solid rgba(234, 179, 8, 0.2) !important;
}

[data-theme="neon"] :is(main, section, div) .bg-green-50 {
    background: rgba(34, 197, 94, 0.1) !important;
    color: #22c55e !important;
}

/* Boutons d'action dans les cartes (Edit/Delete) */
[data-theme="neon"] .group-hover\:opacity-100 button {
    background: rgba(4, 8, 18, 0.8) !important;
    border: 1px solid rgba(34, 211, 238, 0.1) !important;
    color: #94a3b8 !important;
}

[data-theme="neon"] .group-hover\:opacity-100 button:hover {
    border-color: var(--neon-cyan) !important;
    color: var(--neon-cyan) !important;
    box-shadow: 0 0 10px rgba(34, 211, 238, 0.3);
}

/* ── CONFIGURATEUR TOOLBAR (LivePreview) ── */
/* ── CONFIGURATEUR TOOLBAR (LivePreview) scopé Néon ── */
[data-theme="neon"] [data-preview-toolbar] {
    background: #020617 !important;
    border-bottom: 1px solid rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] [data-preview-toolbar] button {
    border-radius: 0 !important;
    transition: all 0.2s ease !important;
}

[data-theme="neon"] [data-preview-toolbar] button[class*="bg-indigo-50"] {
    background: var(--neon-cyan) !important;
    color: #020617 !important;
}

[data-theme="neon"] [data-preview-toolbar] .bg-slate-100 {
    background: rgba(15, 23, 42, 0.8) !important;
    border: 1px solid rgba(34, 211, 238, 0.2);
}

[data-theme="neon"] [data-preview-toolbar] .bg-slate-100 button[class*="bg-white"] {
    background: var(--neon-cyan) !important;
    color: #020617 !important;
    box-shadow: 0 0 15px rgba(34, 211, 238, 0.4) !important;
}

/* ── SIDEBAR STYLE EDITOR (Tabs) ── */
/* ── SIDEBAR STYLE EDITOR (Global Durcissement) ── */
[data-theme="neon"] [data-style-panel],
[data-theme="neon"] [data-style-panel] *,
[data-theme="neon"] [data-style-tabs],
[data-theme="neon"] [data-style-tabs] *,
[data-theme="neon"] button,
[data-theme="neon"] .rounded-xl,
[data-theme="neon"] .rounded-lg,
[data-theme="neon"] .rounded-md {
    border-radius: 0 !important;
    /* Reset TOTAL et INCONTESTABLE des arrondis sur TOUTE l'interface admin Neon */
}

/* Suppression des forçages globaux destructeurs. Les classes Tailwind géreront les états actifs/inactifs. */
[data-theme="neon"] [data-neon-group] {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

/* Direction par défaut: Row */
[data-theme="neon"] [data-neon-group] {
    flex-direction: row;
}

/* Direction: Column */
[data-theme="neon"] [data-neon-group][data-neon-column] {
    flex-direction: column !important;
}

[data-theme="neon"] [data-neon-group]>* {
    margin: 0 !important;
    border-radius: 0 !important;
    border-right-width: 1px !important;
    border-right-color: rgba(34, 211, 238, 0.5) !important;
    /* Bordure TRES visible pour détacher les éléments */
    border-bottom-width: 0 !important;
}

[data-theme="neon"] [data-neon-group][data-neon-column]>* {
    border-right-width: 0 !important;
    border-bottom-width: 1px !important;
    border-bottom-color: rgba(34, 211, 238, 0.5) !important;
    /* Bordure TRES visible */
}

[data-theme="neon"] [data-neon-group]>*+* {
    margin: 0 !important;
}

[data-theme="neon"] [data-neon-group]>*:last-child {
    border-right-width: 0 !important;
    border-bottom-width: 0 !important;
}

/* Forçage spécifique Onglets Sidebar */
[data-theme="neon"] [data-style-tabs] button {
    border-left-width: 1px !important;
    border-left-color: rgba(34, 211, 238, 0.1) !important;
    border-bottom-width: 2px !important;
}

[data-theme="neon"] [data-style-tabs] button:first-child {
    border-left-width: 0 !important;
}

/* Style Scrollbars Sidepanel Neon */
[data-theme="neon"] [data-style-panel] *::-webkit-scrollbar {
    width: 4px;
}

[data-theme="neon"] [data-style-panel] *::-webkit-scrollbar-track {
    background: transparent;
}

[data-theme="neon"] [data-style-panel] *::-webkit-scrollbar-thumb {
    background: #1e293b;
    border-radius: 0;
}

[data-theme="neon"] [data-style-panel] *::-webkit-scrollbar-thumb:hover {
    background: var(--neon-cyan);
}

/* ── SLIDERS NEON (Range Inputs) ── */
[data-theme="neon"] [data-style-panel] input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    background: #0f172a !important;
    height: 4px;
    border-radius: 0;
    outline: none;
}

[data-theme="neon"] [data-style-panel] input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    background: var(--neon-cyan);
    cursor: pointer;
    box-shadow: 0 0 10px var(--neon-cyan);
}

[data-theme="neon"] [data-style-panel] input[type="range"]::-moz-range-thumb {
    width: 14px;
    height: 14px;
    background: var(--neon-cyan);
    cursor: pointer;
    border: none;
    box-shadow: 0 0 10px var(--neon-cyan);
}

[data-theme="neon"] [data-style-tabs] button:not(.bg-indigo-50\/50),
[data-theme="neon"] [data-preview-toolbar] button:not(.bg-indigo-50):not(.bg-white) {
    color: rgba(34, 211, 238, 0.8) !important;
    /* Cyan vibrant même inactif */
}

[data-theme="neon"] [data-style-tabs] button:not(.bg-indigo-50\/50) *,
[data-theme="neon"] [data-preview-toolbar] button:not(.bg-indigo-50):not(.bg-white) * {
    color: rgba(34, 211, 238, 0.8) !important;
    stroke: rgba(34, 211, 238, 0.8) !important;
}

[data-theme="neon"] [data-style-tabs] button:not(.bg-indigo-50\/50):hover,
[data-theme="neon"] [data-preview-toolbar] button:not(.bg-indigo-50):not(.bg-white):hover {
    background: rgba(34, 211, 238, 0.1) !important;
    color: var(--neon-cyan) !important;
}

[data-theme="neon"] [data-style-tabs] button:not(.bg-indigo-50\/50):hover *,
[data-theme="neon"] [data-preview-toolbar] button:not(.bg-indigo-50):not(.bg-white):hover * {
    color: var(--neon-cyan) !important;
    stroke: var(--neon-cyan) !important;
}

/* ── SWITCHS NEON (Toggles) ── */
[data-theme="neon"] [data-style-panel] [role="switch"] {
    background-color: #0f172a !important;
    /* OFF default */
    border-color: rgba(34, 211, 238, 0.1) !important;
    transition: all 0.3s ease !important;
}

[data-theme="neon"] [data-style-panel] [role="switch"][aria-checked="true"] {
    background-color: var(--neon-cyan) !important;
    /* ON */
    box-shadow: 0 0 10px rgba(34, 211, 238, 0.4);
}

[data-theme="neon"] [data-style-panel] [role="switch"] span {
    background-color: #94a3b8 !important;
    /* Thumb OFF */
    transition: all 0.3s ease !important;
}

[data-theme="neon"] [data-style-panel] [role="switch"][aria-checked="true"] span {
    background-color: #020617 !important;
    /* Thumb ON */
}

[data-theme="neon"] [data-style-panel] {
    background: #020617 !important;
    border-color: rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] [data-style-panel] .border-b {
    border-bottom-color: rgba(34, 211, 238, 0.15) !important;
}

/* ── FOOTER ── */
[data-theme="neon"] footer {
    background: #020617 !important;
    border-top: 1px solid rgba(34, 211, 238, 0.15) !important;
}

[data-theme="neon"] footer h4 {
    border-color: rgba(34, 211, 238, 0.2) !important;
    color: var(--neon-cyan) !important;
    text-shadow: 0 0 8px rgba(34, 211, 238, 0.3);
    position: relative;
    padding-top: 10px;
    /* Espace pour la barre supérieure */
    border-bottom: none !important;
    /* On remplace la bordure basse par un style plus neon */
}

/* Barre de décoration Cyberpunk au-dessus des titres du footer */
[data-theme="neon"] footer h4::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 2px;
    background: var(--neon-cyan);
    box-shadow: 0 0 10px var(--neon-cyan);
}

[data-theme="neon"] footer a {
    color: #64748b !important;
}

[data-theme="neon"] footer a:hover {
    color: var(--neon-cyan) !important;
    text-shadow: 0 0 8px rgba(34, 211, 238, 0.4);
}

[data-theme="neon"] footer .bg-white {
    background-color: rgba(15, 23, 42, 0.8) !important;
}

/* ── PROSE (scopé) ── */
[data-theme="neon"] section .prose,
[data-theme="neon"] footer .prose {
    color: #94a3b8 !important;
}

[data-theme="neon"] section .prose strong,
[data-theme="neon"] footer .prose strong {
    color: #f1f5f9 !important;
}

[data-theme="neon"] section .prose a {
    color: var(--neon-cyan) !important;
}

/* ── SCROLLBAR ── */
[data-theme="neon"]::-webkit-scrollbar {
    width: 4px;
}

[data-theme="neon"]::-webkit-scrollbar-track {
    background: #020617;
}

[data-theme="neon"]::-webkit-scrollbar-thumb {
    background: rgba(34, 211, 238, 0.3);
    border-radius: 0;
}

/* ── GRILLE DE FOND (visible par-dessus les sections) ── */
/* On utilise un élément dédié via ThemeBodyClass pour éviter les conflits pseudo-éléments */

/* ── MODALS PUBLICS (cookie consent, contact) ── */
[data-theme="neon"] .bg-white\/90.backdrop-blur-xl {
    background-color: rgba(15, 23, 42, 0.9) !important;
}

/* ── BOUTON FLOTTANT ── */
[data-theme="neon"] .fixed.bottom-6.right-6 a {
    border-radius: 0 !important;
    box-shadow: 0 0 15px rgba(34, 211, 238, 0.3);
}

/* ── ANIMATIONS ── */
@keyframes neonGlow {

    0%,
    100% {
        box-shadow: 0 0 5px rgba(34, 211, 238, 0.2);
    }

    50% {
        box-shadow: 0 0 20px rgba(34, 211, 238, 0.4);
    }
}

@keyframes scanLine {
    0% {
        transform: translateY(-100%);
    }

    100% {
        transform: translateY(100vh);
    }
}

/* Ligne de scan subtile — uniquement sur le site public */
[data-theme="neon"]::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(34, 211, 238, 0.15), transparent);
    animation: scanLine 8s linear infinite;
    pointer-events: none;
    z-index: 9998;
}

/* ── Rounded elements → sharp (scopé aux sections du site) ── */
[data-theme="neon"] section .rounded-full:not(.w-1):not(.w-1\.5):not(.w-2) {
    border-radius: 0 !important;
}

[data-theme="neon"] section .rounded-2xl,
[data-theme="neon"] section .rounded-3xl,
[data-theme="neon"] section .rounded-xl,
[data-theme="neon"] section .rounded-lg,
[data-theme="neon"] footer .rounded-2xl,
[data-theme="neon"] footer .rounded-xl {
    border-radius: 0 !important;
}

/* ── PAGES DYNAMIQUES (articles, slug pages) ── */
/* On laisse le background de la page visible (inline style) */
[data-theme="neon"] main.min-h-screen {
    background-color: transparent !important;
    background-image: inherit !important;
}

/* ════════════════════════════════════════════════════════════
   ADMIN : adaptation des panneaux pour le thème neon
   Le body est sombre (#020617), les panneaux bg-white doivent
   s'adapter. On exclut le panneau d'édition [data-style-panel]
   qui garde ses propres styles.
   ════════════════════════════════════════════════════════════ */

/* Couleur de texte par défaut dans le contenu admin */
[data-theme="neon"] main {
    color: #e2e8f0;
}

/* Panneaux blancs → fond sombre avec bordure neon */
[data-theme="neon"] main .bg-white {
    background-color: rgba(15, 23, 42, 0.9);
    border-color: rgba(34, 211, 238, 0.12);
}

/* Input/select dans les pages admin : fond sombre + texte clair */
[data-theme="neon"] main input:not([type="color"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
[data-theme="neon"] main textarea,
[data-theme="neon"] main select {
    background-color: rgba(2, 6, 23, 0.6);
    color: #e2e8f0;
    border-color: rgba(34, 211, 238, 0.15);
}

/* Labels et headings admin */
[data-theme="neon"] main h1,
[data-theme="neon"] main h2,
[data-theme="neon"] main h3 {
    color: #f1f5f9;
}

[data-theme="neon"] main label {
    color: #cbd5e1;
}

/* Textes gris admin → plus clairs */
[data-theme="neon"] main .text-gray-400,
[data-theme="neon"] main .text-gray-500 {
    color: #64748b;
}

[data-theme="neon"] main .text-gray-800,
[data-theme="neon"] main .text-gray-900,
[data-theme="neon"] main .text-slate-800,
[data-theme="neon"] main .text-slate-900 {
    color: #e2e8f0;
}

[data-theme="neon"] main .text-slate-500,
[data-theme="neon"] main .text-slate-600,
[data-theme="neon"] main .text-slate-700 {
    color: #94a3b8;
}

/* bg-gray dans admin */
[data-theme="neon"] main .bg-gray-50,
[data-theme="neon"] main .bg-gray-100 {
    background-color: rgba(15, 23, 42, 0.5);
}

/* bg-slate dans admin */
[data-theme="neon"] main .bg-slate-50,
[data-theme="neon"] main .bg-slate-100 {
    background-color: rgba(15, 23, 42, 0.4);
}

/* ── ADAPTATION SPÉCIFIQUE GESTION RDV & MES COMPAGNONS ── */
[data-theme="neon"] :is(.bg-white, .bg-gray-50, .bg-slate-50) {
    --color-surface: rgba(15, 23, 42, 0.8);
    --color-card-bg: rgba(15, 23, 42, 0.8);
}

/* Forçage du fond sombre sur les conteneurs principaux de réservation */
[data-theme="neon"] main :is(.bg-white, .bg-gray-50, .bg-slate-50, .bg-gray-50\/50) {
    background-color: rgba(15, 23, 42, 0.8) !important;
    backdrop-filter: blur(12px);
    border-color: rgba(34, 211, 238, 0.15) !important;
    color: #e2e8f0;
}

/* Header "Bonjour, Loïc" et autres headers de section */
[data-theme="neon"] main .bg-white.p-4.md\:p-6.rounded-xl,
[data-theme="neon"] main .bg-white.rounded-2xl.md\:rounded-3xl.shadow-soft {
    background-color: rgba(15, 23, 42, 0.9) !important;
    border: 1px solid rgba(34, 211, 238, 0.2) !important;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.4), 0 0 10px rgba(34, 211, 238, 0.05) !important;
}

/* Cards dans le Dashboard (Next Appointment, etc.) */
[data-theme="neon"] main .bg-white.rounded-xl.md\:rounded-2xl.shadow-soft.p-3 {
    background-color: rgba(2, 6, 23, 0.6) !important;
    border: 1px solid rgba(34, 211, 238, 0.15) !important;
}

/* Éléments de liste et items secondaires */
[data-theme="neon"] main :is(.bg-gray-50, .bg-slate-50, .bg-slate-900\/50, .bg-gray-50\/50) {
    background-color: rgba(2, 6, 23, 0.4) !important;
    border-color: rgba(34, 211, 238, 0.1) !important;
}

/* Textes de titres dans les panneaux */
[data-theme="neon"] main :is(h1, h2, h3, h4).text-gray-900,
[data-theme="neon"] main :is(h1, h2, h3, h4).text-gray-800 {
    color: #f1f5f9 !important;
    text-shadow: 0 0 8px rgba(34, 211, 238, 0.2);
}

/* Gradiants personnalisés (Compagnons) - On les laisse passer ou on les atténue */
[data-theme="neon"] .bg-gradient-to-br.from-gray-50.to-gray-100 {
    background-image: linear-gradient(to bottom right, rgba(15, 23, 42, 0.6), rgba(2, 6, 23, 0.8)) !important;
}

/* Boutons secondaires dans l'admin */
[data-theme="neon"] main .bg-brand-primary\/10 {
    background-color: rgba(34, 211, 238, 0.1) !important;
    color: #22d3ee !important;
}

/* Fonds colorés de section (Information, Danger, Warning) */
[data-theme="neon"] main .bg-blue-50 {
    background-color: rgba(30, 58, 138, 0.2) !important;
    border-color: rgba(34, 211, 238, 0.3) !important;
    color: #93c5fd !important;
}

[data-theme="neon"] main .bg-red-50 {
    background-color: rgba(127, 29, 29, 0.2) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
    color: #fca5a5 !important;
}

[data-theme="neon"] main .bg-yellow-50 {
    background-color: rgba(120, 53, 15, 0.2) !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
    color: #fcd34d !important;
}

[data-theme="neon"] main :is(.text-blue-900, .text-blue-700, .text-red-900, .text-red-600, .text-yellow-900, .text-yellow-800) {
    color: currentColor !important;
}

/* ── STATISTIQUES & DASHBOARD ADMIN ── */
[data-theme="neon"] main .grid .bg-white.p-6.rounded-2xl {
    background-color: rgba(15, 23, 42, 0.7) !important;
    border-color: rgba(34, 211, 238, 0.15) !important;
}

[data-theme="neon"] main .bg-emerald-600.bg-opacity-10,
[data-theme="neon"] main .bg-indigo-600.bg-opacity-10,
[data-theme="neon"] main .bg-red-600.bg-opacity-10 {
    background-color: rgba(34, 211, 238, 0.1) !important;
}

[data-theme="neon"] main :is(.text-emerald-600, .text-indigo-600, .text-red-600) {
    color: #22d3ee !important;
}

[data-theme="neon"] main .text-3xl.font-display.font-bold.text-gray-900 {
    color: #f1f5f9 !important;
}

[data-theme="neon"] main .bg-gray-100.p-1.rounded-xl {
    background-color: rgba(2, 6, 23, 0.6) !important;
}

[data-theme="neon"] main .bg-white.text-brand-primary.shadow-sm {
    background-color: rgba(34, 211, 238, 0.2) !important;
    color: #22d3ee !important;
}

[data-theme="neon"] main .h-2.bg-gray-100.rounded-full {
    background-color: rgba(15, 23, 42, 0.8) !important;
}

[data-theme="neon"] main .bg-emerald-500.rounded-full {
    background-color: #22d3ee !important;
    box-shadow: 0 0 10px rgba(34, 211, 238, 0.4);
}

[data-theme="neon"] main .bg-indigo-50\/50,
[data-theme="neon"] main .bg-indigo-50 {
    background-color: rgba(34, 211, 238, 0.05) !important;
    border-color: rgba(34, 211, 238, 0.1) !important;
}

/* Fix spécifique pour les boutons d'historique et modifier dans les tableaux */
[data-theme="neon"] main .bg-white.border.border-gray-200.hover\:border-indigo-300 {
    background-color: rgba(2, 6, 23, 0.4) !important;
    border-color: rgba(34, 211, 238, 0.2) !important;
    color: #94a3b8 !important;
}

[data-theme="neon"] main .bg-white.border.border-gray-200.hover\:border-indigo-300:hover {
    background-color: rgba(34, 211, 238, 0.1) !important;
    border-color: #22d3ee !important;
    color: #22d3ee !important;
}

/* ── APPOINTMENT CALENDAR ── */
[data-theme="neon"] .bg-white.rounded-xl.md\:rounded-2xl.shadow-soft.p-4.md\:p-8 {
    background-color: rgba(15, 23, 42, 0.7) !important;
    border-color: rgba(34, 211, 238, 0.15) !important;
    backdrop-filter: blur(12px);
}

[data-theme="neon"] .text-2xl.font-display.font-bold.text-gray-800 {
    color: #f1f5f9 !important;
}

[data-theme="neon"] .bg-brand-warm {
    background-color: rgba(34, 211, 238, 0.1) !important;
}

[data-theme="neon"] .text-brand-primary {
    color: #22d3ee !important;
}

/* En-têtes de jours */
[data-theme="neon"] .bg-gray-50.border-gray-100,
[data-theme="neon"] .bg-gray-100.border-gray-200.opacity-60 {
    background-color: rgba(2, 6, 23, 0.6) !important;
    border-color: rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] .text-gray-800 {
    color: #f1f5f9 !important;
}

[data-theme="neon"] .text-gray-500 {
    color: #94a3b8 !important;
}

/* Slots du calendrier */
[data-theme="neon"] .bg-slate-50.text-slate-400.border.border-slate-200 {
    background-color: rgba(15, 23, 42, 0.4) !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
    color: #475569 !important;
}

[data-theme="neon"] .bg-gray-50\/50.rounded-xl.border-2.border-dashed.border-gray-200 {
    background-color: rgba(15, 23, 42, 0.2) !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

/* Contrôles du calendrier */
[data-theme="neon"] .bg-gray-50.rounded-full.p-1.border.border-gray-200 {
    background-color: rgba(15, 23, 42, 0.8) !important;
    border-color: rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] .text-gray-700.capitalize {
    color: #22d3ee !important;
}

[data-theme="neon"] .bg-indigo-50.hover\:bg-indigo-100.text-indigo-600 {
    background-color: rgba(34, 211, 238, 0.15) !important;
    color: #22d3ee !important;
    border-color: rgba(34, 211, 238, 0.3) !important;
}

[data-theme="neon"] .bg-gray-100.p-1.rounded-lg {
    background-color: rgba(2, 6, 23, 0.8) !important;
}

[data-theme="neon"] .bg-white.text-gray-800.shadow-sm {
    background-color: rgba(34, 211, 238, 0.2) !important;
    color: #22d3ee !important;
}

/* Légende */
[data-theme="neon"] .bg-gray-50.rounded-xl.p-3.border.border-gray-100 {
    background-color: rgba(15, 23, 42, 0.5) !important;
    border-color: rgba(34, 211, 238, 0.1) !important;
}

[data-theme="neon"] .text-gray-600 {
    color: #94a3b8 !important;
}

/* ── GESTION DE L'ÉQUIPE & HORAIRES COACHS ── */
[data-theme="neon"] main .bg-white.rounded-xl.border.p-4.shadow-sm {
    background-color: rgba(15, 23, 42, 0.7) !important;
    border-color: rgba(34, 211, 238, 0.15) !important;
}

[data-theme="neon"] main .bg-white.rounded-xl.border.p-4.shadow-sm:hover {
    border-color: rgba(34, 211, 238, 0.4) !important;
}

[data-theme="neon"] main .text-gray-900.truncate {
    color: #f1f5f9 !important;
}

[data-theme="neon"] main .bg-purple-100.text-purple-700 {
    background-color: rgba(168, 85, 247, 0.15) !important;
    color: #c084fc !important;
}

[data-theme="neon"] main .bg-blue-100.text-blue-700 {
    background-color: rgba(34, 211, 238, 0.15) !important;
    color: #22d3ee !important;
}

[data-theme="neon"] main .bg-green-50.text-green-700 {
    background-color: rgba(34, 197, 94, 0.15) !important;
    color: #4ade80 !important;
    border-color: rgba(34, 197, 94, 0.2) !important;
}

/* Toggle switch neon */
[data-theme="neon"] main .bg-green-500 {
    background-color: #06b6d4 !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.4);
}

[data-theme="neon"] main .bg-gray-300 {
    background-color: rgba(15, 23, 42, 0.8) !important;
}

/* Éditeur d'horaires */
[data-theme="neon"] main .bg-green-100.text-green-800.border-green-200 {
    background-color: rgba(34, 197, 94, 0.2) !important;
    color: #4ade80 !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
}

[data-theme="neon"] main .bg-gray-50.text-gray-400.border-transparent {
    background-color: rgba(15, 23, 42, 0.4) !important;
    color: #475569 !important;
}

[data-theme="neon"] main .bg-gray-50.text-gray-400.border-transparent:hover {
    background-color: rgba(15, 23, 42, 0.6) !important;
}

[data-theme="neon"] main .bg-white.p-2.bg-white.flex.flex-col {
    background-color: transparent !important;
}

/* ── PET CARD ── */
[data-theme="neon"] .bg-white.rounded-2xl.p-4.border.border-gray-100.shadow-sm.hover\:shadow-md {
    background-color: rgba(15, 23, 42, 0.7) !important;
    border-color: rgba(34, 211, 238, 0.15) !important;
}

[data-theme="neon"] .text-gray-800.font-bold {
    color: #f1f5f9 !important;
}

[data-theme="neon"] .bg-gray-50.rounded-xl.p-3.mt-3 {
    background-color: rgba(2, 6, 23, 0.5) !important;
}

/* Cartes de statistiques Admin */
[data-theme="neon"] .bg-white.p-5.rounded-2xl.shadow-soft.border.border-gray-100 {
    background-color: rgba(15, 23, 42, 0.8) !important;
    border-color: rgba(34, 211, 238, 0.2) !important;
    backdrop-filter: blur(12px);
}

[data-theme="neon"] .text-3xl.font-display.font-bold.text-gray-900 {
    color: #ffffff !important;
    text-shadow: 0 0 10px rgba(34, 211, 238, 0.3);
}

[data-theme="neon"] .text-sm.font-medium.text-gray-500 {
    color: #94a3b8 !important;
}

/* Barres de progression */
[data-theme="neon"] .bg-gray-100.rounded-full {
    background-color: rgba(15, 23, 42, 0.9) !important;
}

[data-theme="neon"] .bg-brand-primary.h-2 {
    background: linear-gradient(90deg, #06b6d4, #22d3ee) !important;
    box-shadow: 0 0 8px rgba(34, 211, 238, 0.5);
}

/* ── OVERRIDES GÉNÉRAUX DES CONTENEURS & INPUTS ── */
[data-theme="neon"] main .bg-white:not(button):not(.bg-brand-primary),
[data-theme="neon"] main .bg-gray-50,
[data-theme="neon"] main .bg-slate-50,
[data-theme="neon"] main .bg-indigo-50 {
    background-color: rgba(15, 23, 42, 0.6) !important;
    border-color: rgba(34, 211, 238, 0.15) !important;
}

[data-theme="neon"] main input,
[data-theme="neon"] main select,
[data-theme="neon"] main textarea {
    background-color: rgba(2, 6, 23, 0.8) !important;
    color: #f1f5f9 !important;
    border-color: rgba(34, 211, 238, 0.2) !important;
}

[data-theme="neon"] main input:focus,
[data-theme="neon"] main select:focus,
[data-theme="neon"] main textarea:focus {
    border-color: #22d3ee !important;
    box-shadow: 0 0 0 2px rgba(34, 211, 238, 0.1) !important;
}

[data-theme="neon"] main .text-gray-800,
[data-theme="neon"] main .text-gray-700,
[data-theme="neon"] main .text-slate-700 {
    color: #f1f5f9 !important;
}

[data-theme="neon"] main .text-gray-500,
[data-theme="neon"] main .text-slate-500,
[data-theme="neon"] main .text-gray-400 {
    color: #94a3b8 !important;
}

/* Modals & Portals */
[data-theme="neon"] .fixed.inset-0.z-\[9999\] .bg-white {
    background-color: rgba(15, 23, 42, 0.95) !important;
    border-color: rgba(34, 211, 238, 0.3) !important;
    backdrop-filter: blur(20px);
}

[data-theme="neon"] .fixed.inset-0.z-\[9999\] .text-gray-800,
[data-theme="neon"] .fixed.inset-0.z-\[9999\] .text-gray-900 {
    color: #f1f5f9 !important;
}

/* ── ADAPTATION DES PANNEAUX ADMIN (STYLE EDITOR & SIDEBARS) ── */
/* Scopé sous [data-theme="neon"] pour ne pas impacter les autres thèmes */
[data-theme="neon"] [data-style-panel],
[data-theme="neon"] [data-style-panel]>div,
[data-theme="neon"] [data-style-panel] .bg-white {
    background-color: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-color: rgba(34, 211, 238, 0.2);
    color: #e2e8f0;
}

/* Forçage spécifique pour les conteneurs internes */
[data-theme="neon"] [data-style-panel] .bg-slate-50,
[data-theme="neon"] [data-style-panel] .bg-gray-50,
[data-theme="neon"] [data-style-panel] .bg-indigo-50,
[data-theme="neon"] [data-style-panel] .bg-white\/50,
[data-theme="neon"] [data-style-panel] .bg-slate-50\/50,
[data-theme="neon"] [data-style-panel] .bg-blue-50,
[data-theme="neon"] [data-style-panel] .bg-amber-50,
[data-theme="neon"] [data-style-panel] .bg-teal-50 {
    background-color: rgba(2, 6, 23, 0.4);
    border-color: rgba(34, 211, 238, 0.1);
    color: #f1f5f9;
}

/* Bordures intérieures */
[data-theme="neon"] [data-style-panel] .border-b,
[data-theme="neon"] [data-style-panel] .border-t,
[data-theme="neon"] [data-style-panel] .border,
[data-theme="neon"] [data-style-panel] .border-slate-100,
[data-theme="neon"] [data-style-panel] .border-slate-200,
[data-theme="neon"] [data-style-panel] .border-blue-100,
[data-theme="neon"] [data-style-panel] .border-teal-100,
[data-theme="neon"] [data-style-panel] .border-amber-100 {
    border-color: rgba(34, 211, 238, 0.2);
}

/* Inputs / Selects / Textareas */
[data-theme="neon"] [data-style-panel] input:not([type="color"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
[data-theme="neon"] [data-style-panel] textarea,
[data-theme="neon"] [data-style-panel] select {
    background-color: rgba(2, 6, 23, 0.8);
    color: #22d3ee;
    border: 1px solid rgba(34, 211, 238, 0.3);
    border-radius: 4px;
    text-align: center;
    font-family: 'JetBrains Mono', monospace;
}

/* Centrage spécifique pour les ColorInputs */
[data-theme="neon"] [data-style-panel] .font-mono.text-center {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Tabs / Onglets */
[data-theme="neon"] [data-style-panel] .border-indigo-600 {
    border-color: #22d3ee;
    background-color: rgba(34, 211, 238, 0.1);
    color: #22d3ee;
}

[data-theme="neon"] [data-style-panel] .text-slate-500 {
    color: #94a3b8;
}

/* Titres (Néon Cyan) */
[data-theme="neon"] [data-style-panel] h1,
[data-theme="neon"] [data-style-panel] h2,
[data-theme="neon"] [data-style-panel] h3,
[data-theme="neon"] [data-style-panel] h4,
[data-theme="neon"] [data-style-panel] h5,
[data-theme="neon"] [data-style-panel] .text-slate-400.uppercase {
    color: #22d3ee;
    text-shadow: 0 0 8px rgba(34, 211, 238, 0.4);
    font-weight: 800;
    letter-spacing: 0.1em;
}

/* ── MODALES NEON (Loader Select etc) ── */
[data-theme="neon"] .fixed.inset-0.z-\[100\] .bg-white,
[data-theme="neon"] .fixed.inset-0.z-\[100000\] .bg-white {
    background-color: rgba(15, 23, 42, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(34, 211, 238, 0.3);
    color: #e2e8f0;
}

/* Cas particulier : Boutons bg-white dans l'admin (hors site principal) */
[data-theme="neon"]:not(main) .bg-white {
    color: #020718;
}

/* Boutons d'action pages (Voir, Renommer, Editer) */
[data-theme="neon"] .bg-white.text-brand-secondary {
    color: #22d3ee;
}

[data-theme="neon"] .fixed.inset-0.z-\[100\] .text-slate-800,
[data-theme="neon"] .fixed.inset-0.z-\[100\] .text-slate-700,
[data-theme="neon"] .fixed.inset-0.z-\[100\] .text-amber-900 {
    color: #22d3ee;
}

[data-theme="neon"] .fixed.inset-0.z-\[100\] .bg-slate-100,
[data-theme="neon"] .fixed.inset-0.z-\[100\] .bg-indigo-50 {
    background-color: rgba(2, 6, 23, 0.4);
    border-color: rgba(34, 211, 238, 0.2);
}

[data-theme="neon"] .fixed.inset-0.z-\[100\] .border-slate-200 {
    border-color: rgba(34, 211, 238, 0.2);
}

/* Boutons dans les modales */
[data-theme="neon"] .fixed.inset-0.z-\[100\] button.border-amber-500,
[data-theme="neon"] .fixed.inset-0.z-\[100\] button.bg-amber-500 {
    border-color: #22d3ee;
    background-color: rgba(34, 211, 238, 0.2);
    color: #22d3ee;
    box-shadow: 0 0 15px rgba(34, 211, 238, 0.2);
}

/* ── PANNEAU FOND D'ARRIÈRE-PLAN (URGENT REPAIR) ── */
[data-theme="neon"] [data-style-panel] .bg-gradient-to-br.from-blue-50.to-indigo-50,
[data-theme="neon"] [data-style-panel] .from-blue-50,
[data-theme="neon"] [data-style-panel] .to-indigo-50 {
    background: rgba(15, 23, 42, 0.8);
    border-color: rgba(34, 211, 238, 0.3);
}

[data-theme="neon"] [data-style-panel] .bg-blue-600,
[data-theme="neon"] [data-style-panel] .bg-blue-600:hover,
[data-theme="neon"] [data-style-panel] .bg-indigo-600 {
    background-color: rgba(34, 211, 238, 0.2);
    color: #22d3ee;
    border: 1px solid rgba(34, 211, 238, 0.4);
}

[data-theme="neon"] [data-style-panel] .text-blue-900,
[data-theme="neon"] [data-style-panel] .text-blue-700,
[data-theme="neon"] [data-style-panel] .text-blue-600,
[data-theme="neon"] [data-style-panel] .text-teal-900,
[data-theme="neon"] [data-style-panel] .text-blue-500 {
    color: #22d3ee;
    text-shadow: 0 0 8px rgba(34, 211, 238, 0.3);
}

[data-theme="neon"] [data-style-panel] .border-blue-100,
[data-theme="neon"] [data-style-panel] .border-blue-200 {
    border-color: rgba(34, 211, 238, 0.2);
}

[data-theme="neon"] [data-style-panel] .bg-slate-100,
[data-theme="neon"] [data-style-panel] .bg-white {
    background-color: rgba(2, 6, 23, 0.4);
}

[data-theme="neon"] [data-style-panel] .hover\:bg-blue-50:hover,
[data-theme="neon"] [data-style-panel] .hover\:bg-slate-50:hover {
    background-color: rgba(34, 211, 238, 0.1);
}

/* ============================================================
   MODALS & POPUPS (Neon Overrides)
   On cible les modals injectées dans le body via Portal
   ============================================================ */

/* Overlay global */
[data-theme="neon"] .fixed.inset-0.flex>div.absolute.bg-black\/60 {
    background-color: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(8px);
}

/* Conteneur de Modal (Cible Modal.tsx et ConfirmModal.tsx) */
[data-theme="neon"] .fixed.inset-0 .relative.bg-white {
    background-color: rgba(15, 23, 42, 0.95);
    backdrop-filter: blur(25px);
    border: 1px solid rgba(34, 211, 238, 0.3);
    box-shadow: 0 0 50px rgba(0, 0, 0, 0.8), 0 0 20px rgba(34, 211, 238, 0.15);
    color: #f1f5f9;
}

/* Header de Modal */
[data-theme="neon"] .fixed.inset-0 .bg-sage-50\/50,
[data-theme="neon"] .fixed.inset-0 .border-b.border-gray-100 {
    background-color: rgba(2, 6, 23, 0.5);
    border-bottom: 1px solid rgba(34, 211, 238, 0.2);
}

/* Header de Modal */
[data-theme="neon"] div.fixed.inset-0.z-\[200000\] .bg-sage-50\/50 {
    background-color: rgba(2, 6, 23, 0.5);
    border-bottom: 1px solid rgba(34, 211, 238, 0.2);
}

/* Titres et Textes dans Modals */
[data-theme="neon"] div.fixed.inset-0.z-\[200000\] :is(.text-sage-900, .text-gray-900, h3) {
    color: var(--neon-cyan);
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

[data-theme="neon"] div.fixed.inset-0.z-\[200000\] :is(.text-sage-600, .text-gray-600, .text-gray-700, p) {
    color: #94a3b8;
}

/* Icônes de ConfirmModal */
[data-theme="neon"] div.fixed.inset-0.z-\[200000\] :is(.bg-red-50, .bg-blue-50, .bg-green-50, .bg-sage-50) {
    background-color: rgba(2, 6, 23, 0.6);
    border: 1px solid rgba(34, 211, 238, 0.3);
    box-shadow: 0 0 15px rgba(34, 211, 238, 0.2);
}

[data-theme="neon"] div.fixed.inset-0.z-\[200000\] .rounded-full svg {
    color: var(--neon-cyan);
}

/* Inputs dans Modals */
[data-theme="neon"] div.fixed.inset-0.z-\[200000\] input {
    background-color: rgba(2, 6, 23, 0.8);
    border: 1px solid rgba(34, 211, 238, 0.3);
    color: #e2e8f0;
}

[data-theme="neon"] div.fixed.inset-0.z-\[200000\] input:focus {
    border-color: #22d3ee;
    box-shadow: 0 0 10px rgba(34, 211, 238, 0.2);
}

/* Boutons de Modals */
[data-theme="neon"] div.fixed.inset-0.z-\[200000\] button.border-gray-300,
[data-theme="neon"] div.fixed.inset-0.z-\[200000\] button:not([class*="bg-"]) {
    background-color: transparent;
    border: 1px solid rgba(148, 163, 184, 0.3);
    color: #94a3b8;
}

[data-theme="neon"] div.fixed.inset-0.z-\[200000\] button.border-gray-300:hover {
    background-color: rgba(148, 163, 184, 0.1);
    color: #f1f5f9;
}

/* Boutons d'action (Success/Danger) dans Modals */
[data-theme="neon"] div.fixed.inset-0.z-\[200000\] button[class*="bg-"] {
    background-color: var(--neon-cyan) !important;
    color: #020617 !important;
    border-radius: 4px !important;
    box-shadow: 0 0 15px rgba(34, 211, 238, 0.4) !important;
}

[data-theme="neon"] div.fixed.inset-0.z-\[200000\] .shadow-gray-200 {
    box-shadow: none !important;
}

/* ============================================================
   MODULE BOOKING (Neon Overrides)
   Intégration du module Booking avec l'esthétique Neon
   ============================================================ */

[data-theme="neon"] .booking-module-wrapper {
    color: #e2e8f0;
}

[data-theme="neon"] .booking-module-wrapper .bg-white {
    background-color: rgba(15, 23, 42, 0.7) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(34, 211, 238, 0.2);
}

[data-theme="neon"] .booking-module-wrapper .bg-gray-50,
[data-theme="neon"] .booking-module-wrapper .bg-gray-100 {
    background-color: rgba(2, 6, 23, 0.5) !important;
}

[data-theme="neon"] .booking-module-wrapper .text-gray-800,
[data-theme="neon"] .booking-module-wrapper .text-gray-900,
[data-theme="neon"] .booking-module-wrapper .text-gray-700 {
    color: #f1f5f9 !important;
}

[data-theme="neon"] .booking-module-wrapper .text-gray-600,
[data-theme="neon"] .booking-module-wrapper .text-gray-500 {
    color: #94a3b8 !important;
}

[data-theme="neon"] .booking-module-wrapper .border-gray-200,
[data-theme="neon"] .booking-module-wrapper .border-gray-100 {
    border-color: rgba(34, 211, 238, 0.15) !important;
}

/* Sidebar Booking */
[data-theme="neon"] .booking-module-wrapper aside {
    background-color: rgba(2, 6, 23, 0.95) !important;
    border-right: 1px solid rgba(34, 211, 238, 0.2);
}

/* Inputs Booking */
[data-theme="neon"] .booking-module-wrapper input:not([type="color"]):not([type="checkbox"]):not([type="radio"]),
[data-theme="neon"] .booking-module-wrapper select,
[data-theme="neon"] .booking-module-wrapper textarea {
    background-color: rgba(2, 6, 23, 0.8) !important;
    border: 1px solid rgba(34, 211, 238, 0.3) !important;
    color: #e2e8f0 !important;
}

[data-theme="neon"] .booking-module-wrapper .shadow-soft {
    box-shadow: 0 0 20px rgba(34, 211, 238, 0.1) !important;
}