/* ==========================================================================
   SIMULATEUR WIDGET — simulateur.css 

   Correspondances rapides:
   - #theme_panel          : panneau simulateur (desktop = bas/droite, mobile = bas)
   - .sim-inner            : zone scroll interne
   - #sim_results          : bloc résultats (zone "BMW 3-serie" + cartes + ECU + note + bouton)
   - #ecuChips             : chips ECU ("Bosch EDC...")
   - #gainCv / #gainNm     : badges gains (+54 / +100)
   - .sim-expanded         : état "résultats affichés" (ajustements hauteur desktop)
========================================================================== */

/* ==========================================================================
   CONFIGURATEUR — MODIFIE ICI (couleurs / tailles / hauteurs)
   (Tout est centralisé, tu ajustes sans chercher dans le fichier)
========================================================================== */


:root{
  /* --- Panneau (fond unique) --- */
  --sim-panel-bg: #141417;
  --sim-panel-border: #141417;
  --sim-panel-shadow: 0 22px 60px #141417;

  /* --- Surfaces internes (inputs / boutons / cartes) --- */
  --sim-surface-1: #141417;      /* selects / toggles */
  --sim-surface-2: #1e1e1e;   /* boutons / cartes origine */
  --sim-surface-3: #2f2f2f;   /* état actif */
  --sim-surface-tuned: #2a2323; /* cartes stage (légèrement rouge) */
  --sim-border-1: #303030;
  --sim-border-2: #3a3a3a;

  

  /* --- Segment véhicules (barre d’icônes) --- */
  --sim-segment-bg: #141417;              /* fond de la barre (zone entourée en rouge) */
  --sim-segment-border: #303030;          /* bordure barre */
  --sim-segment-btn-text: #bdbdbd;        /* icônes inactives */
  --sim-segment-btn-active-bg: #121212;   /* fond icône active */
  --sim-segment-btn-active-border: #4a4a4a;
  --sim-segment-btn-active-text: #ffffff; /* icône active */
/* --- Texte --- */
  --sim-text: #e5e5e5;
  --sim-muted: #bfbfbf;
  --sim-muted-2: #d0d0d0;

  /* --- Hauteur DESKTOP quand les résultats sont affichés --- */
  --sim-desktop-results-maxh: 74vh;   /* ex: 70vh = plus bas, 80vh = plus haut */
  --sim-desktop-inner-offset: 72px;   /* compense header/paddings internes */

  /* --- Hauteur MOBILE quand les résultats sont affichés --- */
  --sim-mobile-results-maxh: 51vh;    /* ex: 70vh = plus bas, 85vh = plus haut */
  --sim-mobile-inner-offset: 50px;   /* compense header/paddings internes */

  /* --- Taille ECU chips (desktop) --- */
  --sim-ecu-font: 12px;

  /* --- MOBILE: réduction globale (tout le visuel de la zone résultats) --- */
  --sim-mobile-results-scale: .88;    /* .90 léger / .85 fort / .80 très compact */

  /* --- MOBILE: tailles fines (si tu veux affiner en plus du scale) --- */
  --sim-mobile-font: 12px;            /* base texte */
  --sim-mobile-pad: 10px;             /* padding interne */
  --sim-mobile-card-pad: 8px;         /* padding cartes */
  --sim-mobile-cv: 34px;              /* gros chiffres 286/340 */
  --sim-mobile-ecu: 9px;              /* chips ECU */
  --sim-mobile-btn: 13px;             /* boutons */
  
  /* Variable largeur panneau (comme l’origine) */
  --panel-width: 560px;
}




/* ==========================================================================
   BASE (commun desktop + mobile)
========================================================================== */

/* Scope box-sizing */
#theme_panel,
#theme_panel *{ box-sizing: border-box; }

/* =========================================================
   THEME PANEL – STRUCTURE
   ========================================================= */
#theme_panel{
  position: fixed;
  right: 18px;
  bottom: 18px;
  left: auto;
  top: auto;
  width: var(--panel-width);
  overflow: hidden;
  border-radius: 18px;
  z-index: 10000;
  pointer-events: auto;

  /* Fond/relief pilotés par variables */
  background-color: var(--sim-panel-bg);
  background-image: none;
  backdrop-filter: none;
  border: 1px solid var(--sim-panel-border);
  box-shadow: var(--sim-panel-shadow);
}

/* Zone scrollable interne */
#theme_panel .sim-inner{
  padding: 12px 14px 16px;
  border-bottom: 1px solid transparent;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) rgba(255,255,255,.06);
}
#theme_panel .sim-inner::-webkit-scrollbar{ width:10px; }
#theme_panel .sim-inner::-webkit-scrollbar-track{
  background: rgba(255,255,255,.06);
  border-radius: 999px;
}
#theme_panel .sim-inner::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.22);
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.06);
}
#theme_panel .sim-inner::-webkit-scrollbar-thumb:hover{
  background: rgba(255,255,255,.30);
}

/* Header */
#theme_panel .theme_panel_inner{ text-align:center; }
#theme_panel .theme_panel_header{
  margin: 10px 0 6px;
  font-size: 20px;
  letter-spacing: .10em;
  text-transform: uppercase;
  opacity: .92;
  color:#f2f2f2;
}

/* (optionnel) barre/grab si tu l’ajoutes */
#theme_panel .sim-grab{
  position: sticky;
  top: 0;
  height: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 2;
  pointer-events: none;
}
#theme_panel .sim-grab::before{
  content:"";
  width: 40px;
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.28);
  opacity: .35;
}

/* Sécurité: cacher l’ancien onglet du switcher */
#theme_panel_button{ display:none !important; }

/* =========================================================
   SEGMENT (Voiture / Moto) — design origine
   ========================================================= */
