/* =========================
   TOC 基本デザイン
========================= */
#toc {
  --color_gray: hsla(0,0%,78%,.15);
  --color_border: hsla(0,0%,78%,.5);

  background:
    linear-gradient(-45deg,
      transparent 25%, var(--color_gray) 25%,
      var(--color_gray) 50%, transparent 50%,
      transparent 75%, var(--color_gray) 75%, var(--color_gray)
    );
  background-clip: padding-box;
  background-size: 4px 4px;
  border-top: 4px double var(--color_border);
  border-bottom: 4px double var(--color_border);
  border-left: none !important;
  border-right: none !important;
}

/* タイトル */
.toc-title {
  font-size: 18px !important;
  padding-top: 20px !important; /* ← 上書きがあるので最終値に一本化 */
  border: none !important;
	pointer-events: none;
}

/* リスト */
.toc-list.open {
  /* もともとの余白指定をここに統合 */
  padding-top: 0 !important;
  padding-bottom: 30px;

  /* 折り畳み制御 */
  max-height: 550px;
  overflow: hidden;
  transition: max-height .25s ease;
}

.toc-list > li {
  font-weight: normal !important;
  font-size: 15px !important;
}

#main .toc-list > li::before {
  color: #000 !important;
}

/* 番号表現（必要な場合のみ） */
.entry-content .toc.tnt-number-detail ol li:before {
  content: counters(toc,"-") " |" !important;
}

/* 見出しアイコン：アイコンフォント or 背景画像のどちらかに統一推奨 */
/* → 両方出したい意図でなければ、どちらか片方だけ残すのが軽量 */
.toc-checkbox:checked + .toc-title::before {
	/*
  content: "\e918";           
  font-family: icomoon;
	*/
  display: inline-block;
  margin-right: .5em;
  padding-bottom: 2px;
  vertical-align: middle;

  width: 19px;
	height: 19px;
  content: "";
  background: url(https://cynadus.com/wp-content/plugins/toc-design-plugin/img/bulleted-list.svg) no-repeat top 0px center;
  background-size: 19px 19px;
}

.toc-checkbox:checked+.toc-title::after {
	display: none !important;
}

.toc-content ol ol li { font-size: 13px !important; }

#sidebar .toc .toc-list ul,
#sidebar .toc .toc-list ol { padding-left: 0.5em !important; }

/* =========================
   「もっと見る」UI
========================= */
.toc-content { position: relative; }
.toc-more-checkbox { display: none; }

.toc-fade {
  position: sticky;
  bottom: 60px;       /* ボタン分の余白 */
  height: 80px;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 70%);
  margin-top: -80px;  /* リストに被せる */
}

/* ボタン共通 */
.toc-more-btn {
  display: inline-block;     /* block と inline-block の重複を統一 */
  width: 110px;
  margin: 0 6px;
  padding: 7px 14px;
  border: 1px solid var(--color_border, #ccc);
  border-radius: 999px;
  text-align: center;
  font-size: 14px;
  cursor: pointer;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.05);
  transition: background-color .3s ease, color .3s ease;
}
.toc-more-btn.less { display: none; }  /* 初期は「折りたたむ」非表示 */

/* ボタンラッパー */
.toc-more-wrapper {
  background: #fff;          /* 通常は白背景 */
  padding: 12px 0 20px;
  text-align: center;
  position: relative;
  z-index: 1;
  transition: background-color .3s ease;
}

/* =========================
   チェックON時（展開時）
========================= */
.toc-more-checkbox:checked ~ .toc-list.open {
  max-height: none;
  overflow: visible;
}
.toc-more-checkbox:checked ~ .toc-fade { display: none; }
.toc-more-checkbox:checked ~ .toc-more-wrapper { background: transparent; }
.toc-more-checkbox:checked ~ .toc-more-wrapper .more { display: none; }
.toc-more-checkbox:checked ~ .toc-more-wrapper .less { display: inline-block; }
