/* ── Expertiz TOC — toc.css ─────────────────────────────────────────────── */

:root {
  --etoc-accent:   #2563eb;
  --etoc-border:   #e2e8f0;
  --etoc-bg:       #f8fafc;
  --etoc-text:     #1e293b;
  --etoc-muted:    #64748b;
  --etoc-hover:    #1d4ed8;
  --etoc-radius:   10px;
  --etoc-shadow:   0 1px 4px rgba(0,0,0,.08);
}

/* ── Conteneur ──────────────────────────────────────────────────────────── */
.etoc-toc {
  background:    var(--etoc-bg);
  border:        1px solid var(--etoc-border);
  border-left:   4px solid var(--etoc-accent);
  border-radius: var(--etoc-radius);
  padding:       0;
  margin:        1.8em 0 2em;
  box-shadow:    var(--etoc-shadow);
  max-width:     680px;
  font-size:     .92rem;
}

/* ── details / summary ──────────────────────────────────────────────────── */
.etoc-toc details {
  padding: 0;
}

.etoc-toc summary {
  list-style: none;
  cursor:     pointer;
  padding:    14px 18px;
  user-select: none;
  display:    flex;
  align-items: center;
  justify-content: space-between;
}

.etoc-toc summary::-webkit-details-marker { display: none; }

.etoc-title-text {
  font-weight: 700;
  font-size:   .88rem;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--etoc-accent);
}

/* Chevron animé */
.etoc-toc summary::after {
  content:    '▾';
  color:      var(--etoc-accent);
  font-size:  1rem;
  transition: transform .2s ease;
  flex-shrink: 0;
}

.etoc-toc details:not([open]) summary::after {
  transform: rotate(-90deg);
}

/* ── Listes ─────────────────────────────────────────────────────────────── */
.etoc-list {
  margin:  0;
  padding: 0 18px 16px 36px;
  counter-reset: etoc-h2;
}

.etoc-sublist {
  margin:  4px 0 4px 16px;
  padding: 0;
  counter-reset: etoc-h3;
}

.etoc-no-numbers,
.etoc-no-numbers .etoc-sublist {
  list-style: none;
  padding-left: 18px;
}

/* ── Items ──────────────────────────────────────────────────────────────── */
.etoc-item {
  margin:      3px 0;
  line-height: 1.5;
}

.etoc-h2 {
  counter-increment: etoc-h2;
}

.etoc-h3 {
  counter-increment: etoc-h3;
  font-size: .875em;
}

/* ── Liens ──────────────────────────────────────────────────────────────── */
.etoc-link {
  color:           var(--etoc-text);
  text-decoration: none;
  transition:      color .15s, padding-left .15s;
  display:         inline-block;
}

.etoc-link:hover {
  color:        var(--etoc-hover);
  padding-left: 3px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ── Lien actif (scroll-spy) ───────────────────────────────────────────── */
.etoc-link.etoc-active {
  color:       var(--etoc-accent);
  font-weight: 600;
}

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .etoc-toc {
    max-width: 100%;
    font-size: .875rem;
  }
}