/* ============================================================
   minorityOpinion — SWELL カスタムCSS
   貼り付け先: 外観 → カスタマイズ → 追加CSS
   ============================================================ */

/* ────────────────────────────────────────
   0. ベース / フォント
──────────────────────────────────────── */
body,
.swell-block-editor {
  font-family: 'Zen Maru Gothic', sans-serif;
  background: var(--bg);
  color: var(--ink);
}


/* ────────────────────────────────────────
   1. トップバー（SWELL: #topbar）
──────────────────────────────────────── */
#topbar,
.c-headTopBar {
  background: var(--ink) !important;
  color: #cccccc !important;
  font-size: 11px;
}
#topbar a,
.c-headTopBar a {
  color: var(--yamabuki) !important;
  font-weight: 700;
  text-decoration: none;
}


/* ────────────────────────────────────────
   2. ヘッダー（SWELL: #header / .c-headWrap）
──────────────────────────────────────── */
#header,
.c-headWrap {
  background: var(--yamabuki) !important;
  border-bottom: 5px solid var(--ink) !important;
}

/* サイトタイトル */
.c-siteName__text,
#site-title a {
  font-family: 'Dela Gothic One', sans-serif !important;
  font-size: 18px !important;
  color: var(--ink) !important;
  line-height: 1.1;
}

/* サイトディスクリプション */
.c-siteName__desc,
#site-description {
  font-size: 9px !important;
  letter-spacing: 2px;
  color: var(--ink-80) !important;
}

/* グローバルナビ */
#g-nav a,
.c-gnav__item > a {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  border-radius: 6px;
  padding: 5px 10px !important;
  transition: background 0.15s;
}
#g-nav a:hover,
.c-gnav__item > a:hover {
  background: rgba(0, 0, 0, 0.1) !important;
  color: var(--ink) !important;
}


/* ────────────────────────────────────────
   3. ティッカー（TODAY's BUZZ）
   ※ SWELLのインフォバーウィジェット or カスタムHTMLウィジェットで設置
──────────────────────────────────────── */
.mo-ticker {
  display: flex;
  align-items: stretch;
  overflow: hidden;
  background: var(--yamabuki-dark);
}
.mo-ticker__label {
  background: var(--ink);
  color: var(--yamabuki);
  font-size: 10px;
  font-weight: 900;
  padding: 7px 14px;
  white-space: nowrap;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
  letter-spacing: 0.05em;
}
.mo-ticker__track {
  flex: 1;
  overflow: hidden;
  position: relative;
  min-width: 0;
}
.mo-ticker__track::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 40px;
  background: linear-gradient(to right, var(--yamabuki-dark), transparent);
  z-index: 1;
  pointer-events: none;
}
.mo-ticker__scroll {
  color: var(--ink-80);
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
  display: inline-block;
  animation: mo-scroll 28s linear infinite;
  padding: 7px 0;
}
@keyframes mo-scroll {
  0%   { transform: translateX(100vw); }
  100% { transform: translateX(-100%); }
}


/* ────────────────────────────────────────
   4. パンくずリスト
──────────────────────────────────────── */
.c-breadcrumb,
#breadcrumb {
  font-size: 11px !important;
  color: var(--ink-40) !important;
}
.c-breadcrumb a,
#breadcrumb a {
  color: var(--yamabuki-deeper) !important;
  text-decoration: none;
}


/* ────────────────────────────────────────
   5. アイキャッチ（TODAY's STING バナー）
──────────────────────────────────────── */
.eyecatch,
.p-postThumb {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--border);
}

/* アイキャッチが未設定の場合のデフォルト背景（蜂柄ストライプ） */
.p-postThumb--noImage,
.eyecatch--noImage {
  height: 280px;
  background:
    repeating-linear-gradient(
      45deg,
      var(--yamabuki)   0px,
      var(--yamabuki)   30px,
      var(--ink)        30px,
      var(--ink)        35px,
      var(--yamabuki)   35px,
      var(--yamabuki)   65px,
      var(--ink)        65px,
      var(--ink)        70px
    );
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.p-postThumb--noImage::before,
.eyecatch--noImage::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 190, 0, 0.87);
}

