/* Page Suite EduPrivacy sur netoragroup.com
   1) Ajustements à la barre Netora World (68 px de haut).
   2) Mode sombre : <html data-theme="dark">. Le mode clair est le style d'origine (style.css), inchangé. */

.ep .subnav { top: 68px; }

/* ---------- Mode sombre ---------- */
html[data-theme="dark"] .ep {
  --navy: #eef3fa; --blue: #7fb0ff; --blue-soft: rgba(127, 176, 255, .12);
  --ink: #dbe5f2; --muted: #9fb0c6; --line: rgba(255, 255, 255, .1);
  --bg: #071226; --alt: #0b1830;
  --shadow: 0 10px 30px rgba(0, 0, 0, .35);
  color-scheme: dark;
}
html[data-theme="dark"] .ep .lux-kicker.dark { color: var(--gold-2); }

/* Fonds des sections claires */
html[data-theme="dark"] .ep .su-alt { background: #0b1830; }
html[data-theme="dark"] .ep .section:not(.su-alt):not(.su-dark) { background: #071226; }

/* Cartes et blocs blancs */
html[data-theme="dark"] .ep .su-tool,
html[data-theme="dark"] .ep .su-calc,
html[data-theme="dark"] .ep .su-visio,
html[data-theme="dark"] .ep .feat,
html[data-theme="dark"] .ep .faq details,
html[data-theme="dark"] .ep .panel,
html[data-theme="dark"] .ep .panel-white { background: #0f1f3a; border-color: rgba(201, 164, 92, .18); box-shadow: 0 18px 44px rgba(0, 0, 0, .3); }
html[data-theme="dark"] .ep .su-access { background: #0b1830; border-color: rgba(201, 164, 92, .18); }
html[data-theme="dark"] .ep .su-tool:hover { border-color: var(--gold); box-shadow: 0 20px 44px rgba(0, 0, 0, .45); }
html[data-theme="dark"] .ep .su-tool strong,
html[data-theme="dark"] .ep .su-access h3,
html[data-theme="dark"] .ep .su-steps strong,
html[data-theme="dark"] .ep .su-calc h3,
html[data-theme="dark"] .ep .su-calc dd { color: #f3f6fb; }
html[data-theme="dark"] .ep .su-tool-ico { background: #050b17; border: 1px solid rgba(201, 164, 92, .25); }
html[data-theme="dark"] .ep .card-ico { background: rgba(127, 176, 255, .12); color: #9cc0ff; }
html[data-theme="dark"] .ep .checks .ico { color: #9cc0ff; }
html[data-theme="dark"] .ep .faq summary { color: #f3f6fb; }
html[data-theme="dark"] .ep .faq summary::after { color: var(--gold-2); }

/* Captures : cadre « navigateur » */
html[data-theme="dark"] .ep .su-shot,
html[data-theme="dark"] .ep .su-mail { border-color: rgba(255, 255, 255, .12); box-shadow: 0 30px 70px rgba(0, 0, 0, .5); }
html[data-theme="dark"] .ep .su-bar { background: #1b2333; border-bottom-color: #283245; }
html[data-theme="dark"] .ep .su-bar span { background: #0f1622; color: #8b97a8; }
html[data-theme="dark"] .ep .su-phone { border-color: #000; }

/* Onglets bureautique */
html[data-theme="dark"] .ep .su-tab { background: #0f1f3a; color: #dbe5f2; border-color: rgba(255, 255, 255, .14); }
html[data-theme="dark"] .ep .su-tab[aria-selected="true"] { color: #fff; border-color: transparent; }

/* Étapes de signature */
html[data-theme="dark"] .ep .su { --su-green: #2f7a5a; }
html[data-theme="dark"] .ep .su-steps li:not(:last-child)::after { background: linear-gradient(var(--su-green), rgba(255, 255, 255, .12)); }

/* Sous-menu collant */
html[data-theme="dark"] .ep .subnav { background: rgba(7, 18, 38, .96); border-bottom-color: rgba(255, 255, 255, .08); box-shadow: 0 6px 18px rgba(0, 0, 0, .35); }
html[data-theme="dark"] .ep .su-subnav .subnav-in > a:not(.btn) { color: #9fb0c6; }
html[data-theme="dark"] .ep .su-subnav .subnav-in > a:not(.btn):hover,
html[data-theme="dark"] .ep .su-subnav .subnav-in > a.on { color: #071226; background: var(--gold-2); }

/* Estimateur */
html[data-theme="dark"] .ep .su-calc dl div { border-bottom-color: rgba(255, 255, 255, .08); }
html[data-theme="dark"] .ep .su-calc dl div:first-child dd { color: var(--gold-2); }
html[data-theme="dark"] .ep .su-range input[type=range] { accent-color: var(--gold); }
html[data-theme="dark"] .ep .su-range input[type=number] { background: #071226; color: #f3f6fb; border-color: rgba(255, 255, 255, .18); }

/* Boutons */
html[data-theme="dark"] .ep .btn:not(.btn-gold):not(.btn-outline-light) { background: #2f6fd6; color: #fff; }
html[data-theme="dark"] .ep .btn:not(.btn-gold):not(.btn-outline-light):hover { background: #4a86e8; }
html[data-theme="dark"] .ep .subnav .subnav-in > a.btn { background: #2f6fd6; color: #fff; }

/* Formulaire */
html[data-theme="dark"] .ep .form input,
html[data-theme="dark"] .ep .form select,
html[data-theme="dark"] .ep .form textarea { background: #071226; color: #f3f6fb; border-color: rgba(255, 255, 255, .18); }
html[data-theme="dark"] .ep .form input::placeholder,
html[data-theme="dark"] .ep .form textarea::placeholder { color: #6f8099; }
html[data-theme="dark"] .ep .seg label { border-color: rgba(255, 255, 255, .18); }
html[data-theme="dark"] .ep .seg label:has(input:checked) { border-color: #7fb0ff; background: rgba(127, 176, 255, .14); color: #fff; }
html[data-theme="dark"] .ep .alert.ok { background: rgba(34, 197, 94, .14); color: #86efac; }
html[data-theme="dark"] .ep .alert.err { background: rgba(239, 68, 68, .14); color: #fca5a5; }

/* Étiquettes flottantes du haut de page */
html[data-theme="dark"] .ep .float-tag { background: #0f1f3a; color: #f3f6fb; border: 1px solid rgba(201, 164, 92, .3); box-shadow: 0 12px 30px rgba(0, 0, 0, .45); }

/* Sous-menu des outils : tout tient sur une ligne, sans liens coupés.
   Écran large : barre plus large et liens plus serrés ; écran moyen : sans icônes ;
   petit écran : défilement horizontal avec fondu sur les bords. */
.ep .su-subnav .subnav-in { width: min(1400px, 100% - 32px); max-width: none; padding: 0; gap: 2px; justify-content: space-between; }
.ep .su-subnav .subnav-in > a:not(.btn) { padding: 6px 9px; font-size: .88rem; }
.ep .su-subnav .subnav-in > a.btn { margin-left: 8px; }
@media (max-width: 1320px) {
  .ep .su-subnav .subnav-in > a:not(.btn) .ico { display: none; }
}
@media (max-width: 1160px) {
  .ep .su-subnav .subnav-in > a:not(.btn) { padding: 6px 6px; font-size: .83rem; }
}
@media (max-width: 1080px) {
  .ep .su-subnav .subnav-in > a:not(.btn) { padding: 6px 9px; font-size: .88rem; }
  .ep .su-subnav .subnav-in { justify-content: flex-start; padding-inline: 4px; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%); }
  .ep .su-subnav .subnav-in > a:not(.btn) .ico { display: inline-block; }
}