#theme_panel .segment{
  display:flex;
  gap:10px;
  background: var(--sim-segment-bg);
  padding:8px;
  border-radius:14px;
  border:1px solid var(--sim-segment-border);
  margin: 0 0 14px;
}
#theme_panel .segment button{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid transparent;
  background: transparent;
  color: var(--sim-segment-btn-text);
  font-size:14px;
  font-weight:600;
  cursor:pointer;
}
#theme_panel .segment button svg{ width:18px; height:18px; opacity:.9; }
#theme_panel .segment button.active{
  background: var(--sim-segment-btn-active-bg);
  border-color: var(--sim-segment-btn-active-border);
  color: var(--sim-segment-btn-active-text);
}

/* =========================================================
   SELECTEURS + BOUTON
   ========================================================= */
#theme_panel .selectorCard{ background: transparent; padding: 0; border: 0; box-shadow:none; }

#theme_panel .selectRow{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:10px;
  margin-bottom: 12px;
}

#theme_panel .selectWrap{ position:relative; }

#theme_panel select{
  width:100%;
  appearance:none;
  background: var(--sim-surface-1);
  color: var(--sim-muted-2);
  border:1px solid var(--sim-border-1);
  border-radius:10px;
  padding:12px 40px 12px 12px;
  font-size:14px;
  outline:none;
}
#theme_panel select:disabled{ opacity:.55; }

#theme_panel .selectWrap:after{
  content:"";
  position:absolute;
  right:12px;
  top:50%;
  width:10px;
  height:10px;
  border-right:2px solid #9b9b9b;
  border-bottom:2px solid #9b9b9b;
  transform: translateY(-60%) rotate(45deg);
  pointer-events:none;
  opacity:.9;
}

#theme_panel #btnShow,
#theme_panel .btnPrimary{
  width:100%;
  border-radius:12px;
  border:1px solid var(--sim-border-2);
  background: var(--sim-surface-2);
  color: var(--sim-text);
  font-weight:700;
  padding:12px 14px;
  cursor:pointer;
}
#theme_panel #btnShow:disabled,
#theme_panel .btnPrimary:disabled{
  opacity:.55;
  cursor:default;
}

/* =========================================================
   RÉSULTATS — IMPORTANT: ton HTML utilise #sim_results
   ========================================================= */
#theme_panel #sim_results{
  display:none;
  margin-top: 14px;
}
#theme_panel #sim_results.show{
  display:block;
}

#theme_panel .titleBlock{ text-align:center; width:100%; }
#theme_panel .carTitle{
  font-size:34px;
  font-weight:800;
  letter-spacing:.01em;
  color:#f2f2f2;
}
#theme_panel .carMeta{
  font-size: 13px;
  opacity: .8;
  margin-top:4px;
  margin-bottom: 12px;
  color:#d8d8d8;
}

/* Toggle stage (pill) */
#theme_panel .stageToggle{
  display:flex;
  gap: 8px;
  background: var(--sim-surface-1);
  border:1px solid color-mix(in srgb, var(--sim-border-1) 70%, #000 30%);
  border-radius: 999px;
  padding: 6px;
  margin: 10px 0 14px;
}
#theme_panel .stageToggle button{
  flex:1;
  border:0;
  border-radius: 999px;
  padding: 10px 12px;
  background: transparent;
  color: var(--sim-muted);
  cursor:pointer;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .02em;
}
#theme_panel .stageToggle button.active{
  background: var(--sim-surface-3);
  color:#fff;
}

/* Cartes Origine / Stage */
#theme_panel .cardsRow{
  display:flex;
  gap: 14px;
  align-items: stretch;
}

#theme_panel .resultCard{
  flex:1;
  border-radius: 18px;
  padding: 16px 16px 14px;
  border: 1px solid rgba(255,255,255,.07);
  position: relative;
  overflow: hidden;
  min-height: 120px;
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
  text-align: center;
}

#theme_panel .resultCard.origin{
  background: var(--sim-surface-2);
}

#theme_panel .resultCard.tuned{
  background: var(--sim-surface-tuned);
  --gain-cv-x: -65px;
  --gain-cv-y: 0px;
  --gain-nm-x: -65px;
  --gain-nm-y: 0px;
}

#theme_panel .cardKicker{
  text-transform: uppercase;
  letter-spacing: .18em;
  font-weight: 900;
  font-size: 12px;
  opacity: .85;
  margin-bottom: 12px;
  color:#e8e8e8;
}
#theme_panel .resultCard.tuned .cardKicker{
  color: #ff5a5a;
  opacity: .95;
}

/* Nombres */
#theme_panel .cardMain,
#theme_panel .cardSub{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: baseline;
}
#theme_panel .cardMain{
  gap: 8px;
  line-height: 1;
  margin-bottom: 10px;
}

#theme_panel .cardMain span[id$="Cv"]:not(#gainCv){
  font-size: 52px;
  font-weight: 950;
  letter-spacing: -0.02em;
  color:#fff;
}
#theme_panel .cardSub{
  gap: 6px;
  font-size: 20px;
  font-weight: 850;
  opacity: .95;
  color:#e9e9e9;
}
#theme_panel .unit{
  margin-left: 10px;
  font-size: 0.85em;
  opacity: .9;
  font-weight: 800;
}

/* Gains (badges) */
#theme_panel .inlineGain{
  justify-content: center;
  position: relative;
}
#theme_panel .gainInline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:14px !important;
  font-weight:800 !important;
  padding:4px 8px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.25);
  line-height:1 !important;
  white-space:nowrap;
  min-width: 0 !important;
  height:auto !important;
}
#theme_panel .gainCv{
  color:#7fb6ff !important;
  border-color: rgba(127,182,255,.28) !important;
  background: rgba(127,182,255,.12) !important;
}
#theme_panel .gainNm{
  color:#8fe0b0 !important;
  border-color: rgba(143,224,176,.25) !important;
  background: rgba(143,224,176,.10) !important;
}

/* Positionnement badges sur la carte Stage */
#theme_panel .resultCard.tuned .cardMain{ position: relative; }
#theme_panel .resultCard.tuned .cardSub{ position: relative; }

