// hikari-theme/styles/variables.scss
// CSS 变量（使用 hikari-palette）
// ============================================
// 1. Color System
// ============================================
// Colors are defined via CSS variables in the index.scss
// and by the hikari-palette crate
// ============================================
// 2. Typography Variables
// ============================================
$hikari-font-family-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
$hikari-font-family-mono: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
$hikari-font-size-xs: 0.75rem;
$hikari-font-size-sm: 0.875rem;
$hikari-font-size-base: 1rem;
$hikari-font-size-lg: 1.125rem;
$hikari-font-size-xl: 1.25rem;
$hikari-font-size-2xl: 1.5rem;
$hikari-font-size-3xl: 1.875rem;
// ============================================
// 间距变量
// ============================================
$hikari-spacing-xs: 0.25rem;
$hikari-spacing-sm: 0.5rem;
$hikari-spacing-md: 1rem;
$hikari-spacing-lg: 1.5rem;
$hikari-spacing-xl: 2rem;
$hikari-spacing-2xl: 3rem;
// ============================================
// 圆角变量
// ============================================
$hikari-radius-sm: 0.25rem;
$hikari-radius-md: 0.5rem;
$hikari-radius-lg: 0.75rem;
$hikari-radius-xl: 1rem;
$hikari-radius-full: 9999px;
// ============================================
// 阴影变量
// ============================================
$hikari-shadow-sm: var(--hi-shadow-sm);
$hikari-shadow-md: var(--hi-shadow-md);
$hikari-shadow-lg: var(--hi-shadow-lg);
$hikari-shadow-xl: var(--hi-shadow-xl);
// ============================================
// 过渡变量
// ============================================
$hikari-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
$hikari-transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
$hikari-transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
// ============================================
// 设计系统变量
// ============================================
// 亚克力效果参数
$hikari-acrylic-blur: 20px;
$hikari-acrylic-noise: 0.5;
$hikari-acrylic-opacity: 0.85;
// 发光效果参数
$hikari-glow-sm: var(--hi-glow-sm);
$hikari-glow-md: var(--hi-glow-md);
$hikari-glow-lg: var(--hi-glow-lg);
$hikari-glow-focus: var(--hi-glow-focus);
// 强调色条参数
$hikari-accent-bar-width: 3px;
$hikari-accent-bar-position: left; // left, right, top, bottom
// 细微圆角（风格）
$hikari-radius-fui-sm: 4px;
$hikari-radius-fui-md: 6px;
$hikari-radius-fui-lg: 8px;
// 边框发光
$hikari-border-glow-color: var(--hi-border-glow);
$hikari-border-glow-width: var(--hi-border-glow-width);
// 动画缓动函数（GSAP 风格）
$hikari-ease-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);
$hikari-ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);
$hikari-ease-elastic: cubic-bezier(0.5, 1.5, 0.5, 1);
// 动画时长
$hikari-duration-instant: 100ms;
$hikari-duration-fast: 200ms;
$hikari-duration-normal: 300ms;
$hikari-duration-slow: 500ms;
// 背景微动参数
$hikari-ambient-duration: 8s;
$hikari-ambient-easing: ease-in-out;
// ============================================
// Icon Button 尺寸变量
// ============================================
$hikari-icon-button-size-16: 16px;
$hikari-icon-button-size-24: 24px;
$hikari-icon-button-size-32: 32px;
$hikari-icon-button-size-36: 36px;
// ============================================
// 常用图标尺寸变量
// ============================================
$hikari-icon-size-xs: 12px;
$hikari-icon-size-sm: 14px;
$hikari-icon-size-md: 16px;
$hikari-icon-size-lg: 20px;
$hikari-icon-size-xl: 24px;