﻿/* 鏂囩珷椤?TOC 渚ц竟鏍?*/
.post-with-toc-sidebar {
  display: flex;
  gap: 2rem;
  align-items: flex-start;
  max-width: 100%;
}

.post-with-toc-sidebar .post-single {
  flex: 1;
  min-width: 0;
  order: 1;
}

/* 鐩綍鑴辩鏂囨。娴侊紝鍥哄畾鍦ㄩ〉闈㈠彸渚э紝涓嶅啀鎸ゅ帇姝ｆ枃 */
.toc-sidebar {
  width: 240px;
  position: fixed;
  right: 24px;
  top: 84px;
  z-index: 10;
}

.toc-sidebar .toc {
  position: static;
  border: none;
  background: transparent;
  padding: 0;
  margin-bottom: 0;
}

.toc-sidebar .toc details {
  border: none;
  background: transparent;
  padding: 0;
}

.toc-sidebar .toc summary {
  cursor: pointer;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.toc-sidebar .toc .inner {
  max-height: 70vh;
  overflow-y: auto;
}

.toc-sidebar .toc ul {
  list-style: none;
  padding-left: 1rem;
}

.toc-sidebar .toc li {
  margin: 0.3rem 0;
  font-size: 0.9em;
}

.toc-sidebar .toc a {
  text-decoration: none;
  color: var(--secondary);
}

.toc-sidebar .toc a:hover {
  color: var(--primary);
}

/* 绐勫睆锛氫晶杈规爮绉昏嚦涓婃柟 */
@media screen and (max-width: 900px) {
  .post-with-toc-sidebar {
    flex-direction: column-reverse;
  }

  .toc-sidebar {
    width: 100%;
    position: static;
    right: auto;
    top: auto;
    z-index: auto;
  }

  .toc-sidebar .toc {
    position: static;
  }

  .toc-sidebar .toc .inner {
    max-height: 200px;
  }
}
