/**
 * B2 Group Buy Plugin - CSS Variables
 * 统一的CSS变量定义，供所有样式文件使用
 */

:root {
    /* ==================== 颜色渐变 ==================== */
    --gb-primary-gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%);
    --gb-secondary-gradient: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);
    --gb-success-gradient: linear-gradient(135deg, #10b981 0%, #34d399 100%);
    --gb-warning-gradient: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
    --gb-danger-gradient: linear-gradient(135deg, #ef4444 0%, #f87171 100%);
    --gb-info-gradient: linear-gradient(135deg, #06b6d4 0%, #22d3ee 100%);
    --gb-purple-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

    /* ==================== 基础颜色 ==================== */
    --gb-primary: #6366f1;
    --gb-primary-hover: #4f46e5;
    --gb-primary-light: #eef2ff;
    --gb-secondary: #64748b;
    --gb-success: #10b981;
    --gb-success-light: #d1fae5;
    --gb-warning: #f59e0b;
    --gb-warning-light: #fef3c7;
    --gb-danger: #ef4444;
    --gb-danger-light: #fee2e2;
    --gb-info: #06b6d4;
    --gb-info-light: #cffafe;

    /* ==================== 文本颜色 ==================== */
    --gb-text-primary: #1e293b;
    --gb-text-secondary: #64748b;
    --gb-text-muted: #94a3b8;
    --gb-text-light: #cbd5e1;

    /* ==================== 背景颜色 ==================== */
    --gb-bg-primary: #ffffff;
    --gb-bg-secondary: #f8fafc;
    --gb-bg-tertiary: #f1f5f9;
    --gb-bg-dark: #1e293b;

    /* ==================== 玻璃态效果 ==================== */
    --gb-glass-bg: rgba(255, 255, 255, 0.7);
    --gb-glass-bg-dark: rgba(255, 255, 255, 0.1);
    --gb-glass-border: rgba(255, 255, 255, 0.2);
    --gb-backdrop-blur: blur(10px);

    /* ==================== 阴影 ==================== */
    --gb-shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --gb-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --gb-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --gb-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --gb-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --gb-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    --gb-shadow-glow: 0 0 40px rgba(99, 102, 241, 0.15);
    --gb-shadow-glow-purple: 0 0 40px rgba(102, 126, 234, 0.2);

    /* ==================== 过渡动画 ==================== */
    --gb-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --gb-transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --gb-transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);
    --gb-transition-spring: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

    /* ==================== 圆角 ==================== */
    --gb-radius-xs: 4px;
    --gb-radius-sm: 8px;
    --gb-radius-md: 12px;
    --gb-radius-lg: 16px;
    --gb-radius-xl: 20px;
    --gb-radius-2xl: 24px;
    --gb-radius-full: 9999px;

    /* ==================== 间距 ==================== */
    --gb-space-xs: 4px;
    --gb-space-sm: 8px;
    --gb-space-md: 16px;
    --gb-space-lg: 24px;
    --gb-space-xl: 32px;
    --gb-space-2xl: 48px;

    /* ==================== 字体 ==================== */
    --gb-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --gb-font-mono: 'JetBrains Mono', 'Fira Code', Consolas, Monaco, 'Andale Mono', monospace;

    /* ==================== 字体大小 ==================== */
    --gb-text-xs: 0.75rem;
    --gb-text-sm: 0.875rem;
    --gb-text-base: 1rem;
    --gb-text-lg: 1.125rem;
    --gb-text-xl: 1.25rem;
    --gb-text-2xl: 1.5rem;
    --gb-text-3xl: 1.875rem;

    /* ==================== 层级 ==================== */
    --gb-z-dropdown: 1000;
    --gb-z-sticky: 1020;
    --gb-z-fixed: 1030;
    --gb-z-modal-backdrop: 1040;
    --gb-z-modal: 1050;
    --gb-z-popover: 1060;
    --gb-z-tooltip: 1070;

    /* ==================== 断点 (用于媒体查询参考) ==================== */
    /* --gb-breakpoint-sm: 640px; */
    /* --gb-breakpoint-md: 768px; */
    /* --gb-breakpoint-lg: 1024px; */
    /* --gb-breakpoint-xl: 1280px; */
}

/* ==================== 暗色主题支持 ==================== */
/* 方式1：系统偏好自动切换（不需要手动添加类名） */
@media (prefers-color-scheme: dark) {
    :root:not(.gb-light-mode) {
        --gb-bg-primary: #0f172a;
        --gb-bg-secondary: #1e293b;
        --gb-bg-tertiary: #334155;
        --gb-bg-dark: #020617;
        --gb-text-primary: #f1f5f9;
        --gb-text-secondary: #94a3b8;
        --gb-text-muted: #64748b;
        --gb-text-light: #475569;
        --gb-glass-bg: rgba(30, 41, 59, 0.85);
        --gb-glass-border: rgba(255, 255, 255, 0.1);
        --gb-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
        --gb-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
        --gb-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
        --gb-shadow-glow: 0 0 40px rgba(99, 102, 241, 0.3);
    }
}

/* 方式2：手动强制暗色模式（添加 .gb-dark-mode 类到 html） */
:root.gb-dark-mode {
    --gb-bg-primary: #0f172a;
    --gb-bg-secondary: #1e293b;
    --gb-bg-tertiary: #334155;
    --gb-bg-dark: #020617;
    --gb-text-primary: #f1f5f9;
    --gb-text-secondary: #94a3b8;
    --gb-text-muted: #64748b;
    --gb-text-light: #475569;
    --gb-glass-bg: rgba(30, 41, 59, 0.85);
    --gb-glass-border: rgba(255, 255, 255, 0.1);
    --gb-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
    --gb-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
    --gb-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
    --gb-shadow-glow: 0 0 40px rgba(99, 102, 241, 0.3);
}