/* theme.css — デザイントークン（色・タイポグラフィ・スペーシング） */
/* このファイルを変更するだけでサイト全体のテーマを変更できます */

:root {
  /* カラー — メイン */
  --color-bg:             #f8f8f6;
  --color-surface:        #ffffff;
  --color-surface-alt:    #f1f0ec;
  --color-hero-bg:        #ffffff;
  --color-border:         #e2e2de;
  --color-text:           #2c2c2a;
  --color-text-secondary: #4a4a47;
  --color-muted:          #888884;
  --color-heading:        #1a1a18;
  --color-link:           #3b5bdb;

  /* カラー — アクセント */
  --color-accent:         #3b5bdb;
  --color-accent-hover:   #2f4ac0;
  --color-accent-fg:      #ffffff;
  --color-accent-ring:    rgba(59, 91, 219, 0.2);

  /* カラー — ステータス */
  --color-status-published:    #1a7a44;
  --color-status-published-bg: #edfaf2;
  --color-status-wip:          #a15c00;
  --color-status-wip-bg:       #fff8ec;
  --color-status-private:      #555;
  --color-status-private-bg:   #f5f5f5;

  /* カラー — フィーチャードバッジ */
  --color-featured-bg:    #3b5bdb;
  --color-featured-fg:    #ffffff;

  /* カラー — タグ */
  --color-tag-bg:         #eef0f8;
  --color-tag-fg:         #3b5bdb;

  /* タイポグラフィ */
  --font-body:            'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
  --font-heading:         'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
  --font-mono:            'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;

  /* フォントサイズ */
  --text-xs:    0.75rem;
  --text-sm:    0.875rem;
  --text-base:  1rem;
  --text-lg:    1.125rem;
  --text-xl:    1.25rem;
  --text-2xl:   1.5rem;
  --text-3xl:   1.875rem;
  --text-4xl:   2.25rem;

  /* フォントウェイト */
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-bold:   700;

  /* ラインハイト */
  --leading-tight:   1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.75;

  /* スペーシング */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* ボーダー半径 */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* シャドウ */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);

  /* レイアウト */
  --container-max:  1100px;
  --header-height:  56px;
  --footer-height:  56px;
}