/* Lecteur de formations — styles communs à l'Espace conseiller et à l'Espace formation des clients.
   Utilise les variables de couleur de la page (--navy, --gold, --light, --hair, --muted, --ink, --ok, --fd, --fb) et ses boutons .btn */
.mods{list-style:none;padding:0;margin:12px 0 18px;display:grid;gap:8px}
.mods li{display:flex;gap:12px;align-items:center;font-size:.9rem;padding:10px 12px;border:1px solid var(--hair);border-radius:10px}
.mods li i{font-style:normal;font-size:.72rem;font-weight:700;color:var(--gold);min-width:28px}
.mods li em{margin-left:auto;font-style:normal;font-size:.72rem;color:var(--muted)}
.back{display:inline-block;color:var(--muted);font-size:.84rem;font-weight:600;margin-bottom:10px}
.back:hover{color:var(--gold)}
.lesson-media{width:100%;max-width:960px;border-radius:14px;background:#000;display:block;margin-bottom:16px}
.lesson-frame{position:relative;max-width:960px;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;margin-bottom:16px}
.lesson-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lesson-audio{max-width:960px;background:#fff;border:1px solid var(--hair);border-radius:12px;padding:12px 16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.lesson-audio b{display:flex;gap:8px;align-items:center;color:var(--navy);font-weight:600;font-size:.9rem}
.lesson-audio audio{flex:1;min-width:220px}
.lesson-text{max-width:760px;background:#fff;border:1px solid var(--hair);border-radius:16px;padding:clamp(20px,4vw,38px);font-size:1rem;line-height:1.7;margin:8px 0 22px}
.lesson-text h3{font-size:1.25rem;margin:1.6em 0 .6em;color:var(--navy)}
.lesson-text h3:first-child{margin-top:0}
.lesson-text p{margin:0 0 1em}
.lesson-text ul,.lesson-text ol{padding-left:1.3em;margin:0 0 1.1em}
.lesson-text li{margin-bottom:.45em}
.lesson-text strong{color:var(--navy)}
.lesson-nav{max-width:960px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mods li a:hover b{color:var(--gold)!important}
.catalog{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
.course-card{background:#fff;border:1px solid var(--hair);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:.18s}
.course-card:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 12px 24px rgba(13,27,62,.08)}
.cc-top{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff;padding:22px;min-height:120px;display:flex;flex-direction:column;justify-content:space-between;gap:10px}
.cc-top b{font-family:var(--fd);font-weight:400;font-size:1.3rem;line-height:1.25}
.cc-body{padding:18px 20px;display:flex;flex-direction:column;gap:12px;flex:1}
.cc-body p{margin:0;color:var(--muted);font-size:.87rem;flex:1}
.cc-meta{font-size:.78rem;color:var(--muted);font-weight:600}
.bar{height:6px;border-radius:99px;background:var(--light);overflow:hidden}
.bar i{display:block;height:100%;background:var(--gold);border-radius:99px;transition:width .4s}
.progress-line{display:flex;align-items:center;gap:14px;max-width:560px;margin:-10px 0 22px}
.progress-line .bar{flex:1}
.progress-line span{font-size:.82rem;color:var(--muted);white-space:nowrap}
.module{background:#fff;border:1px solid var(--hair);border-radius:14px;margin-bottom:10px;max-width:900px}
.module summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;padding:16px 18px;font-family:var(--fd);font-size:1.08rem;color:var(--navy)}
.module summary::-webkit-details-marker{display:none}
.module summary::after{content:"+";color:var(--gold);font-family:var(--fb);font-weight:700}
.module[open] summary::after{content:"–"}
.module summary em{font-style:normal;font-family:var(--fb);font-size:.78rem;color:var(--muted);margin-left:auto;align-self:center}
.module .mods{margin:0;padding:0 14px 14px}
.mods .chk{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--hair);display:grid;place-items:center;flex:none;color:#fff;min-width:22px}
.mods li.is-done .chk{background:var(--ok);border-color:var(--ok)}
.playlist{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:14px;max-width:1100px;margin-bottom:16px}
.playlist .lesson-media{margin:0}
.chapters{display:flex;flex-direction:column;gap:6px;max-height:520px;overflow:auto}
.chapters button{display:flex;gap:10px;align-items:center;text-align:left;border:1px solid var(--hair);background:#fff;border-radius:10px;padding:10px 12px;font-size:.86rem;color:var(--ink)}
.chapters button i{font-style:normal;font-size:.72rem;font-weight:700;color:var(--gold);min-width:18px}
.chapters button.on{border-color:var(--navy);background:var(--navy);color:#fff}
.lesson-links{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.lesson-text a{color:var(--navy);font-weight:600;text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px;overflow-wrap:anywhere}
.lesson-text.lb h1{font-family:var(--fd);font-weight:400;font-size:1.3rem;color:var(--navy);margin:1.2em 0 .5em}
.lesson-text.lb img{max-width:100%;height:auto;border-radius:10px}
.lesson-text.lb figure{margin:12px 0}
.slides-wrap{position:relative;margin:14px 0 18px}
.slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;border-radius:12px;background:var(--navy);scrollbar-width:none}
.slides::-webkit-scrollbar{display:none}
.slides img{flex:0 0 100%;width:100%;scroll-snap-align:center;object-fit:contain;max-height:72vh;border-radius:0!important;background:var(--navy)}
.sl-prev,.sl-next{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.9);color:var(--navy);font-size:1.4rem;line-height:1;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.sl-prev{left:10px}.sl-next{right:10px}
.sl-count{position:absolute;right:12px;bottom:10px;background:rgba(9,20,48,.75);color:#fff;font-size:.74rem;font-weight:600;padding:3px 9px;border-radius:99px}
.done-btn svg{margin-right:2px}
@media (max-width:860px){ .playlist{grid-template-columns:1fr} .chapters{max-height:none} }
.mods li a.mod-link{display:flex;gap:12px;align-items:center;width:100%}
.mods li a.mod-link b{color:var(--navy);font-weight:600}
.all-done{color:var(--ok);font-weight:600;margin-top:18px}
.lesson-text table{width:100%;border-collapse:collapse;margin:12px 0 20px;font-size:.88rem;display:block;overflow-x:auto}
.lesson-text th,.lesson-text td{border:1px solid var(--hair);padding:8px 10px;text-align:left;vertical-align:top}
.lesson-text thead th{background:var(--navy);color:#fff;font-weight:600}
.lesson-text tbody tr:nth-child(even) td{background:#FAFBFD}
.maj-note{background:#EAF5EF;border-left:4px solid var(--ok);border-radius:8px;padding:10px 14px;font-size:.9rem;color:var(--ink)}
.maj-box{background:#F6F1E3;border:1px solid rgba(201,168,76,.45);border-radius:12px;padding:14px 18px;margin:0 0 18px}
.maj-box ul{margin:6px 0 10px}

/* contenu des formations centré ; le texte prend la même largeur que la vidéo */
.course-wrap,.course-page{max-width:920px;margin-left:auto;margin-right:auto}
.course-wrap .module{max-width:none}
.course-page .progress-line{max-width:none}
.lesson-wrap{max-width:1000px;margin:0 auto}
.lesson-wrap .lesson-media,.lesson-wrap .lesson-frame,.lesson-wrap .lesson-audio,.lesson-wrap .lesson-text,.lesson-wrap .lesson-nav,.lesson-wrap .playlist{max-width:none;margin-left:auto;margin-right:auto}
.lesson-wrap .head{justify-content:center;text-align:center}
.lesson-wrap .head h1{margin-left:auto;margin-right:auto}
.lesson-wrap .lesson-links{justify-content:center}
.lesson-wrap > p{text-align:center}
.lesson-wrap .lesson-text{font-size:1.02rem}