#theme_panel .resultCard.tuned #gainCv{
  position: absolute;
  left: calc(100% + var(--gain-cv-x));
  top: var(--gain-cv-y);
  right: auto !important;
}
#theme_panel .resultCard.tuned #gainNm{
  position: absolute;
  left: calc(100% + var(--gain-nm-x));
  top: var(--gain-nm-y);
  right: auto !important;
}

/* Pourcentages cachés */
#gainCvPct, #gainNmPct, .srOnly{ display:none !important; }

/* ECU chips */
#theme_panel .chips{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
#theme_panel .chips .chip,
#theme_panel .chips > *{
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 800;
  color:#d6d6d6;
}

#theme_panel .note{
  margin-top: 12px;
  font-size: 13px;
  line-height: 1.35;
  opacity: .85;
  color:#d6d6d6;
}

/* Réservation */
#theme_panel .bookingWrap{ margin-top: 12px; }
@keyframes bookingPulse {
  0%   { box-shadow: 0 10px 22px rgba(225,6,0,.18); transform: translateY(0); }
  50%  { box-shadow: 0 14px 34px rgba(225,6,0,.35); transform: translateY(-1px); }
  100% { box-shadow: 0 10px 22px rgba(225,6,0,.18); transform: translateY(0); }
}
#theme_panel #btnBook.primary{
  width: 100%;
  border-radius: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(135deg,#e10600,#ff3b30);
  color:#fff;
  font-weight: 900;
  letter-spacing: .2px;
  cursor:pointer;
  animation: bookingPulse 2.2s ease-in-out infinite;
}
#theme_panel #btnBook.primary:hover{ filter: brightness(1.08); animation-play-state: paused; }
#theme_panel #btnBook.primary:active{ transform: translateY(1px); }

/* =========================================================
   DRAWER – BACKDROP + FAB
   ========================================================= */
#sim_backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
  z-index: 9000;
}
#sim_backdrop.show{
  opacity: 1;
  pointer-events: auto;
}
body.sim-lock{ overflow: hidden; }

/* FAB (bouton rouge) */
#sim_fab{
  position: fixed;
  bottom: 18px;
  right: 18px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background:#e10600;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 2;
  box-shadow: 0 12px 30px rgba(0,0,0,.45);
  text-decoration:none;
}
#sim_fab i{ font-size: 20px; }

/* Cache le FAB quand le drawer est ouvert */
body.sim-lock #sim_fab{ opacity: 0; pointer-events:none; }

/* =========================================================
   MOBILE (<= 768px)
   ========================================================= */


/* =========================================================
   DESKTOP (>= 769px)
   ========================================================= */


/* =========================================================
   DESKTOP — Scrollbar + hauteur menu avec gains
   ========================================================= */

/* =====================================================================
   PATCH — Uniformiser couleurs (clair/sombre) + tailles résultats
   ===================================================================== */

/* Le panneau ne doit JAMAIS être transparent, même si un thème global applique des rgba */
#theme_panel{ opacity: 1 !important; }

/* Mode résultats = plus haut (desktop + mobile) */
#theme_panel.sim-expanded{ max-height: 92vh !important; }

/* Zone scrollable interne (assure scrollbar) */
#theme_panel .sim-inner{
  max-height: calc(92vh - 70px);
  overflow-y: auto;
}

/* Réduit tailles UNIQUEMENT quand les résultats sont affichés */
#theme_panel.sim-expanded #sim_results .carTitle{ font-size: 26px !important; }
#theme_panel.sim-expanded #sim_results .carMeta{ font-size: 12px !important; }
#theme_panel.sim-expanded #sim_results .stageToggle button{
  font-size: 12px !important;
  padding: 8px 10px !important;
}
#theme_panel.sim-expanded #sim_results .cardKicker{ font-size: 11px !important; }
#theme_panel.sim-expanded #sim_results .cardMain span[id$="Cv"]:not(#gainCv){ font-size: 46px !important; }
#theme_panel.sim-expanded #sim_results .cardSub{ font-size: 16px !important; }
#theme_panel.sim-expanded #sim_results .unit{
  color: rgba(255,255,255,.72) !important;
  opacity: 1 !important;
}
#theme_panel.sim-expanded #sim_results .chips .chip,
#theme_panel.sim-expanded #sim_results .chips > *{
  font-size: 11px !important;
  padding: 6px 10px !important;
}
#theme_panel.sim-expanded #sim_results .note{ font-size: 12px !important; }
#theme_panel.sim-expanded #btnBook.primary{
  padding: 10px 12px !important;
  font-size: 15px !important;
}

/* Supprime l'espace vide sous le bouton en poussant la réservation en bas */
#theme_panel .sim-inner{ display:flex; flex-direction: column; }
#theme_panel .bookingWrap{ margin-top: auto !important; padding-top: 10px; }

/* Titre SIMULATEUR toujours visible en haut du panneau */
#theme_panel .theme_panel_header{
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--sim-panel-bg);
  padding: 10px 0 8px;
  margin: 0;
}

/* Mobile: garde l'effet drawer + augmente la hauteur en résultats */




/* =========================================================
   OVERRIDE dark.css (qui force des couleurs sur #theme_panel en thème sombre)
   Objectif : COULEURS IDENTIQUES au thème clair
   ========================================================= */

/* Panneau (forcer la même couleur que le mode clair) */
html.dark body #theme_panel#theme_panel,
html.theme-dark body #theme_panel#theme_panel,
body.dark #theme_panel#theme_panel,
body.theme-dark #theme_panel#theme_panel,
[data-theme="dark"] #theme_panel#theme_panel,
[data-bs-theme="dark"] #theme_panel#theme_panel{
  background: var(--sim-panel-bg) !important;
  background-color: var(--sim-panel-bg) !important;
  background-image: none !important;
  backdrop-filter: none !important;
}