/* TODAY's STING キッカー（アイキャッチ内ラベル） */
.mo-kicker {
  position: relative;
  z-index: 1;
  font-size: 11px;
  font-weight: 900;
  background: var(--ink);
  color: var(--yamabuki);
  display: inline-block;
  padding: 3px 14px;
  border-radius: 4px;
  margin-bottom: 10px;
  letter-spacing: 0.05em;
}


/* ────────────────────────────────────────
   6. 記事メタ（タグ・日付・読了時間）
──────────────────────────────────────── */
/* カテゴリタグ */
.c-cat-label,
.cat-label,
a[class*="cat-"] {
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 2px 10px !important;
  border-radius: 4px !important;
  background: var(--yamabuki-light) !important;
  color: #8a6d00 !important;
  border: none !important;
}

/* 「注目」タグ（hot） */
.tag-hot,
.p-postMeta .is-hot {
  background: var(--danger-light) !important;
  color: var(--danger) !important;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 4px;
}

/* 日付・読了時間 */
.c-postMeta__date,
.post-date,
.p-postMeta__date {
  font-size: 11px !important;
  color: var(--ink-40) !important;
}


/* ────────────────────────────────────────
   7. シェアボタン
──────────────────────────────────────── */
.c-shareBtn,
.share-btn-wrap .btn {
  border-radius: 50% !important;
  background: var(--yamabuki) !important;
  border: 2px solid var(--ink) !important;
  color: var(--ink) !important;
  font-weight: 900 !important;
  font-size: 12px !important;
  transition: transform 0.15s !important;
}
.c-shareBtn:hover,
.share-btn-wrap .btn:hover {
  transform: scale(1.1);
  background: var(--yamabuki-dark) !important;
}


/* ────────────────────────────────────────
   8. 記事本文エリア
──────────────────────────────────────── */
.p-articleBody,
.article-body,
.entry-content {
  background: var(--card-bg);
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 28px 24px;
  margin-bottom: 24px;
  font-size: 15px;
  line-height: 2;
  color: var(--ink-80);
}

/* リード文 */
.p-articleBody .lead,
.entry-content .lead,
.wp-block-mo-lead {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  line-height: 2;
  padding-bottom: 18px;
  margin-bottom: 22px;
  border-bottom: 2px solid var(--yamabuki);
}

/* H2 見出し */
.entry-content h2,
.p-articleBody h2 {
  font-size: 17px !important;
  font-weight: 900 !important;
  line-height: 1.6;
  margin: 28px 0 14px !important;
  padding: 12px 16px !important;
  background: var(--yamabuki-50) !important;
  border-left: 5px solid var(--yamabuki) !important;
  border-radius: 0 8px 8px 0 !important;
  color: #000000 !important;
  /* SWELLのデフォルトborder-bottomを消す */
  border-bottom: none !important;
  border-top: none !important;
  border-right: none !important;
}

/* H3 見出し */
.entry-content h3,
.p-articleBody h3 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  border-bottom: 2px solid var(--yamabuki-light) !important;
  padding-bottom: 6px !important;
  margin: 22px 0 12px !important;
  background: none !important;
  border-left: none !important;
  border-radius: 0 !important;
}

/* 本文段落 */
.entry-content p,
.p-articleBody p {
  font-size: 15px;
  line-height: 2;
  margin-bottom: 14px;
}

/* マーカー強調 */
.marker,
.entry-content mark {
  background: linear-gradient(transparent 60%, var(--yamabuki-light) 60%);
  font-weight: 700;
  color: inherit;
  padding: 0;
}


