/* ============================================================
   Notion風テーマ for MkDocs Material
   source: Notion DESIGN.md → design-tokens.json
   ルール: primary(紫)は対話的要素/アクセントのみ。本文・枠線には使わない。
   ============================================================ */

/* ---------- LIGHT (default scheme) ---------- */
[data-md-color-scheme="default"] {
  --md-primary-fg-color:        #ffffff;   /* ヘッダーは白（Notion流） */
  --md-primary-fg-color--light: #ffffff;
  --md-primary-fg-color--dark:  #f6f5f4;
  --md-primary-bg-color:        #1a1a1a;   /* ヘッダー上の文字＝黒 */
  --md-primary-bg-color--light: #5d5b54;

  --md-accent-fg-color:         #5645d4;   /* アクセント＝Notion purple */

  --md-default-bg-color:        #ffffff;
  --md-default-fg-color:        #1a1a1a;
  --md-default-fg-color--light: #5d5b54;
  --md-default-fg-color--lighter:#a4a097;
  --md-default-fg-color--lightest:#ede9e4;

  --md-typeset-color:           #37352f;   /* 本文＝チャコール */
  --md-typeset-a-color:         #5645d4;   /* リンク＝purple */

  --md-code-bg-color:           #f6f5f4;
  --md-code-fg-color:           #37352f;

  --md-footer-bg-color:         #37352f;
  --md-footer-bg-color--dark:   #2b2926;

  --nt-hairline:                #e5e3df;
  --nt-surface:                 #f6f5f4;

  --nt-info-bg:    #eef5fd; --nt-info-ac:    #0075de;
  --nt-tip-bg:     #e8f7ed; --nt-tip-ac:     #1aae39;
  --nt-warn-bg:    #fef7d6; --nt-warn-ac:    #dd5b00;
  --nt-danger-bg:  #fde0ec; --nt-danger-ac:  #e03131;
}

/* ---------- DARK (slate scheme) ---------- */
[data-md-color-scheme="slate"] {
  --md-hue: 240;
  --md-primary-fg-color:        #202020;
  --md-primary-bg-color:        #e6e3df;
  --md-accent-fg-color:         #9585ec;

  --md-default-bg-color:        #191919;
  --md-default-fg-color:        #e6e3df;
  --md-default-fg-color--light: #b0aca3;
  --md-default-fg-color--lighter:#8f8b82;
  --md-default-fg-color--lightest:#373737;

  --md-typeset-color:           #d4d1ca;
  --md-typeset-a-color:         #a99cf0;

  --md-code-bg-color:           #232323;
  --md-code-fg-color:           #d4d1ca;

  --md-footer-bg-color:         #202020;

  --nt-hairline:                #373737;
  --nt-surface:                 #232323;

  --nt-info-bg:    #20303f; --nt-info-ac:    #4aa3f0;
  --nt-tip-bg:     #1e3326; --nt-tip-ac:     #4cc76a;
  --nt-warn-bg:    #3a2f17; --nt-warn-ac:    #f08a3c;
  --nt-danger-bg:  #3a2029; --nt-danger-ac:  #f26a6a;
}

/* ---------- タイポグラフィ & 読みやすさ ---------- */
.md-typeset {
  font-size: 0.82rem;
  line-height: 1.75;               /* Notionの広い行間 */
  letter-spacing: 0.1px;
}
.md-grid { max-width: 68rem; }       /* 詰め込みすぎない本文幅 */

/* Notionは見出しに罫線を引かない。太さ＋余白だけで階層を出す */
.md-typeset h1 { font-weight: 600; font-size: 1.9rem; letter-spacing: -0.4px; margin-bottom: 0.6em; }
.md-typeset h2 { font-weight: 600; font-size: 1.45rem; letter-spacing: -0.3px; margin-top: 2.2em; }
.md-typeset h3 { font-weight: 600; font-size: 1.15rem; margin-top: 1.7em; }

/* ---------- ヘッダー：白地に細いhairline ---------- */
.md-header {
  border-bottom: 1px solid var(--nt-hairline);
  box-shadow: none;
}
[data-md-color-scheme="default"] .md-header { color: #1a1a1a; }

/* ---------- ナビ：アクティブは紫、控えめに ---------- */
.md-nav__link--active,
.md-nav__item .md-nav__link--active { color: var(--md-accent-fg-color); font-weight: 600; }
.md-typeset a:hover { text-decoration: underline; }

/* ---------- Admonition = Notion風カラーアウト ---------- */
.md-typeset .admonition,
.md-typeset details {
  border: 1px solid var(--nt-hairline);
  border-left-width: 3px;
  border-radius: 8px;
  box-shadow: none;
  font-size: 0.82rem;          /* 本文と同サイズ。警告を弱めない */
  background: var(--nt-surface);
}
.md-typeset .admonition-title,
.md-typeset summary { font-weight: 600; background: transparent !important; }
/* タイトル前のアイコン色だけ差し色、地は淡いパステル */
.md-typeset .admonition-title::before,
.md-typeset summary::before { background-color: currentColor; }

/* note / info */
.md-typeset .note, .md-typeset .info, .md-typeset .abstract {
  border-left-color: var(--nt-info-ac); background: var(--nt-info-bg);
}
.md-typeset .note > .admonition-title, .md-typeset .info > .admonition-title { color: var(--nt-info-ac); }

/* tip / success / hint */
.md-typeset .tip, .md-typeset .success, .md-typeset .hint, .md-typeset .check {
  border-left-color: var(--nt-tip-ac); background: var(--nt-tip-bg);
}
.md-typeset .tip > .admonition-title, .md-typeset .success > .admonition-title { color: var(--nt-tip-ac); }

/* warning / caution */
.md-typeset .warning, .md-typeset .caution, .md-typeset .attention {
  border-left-color: var(--nt-warn-ac); background: var(--nt-warn-bg);
}
.md-typeset .warning > .admonition-title { color: var(--nt-warn-ac); }

/* danger / error */
.md-typeset .danger, .md-typeset .error, .md-typeset .bug {
  border-left-color: var(--nt-danger-ac); background: var(--nt-danger-bg);
}
.md-typeset .danger > .admonition-title, .md-typeset .error > .admonition-title { color: var(--nt-danger-ac); }

/* ---------- テーブル：hairline＋surfaceヘッダー ---------- */
.md-typeset table:not([class]) {
  border: 1px solid var(--nt-hairline);
  border-radius: 8px;
  overflow: hidden;
  font-size: 0.78rem;
  box-shadow: none;
}
.md-typeset table:not([class]) th {
  background: var(--nt-surface);
  font-weight: 600;
  color: var(--md-typeset-color);
  border-bottom: 1px solid var(--nt-hairline);
}
.md-typeset table:not([class]) td { border-top: 1px solid var(--nt-hairline-soft, var(--nt-hairline)); }

/* ---------- インラインコード：チップ風 ---------- */
.md-typeset code {
  background: var(--nt-surface);
  border: 1px solid var(--nt-hairline);
  border-radius: 6px;
  padding: 0.1em 0.4em;
  font-size: 0.85em;
}

/* ---------- 検索バー：surface地 ---------- */
.md-search__input { background: var(--nt-surface); border-radius: 8px; }

/* ---------- Mermaid図：中央寄せ・余白 ---------- */
.md-typeset .mermaid { margin: 1.4em 0; }