/* Cartes résultats (mêmes fonds qu'en clair) */
html.dark #theme_panel#theme_panel .resultCard.origin,
html.theme-dark #theme_panel#theme_panel .resultCard.origin,
body.dark #theme_panel#theme_panel .resultCard.origin,
body.theme-dark #theme_panel#theme_panel .resultCard.origin,
[data-theme="dark"] #theme_panel#theme_panel .resultCard.origin,
[data-bs-theme="dark"] #theme_panel#theme_panel .resultCard.origin{
  background: var(--sim-surface-2) !important;
}

html.dark #theme_panel#theme_panel .resultCard.tuned,
html.theme-dark #theme_panel#theme_panel .resultCard.tuned,
body.dark #theme_panel#theme_panel .resultCard.tuned,
body.theme-dark #theme_panel#theme_panel .resultCard.tuned,
[data-theme="dark"] #theme_panel#theme_panel .resultCard.tuned,
[data-bs-theme="dark"] #theme_panel#theme_panel .resultCard.tuned{
  /* garder le même dégradé brun/rouge que l'original */
  background: radial-gradient(120% 120% at 30% 20%, rgba(160,40,40,.38) 0%, rgba(38,22,22,.92) 65%, rgba(25,18,18,1) 100%) !important;
}

/* Selects (ne pas prendre le fond #222 imposé par dark.css) */
html.dark #theme_panel#theme_panel select,
html.theme-dark #theme_panel#theme_panel select,
body.dark #theme_panel#theme_panel select,
body.theme-dark #theme_panel#theme_panel select,
[data-theme="dark"] #theme_panel#theme_panel select,
[data-bs-theme="dark"] #theme_panel#theme_panel select{
  background: var(--sim-surface-1) !important;
  color: var(--sim-muted-2) !important;
  border-color: var(--sim-border-1) !important;
}

/* Bouton Réserver : toujours rouge (dark.css le grise parfois via styles globaux) */
html.dark #theme_panel#theme_panel #btnBook.primary,
html.theme-dark #theme_panel#theme_panel #btnBook.primary,
body.dark #theme_panel#theme_panel #btnBook.primary,
body.theme-dark #theme_panel#theme_panel #btnBook.primary,
[data-theme="dark"] #theme_panel#theme_panel #btnBook.primary,
[data-bs-theme="dark"] #theme_panel#theme_panel #btnBook.primary{
  background: linear-gradient(135deg,#e10600,#ff3b30) !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,.12) !important;
}


/* === LOCK COULEURS: le widget doit rester identique (clair/sombre) === */
#theme_panel,
#theme_panel .sim-inner,
#theme_panel .stageToggle,
#theme_panel .simHeader{
  background-color: var(--sim-panel-bg) !important;
  background-image: none !important;
}
/* La pill stageToggle est une "surface" interne, pas le fond du panneau */
#theme_panel .stageToggle{ background-color: var(--sim-surface-1) !important; }
/* Empêche tout "filtre" global d'assombrir le widget en mode sombre */
#theme_panel, #theme_panel *{
  filter: none !important;
}
/* Fix taille badges +CV/+NM (anti overrides globaux) */
#theme_panel .gainInline{
  font-size: 14px !important;
  line-height: 1 !important;
}


/* =========================================================
   SIMULATEUR — COULEURS GAINS (clair = sombre)
   - Restaure les pastilles +CV / +Nm (bleu / vert)
   - Identiques en thème clair et en thème sombre
   ========================================================= */
#theme_panel .gainInline.gainCv{
  background:#2f6bff !important;
  color:#ffffff !important;
  border-color: rgba(255,255,255,.14) !important;
}
#theme_panel .gainInline.gainNm{
  background:#2fbf71 !important;
  color:#ffffff !important;
  border-color: rgba(255,255,255,.14) !important;
}


/* ---------------------------------------------------------
   FIX DEFINITIF: le gain (#gainCv / #gainNm) ne doit jamais
   hériter des tailles "gros chiffres" (Cv).
--------------------------------------------------------- */
#theme_panel #gainCv,
#theme_panel #gainNm{
  font-size: 14px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}



/* =========================================================
   DARK MODE — UNIFORMISER LE FOND (supprimer zones plus foncées)
   Certains styles globaux du thème sombre appliquent un fond
   sur des wrappers génériques (.card/.content-container/etc).
   Dans le simulateur, ces wrappers doivent rester TRANSPARENTS
   pour laisser apparaître le fond #222 du panneau (comme en clair).
   ========================================================= */
html.dark #theme_panel #sim_results,
html.theme-dark #theme_panel #sim_results,
body.dark #theme_panel #sim_results,
body.theme-dark #theme_panel #sim_results,
[data-theme="dark"] #theme_panel #sim_results,
[data-bs-theme="dark"] #theme_panel #sim_results,

html.dark #theme_panel .titleBlock,
html.theme-dark #theme_panel .titleBlock,
body.dark #theme_panel .titleBlock,
body.theme-dark #theme_panel .titleBlock,
[data-theme="dark"] #theme_panel .titleBlock,
[data-bs-theme="dark"] #theme_panel .titleBlock,

html.dark #theme_panel .cardsRow,
html.theme-dark #theme_panel .cardsRow,
body.dark #theme_panel .cardsRow,
body.theme-dark #theme_panel .cardsRow,
[data-theme="dark"] #theme_panel .cardsRow,
[data-bs-theme="dark"] #theme_panel .cardsRow,

html.dark #theme_panel .chips,
html.theme-dark #theme_panel .chips,
body.dark #theme_panel .chips,
body.theme-dark #theme_panel .chips,
[data-theme="dark"] #theme_panel .chips,
[data-bs-theme="dark"] #theme_panel .chips,

html.dark #theme_panel .note,
html.theme-dark #theme_panel .note,
body.dark #theme_panel .note,
body.theme-dark #theme_panel .note,
[data-theme="dark"] #theme_panel .note,
[data-bs-theme="dark"] #theme_panel .note,

html.dark #theme_panel .bookingWrap,
html.theme-dark #theme_panel .bookingWrap,
body.dark #theme_panel .bookingWrap,
body.theme-dark #theme_panel .bookingWrap,
[data-theme="dark"] #theme_panel .bookingWrap,
[data-bs-theme="dark"] #theme_panel .bookingWrap{
  background: transparent !important;
  background-color: transparent !important;
}