/* ────────────────────────────────────────
   9. データボックス（SWELLカスタムHTMLブロック or ショートコード）
──────────────────────────────────────── */
.mo-data-box {
  background: var(--yamabuki-50);
  border: 1px solid var(--yamabuki);
  border-radius: 10px;
  padding: 14px 16px;
  margin: 18px 0;
}
.mo-data-box__label {
  font-size: 11px;
  font-weight: 900;
  color: var(--yamabuki-deeper);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.mo-data-box__label::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--yamabuki);
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  flex-shrink: 0;
}
.mo-data-box table {
  width: 100%;
  font-size: 13px;
  border-collapse: collapse;
}
.mo-data-box th {
  text-align: left;
  font-weight: 700;
  padding: 6px 8px;
  border-bottom: 2px solid var(--yamabuki);
  color: #000;
  font-size: 12px;
}
.mo-data-box td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--yamabuki-light);
  color: var(--ink-60);
}
.mo-data-box td:last-child {
  text-align: right;
  font-weight: 700;
  color: var(--ink);
}


/* ────────────────────────────────────────
   10. 引用ボックス（blockquote）
──────────────────────────────────────── */
.entry-content blockquote,
.p-articleBody blockquote,
.mo-quote-box {
  background: var(--bg) !important;
  border-left: 4px solid var(--yamabuki) !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
  padding: 14px 18px !important;
  margin: 18px 0 !important;
  border-radius: 0 8px 8px 0 !important;
  font-style: italic;
  color: var(--ink-60);
  font-size: 14px;
  line-height: 1.8;
}
.entry-content blockquote cite,
.mo-quote-box cite {
  font-size: 11px;
  color: var(--ink-40);
  font-style: normal;
  display: block;
  margin-top: 4px;
}
/* SWELLが付けるデフォルトアイコンを消す */
.entry-content blockquote::before {
  display: none !important;
}


/* ────────────────────────────────────────
   11. 情報源セクション
──────────────────────────────────────── */
.mo-sources {
  background: var(--bg);
  border-radius: 12px;
  padding: 18px;
  margin-top: 28px;
  border: 1px solid var(--border);
}
.mo-sources__title {
  font-size: 14px;
  font-weight: 900;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #000;
}
.mo-sources__title::before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  background: var(--yamabuki);
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  flex-shrink: 0;
}
.mo-source-item {
  font-size: 13px;
  padding: 7px 0;
  border-bottom: 1px solid var(--border);
  display: flex;
  gap: 8px;
  align-items: flex-start;
}
.mo-source-item:last-child {
  border-bottom: none;
}
.mo-source-num {
  font-family: 'Dela Gothic One', sans-serif;
  font-size: 12px;
  color: var(--yamabuki-deeper);
  min-width: 20px;
  flex-shrink: 0;
}
.mo-source-item a {
  color: var(--yamabuki-deeper);
  text-decoration: none;
  font-weight: 500;
}
.mo-source-item a:hover {
  text-decoration: underline;
}
.mo-source-desc {
  color: var(--ink-60);
  font-size: 12px;
  margin-top: 2px;
}


/* ────────────────────────────────────────
   12. 目次（SWELL内蔵TOC）
──────────────────────────────────────── */
.swell-block-toc,
#toc,
.wp-block-swell-toc {
  background: var(--card-bg) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 14px !important;
}
.swell-block-toc__title,
#toc-title {
  font-size: 13px !important;
  font-weight: 900 !important;
  color: #000 !important;
  border-bottom: 3px solid var(--yamabuki) !important;
  padding-bottom: 8px !important;
  margin-bottom: 8px !important;
}
.swell-block-toc a,
#toc a {
  font-size: 12.5px !important;
  color: var(--ink-60) !important;
  text-decoration: none !important;
  display: block;
  padding: 5px 0;
  border-bottom: 1px solid var(--border);
}
.swell-block-toc a:hover,
#toc a:hover {
  color: var(--yamabuki-deeper) !important;
}


