/* ═══════════════════════════════════════════════════════
   海丝管理后台 · 全局主题令牌  (variables.css)
   所有后台页面引入此文件，获得统一的视觉设计系统。
   采用三级令牌架构：原始令牌 → 语义令牌 → 组件令牌
   ═══════════════════════════════════════════════════════ */

/* ── 一、原始令牌 (Primitive Tokens) ── */
:root {
  /* 闽南·海洋色板 */
  --minnan-red:          #C8102E;
  --minnan-red-dark:     #8B0000;
  --minnan-red-light:    #E53E3E;
  --minnan-gold:         #D4AF37;
  --minnan-gold-light:   #FFD700;
  --minnan-gold-dark:    #B8960C;
  --minnan-brown:        #5C3317;
  --minnan-brown-dark:   #3A210F;
  --minnan-brown-light:  #8B6F47;
  --minnan-beige:        #F5F3E8;
  --minnan-beige-light:  #FAF8F0;
  --minnan-black:        #1A1A1A;
  --ocean-blue:          #0A3A5C;
  --ocean-deep:          #06101E;
}

/* ── 二、语义令牌 (Semantic Tokens) ── */
:root {
  /* 主色 & 状态色 */
  --color-primary:        var(--minnan-red);
  --color-primary-hover:  var(--minnan-red-light);
  --color-primary-active: var(--minnan-red-dark);
  --color-success:        #52c41a;
  --color-warning:        #faad14;
  --color-error:          var(--minnan-red);
  --color-info:           var(--ocean-blue);
  --color-accent:         var(--minnan-gold);

  /* 文字色阶 */
  --color-text-primary:   var(--minnan-black);
  --color-text-secondary: var(--minnan-brown);
  --color-text-tertiary:  var(--minnan-brown-light);
  --color-text-disabled:  #bfbfbf;
  --color-text-inverse:   var(--minnan-beige);

  /* 背景层级 */
  --color-bg-base:        #ffffff;
  --color-bg-secondary:   var(--minnan-beige-light);
  --color-bg-tertiary:    var(--minnan-beige);
  --color-bg-hover:       rgba(212, 175, 55, 0.08);
  --color-bg-active:      rgba(200, 16, 46, 0.10);

  /* 边框 */
  --color-border:         var(--minnan-brown-light);
  --color-border-light:   rgba(212, 175, 55, 0.20);
  --color-border-gold:    var(--minnan-gold);

  /* ── 三、阴影系统 ── */
  --shadow-sm:    0 2px 8px rgba(92, 51, 23, 0.10);
  --shadow-md:    0 4px 16px rgba(92, 51, 23, 0.15);
  --shadow-lg:    0 8px 24px rgba(92, 51, 23, 0.20);
  --shadow-gold:  0 2px 10px rgba(212, 175, 55, 0.30);
  --shadow-card:
    0 2px 6px   rgba(0, 0, 0, 0.25),
    0 12px 40px rgba(0, 0, 0, 0.40),
    0 0 80px    rgba(10, 20, 40, 0.50);

  /* ── 四、圆角 ── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-pill: 9999px;

  /* ── 五、布局骨架 ── */
  --sidebar-width: 240px;
  --header-height: 64px;

  /* ── 六、字号阶梯 ── */
  --font-xs:  11px;
  --font-sm:  12px;
  --font-md:  14px;
  --font-lg:  16px;
  --font-xl:  18px;
  --font-xxl: 20px;

  /* ── 七、间距系统 ── */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-xxl: 48px;

  /* ── 八、动效令牌 ── */
  --duration-fast:  120ms;
  --duration-base:  220ms;
  --duration-slow:  380ms;
  --ease-spring:    cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-smooth:    cubic-bezier(0.40, 0.00, 0.20, 1);
  --ease-out:       cubic-bezier(0.00, 0.00, 0.20, 1);
}

/* ── 侧边栏 Logo 组件令牌（供 dashboard 等页面复用）── */
:root {
  --logo-icon-size:    40px;
  --logo-icon-radius:  8px;
  --logo-text-size:    18px;
  --logo-slogan-size:  10px;
}