/* =========================================================
   DARK MODE — FOND UNIFORME (1 seule couleur comme en clair)
   - Certains styles globaux injectent un fond plus sombre sur des wrappers.
   - Ici on force le "fond panneau" (#222) sur les zones neutres
     (hors cartes/boutons/badges qui gardent leur propre fond).
   ========================================================= */
html.theme-dark #theme_panel .sim-inner,
html.theme-dark #theme_panel #sim_results,
html.theme-dark #theme_panel .titleBlock,
html.theme-dark #theme_panel .cardsRow,
html.theme-dark #theme_panel .chips,
html.theme-dark #theme_panel .note,
html.theme-dark #theme_panel .bookingWrap{
  background: var(--sim-panel-bg) !important;
  background-color: var(--sim-panel-bg) !important;
  background-image: none !important;
}

/* La pill stageToggle reste une surface interne */
html.theme-dark #theme_panel .stageToggle{
  background: var(--sim-surface-1) !important;
  background-color: var(--sim-surface-1) !important;
  background-image: none !important;
}

/* Evite des pseudo-overlays éventuels sur la zone résultats */
html.theme-dark #theme_panel #sim_results::before,
html.theme-dark #theme_panel #sim_results::after,
html.theme-dark #theme_panel .titleBlock::before,
html.theme-dark #theme_panel .titleBlock::after{
  content: none !important;
  display: none !important;
}



/* -----------------------------
   2) MOBILE — interface plus petite
------------------------------ */




/* -----------------------------
   MOBILE — interface plus petite (sélecteurs corrects)
------------------------------ */




/* =========================================================
   AJUSTEMENTS (v3)
   - DESKTOP: hauteur panneau en résultats via variables
   - MOBILE: réduction plus visible de tout le visuel
   ========================================================= */

/* -----------------------------
   DESKTOP — résultats (configurable)
------------------------------ */


/* -----------------------------
   MOBILE — interface plus petite (réduction globale)
------------------------------ */





/* SIMULATEUR — PANEL BG (via variables) */
#theme_panel{
  background-color: var(--sim-panel-bg) !important;
  border: 1px solid var(--sim-panel-border);
  box-shadow: var(--sim-panel-shadow);
}

/* ==========================================================================
   DESKTOP (min-width: 769px)
========================================================================== */

/* Hauteur du panneau quand les résultats sont affichés (configurable) */
@media (min-width: 769px){
  #theme_panel.sim-expanded{
    max-height: var(--sim-desktop-results-maxh) !important;
  }
  #theme_panel.sim-expanded .sim-inner{
    max-height: calc(var(--sim-desktop-results-maxh) - var(--sim-desktop-inner-offset)) !important;
    overflow-y: auto !important;
  }

  /* Taille des chips ECU ("Bosch EDC...") sur desktop */
  #theme_panel #ecuChips .chip,
  #theme_panel #ecuChips > *{
    font-size: var(--sim-ecu-font) !important;
  }
}



/* --- MEDIA QUERIES EXISTANTES (DESKTOP) --- */
@media (max-width: 768px){


  /* Hauteur du panneau quand les résultats sont affichés (configurable) */
  #theme_panel.sim-expanded{
    max-height: var(--sim-mobile-results-maxh) !important;
  }
  #theme_panel.sim-expanded .sim-inner{
    max-height: calc(var(--sim-mobile-results-maxh) - var(--sim-mobile-inner-offset)) !important;
    overflow-y: auto !important;
  }

  #theme_panel{
    --panel-width: 100vw;
    --sim-max: 56vh;
    width: 100vw;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    max-height: var(--sim-max);
    height: auto;
    border-radius: 18px 18px 0 0;
    transition: transform .35s ease;
    will-change: transform;
  }
  #theme_panel.sim-expanded{ --sim-max: 82vh; }

  #theme_panel.close_panel{ transform: translateY(100%); }
  #theme_panel.open_panel{ transform: translateY(0); }

  #theme_panel .sim-inner{ max-height: calc(var(--sim-max) - 86px); }

  #theme_panel .cardsRow{ flex-direction: row; }
  #theme_panel .resultCard{ min-width: 0; padding: 12px; border-radius: 14px; }
  #theme_panel .cardMain span[id$="Cv"]:not(#gainCv){ font-size: 42px; }
  #theme_panel .cardSub{ font-size: 16px; }

  #theme_panel .resultCard.tuned{
    --gain-cv-x: -52px;
    --gain-nm-x: -46px;
  }

  #theme_panel #ecuChips .chip,
  #theme_panel #ecuChips > *{
    font-size: 10px !important;
    padding: 4px 7px !important;
  }

  #theme_panel{ padding-left: 10px; padding-right: 10px; }
  body.sim-lock{ touch-action: none; }
}

@media (min-width: 769px){
  #theme_panel{
    left: auto !important;
    right: 18px !important;
    top: auto !important;
    bottom: 18px !important;

    width: var(--panel-width) !important;
    max-height: 78vh !important;
    height: auto !important;

    transform: translateY(calc(100% + 24px)) !important;
    transition: transform .35s ease !important;
    will-change: transform;
  }
  #theme_panel.open_panel{ transform: translateY(0) !important; }
  #theme_panel.close_panel{ transform: translateY(calc(100% + 24px)) !important; }
}

@media (min-width: 769px){
  #theme_panel{ max-height: 78vh; }
  #theme_panel.sim-expanded{ max-height: 70vh; }
  #theme_panel .sim-inner{
    max-height: calc(70vh - 110px);
    overflow-y: auto;
  }
}

@media (min-width: 769px){
  #theme_panel.sim-expanded{
    max-height: var(--sim-desktop-results-maxh) !important;
  }
  #theme_panel.sim-expanded .sim-inner{
    max-height: calc(var(--sim-desktop-results-maxh) - var(--sim-desktop-inner-offset)) !important;
    overflow-y: auto !important;
  }

  /* Taille des chips ECU sur desktop (noms "Bosch EDC...") */
  #theme_panel #ecuChips .chip,
  #theme_panel #ecuChips > *{
    font-size: var(--sim-ecu-font) !important;
  }
}



