/* ============================================================
   cours.css - Espace cours (module cours), présentation refaite au
   style de la maquette (espace / matière / séance / connexion), en
   palette Ardoise. Utilise les jetons de site.css (--blue, --teal,
   --ink, --card, --line, --muted, --deep, --cat...). Présentation
   uniquement : la logique et les données du module sont inchangées.
   ============================================================ */

/* ---- Fil d'Ariane + cartouche catégorie ---- */
.crumbs{font-family:var(--display); font-size:13px; color:var(--muted); margin:0 0 18px; padding-top:36px}
.crumbs a{color:var(--teal); text-decoration:none}
.crumbs a:hover{color:var(--blue)}
.cat-tag{--cat:var(--blue); display:inline-flex; align-items:center; gap:8px; font-family:var(--display); font-weight:700; font-size:12px; letter-spacing:.13em; text-transform:uppercase; color:var(--cat)}
.cat-tag .cat-dot{width:8px; height:8px; border-radius:50%; background:var(--cat)}
.info-48h{display:inline-flex; align-items:center; gap:6px; font-family:var(--display)}

.btn-locked{opacity:.6}
.btn-disabled{opacity:.4; pointer-events:none}

/* ============ ESPACE (tableau de bord) ============ */
.espace{max-width:var(--maxw); margin:0 auto; padding:44px 28px 72px}
.espace-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:30px; flex-wrap:wrap; gap:16px}
.espace-head .eyebrow{display:block; margin-bottom:6px}
.espace-head h1{font-family:var(--display); font-weight:600; font-size:32px; margin:0}
.espace-head p{font-size:15px; color:var(--muted); margin:8px 0 0}
.subtitle{font-family:var(--display); font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:700; margin:0 0 16px}
.matieres{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.mat-card{--cat:var(--blue); display:block; background:var(--card); border:1px solid var(--line); border-top:3px solid var(--cat); border-radius:12px; padding:22px 24px; text-decoration:none; color:var(--ink); transition:transform .15s, box-shadow .15s}
.mat-card:hover{transform:translateY(-3px); box-shadow:0 16px 40px -18px rgba(15,34,49,.35)}
.mat-card .top{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:16px}
.mat-card .icon{width:46px; height:46px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:800; font-size:16px; color:#fff; background:var(--cat); letter-spacing:.02em}
.mat-card .badge{font-family:var(--display); font-size:11px; font-weight:700; letter-spacing:.04em; padding:5px 10px; border-radius:20px; color:var(--cat); background:color-mix(in srgb, var(--cat) 14%, var(--card))}
.mat-card h3{font-family:var(--display); font-weight:600; font-size:18px; margin:0 0 6px}
.mat-card .resume-txt{font-size:13px; color:var(--muted); margin:0 0 16px; line-height:1.5}
.mat-card .plabel{font-family:var(--display); font-size:13px; font-weight:600; color:var(--cat)}
@media(max-width:820px){ .matieres{grid-template-columns:1fr} }

/* ============ MATIÈRE (chapitres / séances) ============ */
.matiere{max-width:1000px; margin:0 auto; padding:36px 28px 72px}
.matiere .cat{--cat:var(--blue); display:inline-flex; align-items:center; gap:8px; font-family:var(--display); font-weight:700; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--cat); margin-bottom:8px}
.matiere .cat .cat-dot, .matiere .cat .d{width:8px; height:8px; border-radius:50%; background:var(--cat)}
.matiere h1{font-family:var(--display); font-weight:700; font-size:32px; margin:0 0 6px}
.matiere .lvl{font-size:14px; color:var(--muted)}
.matiere .note, .info-48h{font-size:14px; color:var(--muted); margin-top:6px}
.hr{height:1px; background:var(--line); margin:26px 0 28px}
.chap-list, .chapters{display:flex; flex-direction:column; gap:22px; margin-top:24px}
.chap-block, .chapter{background:var(--card); border:1px solid var(--line); border-radius:12px; overflow:hidden}
.chap-title, .chapter-head{display:flex; align-items:center; gap:14px; padding:18px 22px; background:var(--card-2); border-bottom:1px solid var(--line); margin:0; font-family:var(--display); font-weight:600; font-size:18px}
.chap-num, .chapter-num{width:28px; height:28px; flex:none; border-radius:8px; background:var(--cat,var(--blue)); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px}
.seance-list{list-style:none; margin:0; padding:0}
.seance-list li{margin:0}
.seance-list a, .seance{display:flex; align-items:center; gap:16px; padding:14px 22px; border-bottom:1px dotted var(--line); border-left:3px solid transparent; text-decoration:none; color:inherit; transition:background .12s}
.seance-list a:hover, .seance:hover{background:var(--tint)}
.seance-list li:last-child a, .chapter .seance:last-child{border-bottom:none}
.s-num, .sn{font-family:var(--display); font-size:13px; font-weight:700; color:var(--cat,var(--teal)); white-space:nowrap; flex:none}
.s-titre, .st{flex:1; font-size:14px}
.s-date, .sd{font-size:12.5px; color:var(--muted); white-space:nowrap}
.seance-lock{display:flex; align-items:center; gap:16px; padding:14px 22px; border-bottom:1px dotted var(--line); color:var(--muted)}
.seance-lock .s-num{color:var(--muted)}
.seance-lock .s-titre{color:var(--muted)}
.seance-lock .s-lock{margin-left:auto; display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:var(--muted); white-space:nowrap}

/* ============ SÉANCE ============ */
.seance-page{max-width:840px; margin:0 auto; padding:36px 28px 72px}
.seance-page .cat, .seance .cat{--cat:var(--gold); display:inline-flex; align-items:center; gap:8px; font-family:var(--display); font-weight:700; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--cat); margin-bottom:12px}
.seance-page .cat .d{width:8px; height:8px; border-radius:50%; background:var(--cat)}
.seance-page h1{font-family:var(--display); font-weight:700; font-size:30px; margin:0 0 10px}
.seance-sub{color:var(--muted); margin:0 0 18px}
.seance-meta{display:flex; flex-wrap:wrap; gap:20px; font-family:var(--display); font-size:14px; color:var(--muted); margin-bottom:28px}
.panel{background:var(--card); border:1px solid var(--line); border-radius:8px; padding:22px 26px; margin-bottom:22px}
.panel h3{font-family:var(--display); font-weight:600; font-size:16px; margin:0 0 12px}
.panel ul{margin:0; padding-left:20px; font-size:15px; line-height:1.8; color:var(--ink)}

