/* Custom color styling for FontAwesome icons in sidebar */

/* Navigation icons - different colors for each type */
#sidebar .nav-link i.fa-home {
  color: #3b82f6; /* Blue for home */
}

#sidebar .nav-link i.fa-stream {
  color: #8b5cf6; /* Purple for categories */
}

#sidebar .nav-link i.fa-tags {
  color: #10b981; /* Green for tags */
}

#sidebar .nav-link i.fa-archive {
  color: #f59e0b; /* Orange for archives */
}

#sidebar .nav-link i.fa-info-circle {
  color: #ef4444; /* Red for about */
}

/* Contact/social icons in sidebar bottom */
#sidebar .sidebar-bottom i.fab {
  transition: color 0.3s ease;
}

#sidebar .sidebar-bottom i.fa-github {
  color: #333333;
}

#sidebar .sidebar-bottom i.fa-twitter,
#sidebar .sidebar-bottom i.fa-x-twitter {
  color: #1da1f2;
}

#sidebar .sidebar-bottom i.fa-envelope {
  color: #ea4335;
}

#sidebar .sidebar-bottom i.fa-rss {
  color: #ff6600;
}

#sidebar .sidebar-bottom i.fa-mastodon {
  color: #6364ff;
}

#sidebar .sidebar-bottom i.fa-linkedin {
  color: #0077b5;
}

#sidebar .sidebar-bottom i.fa-stack-overflow {
  color: #f48024;
}

#sidebar .sidebar-bottom i.fa-bluesky {
  color: #00bcd4;
}

#sidebar .sidebar-bottom i.fa-reddit {
  color: #ff4500;
}

#sidebar .sidebar-bottom i.fa-threads {
  color: #000000;
}

/* Hover effects for better interactivity */
#sidebar .nav-link:hover i,
#sidebar .sidebar-bottom a:hover i {
  transform: scale(1.1);
  transition: all 0.3s ease;
}

/* Bold styling for h1 elements */
h1 {
  font-weight: bold !important;
}

/* ===== 本文カラム幅 =====
   読み幅の情報源はこの 3 変数だけに一本化する。
   旧実装は .container の padding clamp / main の padding clamp / article の max-width が
   三重に幅を取り合っており、1440px では main の padding(12rem) が勝つため
   article の max-width: 800px が一度も効かず、実効 680px になっていた。
   TOC は意図的に非表示のため、空いた横幅は読みカラムの余白として使う。 */
:root {
  /* 記事は全角 41 字相当（本文 17.28px）で固定する */
  --article-max-width: 720px;
  /* 一覧系は記事と同じ幅から始め、大画面だけ少し広げる */
  --listing-max-width: 720px;
  /* 小画面でも端との距離を保ち、広い画面では 32px まで増やす */
  --content-gutter: clamp(1.25rem, 4vw, 2rem);
}

/* 大画面では 1 段だけ広げる。全角 45 字（可読域の上限）で止め、
   記事本文は 720px のまま、一覧系にだけ余白を配分する */
@media (min-width: 1600px) {
  :root {
    --listing-max-width: 780px;
  }
}

/* テーマ側のコンテナ幅を解除し、余白は実際に記事を包む main と tail にだけ置く */
#main-wrapper > .container {
  max-width: none !important;
  padding-left: 0;
  padding-right: 0;
}

#main-wrapper main[aria-label="Main Content"],
#main-wrapper #tail-wrapper {
  max-width: none !important;
  padding-left: var(--content-gutter) !important;
  padding-right: var(--content-gutter) !important;
}

/* 読み幅を決めるのはここだけ。
   main の直下要素すべてに掛けることで、記事本文・ホームの一覧・アーカイブ・
   カテゴリ・ページネーションが同じカラム幅と左端で揃う。 */
#main-wrapper main[aria-label="Main Content"] > *,
#main-wrapper #tail-wrapper > * {
  max-width: var(--listing-max-width);
  margin-left: auto;
  margin-right: auto;
}

/* 記事は一覧とは独立して、画面が広くなっても読み幅を広げない */
#main-wrapper main[aria-label="Main Content"] > article.post-article {
  max-width: var(--article-max-width);
}

/* 本文は article の幅に従わせ、独自の上限を持たせない */
.post-article .content {
  max-width: none;
  /* 和文の可読性を優先した行間 */
  line-height: 1.85;
}

/* ===== ホーム一覧の密度 =====
   テーマ既定はカード 1 件あたり 225px あり、900px 級のビューポートで 3 件しか入らなかった。
   カード枠を外して罫線区切りのリストにし、余白を詰めて 1 件 182px（4 件）にする。
   セレクタの詳細度はテーマ側（#post-list .card .card-body 等）に合わせている。 */
#post-list .card-wrapper:not(:last-child) {
  margin-bottom: 0;
}

#post-list .card .post-preview {
  background: none;
  box-shadow: none;
  border-radius: 0;
}

#post-list .card-wrapper:not(:last-child) .post-preview {
  border-bottom: 1px solid var(--main-border-color);
}

/* カード用のホバー時オーバーレイ。背景を外したので不要 */
#post-list .card .post-preview::before {
  display: none;
}

#post-list .card .card-body {
  padding: 1rem 0;
}

#post-list .card .card-body .card-title {
  line-height: 1.4;
  margin-bottom: 0.3rem;
}

#post-list .card .card-body .card-text {
  margin-bottom: 0.4rem;
}

/* 抜粋は本文ではなく一覧の補助情報なので、本文より 1 段落とす */
#post-list .card .card-body .card-text.content p {
  font-size: 0.95rem;
  line-height: 1.5;
}

/* カードの浮き上がりを失う分、ホバーはタイトルの色で示す */
#post-list .card .post-preview:hover .card-title {
  color: var(--link-color) !important;
}