/* ==========================================================================
   MOBILE (max-width: 768px)
========================================================================== */

@media (max-width: 768px){

  /* Réduction globale de la zone résultats (zone entourée en vert) */
  #theme_panel #sim_results{
    zoom: var(--sim-mobile-results-scale);
  }
  @supports not (zoom: 1){
    #theme_panel #sim_results{
      transform: scale(var(--sim-mobile-results-scale));
      transform-origin: top center;
    }
  }

  /* Affinages optionnels (si tu veux encore plus petit) */
  #theme_panel{ font-size: var(--sim-mobile-font) !important; }
  #theme_panel .sim-inner{ padding: var(--sim-mobile-pad) calc(var(--sim-mobile-pad) + 2px) calc(var(--sim-mobile-pad) + 2px) !important; }

  #theme_panel #carTitle{ font-size: 22px !important; }
  #theme_panel #carMeta{ font-size: 10px !important; }

  #theme_panel .resultCard,
  #theme_panel .stageCard{
    padding: var(--sim-mobile-card-pad) !important;
  }

  #theme_panel .cardMain span[id$="Cv"]:not(#gainCv){
    font-size: var(--sim-mobile-cv) !important;
  }

  #theme_panel #ecuChips .chip,
  #theme_panel #ecuChips > *{
    font-size: var(--sim-mobile-ecu) !important;
  }

  #theme_panel #btnShow,
  #theme_panel #btnBook{
    font-size: var(--sim-mobile-btn) !important;
  }
}



/* --- MEDIA QUERIES EXISTANTES (MOBILE) --- */
@media (max-width: 768px){
  #theme_panel{
    right: 0;
    bottom: 0;
    left: 0;
    width: 100vw;
    border-radius: 18px 18px 0 0;
    max-height: 56vh;
  }
  #theme_panel.sim-expanded{ max-height: 86vh !important; }
  #theme_panel .sim-inner{ max-height: calc(86vh - 78px); }
}

@media (max-width: 768px){

  /* Base */
  #theme_panel{ font-size: 13px !important; }
  #theme_panel .sim-inner{ padding: 10px 12px 12px !important; }

  /* Titre */
  #theme_panel .theme_panel_header{
    font-size: 18px !important;
    margin: 6px 0 4px !important;
    padding: 8px 0 6px !important;
  }

  /* Selects + bouton voir */
  #theme_panel select{
    padding: 10px 34px 10px 10px !important;
    font-size: 13px !important;
    border-radius: 10px !important;
  }
  #theme_panel #btnShow{
    padding: 10px 12px !important;
    font-size: 13px !important;
    border-radius: 12px !important;
  }

  /* Titre véhicule */
  #theme_panel #sim_results .carTitle{ font-size: 24px !important; }
  #theme_panel #sim_results .carMeta{ font-size: 11px !important; }

  /* Stage 1/2 */
  #theme_panel #sim_results .stageToggle button{
    font-size: 12px !important;
    padding: 8px 10px !important;
    border-radius: 999px !important;
  }

  /* Cartes */
  #theme_panel .resultCard{ padding: 10px !important; border-radius: 14px !important; }
  #theme_panel .cardKicker{ font-size: 11px !important; }
  #theme_panel .cardMain span[id$="Cv"]{ font-size: 38px !important; }
  #theme_panel .cardSub{ font-size: 14px !important; }

  /* Badges gains */
  #theme_panel #gainCv,
  #theme_panel #gainNm{
    font-size: 13px !important;
    padding: 6px 9px !important;
    border-radius: 999px !important;
  }

  /* ECU chips */
  #theme_panel #ecuChips .chip,
  #theme_panel #ecuChips > *{
    font-size: 9px !important;
    padding: 4px 7px !important;
    border-radius: 999px !important;
  }

  /* Note + bouton réserver */
  #theme_panel .note{ font-size: 11px !important; }
  #theme_panel #btnBook.primary{
    font-size: 14px !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
  }
}

@media (max-width: 768px){

  #theme_panel{ font-size: 13px !important; }
  #theme_panel .sim-inner{ padding: 10px 12px 12px !important; }

  #theme_panel .theme_panel_header{
    font-size: 18px !important;
    margin: 6px 0 4px !important;
    padding: 8px 0 6px !important;
  }

  #theme_panel select{
    padding: 10px 34px 10px 10px !important;
    font-size: 13px !important;
    border-radius: 10px !important;
  }

  #theme_panel #btnShow{
    padding: 10px 12px !important;
    font-size: 13px !important;
    border-radius: 12px !important;
  }

  #theme_panel #carTitle{ font-size: 24px !important; }
  #theme_panel #carMeta{ font-size: 11px !important; }

  #theme_panel #btnStage1,
  #theme_panel #btnStage2{
    font-size: 12px !important;
    padding: 8px 10px !important;
    border-radius: 999px !important;
  }

  #theme_panel .resultCard,
  #theme_panel .stageCard{
    padding: 10px !important;
    border-radius: 14px !important;
  }

  #theme_panel .cardKicker{ font-size: 11px !important; }
  #theme_panel .cardSub{ font-size: 14px !important; }

  #theme_panel .cardMain span[id$="Cv"]:not(#gainCv){
    font-size: 38px !important;
  }

  #theme_panel #gainCv,
  #theme_panel #gainNm{
    font-size: 13px !important;
    padding: 6px 9px !important;
    border-radius: 999px !important;
  }

  #theme_panel #ecuChips .chip,
  #theme_panel #ecuChips > *{
    font-size: 9px !important;
    padding: 4px 7px !important;
    border-radius: 999px !important;
  }

  #theme_panel .note{ font-size: 11px !important; }
  #theme_panel #btnBook{
    font-size: 14px !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
  }
}

