/* ==========================================
   YECO 全局CSS变量
   所有页面和报告必须使用这些变量以保持视觉统一性
   ========================================== */

:root {
    /* ==========================================
       主色调 - 以黑色为主
       ========================================== */
    --primary-black: #000000;
    --rich-black: #0d0d0d;
    --charcoal: #1a1a1a;
    --dark-gray: #2a2a2a;
    --medium-gray: #4a4a4a;

    /* ==========================================
       金色点缀 - 精简使用
       ========================================== */
    --accent-gold: #D4AF37;
    --soft-gold: #C9A961;
    --dark-gold: #9B7E2E;
    --light-gold: #E5D8A8;

    /* ==========================================
       中性色
       ========================================== */
    --white: #FFFFFF;
    --off-white: #F8F8F8;
    --light-gray: #E5E5E5;
    --warm-gray: #C2B8A3;

    /* ==========================================
       中东元素色彩
       ========================================== */
    --desert-sand: #D4C5B0;
    --deep-teal: #1B4D3E;
    --sand-beige: #E8DCC4;
    --terracotta: #C97B63;

    /* ==========================================
       状态色
       ========================================== */
    --success-green: #2D5C4A;
    --warning-amber: #8B6914;
    --error-red: #6B2C2C;
    --info-blue: #2C4A6B;

    /* ==========================================
       字体系统
       ========================================== */
    --font-display: 'Playfair Display', serif;
    --font-body: 'Noto Serif SC', 'Noto Serif', serif;
    --font-elegant: 'Cormorant Garamond', serif;
    --font-arabic: 'Noto Sans Arabic', 'Dubai', 'Tahoma', sans-serif;
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* ==========================================
       字体大小
       ========================================== */
    --text-xs: 0.75rem;      /* 12px */
    --text-sm: 0.875rem;     /* 14px */
    --text-base: 1rem;       /* 16px */
    --text-lg: 1.125rem;     /* 18px */
    --text-xl: 1.25rem;      /* 20px */
    --text-2xl: 1.5rem;      /* 24px */
    --text-3xl: 1.875rem;    /* 30px */
    --text-4xl: 2.25rem;     /* 36px */
    --text-5xl: 3rem;        /* 48px */
    --text-6xl: 3.75rem;     /* 60px */

    /* ==========================================
       间距系统 - 8px基准
       ========================================== */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;
    --spacing-xxl: 100px;
    --spacing-3xl: 120px;

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

    /* ==========================================
       阴影
       ========================================== */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    --shadow-gold: 0 4px 15px rgba(212, 175, 55, 0.3);

    /* ==========================================
       过渡动画
       ========================================== */
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
    --transition-slower: 0.8s ease;

    /* 缓动函数 */
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --ease-in: cubic-bezier(0.4, 0, 1, 1);

    /* ==========================================
       Z-index层级管理
       ========================================== */
    --z-base: 1;
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-fixed: 300;
    --z-modal-backdrop: 400;
    --z-modal: 500;
    --z-popover: 600;
    --z-tooltip: 700;
    --z-toast: 800;
    --z-max: 999;

    /* ==========================================
       容器宽度
       ========================================== */
    --container-sm: 640px;
    --container-md: 768px;
    --container-lg: 1024px;
    --container-xl: 1280px;
    --container-2xl: 1536px;

    /* ==========================================
       响应式断点（用于JS）
       ========================================== */
    --breakpoint-sm: 640px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1024px;
    --breakpoint-xl: 1280px;

    /* ==========================================
       动画方向（RTL支持）
       ========================================== */
    --slide-direction: left;
    --text-align: left;
}

/* ==========================================
   RTL变量调整
   ========================================== */
[dir="rtl"] {
    --slide-direction: right;
    --text-align: right;
}