/* 岡本マサヨシ：サイドバー共通パーツ。
   記事ページの右サイドバー（single.css）と、
   ココロ日記一覧の左サイド（blog.css）の両方で使う。
   ブロック見出し・検索窓・タグ一覧のみをここに置く。 */

.side__block { margin-bottom: clamp(2rem, 4vh, 2.8rem); }
.side__block:last-child { margin-bottom: 0; }

.side__label {
  font-family: var(--mono);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  color: var(--ink-faint);
  padding-bottom: 0.7rem;
  margin-bottom: 1.1rem;
  border-bottom: 1px solid var(--line);
}

/* ── 検索 ── */
.side-search__label {
  display: block;
  font-family: var(--jp);
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  color: var(--ink-2);
  margin-bottom: 0.6rem;
}
.side-search__row {
  display: flex;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  background: var(--paper);
  overflow: hidden;
  transition: border-color 0.2s var(--ease);
}
.side-search__row:focus-within { border-color: var(--sumi-deep); }
.side-search__input {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.62em 0.4em 0.62em 1.1em;
  border: none;
  background: none;
  font-family: var(--jp);
  font-size: 0.86rem;
  color: var(--sumi-deep);
  outline: none;
}
.side-search__input::placeholder { color: var(--ink-faint); }
.side-search__btn {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.4rem;
  color: var(--ink-2);
  transition: color 0.2s var(--ease);
}
.side-search__btn:hover { color: var(--sumi-deep); }
.side-search__btn svg { width: 1rem; height: 1rem; }

/* ── タグ ── */
.side-tags { display: flex; flex-wrap: wrap; gap: 0.45rem 0.5rem; }
.side-tags__item {
  display: inline-flex; align-items: center;
  padding: 0.28em 0.8em;
  font-family: var(--jp);
  font-size: 0.76rem;
  letter-spacing: 0.05em;
  color: var(--ink-2);
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: 999px;
  transition: background 0.2s var(--ease), color 0.2s var(--ease), border-color 0.2s var(--ease);
}
.side-tags__item:hover { background: var(--sumi-deep); color: var(--paper); border-color: var(--sumi-deep); }
.side-tags__hash { margin-right: 0.2em; color: var(--ink-faint); }
.side-tags__item:hover .side-tags__hash { color: var(--paper); }
/* 記事ページ＝その記事のタグ／一覧ページ＝絞り込み中のタグ */
.side-tags__item.is-current { border-color: var(--sage-deep); color: var(--sage-deep); }
.side-tags__item.is-current .side-tags__hash { color: var(--sage-deep); }