@media (max-width: 768px){

  /* Base générale */
  #theme_panel{ font-size: var(--sim-mobile-font) !important; }
  #theme_panel .sim-inner{ padding: var(--sim-mobile-pad) calc(var(--sim-mobile-pad) + 2px) calc(var(--sim-mobile-pad) + 2px) !important; }

  /* Titre */
  #theme_panel .theme_panel_header{
    font-size: 16px !important;
    margin: 4px 0 2px !important;
    padding: 6px 0 4px !important;
    letter-spacing: .10em !important;
  }

  /* Selects + bouton voir */
  #theme_panel select{
    padding: 9px 32px 9px 9px !important;
    font-size: var(--sim-mobile-font) !important;
    border-radius: 10px !important;
  }
  #theme_panel #btnShow{
    padding: 9px 10px !important;
    font-size: var(--sim-mobile-btn) !important;
    border-radius: 12px !important;
  }

  /* Titre véhicule */
  #theme_panel #carTitle{ font-size: 22px !important; }
  #theme_panel #carMeta{ font-size: 10px !important; }

  /* Stage 1/2 */
  #theme_panel #btnStage1,
  #theme_panel #btnStage2{
    font-size: 11px !important;
    padding: 7px 9px !important;
    border-radius: 999px !important;
  }

  /* Cartes résultats */
  #theme_panel .resultCard,
  #theme_panel .stageCard{
    padding: var(--sim-mobile-card-pad) !important;
    border-radius: 14px !important;
  }
  #theme_panel .cardKicker{ font-size: 10px !important; letter-spacing: .16em !important; }
  #theme_panel .cardSub{ font-size: 13px !important; }

  /* Gros chiffres CV (sauf gainCv) */
  #theme_panel .cardMain span[id$="Cv"]:not(#gainCv){
    font-size: var(--sim-mobile-cv) !important;
  }

  /* Nm / petits textes */
  #theme_panel .cardMain .unit,
  #theme_panel .cardMain .unitNm,
  #theme_panel .cardMain small{
    font-size: 11px !important;
  }

  /* Badges gains */
  #theme_panel #gainCv,
  #theme_panel #gainNm{
    font-size: 12px !important;
    padding: 5px 8px !important;
    border-radius: 999px !important;
  }

  /* ECU chips (noms "Bosch EDC...") */
  #theme_panel #ecuChips .chip,
  #theme_panel #ecuChips > *{
    font-size: var(--sim-mobile-ecu) !important;
    padding: 4px 7px !important;
    border-radius: 999px !important;
  }

  /* Note + bouton réserver */
  #theme_panel .note{ font-size: 10px !important; }
  #theme_panel #btnBook{
    font-size: 14px !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
  }
}


/* =========================================================
   AJUSTEMENT ESPACEMENTS — chiffres ↔ unités (Cv / Nm)
   ========================================================= */
#theme_panel .cardMain{
  gap: 4px !important;
  margin-bottom: 6px !important;
}
#theme_panel .unit{
  margin-left: 6px !important;
}
#theme_panel .cardSub{
  gap: 4px !important;
}


/* =========================================================
   SCROLL — assurer que la scrollbar atteint le bas du menu
   ========================================================= */
#theme_panel .sim-inner{
  padding-bottom: 18px !important;
}
#theme_panel .sim-inner::after{
  content:"";
  display:block;
  height: 8px;
}
#theme_panel .bookingWrap{
  margin-bottom: 0 !important;
}


/* =========================================================
   AJUSTEMENT FIN — chiffres ↔ unités + mise en valeur "CV"
   - Réduit encore légèrement l'espace
   - Agrandit UNIQUEMENT "cv" sur Origine & Stage
   ========================================================= */

/* Resserre encore l'espace chiffres / unités */
#theme_panel .cardMain{
  gap: 2px !important;
  margin-bottom: 4px !important;
}
#theme_panel .cardSub{
  gap: 2px !important;
}

/* Unités Nm légèrement rapprochées */
#theme_panel .cardSub .unit,
#theme_panel .cardSub .unitNm{
  margin-left: 4px !important;
}

/* Agrandir UNIQUEMENT le "cv" (origine + stage), pas les gains */
#theme_panel #originCv + .unit,
#theme_panel #tunedCv + .unit{
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .02em;
}


/* =========================================================
   SEGMENT - ICONES (Voiture / Moto / Camion / Agricole)
   ========================================================= */
#theme_panel .segment.segment-icons{
  gap:12px;
}
#theme_panel .segment.segment-icons button{
  height:72px;
  padding:0;
  gap:0;
}
#theme_panel .segment.segment-icons button i{
  font-size:32px;
  line-height:1;
}
#theme_panel .segment.segment-icons button svg{ display:none; }

/* Accessibilité : texte uniquement pour lecteurs d'écran */
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}


/* Stage 2 indisponible */
#theme_panel #btnStage2.unavailable{
  position: relative;
  opacity: .75;
  padding-bottom: 20px; /* laisse la place au label */
}

.stage2-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.stage2-unavailable-label {
  margin-top: 12px;
  font-size: 12px;
  color: rgba(255, 70, 70, 0.85);
  text-transform: uppercase;
  letter-spacing: 1px;
}


/* Stage 2 wrap: keep 'STAGE 2' visible and show 'INDISPONIBLE' below */
.stage2-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
}

.stage2-unavailable-label{
  font-size:12px;
  line-height:1;
  color: rgba(255, 70, 70, 0.75);
  text-transform: uppercase;
  letter-spacing: 1px;
}


/* --- Stage 2 indisponible : label sous le bouton sans casser le menu --- */
#theme_panel .stageToggle { overflow: visible; }

#theme_panel #btnStage2.unavailable{
  position: relative;
  opacity: 0.6;
  cursor: not-allowed;
}

/* Affiche "INDISPONIBLE" juste sous STAGE 2 quand le JS met la classe .unavailable */
#theme_panel #btnStage2.unavailable::after{
  content: "non référencé";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  /* plus collé à "STAGE 2" */
  top: calc(100% - 6px);
  font-size: 11px;
  font-weight: 700;
  color: #e04646;
  letter-spacing: 0.4px;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
}



