/* ============ tokens ============ */
.course-html {
  --cc-text:#1a1a1a; --cc-text-muted:#5a6573; --cc-bg:#fff; --cc-bg-subtle:#f8f9fb;
  --cc-border:#e4e7eb; --cc-link:#0d6efd; --cc-link-hover:#084298;
  --cc-theorem:#0d6efd; --cc-definition:#6f42c1; --cc-example:#198754;
  --cc-exercise:#d97706; --cc-proof:#6c757d; --cc-note:#0891b2;
  --cc-warning:#dc3545; --cc-tip:#198754; --cc-formula:#db2777;
  --cc-takeaway:#6f42c1; --cc-solution:#0d6efd; --cc-hint:#d97706;
  --cc-heading:#8b1a1a;          /* dark crimson for section titles */
  --cc-proposition:#b91c1c;      /* strong red for propositions */
  --cc-remark:#6b7280;           /* neutral slate for remarks */
  --cc-toggle-bg:#8b1a1a;        /* prominent theme-toggle button */
  --cc-toggle-fg:#ffffff;
  --cc-toggle-bg-hover:#6f1414;
  --cc-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
             "Liberation Mono", "Courier New", monospace;
  --cc-radius:8px; --cc-radius-sm:6px;
  color:var(--cc-text); background:var(--cc-bg);
  font-size:1.0625rem; line-height:1.7;
  max-width:900px; margin:0 auto;
}

/* --- dark theme: opt-in only, driven by html[data-theme="dark"] --- */
html[data-theme="dark"] .course-html{
  --cc-text:#e6e8eb; --cc-text-muted:#9aa3ad; --cc-bg:#0f1115;
  --cc-bg-subtle:#171a20; --cc-border:#262b33; --cc-link:#6ea8fe;
  --cc-link-hover:#9ec5fe;
  --cc-theorem:#6ea8fe; --cc-definition:#b197fc; --cc-example:#6ee7a5;
  --cc-exercise:#fbbf24; --cc-warning:#f87171;
  --cc-heading:#f4a3a3;
  --cc-proposition:#f87171;
  --cc-remark:#9ca3af;
  --cc-toggle-bg:#f4a3a3;
  --cc-toggle-fg:#1a1a1a;
  --cc-toggle-bg-hover:#ffc0c0;
}

/* ============ theme toggle (top of article) ============ */
.course-theme-bar{
  display:flex;
  justify-content:flex-end;
  margin:0 0 1.25rem;
}

.theme-toggle-btn{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.65rem 1.25rem;
  font:inherit;
  font-weight:700;
  font-size:.95rem;
  line-height:1.2;
  color:var(--cc-toggle-fg);
  background:var(--cc-toggle-bg);
  border:2px solid var(--cc-toggle-bg);
  border-radius:999px;
  cursor:pointer;
  box-shadow:0 3px 10px rgba(0,0,0,.18);
  transition:background .15s, color .15s, border-color .15s,
             transform .12s, box-shadow .15s;
}

.theme-toggle-btn:hover{
  background:var(--cc-toggle-bg-hover);
  border-color:var(--cc-toggle-bg-hover);
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.22);
}

.theme-toggle-btn:active{
  transform:translateY(0);
  box-shadow:0 2px 6px rgba(0,0,0,.18);
}

.theme-toggle-btn:focus-visible{
  outline:3px solid var(--cc-link);
  outline-offset:3px;
}

.theme-toggle-btn .tt-icon{
  font-size:1.15em;
  line-height:1;
}

/* ============ body / headings ============ */
.course-body{min-width:0;
  counter-reset:theorem definition example exercise equation step}
.course-body h1{
  font-size:1.9rem;font-weight:700;margin:0 0 1rem;
  color:var(--cc-heading);
}
.course-body h2{
  font-size:1.6rem;font-weight:700;
  margin:2.5rem 0 1rem;
  padding-bottom:.4rem;
  color:var(--cc-heading);
  border-bottom:2px solid color-mix(in srgb, var(--cc-heading) 25%, transparent);
  scroll-margin-top:5rem;
}
.course-body h3{
  font-size:1.2rem;font-weight:600;
  margin:1.8rem 0 .75rem;
  color:var(--cc-heading);
  scroll-margin-top:5rem;
}
.course-body h4{
  font-size:1.05rem;font-weight:600;
  margin:1.5rem 0 .5rem;
  color:var(--cc-text);
}
.course-body p{margin:0 0 1rem}
.course-body ul,.course-body ol{margin:0 0 1rem 1.25rem;padding:0}
.course-body a{color:var(--cc-link);text-decoration:underline;text-underline-offset:2px}
.course-body a:hover{color:var(--cc-link-hover)}
.course-body hr{border:0;border-top:1px solid var(--cc-border);margin:2rem 0}
.course-body img{max-width:100%;height:auto;border-radius:var(--cc-radius-sm)}