/* corps de séance (contenu importé) */
.seance-body{margin-top:18px; line-height:1.7; font-size:16px; color:var(--ink)}
.seance-body h2, .seance-body h2.sec{font-family:var(--display); font-weight:600; font-size:22px; display:flex; align-items:center; gap:12px; margin:1.6em 0 .5em}
.seance-body h2.sec .n{display:inline-grid; place-items:center; width:30px; height:30px; border-radius:8px; background:var(--cat,var(--blue)); color:#fff; font-size:14px}
.seance-body h3{font-family:var(--display); font-weight:600; font-size:17px; margin:1.2em 0 .4em}
.seance-body p{margin:0 0 1em}
.seance-body ul, .seance-body ol{margin:0 0 1.1em; padding-left:22px}
.seance-body .box{border-radius:10px; padding:14px 16px; margin:14px 0; border:1px solid var(--line)}
.seance-body .box.ok{background:#eef7f1; border-color:#cfe9da; color:#1c5a35}
.seance-body .box.warn{background:#fff6e9; border-color:#f2ddb9; color:#7a5a10}
.seance-body .box.info{background:var(--accent-soft); border-color:var(--line)}
.seance-body .box .bt{font-weight:700; margin-bottom:4px}
.seance-body .tbl{width:100%; border-collapse:collapse; margin:12px 0}
.seance-body .tbl th,.seance-body .tbl td{border:1px solid var(--line); padding:8px 10px; text-align:left; font-size:.92rem}
.seance-body .tbl th{background:var(--card-2)}
.seance-body .activite{display:flex; gap:10px; align-items:center; margin:24px 0 4px}
.seance-body .activite span:first-child{background:var(--cat,var(--blue)); color:#fff; font-weight:700; font-size:.72rem; padding:4px 11px; border-radius:20px; letter-spacing:.05em}
.seance-body .activite .who{color:var(--muted); font-size:.85rem}
.seance-body p.q{font-weight:600; margin:1.1em 0 .3em}
.seance-body p.aide{color:var(--muted); font-size:.9rem; font-style:italic; margin:.2em 0 .6em}

/* corrections repliables */
.corr-wrap{margin:.2em 0 1.2em}
.corr-btn{background:transparent; border:1.5px solid var(--cat,var(--blue)); color:var(--cat,var(--blue)); font-family:var(--display); font-weight:700; border-radius:22px; padding:7px 18px; cursor:pointer; font-size:.9rem}
.corr-btn:hover,.corr-btn.open{background:var(--cat,var(--blue)); color:#fff}
.corr-body{background:#eef7f1; border:1px solid #cfe9da; border-radius:10px; padding:13px 16px; margin-top:10px; color:#1c5a35}
.corr-body::before{content:"Correction"; display:block; font-family:var(--display); font-weight:700; color:var(--accent-deep); margin-bottom:5px; font-size:.9rem}

/* ---- Quiz (balisage du module, style maquette) ---- */
.quiz-block{margin-top:34px}
.sec-quiz{font-family:var(--display); display:flex; align-items:center; gap:12px; font-size:20px; font-weight:700; margin:0 0 6px}
.sec-quiz .n{display:inline-grid; place-items:center; width:32px; height:32px; border-radius:8px; background:var(--teal); color:#fff; font-size:15px}
.quiz{background:var(--card); border:1px solid var(--line); border-radius:8px; padding:28px}
.quiz-q{margin-bottom:22px}
.quiz-title{font-family:var(--display); font-weight:600; font-size:15px; margin:0 0 12px}
.quiz-opt{display:flex; gap:11px; align-items:flex-start; padding:12px 15px; border:1.5px solid var(--line); border-radius:6px; cursor:pointer; margin-bottom:8px; font-size:14px; transition:border-color .12s, background .12s}
.quiz-opt:hover{border-color:var(--blue)}
.quiz-opt input{margin-top:2px; accent-color:var(--blue)}
.quiz-opt.good{border-color:#2f7d4f; background:#e8f3ec; color:#1c5a35}
.quiz-opt.bad{border-color:#c0413a; background:#f7e9e8; color:#8f2d27}
.quiz-fb{margin:8px 0 0; font-family:var(--display); font-weight:600; font-size:.9rem}
.quiz-check{margin-top:6px}
.quiz-score{font-family:var(--display); font-weight:800; font-size:1.05rem; margin-top:14px}
.quiz-score.good{color:#2f7d4f}
.quiz-score.bad{color:var(--accent-deep)}

/* ---- Navigation entre séances ---- */
.seance-nav{display:grid; grid-template-columns:1fr auto 1fr; align-items:stretch; gap:12px; border-top:1px solid var(--line); padding-top:22px; margin-top:28px}
.seance-page > .seance-nav:first-child{border-top:0; padding-top:0; margin-bottom:18px}
.seance-nav > a, .seance-nav > span{display:inline-flex; align-items:center; gap:10px}
.seance-nav .sn-next{justify-content:flex-end; text-align:right}
.seance-nav .sn-plan{justify-content:center; align-self:center}
.sn-lbl{display:flex; flex-direction:column; line-height:1.2}
.sn-dir{font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; opacity:.7}
.sn-tit{font-family:var(--display); font-weight:700; font-size:.92rem}
@media(max-width:560px){ .seance-nav{grid-template-columns:1fr 1fr; grid-template-areas:"prev next" "plan plan"} .seance-nav > a:first-child,.seance-nav > span:first-child{grid-area:prev} .seance-nav .sn-next{grid-area:next} .seance-nav .sn-plan{grid-area:plan} }

/* ---- Séance verrouillée ---- */
.pad-xl{padding-top:60px; padding-bottom:60px}
.lock-card{text-align:center; max-width:520px; margin:0 auto; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:40px 26px}
.lock-ico{display:inline-grid; place-items:center; width:64px; height:64px; border-radius:50%; background:var(--accent-soft); color:var(--accent-deep); margin-bottom:12px}
.lock-card h1{font-family:var(--display); font-weight:700; font-size:24px; margin:0 0 8px}
.lock-when{font-size:1.05rem; margin:.4em 0 1.2em}

/* ============ CONNEXION (deux colonnes) ============ */
.login{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; min-height:560px; border:1px solid var(--line); border-radius:12px; overflow:hidden; margin-top:8px}
.login-form{padding:56px 48px; display:flex; flex-direction:column; justify-content:center; background:var(--card)}
.login-form .inner{max-width:360px; margin:0 auto; width:100%}
.login-form .eyebrow{display:block; margin-bottom:10px}
.login-form h1{font-family:var(--display); font-weight:600; font-size:30px; margin:0 0 8px}
.login-form .sub{font-size:14px; color:var(--muted); margin:0 0 28px}
.login-form label{display:block; font-family:var(--display); font-size:13px; font-weight:600; margin-bottom:6px}
.login-form input[type=email],.login-form input[type=password],.login-form input[type=text]{width:100%; padding:13px 14px; border:1.5px solid var(--line-strong); border-radius:6px; font-size:15px; margin-bottom:18px; background:var(--card); color:var(--ink); font-family:var(--body)}
.login-form input:focus{outline:none; border-color:var(--blue); box-shadow:0 0 0 3px var(--accent-soft)}
.login-row{display:flex; justify-content:space-between; align-items:center; margin-bottom:22px; flex-wrap:wrap; gap:8px}
.login-row label{font-size:13px; color:var(--muted); display:flex; align-items:center; gap:7px; font-weight:400; margin:0}
.login-hint{text-align:center; font-size:13px; color:var(--muted); margin-top:16px}
.login-side{background:var(--deep); color:var(--on-deep); padding:56px 48px; display:flex; flex-direction:column; justify-content:center}
.login-side .big{font-style:italic; font-size:22px; line-height:1.5; margin-bottom:24px; max-width:380px}
.login-side .li{display:flex; gap:12px; align-items:center; font-size:15px; margin-bottom:14px; color:var(--on-deep-soft)}
.login-side .li .c{color:var(--teal); font-weight:700}
@media(max-width:820px){ .login{grid-template-columns:1fr} .login-side{order:-1} }

/* alertes (héritent du site) */
.alert{padding:13px 16px; border-radius:8px; margin:0 0 16px; font-size:.95rem}
.alert-err{background:#f8e7e4; border:1px solid #b23527; color:#7a201a}

/* Bloc résultats de quiz : stockage local + effacement (note MAJ, lot D7) */
.quiz-last{margin-top:10px; font-size:13px; color:var(--muted, #566470); font-weight:600}
.quiz-privacy{margin-top:10px; font-size:12.5px; color:var(--muted, #566470)}
.quiz-clear{margin-top:8px}