/* ────────────────────────────────────────
   13. サイドバー
──────────────────────────────────────── */
/* セクションタイトル共通 */
.widget-title,
.c-widget__title {
  font-size: 14px !important;
  font-weight: 900 !important;
  color: #000 !important;
  padding-bottom: 8px !important;
  border-bottom: 3px solid var(--yamabuki) !important;
  margin-bottom: 12px !important;
  display: flex;
  align-items: center;
  gap: 6px;
}
.widget-title::before,
.c-widget__title::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--yamabuki);
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  flex-shrink: 0;
}

/* プロフィール（aboutカード） */
.mo-profile-card {
  background: var(--yamabuki-50);
  border: 2px solid var(--yamabuki);
  border-radius: 12px;
  padding: 14px;
  text-align: center;
}
.mo-profile-card__name {
  font-size: 13px;
  font-weight: 900;
  color: #000;
  margin: 6px 0 4px;
}
.mo-profile-card__desc {
  font-size: 11px;
  line-height: 1.7;
  color: var(--ink-60);
}

/* ランキング記事リスト */
.c-rankList__item,
.widget_ranking li {
  border-bottom: 1px solid var(--border) !important;
  padding: 8px 0 !important;
}
.c-rankList__num,
.widget_ranking .rank-num {
  font-family: 'Dela Gothic One', sans-serif !important;
  color: var(--yamabuki-deeper) !important;
}


/* ────────────────────────────────────────
   14. 関連記事
──────────────────────────────────────── */
.p-relatedPosts,
.related-posts {
  background: var(--card-bg);
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 18px;
}
.p-relatedPosts__item,
.related-posts .item {
  padding: 9px 0;
  border-bottom: 1px solid var(--border);
}
.p-relatedPosts__item:last-child,
.related-posts .item:last-child {
  border-bottom: none;
}
.p-relatedPosts__title,
.related-posts .item-title {
  font-size: 13px !important;
  font-weight: 700;
  line-height: 1.5;
}


/* ────────────────────────────────────────
   15. フッター
──────────────────────────────────────── */
#footer,
.l-footer {
  background: var(--ink) !important;
  color: var(--ink-40) !important;
  padding: 18px !important;
  text-align: center;
  margin-top: 28px;
}
.footer-logo,
#footer .site-name {
  font-family: 'Dela Gothic One', sans-serif !important;
  color: var(--yamabuki) !important;
  font-size: 14px;
  margin-bottom: 4px;
}
#footer a {
  color: var(--ink-40) !important;
}
#footer a:hover {
  color: var(--yamabuki) !important;
}


/* ────────────────────────────────────────
   16. レスポンシブ（モバイル）
──────────────────────────────────────── */
@media screen and (max-width: 768px) {
  /* ヘッダー */
  .c-headWrap .header-inner,
  #header .l-inner {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px;
    padding: 10px 14px 8px !important;
  }
  .c-siteName__text,
  #site-title a {
    font-size: 15px !important;
  }

  /* ティッカー */
  .mo-ticker__label {
    font-size: 8px;
    padding: 4px 10px;
    line-height: 1.3;
    text-align: center;
  }
  .mo-ticker__scroll {
    font-size: 11px;
    padding: 6px 0;
  }

  /* 記事レイアウト */
  .entry-content,
  .p-articleBody {
    padding: 20px 16px !important;
  }
  .entry-content h2,
  .p-articleBody h2 {
    font-size: 15px !important;
    padding: 10px 12px !important;
    margin: 22px 0 12px !important;
  }
  .entry-content p,
  .p-articleBody p {
    font-size: 14px;
  }
  .p-articleBody .lead,
  .entry-content .lead {
    font-size: 14px !important;
  }

  /* アイキャッチ */
  .p-postThumb--noImage,
  .eyecatch--noImage {
    height: 160px;
  }

  /* データボックス */
  .mo-data-box table,
  .mo-data-box th,
  .mo-data-box td {
    font-size: 11px !important;
    padding: 4px !important;
  }

  /* 情報源 */
  .mo-source-item {
    font-size: 12px;
  }

  /* サイドバー → スマホでは記事下に移動（SWELLの設定で「下に表示」を選択） */
  .l-sidebar {
    margin-top: 20px;
  }
}