.miro-toc {
  background: var(--miro-toc-bg);
  border: 1px solid var(--miro-toc-border);
  border-radius: var(--miro-toc-radius);
  padding: 12px 14px;
  margin: 16px 0;
  font-size: 15px;
  line-height: 1.6;
}
.miro-toc--shadow { box-shadow: 0 6px 18px rgba(0,0,0,0.08); }

.miro-toc--float-left { float: left; margin: 6px 16px 16px 0; }
.miro-toc--float-right { float: right; margin: 6px 0 16px 16px; }

.miro-toc__header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor: default;
}
.miro-toc__title { color: var(--miro-toc-title); font-weight:700; }

.miro-toc__toggle {
  width: 28px; height: 28px; border:1px solid var(--miro-toc-border);
  border-radius: 9999px; background:#fff; display:inline-flex; align-items:center; justify-content:center;
  position: relative;
}
.miro-toc__toggle::before, .miro-toc__toggle::after {
  content:""; position:absolute; background:#666; transition:transform .2s ease;
}
.miro-toc__toggle::before { width:12px; height:2px; }
.miro-toc__toggle::after { width:2px; height:12px; }
.miro-toc[aria-expanded="false"] .miro-toc__toggle::after { transform: scaleY(0); }

.miro-toc__body { margin-top:8px; }
.miro-toc[aria-expanded="false"] .miro-toc__body { display:none; }

.miro-toc__ul { list-style:none; padding-left:0; margin:0; }
.miro-toc__ul .miro-toc__ul { padding-left:16px; border-left: 2px dashed var(--miro-toc-border); margin-left:8px; }

.miro-toc__li { margin: 6px 0; }
.miro-toc__link {
  color: var(--miro-toc-link); text-decoration:none; border-bottom:1px dotted transparent;
}
.miro-toc__link:hover { color: var(--miro-toc-hover); border-bottom-color: var(--miro-toc-hover); }

.miro-toc--minimal { border-color: transparent; box-shadow:none; background: transparent; }
.miro-toc--boxed { border-width: 2px; }
.miro-toc--pill .miro-toc__link {
  padding: 2px 8px; border-radius: 9999px; background: rgba(0,0,0,0.04);
}
.miro-toc--sticky { position: sticky; top: 80px; z-index: 5; }