/* =========================
   OPTION 2 — Custom dropdowns (scrollbar stylée)
   ========================= */
#theme_panel select.cs2-native{
  opacity: 0 !important;
  pointer-events: none !important;
}

#theme_panel .cs2{
  position: absolute;
  inset: 0;
  z-index: 5;
}

#theme_panel .selectWrap:after{ z-index: 6; } /* flèche au-dessus */

#theme_panel .cs2-btn{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  text-align: left;
  outline: none;
  background: transparent; /* les vraies couleurs sont copiées en JS */
}

#theme_panel .cs2.is-disabled .cs2-btn,
#theme_panel .cs2-btn:disabled{
  cursor: default;
}

#theme_panel .cs2-left{
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#theme_panel .cs2-right{
  flex: 0 0 auto;
  opacity: 0.65; /* indicateur/année un peu plus foncé */
  font-weight: 700;
  white-space: nowrap;
}


/* Backdrop plein écran (mobile-safe) : empêche les taps/clics derrière le menu */
.cs2-backdrop{
  position: fixed;
  inset: 0;
  z-index: 2147483646; /* juste sous le menu */
  background: transparent;
  display: none;
  touch-action: none; /* évite les scroll/taps qui fuient sur iOS */
}
.cs2-backdrop.show{ display: block; }

/* Portal menu (dans body) */
.cs2-menu{
  display: none;
  overflow: auto;
  padding: 6px 0;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
}

.cs2-menu.show{ display: block; }

.cs2-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  cursor: pointer;
}

.cs2-item .cs2-left{
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cs2-item:hover{ background: rgba(255,255,255,.06); }
.cs2-item.active{ background: rgba(255,255,255,.10); }
.cs2-item.disabled{ opacity: .45; cursor: default; }

/* Scrollbar style (comme le reste du menu) */
.cs2-menu{
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) rgba(255,255,255,.06);
}
.cs2-menu::-webkit-scrollbar{ width: 10px; }
.cs2-menu::-webkit-scrollbar-track{
  background: rgba(255,255,255,.06);
  border-radius: 999px;
}
.cs2-menu::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.22);
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.06);
}
.cs2-menu::-webkit-scrollbar-thumb:hover{
  background: rgba(255,255,255,.30);
}



/* =========================
   SELECTEURS INACTIFS (grisés)
   ========================= */
#theme_panel .cs2.is-disabled .cs2-btn{
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  filter: grayscale(0.35);
}

#theme_panel .selectWrap.cs2-wrap-disabled:after{
  opacity: 0.35 !important;
}

#theme_panel .selectWrap.cs2-wrap-disabled{
  opacity: 0.85; /* léger voile global (garde lisible) */
}

#theme_panel .selectWrap.cs2-wrap-disabled .cs2-right{
  opacity: 0.45;
}

/* Custom select OPTION 2 */
#theme_panel .cs2.is-disabled .cs2-btn {
  opacity: 0.45;
  cursor: not-allowed;
  filter: grayscale(0.35);
}

#theme_panel .cs2.is-disabled {
  pointer-events: none;
}


/* =========================================================
   BULLE INFO — SIMULATEUR (fix scintillement)
   ========================================================= */

#sim_hint{
  position: fixed;
  right: 22px;
  bottom: 95px;
  z-index: 11001;

  background: linear-gradient(180deg,#1b1c1f,#141518);
  color: #e6e6e6;

  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;

  padding: 10px 14px;
  font-size: 13px;
  letter-spacing: .02em;

  backdrop-filter: blur(6px);

  opacity: 0;
  transform: translateY(8px);
  transition: opacity .35s ease, transform .35s ease;

  pointer-events: none;
  white-space: nowrap;

  will-change: opacity, transform;
}

#sim_hint.show{
  opacity: 1;
  transform: translateY(0);
}

/* flèche vers le bouton */

#sim_hint::after{
  content:"";
  position:absolute;
  bottom:-7px;
  right:26px;

  width:12px;
  height:12px;

  background:#141518;

  border-right:1px solid rgba(255,255,255,0.08);
  border-bottom:1px solid rgba(255,255,255,0.08);

  transform:rotate(45deg);
}

/* mobile */

@media (max-width:480px){
  #sim_hint{
    right:16px;
    bottom:100px;
    max-width:calc(100vw - 40px);
    white-space:normal;
  }
}
}
}




/* =========================================================
   SUPPRESSION DES OMBRES — SIMULATEUR
   ========================================================= */

/* panneau simulateur */
#theme_panel,
.sim-panel,
.simulateur-panel{
  box-shadow: none !important;
}

/* bouton rouge ouverture */
#sim_fab,
.sim_fab,
.sim-fab{
  box-shadow: none !important;
  filter: none !important;
}

/* menu interne du simulateur */
#theme_panel *{
  box-shadow: none !important;
}



/* =========================================================
   SUPPRESSION TOTALE DES OMBRES — SIMULATEUR
   ========================================================= */

#theme_panel{
  box-shadow:none !important;
  filter:none !important;
}

#theme_panel,
#theme_panel *{
  box-shadow:none !important;
  filter:none !important;
}

#sim_fab,
.sim_fab,
.sim-fab{
  box-shadow:none !important;
  filter:none !important;
}

#theme_panel::before,
#theme_panel::after,
#sim_fab::before,
#sim_fab::after{
  box-shadow:none !important;
  filter:none !important;
  background:none !important;
}





.cs2-menu{
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
}

.cs2-item{
  touch-action: pan-y;
}

/* =========================================================
   PATCH SCROLL MOBILE — bloque le scroll chaîné page ↔ menu
   ========================================================= */
#theme_panel .sim-inner,
.cs2-menu{
  overscroll-behavior-y: contain;
  overscroll-behavior-x: none;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}

#theme_panel .sim-inner{
  overflow-y: auto;
}
