
/* TrainingLoad Pro — Formation : identité graphique commune */
:root{
  --tlp-navy:#0e2340;
  --tlp-navy-2:#183f69;
  --tlp-blue:#00a4e5;
  --tlp-green:#afca3e;
  --tlp-green-dark:#78931c;
  --tlp-green-soft:#f5f8e8;
  --tlp-ink:#182436;
  --tlp-muted:#667085;
  --tlp-line:#e4e9ee;
  --tlp-soft:#f7f9fa;
  --tlp-white:#fff;
}
html{background:#fff}
body{
  background:#fff!important;
  color:var(--tlp-ink)!important;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
a{transition:color .15s ease,background .15s ease,border-color .15s ease}
a:hover{color:var(--tlp-blue)}
/* En-tête général, identique aux autres espaces */
.tlp-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--tlp-line)}
.tlp-header__inner{max-width:1180px;height:82px;margin:0 auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.tlp-header__brand{font-family:Georgia,"Times New Roman",serif;font-size:25px;font-weight:700;line-height:1;color:var(--tlp-navy)!important;letter-spacing:-.02em;text-decoration:none!important;white-space:nowrap}
.tlp-header__nav{display:flex;align-items:center;gap:28px}
.tlp-header__nav a{font-size:15px;font-weight:400;line-height:1;color:var(--tlp-navy)!important;text-decoration:none!important;white-space:nowrap}
.tlp-header__nav a:hover,.tlp-header__nav a.is-active{color:var(--tlp-blue)!important}
.tlp-header__account{padding:10px 16px!important;border:1px solid var(--tlp-line)!important;border-radius:999px!important;background:#fff!important}
/* Contexte Formation */
.tlp-training-context{background:var(--tlp-soft);border-bottom:1px solid var(--tlp-line)}
.tlp-training-context-inner{max-width:1180px;min-height:52px;margin:auto;padding:8px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.tlp-training-title{font-family:Georgia,"Times New Roman",serif;color:var(--tlp-navy);font-weight:700;font-size:15px}
.tlp-training-sub{font-size:13px;color:var(--tlp-muted)}
/* Navigation locale des TD / QCM / espace */
.nav,.top{
  background:var(--tlp-soft)!important;
  color:var(--tlp-navy)!important;
  border-bottom:1px solid var(--tlp-line)!important;
  box-shadow:none!important;
}
.nav{top:134px!important}
.nav-logo,.nav strong,.top strong{color:var(--tlp-navy)!important;font-family:Georgia,"Times New Roman",serif!important}
.nav-links a,.nav a,.top a{color:#596579!important}
.nav-links a:hover,.nav a:hover,.top a:hover{color:var(--tlp-blue)!important}
.nav-cta{
  color:var(--tlp-green-dark)!important;
  background:#fff!important;
  border:1px solid rgba(175,202,62,.6)!important;
}
.nav-parcours{
  color:var(--tlp-navy)!important;
  background:#fff!important;
  border:1px solid var(--tlp-line)!important;
}
/* Heroes internes : logique Ouvrages */
.hero,.page-hero,.welcome{
  background:#fff!important;
  color:var(--tlp-navy)!important;
  border-bottom:1px solid var(--tlp-line)!important;
  box-shadow:none!important;
}
.hero h1,.page-hero h1,.welcome h1{
  color:var(--tlp-navy)!important;
  font-family:Georgia,"Times New Roman",serif!important;
}
.hero h1 em{color:#647287!important}
.hero-sub,.hero p,.page-hero p,.welcome p{color:#596579!important}
.hero-eyebrow,.eyebrow,.section-eyebrow,.gate-eyebrow{
  color:var(--tlp-green-dark)!important;
}
.hero-bg-circle{border-color:rgba(175,202,62,.12)!important}
.hero-scroll{display:none!important}
/* Surfaces */
.card,.module,.panel,.quiz-card,.dashboard-card,.summary-card,.gate-card,.progress-card,
.module-summary-card,.td-card,.certification-card,.profile-card{
  background:#fff!important;
  border-color:var(--tlp-line)!important;
  box-shadow:0 8px 26px rgba(14,35,64,.05)!important;
}
.wrap,.container{color:var(--tlp-ink)}
h1,h2,h3,h4{color:var(--tlp-navy)}
/* Ancienne couleur or -> vert de marque */
.question-pill-dot,.dot,.check,.step-num,.gate-step-num{background:var(--tlp-green)!important}
.progress-fill,.fill{background:linear-gradient(90deg,var(--tlp-blue),var(--tlp-green))!important}
.prose-pivot{color:var(--tlp-green-dark)!important}
.formateur-tag{color:var(--tlp-green-dark)!important;background:var(--tlp-green-soft)!important;border-color:rgba(175,202,62,.35)!important}
/* Boutons */
.btn,.button,input[type=submit],button.primary,.btn-primary,.btn-qcm,.hero-parcours-btn{
  background:var(--tlp-navy)!important;
  color:#fff!important;
  border-color:var(--tlp-navy)!important;
  box-shadow:none!important;
}
.btn:hover,.button:hover,input[type=submit]:hover,.btn-primary:hover,.btn-qcm:hover,.hero-parcours-btn:hover{
  background:#173759!important;
}
.hero-programme-btn,.btn-outline{
  color:var(--tlp-navy)!important;
  background:#fff!important;
  border:1px solid #cfd7df!important;
}
.note,.callout,.info-box{
  background:var(--tlp-green-soft)!important;
  border-color:rgba(175,202,62,.45)!important;
  color:#526075!important;
}
/* Menus mobiles */
.nav-hamburger span{background:var(--tlp-navy)!important}
.nav-mobile-menu{background:#fff!important;border-bottom:1px solid var(--tlp-line)!important}
.nav-mobile-menu a{color:#596579!important;border-bottom-color:var(--tlp-line)!important}
.nav-mobile-menu a:hover{color:var(--tlp-blue)!important}
/* Pied de page quand présent */
footer,.footer{background:#fff!important;color:var(--tlp-muted)!important;border-top:1px solid var(--tlp-line)!important}
@media(max-width:900px){
  .tlp-header__inner{height:72px;padding:0 20px}
  .tlp-header__nav{gap:14px}
  .tlp-header__nav a:not(.tlp-header__account){display:none}
  .tlp-header__brand{font-size:22px}
  .tlp-training-context-inner{display:block;padding:10px 20px}
  .tlp-training-sub{margin-top:3px}
  .nav{top:0!important;position:relative!important}
}


/* ==========================================================
   QCM — version éditoriale claire, cohérente avec Ouvrages
   ========================================================== */
.qcm-hero{
  background:#fff!important;
  color:var(--tlp-navy)!important;
  padding:64px 40px 52px!important;
  border-bottom:1px solid var(--tlp-line)!important;
}
.qcm-hero::before{
  border-color:rgba(175,202,62,.18)!important;
}
.qcm-hero-eyebrow{
  color:var(--tlp-green-dark)!important;
}
.qcm-hero h1{
  color:var(--tlp-navy)!important;
}
.qcm-hero h1 em{
  color:#647287!important;
}
.qcm-hero-sub{
  color:#667085!important;
}
.phase-bar{
  background:var(--tlp-soft)!important;
  border-bottom:1px solid var(--tlp-line)!important;
}
.phase-label{color:#667085!important}
.phase-btn{
  background:#fff!important;
  border-color:#d9e0e6!important;
  color:#596579!important;
}
.phase-btn:hover{
  border-color:var(--tlp-green)!important;
  color:var(--tlp-green-dark)!important;
}
.phase-btn.active{
  background:var(--tlp-navy)!important;
  border-color:var(--tlp-navy)!important;
  color:#fff!important;
}
.phase-indicator{
  background:#fff!important;
  color:var(--tlp-navy)!important;
  border:1px solid var(--tlp-line)!important;
  box-shadow:0 6px 20px rgba(14,35,64,.04)!important;
}
.phase-indicator-dot{background:var(--tlp-green)!important}
.phase-indicator-text strong{color:var(--tlp-green-dark)!important}
.bloc-number{
  background:var(--tlp-green-soft)!important;
  color:var(--tlp-green-dark)!important;
  border:1px solid rgba(175,202,62,.35)!important;
}
.bloc-title-group h2{color:var(--tlp-navy)!important}
.question-card{
  border:1px solid var(--tlp-line)!important;
  box-shadow:0 4px 18px rgba(14,35,64,.04)!important;
}
.question-meta-type{
  background:#eef7fb!important;
  color:#167aa5!important;
}
.option-label{
  background:#fff!important;
  border-color:#dce2e7!important;
}
.option-label:hover{
  border-color:var(--tlp-green)!important;
  background:var(--tlp-green-soft)!important;
}
.option-label input[type="radio"],
.option-label input[type="checkbox"]{
  accent-color:var(--tlp-green-dark)!important;
}
.explication{
  background:var(--tlp-green-soft)!important;
  border-left-color:var(--tlp-green)!important;
  color:#526075!important;
}
.explication-title{color:var(--tlp-green-dark)!important}
.progress-fill{
  background:linear-gradient(90deg,var(--tlp-blue),var(--tlp-green))!important;
}
.score-panel{
  background:#fff!important;
  color:var(--tlp-navy)!important;
  border:1px solid var(--tlp-line)!important;
  box-shadow:0 8px 30px rgba(14,35,64,.06)!important;
}
.score-panel::before{background:none!important}
.score-eyebrow{color:var(--tlp-green-dark)!important}
.score-fraction,.score-label,.score-message{color:#667085!important}
.score-bar-wrap{background:#edf0f2!important}
.score-bar-fill{background:linear-gradient(90deg,var(--tlp-blue),var(--tlp-green))!important}
.back-td-btn{
  background:var(--tlp-green)!important;
  color:var(--tlp-navy)!important;
  box-shadow:none!important;
}
.back-td-btn:hover{background:#a1bd31!important}
.qcm-container,.quiz-container,main.container{
  background:#fff!important;
}


/* ==========================================================
   TD — correction du hero après harmonisation
   ========================================================== */
/* Les pages TD conservaient min-height:92vh de leur ancien thème.
   Le fond était bien devenu blanc, mais la hauteur restait celle
   de l'ancien grand hero sombre, d'où l'immense espace vide. */
body .hero{
  min-height:auto!important;
  padding:64px 40px 54px!important;
  justify-content:center!important;
}
body .hero-badge{
  color:var(--tlp-green-dark)!important;
  border:0!important;
  background:transparent!important;
  padding:0!important;
  margin-bottom:18px!important;
}
body .hero h1{
  margin-bottom:14px!important;
}
body .hero-sub{
  margin-bottom:0!important;
}
body .hero-bg-circle:nth-child(1),
body .hero-bg-circle:nth-child(2),
body .hero-bg-circle:nth-child(3){
  border-color:rgba(175,202,62,.10)!important;
}
body .hero-scroll{
  display:none!important;
}
@media(max-width:900px){
  body .hero{padding:48px 24px 42px!important}
}


/* ==========================================================
   Correction sticky — contexte Formation + navigation locale
   ========================================================== */

/* Le bandeau "Formation · Analyse des données / De la collecte..."
   doit rester visible sous le header général. */
.tlp-training-context{
  position:sticky!important;
  top:82px!important;
  z-index:950!important;
  background:rgba(247,249,250,.98)!important;
  backdrop-filter:blur(10px)!important;
}

/* La navigation locale vient ensuite, sous le contexte Formation. */
.nav{
  position:sticky!important;
  top:134px!important; /* 82 px header + ~52 px contexte */
  z-index:900!important;
}

/* Sur mobile le header général fait 72 px et le contexte repasse dans le flux
   pour éviter d'empiler trop de barres sur un petit écran. */
@media(max-width:900px){
  .tlp-training-context{
    position:relative!important;
    top:auto!important;
  }
  .nav{
    position:relative!important;
    top:auto!important;
  }
}


/* ==========================================================
   V5 — Pages internes : suppression du bandeau contexte redondant
   ========================================================== */
body .tlp-header + .nav,
body .tlp-header + .top,
body .tlp-header ~ .nav:first-of-type{
  top:82px!important;
}

/* Si le bandeau contexte n'est pas présent, la nav locale colle
   directement sous le header général. */
body:not(:has(.tlp-training-context)) .nav{
  top:82px!important;
}

@media(max-width:900px){
  body:not(:has(.tlp-training-context)) .nav{
    top:auto!important;
    position:relative!important;
  }
}


/* V6 — internal pages without the editorial context strip */
.internal-formation-page .nav{top:82px!important}
