/**
 * 智坞（zhidock）官网设计令牌（CSS 变量层）
 *
 * 来源：website-style-guide.md §二
 * 与客户端主色对齐：#448aff（qt-material dark_blue.xml）
 *
 * Tailwind 通过 CDN 内联配置已覆盖大部分场景；
 * 本文件用于：
 *   1) 非 Tailwind 控制的原生元素（如 input placeholder、SVG fill）
 *   2) 第三方组件主题化（如代码高亮）
 *   3) 暗色模式（T3.x 启用时扩展）
 */

:root {
  /* 主色阶（与 base.html tailwind.config 一致） */
  --color-brand-50:  #eff5ff;
  --color-brand-100: #dbe8fe;
  --color-brand-200: #bfd6fe;
  --color-brand-300: #93bbfd;
  --color-brand-400: #6098fa;
  --color-brand-500: #448aff;   /* 主色 */
  --color-brand-600: #2266eb;
  --color-brand-700: #1c51d8;
  --color-brand-800: #1e43af;
  --color-brand-900: #1e3a8a;

  /* 中性色 */
  --color-text:        #111827; /* gray-900 */
  --color-text-muted:  #6b7280; /* gray-500 */
  --color-border:      #e5e7eb; /* gray-200 */
  --color-surface:     #ffffff;
  --color-surface-alt: #f9fafb; /* gray-50 */

  /* 状态色 */
  --color-success: #16a34a;
  --color-warning: #d97706;
  --color-error:   #dc2626;

  /* 圆角（与客户端 qss 一致：4px / 8px） */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;

  /* 阴影（克制，避免重质感） */
  --shadow-card:    0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.10);
  --shadow-elevated: 0 8px 24px rgba(16,24,40,.12);

  /* 动效（克制；不超过 200ms） */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 120ms;
  --duration-base: 180ms;
}

/* 全局基础样式（少量补强；主样式由 Tailwind 提供） */
html {
  scroll-behavior: smooth;
}

body {
  font-feature-settings: "kern", "liga", "calt";
}

/* 链接默认（与品牌色一致） */
a {
  color: var(--color-brand-700);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out);
}
a:hover {
  color: var(--color-brand-800);
}

/* 表单占位符颜色统一 */
input::placeholder, textarea::placeholder {
  color: #9ca3af;
}

/* focus 可见性（无障碍 §六） */
:focus-visible {
  outline: 2px solid var(--color-brand-500);
  outline-offset: 2px;
}

/* 减弱动效偏好（无障碍 §六） */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
