/* ============================================================
   穿云 ChuanYun · HUB (MkDocs Material) 品牌覆盖
   把 Material 默认色染成「极光紫粉 Aurora」#7C3AED → #DB2777
   ------------------------------------------------------------
   在 mkdocs.yml 中如下接入：

   theme:
     name: material
     language: zh
     palette:
       # 亮色（默认）
       - media: "(prefers-color-scheme: light)"
         scheme: default
         primary: deep purple      # 交给 brand.css 覆盖成精确紫粉
         accent:  pink
         toggle:
           icon: material/weather-night
           name: 切换到夜间
       # 暗色
       - media: "(prefers-color-scheme: dark)"
         scheme: slate
         primary: deep purple
         accent:  pink
         toggle:
           icon: material/weather-sunny
           name: 切换到白天
     features:
       - navigation.instant
       - navigation.tracking
       - navigation.top
       - content.code.copy
       - toc.follow

   extra_css:
     - stylesheets/brand.css      # ← 本文件

   markdown_extensions:
     - admonition                 # callout 支持
     - pymdownx.superfences        # 代码块
     - pymdownx.highlight
   ============================================================ */

/* ---------- 1. 品牌主色变量（覆盖 Material 的 --md-primary / --md-accent） ---------- */
:root {
  --md-primary-fg-color:        #7C3AED;   /* 主色（顶栏 / 强调）*/
  --md-primary-fg-color--light: #9333EA;
  --md-primary-fg-color--dark:  #6D28D9;
  --md-primary-bg-color:        #ffffff;
  --md-primary-bg-color--light: rgba(255,255,255,.7);

  --md-accent-fg-color:         #DB2777;   /* 强调 / hover 链接 */
  --md-accent-fg-color--transparent: rgba(219,39,119,.10);

  /* 品牌自定义令牌（供本文件复用）*/
  --cy-violet:       #8B5CF6;
  --cy-violet-deep:  #6D28D9;
  --cy-pink:         #EC4899;
  --cy-grad-primary: linear-gradient(118deg,#7C3AED 0%,#9333EA 42%,#DB2777 100%);
  --cy-grad-brand:   linear-gradient(140deg,#8B5CF6,#EC4899);
  --cy-line:         rgba(124,92,190,.16);
  --cy-line-2:       rgba(124,92,190,.30);
  --cy-glass:        rgba(255,255,255,.62);
  --cy-glass-border: rgba(255,255,255,.66);
  --cy-r:            18px;
  --cy-r-btn:        11px;

  /* 顶栏渐变（Material header 用纯色，改成品牌渐变）*/
  --md-typeset-a-color: #6D28D9;
}

/* 暗色方案下微调（scheme=slate）*/
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:  #A78BFA;
  --md-accent-fg-color:   #F472B6;
  --md-typeset-a-color:   #A78BFA;
  --cy-glass:        rgba(30,26,50,.55);
  --cy-glass-border: rgba(167,139,250,.16);
  --cy-line:         rgba(167,139,250,.12);
  --cy-line-2:       rgba(167,139,250,.22);
}

/* ---------- 2. 顶栏：纯色 → 品牌渐变 ---------- */
.md-header {
  background: var(--cy-grad-primary);
  box-shadow: 0 8px 30px -18px rgba(139,92,246,.45);
}
.md-tabs {
  background: transparent;
}

/* ---------- 3. Logo glyph（可在 docs 里放 assets/logo.svg；此处兜底装饰）---------- */
.md-header__button.md-logo img,
.md-header__button.md-logo svg { border-radius: 8px; }

/* ---------- 4. 链接 ---------- */
.md-typeset a {
  color: var(--cy-violet-deep);
  text-underline-offset: 3px;
}
.md-typeset a:hover { color: var(--md-accent-fg-color); }

/* ---------- 5. 代码块：玻璃 + 紫描边（品牌化）---------- */
.md-typeset pre > code,
.md-typeset .highlight pre {
  background: rgba(31,22,54,.96);
  color: #EDEBF5;
  border: 1px solid var(--cy-line-2);
  border-radius: 14px;
  box-shadow: 0 12px 30px -18px rgba(139,92,246,.5);
}
.md-typeset code:not(pre code) {
  color: var(--cy-violet-deep);
  background: rgba(139,92,246,.10);
  border: 1px solid var(--cy-line);
  border-radius: 6px;
  padding: 2px 7px;
  font-size: .88em;
}
[data-md-color-scheme="slate"] .md-typeset code:not(pre code) {
  color: #C4B5FD;
  background: rgba(167,139,250,.14);
}
/* 复制按钮着色 */
.md-clipboard { color: rgba(237,235,245,.55); }
.md-clipboard:hover { color: var(--cy-pink); }

/* ---------- 6. 按钮（.md-button 主 CTA / 幽灵）---------- */
.md-typeset .md-button {
  border-radius: var(--cy-r-btn);
  border: 1px solid var(--cy-line-2);
  color: var(--cy-violet-deep);
  font-weight: 600;
  transition: transform .18s ease, box-shadow .25s ease;
}
.md-typeset .md-button:hover {
  transform: translateY(-2px);
  border-color: var(--cy-violet);
  color: var(--cy-violet-deep);
}
/* 主 CTA：给按钮加 class .md-button--primary 即可 */
.md-typeset .md-button--primary {
  background: var(--cy-grad-primary);
  color: #fff !important;
  border-color: transparent;
  box-shadow: 0 18px 40px -16px rgba(168,85,247,.6);
}
.md-typeset .md-button--primary:hover {
  color: #fff !important;
  box-shadow: 0 24px 52px -16px rgba(236,72,153,.55);
}

/* ---------- 7. Callout / admonition：左紫粉条 + 玻璃 ---------- */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 12px;
  border: 1px solid var(--cy-glass-border);
  border-left: 4px solid var(--cy-pink);
  background: var(--cy-glass);
  box-shadow: 0 20px 50px -22px rgba(139,92,246,.28);
}
.md-typeset .admonition-title,
.md-typeset summary {
  background: rgba(139,92,246,.10);
}
/* note/tip 类用紫，warning 类保留橙暖，其余统一 */
.md-typeset .admonition.note,
.md-typeset .admonition.info,
.md-typeset .admonition.tip { border-left-color: var(--cy-violet); }
.md-typeset .admonition.note > .admonition-title::before,
.md-typeset .admonition.info > .admonition-title::before,
.md-typeset .admonition.tip  > .admonition-title::before {
  background-color: var(--cy-violet-deep);
}