/* ============ code ============ */
/* inline code — a quiet chip, monospaced, doesn't shout */
.course-body :not(pre) > code{
  font-family:var(--cc-mono);
  font-size:.88em;
  padding:.12em .45em;
  border-radius:4px;
  background:var(--cc-bg-subtle);
  border:1px solid var(--cc-border);
  color:var(--cc-text);
  white-space:nowrap;
}

/* block code — a card, with a coloured rail and a scrollable body */
.course-body pre{
  position:relative;
  margin:1.25rem 0;
  padding:1.1rem 1.25rem 1.1rem 1.1rem;
  background:var(--cc-bg-subtle);
  border:1px solid var(--cc-border);
  border-left:3px solid var(--cc-link);
  border-radius:var(--cc-radius);
  overflow-x:auto;
  overflow-y:hidden;
  font-family:var(--cc-mono);
  font-size:.88rem;
  line-height:1.55;
  color:var(--cc-text);
  tab-size:2;
  -moz-tab-size:2;
}

.course-body pre code{
  display:block;
  background:transparent;
  border:0;
  padding:0;
  margin:0;
  color:inherit;
  font:inherit;
  font-size:1em;
  white-space:pre;
}

/* keep code blocks LTR even inside RTL articles — Python is not RTL-aware */
html[dir="rtl"] .course-body pre,
html[dir="rtl"] .course-body :not(pre) > code{
  direction:ltr;
  text-align:left;
}

/* slim, unobtrusive scrollbar for wide code lines */
.course-body pre::-webkit-scrollbar{height:8px}
.course-body pre::-webkit-scrollbar-track{background:transparent}
.course-body pre::-webkit-scrollbar-thumb{
  background:color-mix(in srgb, var(--cc-text-muted) 35%, transparent);
  border-radius:4px;
}
.course-body pre::-webkit-scrollbar-thumb:hover{
  background:color-mix(in srgb, var(--cc-text-muted) 55%, transparent);
}
/* Firefox */
.course-body pre{scrollbar-width:thin;scrollbar-color:var(--cc-border) transparent}

html[data-theme="dark"] .course-body pre{
  background:#0b0e14;
  border-color:#1f2733;
  border-left-color:var(--cc-link);
}
html[data-theme="dark"] .course-body :not(pre) > code{
  background:#141922;
  border-color:#242c38;
}

/* ============ meta bar ============ */
.course-meta{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;color:var(--cc-text-muted);
  font-size:.9rem;padding:.75rem 0;border-bottom:1px solid var(--cc-border);margin-bottom:1.5rem}
.course-meta a{color:var(--cc-link)}

/* ============ TOC (top-of-article card) ============ */
.course-toc{
  margin:0 0 2rem;
  border:1px solid var(--cc-border);
  border-radius:var(--cc-radius);
  background:var(--cc-bg-subtle);
  overflow:hidden;
}

.course-toc-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:.75rem 1rem;
  background:transparent;
  border:0;
  cursor:pointer;
  font:inherit;
  font-weight:600;
  color:var(--cc-text);
  text-align:start;
  transition:background .15s;
}
.course-toc-toggle:hover{background:rgba(0,0,0,.03)}
.course-toc-toggle:focus-visible{
  outline:2px solid var(--cc-link);
  outline-offset:-2px;
}

.tt-chevron{
  transition:transform .18s;
  color:var(--cc-text-muted);
  font-size:.85em;
}
.course-toc[data-collapsed="true"] .tt-chevron{
  transform:rotate(-90deg);
}
html[dir="rtl"] .course-toc[data-collapsed="true"] .tt-chevron{
  transform:rotate(90deg);
}

