/* ============================================
   colors.css — 色彩设计令牌 (Design Tokens)
   基于主色 #02A7F0（天蓝）的品牌色系
   ============================================ */

:root {
  /* ---- 品牌主色 ---- */
  --color-primary:        #02A7F0;
  --color-primary-hover:  #0190D2;
  --color-primary-active: #017BB5;
  --color-primary-light:  #E6F6FD;
  --color-primary-bg:     #F0FAFF;

  /* ---- 功能色 ---- */
  --color-success:        #52C41A;
  --color-success-bg:     #F6FFED;
  --color-warning:        #FAAD14;
  --color-warning-bg:     #FFFBE6;
  --color-danger:         #FF4D4F;
  --color-danger-bg:      #FFF1F0;
  --color-danger-light:   #FFF1F0;
  --color-info:           #02A7F0;
  --color-info-bg:        #E6F6FD;

  /* ---- 中性色 ---- */
  --color-text-primary:   #333333;
  --color-text-regular:   #666666;
  --color-text-secondary: #999999;
  --color-text-placeholder: #BBBBBB;
  --color-text-disabled:  #CCCCCC;
  --color-text-inverse:   #FFFFFF;

  /* ---- 边框与分割线 ---- */
  --color-border-light:   #EBEBEB;
  --color-border-base:    #D9D9D9;
  --color-border-dark:    #B3B3B3;

  /* ---- 背景色 ---- */
  --color-bg-white:        #FFFFFF;
  --color-bg-page:         #F5F6F7;
  --color-bg-component:    #FAFAFA;
  --color-bg-hover:        #F0F2F5;
  --color-bg-mask:         rgba(0, 0, 0, 0.45);

  /* ---- 表格相关 ---- */
  --color-table-header-bg: #FAFAFA;
  --color-table-row-hover: #F5F7FA;
  --color-table-stripe:    #FAFBFC;

  /* ---- 导航栏 ---- */
  --color-navbar-bg:       #02A7F0;
  --color-navbar-text:     #FFFFFF;

  /* ---- 阴影 ---- */
  --shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-base: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-md:  0 4px 16px rgba(0, 0, 0, 0.12);
  --shadow-lg:  0 8px 24px rgba(0, 0, 0, 0.16);

  /* ---- 圆角 ---- */
  --radius-sm:   4px;
  --radius-base: 6px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-round: 50%;
}