/* ---------- 8. 导航高亮 / 目录激活态 ---------- */
.md-nav__link--active,
.md-nav__link:hover {
  color: var(--cy-violet-deep);
}
.md-nav__item .md-nav__link--active {
  font-weight: 600;
}
[data-md-color-scheme="slate"] .md-nav__link--active,
[data-md-color-scheme="slate"] .md-nav__link:hover {
  color: #A78BFA;
}

/* ---------- 9. 表格：品牌表头 ---------- */
.md-typeset table:not([class]) th {
  background: rgba(139,92,246,.08);
  color: var(--cy-violet-deep);
  font-weight: 600;
}

/* ---------- 10. 选中色 / 焦点环 ---------- */
::selection { background: rgba(139,92,246,.28); color: #1F1636; }
[data-md-color-scheme="slate"] ::selection { background: rgba(139,92,246,.38); color: #EDEBF5; }
.md-typeset a:focus-visible,
.md-button:focus-visible {
  outline: 2px solid var(--cy-violet-deep);
  outline-offset: 3px;
  border-radius: 10px;
}

/* ---------- 11. 页脚品牌色 ---------- */
.md-footer { background: #241F3A; }
.md-footer-meta { background: #1B1730; }

/* ---------- 12. 减动效尊重 ---------- */
@media (prefers-reduced-motion: reduce) {
  .md-typeset .md-button,
  .md-typeset .md-button--primary { transition: none !important; }
}