.course-toc-inner{
  padding:.35rem 1rem 1rem;
  border-top:1px solid var(--cc-border);
}
.course-toc[data-collapsed="true"] .course-toc-inner{display:none}

.course-toc ol{
  list-style:none;
  padding:0;
  margin:0;
  column-count:2;
  column-gap:2rem;
}
@media (max-width:640px){
  .course-toc ol{column-count:1}
}
.course-toc li{
  margin:.15rem 0;
  break-inside:avoid;
}
.course-toc a{
  color:var(--cc-text-muted);
  text-decoration:none;
  display:block;
  padding:.2rem 0;
  transition:color .15s;
}
.course-toc a:hover{color:var(--cc-text)}
.course-toc a.active{color:var(--cc-link);font-weight:500}
.course-toc .depth-3{padding-inline-start:1.1rem;font-size:.9rem}

html[data-theme="dark"] .course-toc-toggle:hover{background:rgba(255,255,255,.04)}

/* ============ environments ============ */
.env{position:relative;margin:1.25rem 0;padding:.9rem 1.15rem;
  border-left:4px solid var(--env-accent,var(--cc-border));
  background:var(--env-bg,var(--cc-bg-subtle));border-radius:var(--cc-radius-sm)}
.env-head{font-weight:600;color:var(--env-accent,var(--cc-text));margin:0 0 .4rem}
.env-body > :last-child{margin-bottom:0}
.env-theorem   {--env-accent:var(--cc-theorem);   --env-bg:#eef5ff; counter-increment:theorem}
.env-definition{--env-accent:var(--cc-definition);--env-bg:#f5f0ff; counter-increment:definition}
.env-example   {--env-accent:var(--cc-example);   --env-bg:#f0faf4; counter-increment:example}
.env-exercise  {--env-accent:var(--cc-exercise);  --env-bg:#fff8ec; counter-increment:exercise}
.env-proof     {--env-accent:var(--cc-proof);     --env-bg:var(--cc-bg-subtle)}
.env-note      {--env-accent:var(--cc-note);      --env-bg:#eefbfd}
.env-warning   {--env-accent:var(--cc-warning);   --env-bg:#fef2f2}
.env-tip       {--env-accent:var(--cc-tip);       --env-bg:#f0faf4}

/* ---- additional environments ---- */
.env-proposition{--env-accent:var(--cc-proposition);--env-bg:#fef0f0}
.env-remark     {--env-accent:var(--cc-remark);     --env-bg:var(--cc-bg-subtle)}
.env-takeaway   {--env-accent:var(--cc-takeaway);   --env-bg:#f5f0ff}

/* proposition-specific polish: bolder left rail, subtle heading weight */
.env-proposition{
  border-left-width:5px;
  box-shadow:0 1px 2px rgba(185,28,28,.06);
}
.env-proposition > .env-head{
  letter-spacing:.01em;
  text-transform:none;
}

.env-theorem   > .env-head::before{content:"Théorème "   counter(theorem)   " · "}
.env-definition> .env-head::before{content:"Définition " counter(definition)" · "}
.env-example   > .env-head::before{content:"Exemple "    counter(example)   " · "}
.env-exercise  > .env-head::before{content:"Exercice "   counter(exercise)  " · "}
.env-proof > .env-body::after{content:"∎";float:right;color:var(--cc-text-muted)}

html[data-theme="dark"] .env-theorem   {--env-bg:#122040}
html[data-theme="dark"] .env-definition{--env-bg:#1f1a3a}
html[data-theme="dark"] .env-example,
html[data-theme="dark"] .env-tip       {--env-bg:#11261a}
html[data-theme="dark"] .env-exercise  {--env-bg:#2b1f0a}
html[data-theme="dark"] .env-warning   {--env-bg:#2a1416}
html[data-theme="dark"] .env-note      {--env-bg:#0c2429}
html[data-theme="dark"] .env-proposition{--env-bg:#2a1414}
html[data-theme="dark"] .env-remark     {--env-bg:#1a1d22}
html[data-theme="dark"] .env-takeaway   {--env-bg:#1f1a3a}

/* ============ collapsibles (details/summary) ============ */
details.cc-collapse{margin:.9rem 0;border:1px solid var(--cc-border);
  border-radius:var(--cc-radius-sm);background:var(--cc-bg-subtle);overflow:hidden}
details.cc-collapse > summary{cursor:pointer;padding:.65rem 1rem;font-weight:500;
  color:var(--env-accent,var(--cc-link));list-style:none;display:flex;gap:.5rem;
  user-select:none;align-items:center}
details.cc-collapse > summary::-webkit-details-marker{display:none}
details.cc-collapse > summary::before{content:"▸";display:inline-block;
  transition:transform .18s;color:var(--env-accent,var(--cc-link))}
details.cc-collapse[open] > summary::before{transform:rotate(90deg)}
details.cc-collapse > .cc-collapse-body{padding:.25rem 1rem 1rem;
  border-top:1px solid var(--cc-border)}
details.cc-collapse > .cc-collapse-body > :first-child{margin-top:.75rem}
details.cc-solution{--env-accent:var(--cc-solution)}
details.cc-hint    {--env-accent:var(--cc-hint)}

/* ============ numbered display equations ============ */
.eq{position:relative;counter-increment:equation;padding:.5rem 3.25rem .5rem 0;
  margin:1.25rem 0;overflow-x:auto;overflow-y:hidden}
.eq::after{content:"(" counter(equation) ")";position:absolute;right:.75rem;top:50%;
  transform:translateY(-50%);color:var(--cc-text-muted);font-variant-numeric:tabular-nums}
.eq > .katex-display{margin:0}
.course-body .katex{font-size:1.02em}
.course-body .katex-display{overflow-x:auto;overflow-y:hidden;padding:.25rem 0}

/* ============ step lists ============ */
ol.cc-steps{list-style:none;padding:0;margin:1rem 0;counter-reset:step}
ol.cc-steps > li{position:relative;padding:.35rem 0 .35rem 2.4rem;counter-increment:step}
ol.cc-steps > li::before{content:counter(step);position:absolute;left:0;top:.4rem;
  width:1.65rem;height:1.65rem;display:grid;place-items:center;border-radius:50%;
  background:var(--cc-link);color:#fff;font-size:.8rem;font-weight:600}

/* ============ figures ============ */
figure.cc-figure{margin:1.5rem 0;text-align:center}
figure.cc-figure img,figure.cc-figure svg{max-width:100%;height:auto}
figure.cc-figure figcaption{margin-top:.5rem;font-size:.9rem;
  color:var(--cc-text-muted);font-style:italic}

/* ============ RTL ============ */
html[dir="rtl"] .env{border-left:0;border-right:4px solid var(--env-accent,var(--cc-border))}
html[dir="rtl"] .env-proposition{border-right-width:5px}
html[dir="rtl"] ol.cc-steps > li{padding:.35rem 2.4rem .35rem 0}
html[dir="rtl"] ol.cc-steps > li::before{left:auto;right:0}
html[dir="rtl"] .eq{padding:.5rem 0 .5rem 3.25rem}
html[dir="rtl"] .eq::after{right:auto;left:.75rem}

/* ============ tables ============ */
.cc-table{
  width:100%;
  margin:1.5rem 0;
  border-collapse:separate;
  border-spacing:0;
  font-size:.97rem;
  line-height:1.5;
  border:1px solid var(--cc-border);
  border-radius:var(--cc-radius);
  overflow:hidden;
}

.cc-table caption{
  caption-side:top;
  text-align:start;
  padding:0 0 .6rem;
  font-size:.9rem;
  font-style:italic;
  color:var(--cc-text-muted);
}

.cc-table thead th{
  background:var(--cc-bg-subtle);
  color:var(--cc-text);
  font-weight:600;
  text-align:start;
  padding:.75rem .9rem;
  border-bottom:1px solid var(--cc-border);
  white-space:nowrap;
}

/* first header cell is often empty in grids — keep it narrow */
.cc-table thead th:first-child:empty{width:3rem}

.cc-table tbody td{
  padding:.6rem .9rem;
  border-bottom:1px solid var(--cc-border);
  vertical-align:middle;
}

/* last row loses its bottom border — the container's radius + border takes over */
.cc-table tbody tr:last-child td{border-bottom:0}

/* zebra striping */
.cc-table tbody tr:nth-child(even){
  background:var(--cc-bg-subtle);
}

/* row hover — subtle, doesn't fight with the zebra */
@media (hover:hover){
  .cc-table tbody tr:hover{
    background:color-mix(in srgb, var(--cc-link) 6%, transparent);
  }
  html[data-theme="dark"] .cc-table tbody tr:hover{
    background:color-mix(in srgb, var(--cc-link) 12%, transparent);
  }
}

/* right-align pure-number cells for readability */
.cc-table td:first-child,
.cc-table th:first-child{
  font-variant-numeric:tabular-nums;
}

/* empty cells act like answer slots — give them a hint of surface */
.cc-table tbody td:empty{
  background:var(--cc-bg);
}
.cc-table tbody tr:nth-child(even) td:empty{
  background:var(--cc-bg); /* keep the checkbox-slot look on striped rows too */
}
html[data-theme="dark"] .cc-table tbody td:empty{background:#0c0e12}

/* wide tables scroll horizontally inside their own box, never the page */
.cc-table-scroll{
  overflow-x:auto;
  margin:1.5rem 0;
  border-radius:var(--cc-radius);
}
.cc-table-scroll .cc-table{margin:0}

/* tables inside an environment keep the env's rounded corners readable */
.env .cc-table{
  background:var(--cc-bg);
}

/* RTL: text alignment follows the document direction automatically,
   but explicit-start alignment keeps the header tight */
html[dir="rtl"] .cc-table thead th{text-align:start}

/* numeric cells (add .num or rely on first-child convention) */
.cc-table .num,
.cc-table td.num,
.cc-table th.num{
  text-align:end;
  font-variant-numeric:tabular-nums;
}

/* ============ PDF action button ============ */
a.pdf-download-btn{
  display:inline-block;
  padding:.6rem 1.2rem;
  background:var(--cc-link);
  color:#fff;
  border:1px solid var(--cc-link);
  border-radius:var(--cc-radius);
  font-weight:600;
  font-size:.95rem;
  line-height:1.3;
  text-decoration:none;
  box-shadow:0 1px 2px rgba(0,0,0,.08);
  transition:background .15s, border-color .15s, color .15s,
             transform .12s, box-shadow .15s;
}

a.pdf-download-btn:hover{
  background:var(--cc-link-hover);
  border-color:var(--cc-link-hover);
  color:#fff;
  text-decoration:none;
  transform:translateY(-1px);
  box-shadow:0 3px 10px rgba(13,110,253,.28);
}

a.pdf-download-btn:focus-visible{
  outline:2px solid var(--cc-link);
  outline-offset:2px;
}

a.pdf-download-btn:active{
  transform:translateY(0);
  box-shadow:0 1px 2px rgba(0,0,0,.08);
}

html[data-theme="dark"] a.pdf-download-btn{
  background:var(--cc-link);       /* #6ea8fe — light blue */
  border-color:var(--cc-link);
  color:#0b1220;                   /* dark text: guaranteed contrast */
  box-shadow:0 1px 2px rgba(0,0,0,.4);
}
html[data-theme="dark"] a.pdf-download-btn:hover{
  background:var(--cc-link-hover); /* #9ec5fe — even lighter */
  border-color:var(--cc-link-hover);
  color:#0b1220;
  box-shadow:0 3px 10px rgba(110,168,254,.3);
}

/* ============ print ============ */
@media print{
  .course-toc,.html-course-promo,.course-theme-bar,
  .cc-progress,.cc-back-to-top,.wa-float-btn{display:none !important}
  .course-html{display:block;max-width:none;padding:0}
  .course-body h1,.course-body h2,.course-body h3{color:#000 !important}
  .env,.eq,details.cc-collapse{break-inside:avoid;page-break-inside:avoid}
  details.cc-collapse > .cc-collapse-body{display:block !important}
  details.cc-collapse > summary::before{content:"•";transform:none !important}
  a{color:inherit;text-decoration:none}
  .cc-table{break-inside:avoid;page-break-inside:avoid}
  .cc-table thead th{background:#f0f0f0}
  .cc-table tbody tr:nth-child(even){background:#fafafa}
  .course-body pre{
    border-left-width:3px;
    background:#f5f5f5;
    color:#000;
  }
  .course-body :not(pre) > code{
    background:#f0f0f0;
    border-color:#ddd;
  }
}