/**
 * JSW Nation 设计系统 - Design Tokens
 * 国家卫生健康委药具管理中心
 *
 * 设计理念：专业、稳重、清晰
 * 主色调：绿色系 - 医疗健康、清新专业
 * 强调色：翠绿色 - 生机活力
 */

:root {
  /* ========== 品牌色彩 ========== */
  /* 主色 - 绿色系 (医疗健康) */
  --primary: #22c55e;
  --primary-hover: #16a34a;
  --primary-active: #15803d;
  --primary-light: #f0fdf4;
  --primary-dark: #166534;

  /* 强调色 - 翠绿色 (点缀使用) */
  --accent: #10b981;
  --accent-hover: #059669;
  --accent-light: #d1fae5;

  /* 深色系 - 用于头部 (深绿色) */
  --dark: #14532d;
  --dark-light: #166534;
  --dark-lighter: #15803d;

  /* ========== 功能色彩 ========== */
  --success: #10b981;
  --success-light: #d1fae5;
  --warning: #f59e0b;
  --warning-light: #fef3c7;
  --danger: #ef4444;
  --danger-light: #fee2e2;
  --info: #0ea5e9;
  --info-light: #e0f2fe;

  /* ========== 中性色 - 灰度系统 ========== */
  --white: #ffffff;
  --gray-50: #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-300: #cbd5e1;
  --gray-400: #94a3b8;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1e293b;
  --gray-900: #0f172a;
  --black: #000000;

  /* ========== 字体系统 ========== */
  --font-family-base: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', 'Helvetica Neue', sans-serif;
  --font-family-mono: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace;

  /* 字体大小 */
  --text-xs: 0.75rem;     /* 12px */
  --text-sm: 0.8125rem;   /* 13px */
  --text-base: 0.875rem;  /* 14px */
  --text-lg: 1rem;        /* 16px */
  --text-xl: 1.125rem;    /* 18px */
  --text-2xl: 1.5rem;     /* 24px */
  --text-3xl: 1.875rem;   /* 30px */
  --text-4xl: 2.25rem;    /* 36px */

  /* 字重 */
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;

  /* 行高 */
  --leading-tight: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.75;

  /* ========== 间距系统 ========== */
  --space-0: 0;
  --space-1: 0.25rem;   /* 4px */
  --space-2: 0.5rem;    /* 8px */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px */
  --space-5: 1.25rem;   /* 20px */
  --space-6: 1.5rem;    /* 24px */
  --space-8: 2rem;      /* 32px */
  --space-10: 2.5rem;   /* 40px */
  --space-12: 3rem;     /* 48px */
  --space-16: 4rem;     /* 64px */

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

  /* ========== 阴影 ========== */
  --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);

  /* 彩色阴影 */
  --shadow-primary: 0 4px 14px 0 rgba(34, 197, 94, 0.25);
  --shadow-primary-lg: 0 8px 25px 0 rgba(34, 197, 94, 0.3);

  /* ========== 边框 ========== */
  --border-width: 1px;
  --border-color: var(--gray-200);
  --border-color-light: var(--gray-100);
  --border-color-dark: var(--gray-300);

  /* ========== 过渡动画 ========== */
  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;

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

  /* ========== 布局 ========== */
  --header-height: 56px;
  --sidebar-width: 220px;
  --sidebar-collapsed-width: 64px;
  --content-max-width: 1400px;
}

/* ========== 工具类 ========== */
.clearfix::after {
  content: '';
  display: table;
  clear: both;
}

.text-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}