/*
 * ============================================================
 * PMGO 全局主题配置文件
 * ============================================================
 * 修改规则：
 *   - 改第一层（基础 token）= 影响所有引用它的语义 token
 *   - 改第二层（语义 token）= 只影响该具体组件
 *   - 新页面开发必须引用此文件的变量，禁止写死 px/颜色/font-weight
 * ============================================================
 */

:root {

  /* ============================================================
   * 第一层：基础 Token（不直接用于样式，只供第二层引用）
   * ============================================================ */

  /* 基础颜色 */
  --_blue:        #1b61c9;
  --_blue-dark:   #1550a8;
  --_navy:        #181d26;
  --_green:       #16a34a;
  --_green-dark:  #15803d;
  --_success:     #006400;
  --_danger:      #dc2626;
  --_warning:     #d97706;
  --_white:       #ffffff;

  /* 基础字体大小 */
  --_font-10: 10px;
  --_font-11: 11px;
  --_font-12: 12px;
  --_font-13: 13px;
  --_font-14: 14px;
  --_font-15: 15px;
  --_font-16: 16px;
  --_font-18: 18px;
  --_font-20: 20px;
  --_font-24: 24px;
  --_font-26: 26px;
  --_font-28: 28px;

  /* 基础字重 */
  --_w-normal:   400;
  --_w-medium:   500;
  --_w-semibold: 600;
  --_w-bold:     700;
  --_w-extrabold:800;

  /* 基础间距 */
  --_sp-4:  4px;
  --_sp-6:  6px;
  --_sp-8:  8px;
  --_sp-10: 10px;
  --_sp-12: 12px;
  --_sp-14: 14px;
  --_sp-16: 16px;
  --_sp-20: 20px;
  --_sp-24: 24px;
  --_sp-28: 28px;
  --_sp-32: 32px;
  --_sp-40: 40px;

  /* 基础圆角 */
  --_r-6:  6px;
  --_r-8:  8px;
  --_r-10: 10px;
  --_r-12: 12px;
  --_r-14: 14px;
  --_r-16: 16px;
  --_r-20: 20px;
  --_r-28: 28px;

  /* ============================================================
   * 第二层：语义 Token（页面样式直接引用这一层）
   * ============================================================ */

  /* ---------- 品牌色 ---------- */
  --color-primary:       var(--_blue);
  --color-primary-dark:  var(--_blue-dark);
  --color-navy:          var(--_navy);
  --color-success:       var(--_success);
  --color-success-light: var(--_green);
  --color-success-dark:  var(--_green-dark);
  --color-danger:        var(--_danger);
  --color-warning:       var(--_warning);
  --color-white:         var(--_white);

  /* ---------- 背景色 ---------- */
  --bg-page:    #f8fafc;
  --bg-card:    #ffffff;
  --bg-hover:   #fafbff;
  --bg-success: #f0fdf4;
  --bg-danger:  #fef2f2;
  --bg-warning: #fef9c3;
  --bg-info:    #eff6ff;

  /* ---------- 文本色 ---------- */
  --text-primary: var(--_navy);
  --text-weak:    rgba(4,14,32,0.69);
  --text-muted:   #64748b;
  --text-light:   #94a3b8;

  /* ---------- 边框 & 阴影 ---------- */
  --border-color: #e0e2e6;
  --shadow-card:  rgba(0,0,0,0.32) 0px 0px 1px, rgba(0,0,0,0.08) 0px 0px 2px, rgba(45,127,249,0.28) 0px 1px 3px;
  --shadow-card-inset: rgba(0,0,0,0.32) 0px 0px 1px, rgba(0,0,0,0.08) 0px 0px 2px, rgba(45,127,249,0.28) 0px 1px 3px, rgba(0,0,0,0.06) 0px 0px 0px 0.5px inset;
  --focus-ring:   0 0 0 3px rgba(27,97,201,0.12);

  /* ---------- 字体大小（语义命名）---------- */
  --font-xs:   var(--_font-11);   /* 极小：时间戳、角标 */
  --font-sm:   var(--_font-12);   /* 小：标签、徽章、表格辅助文字 */
  --font-base: var(--_font-13);   /* 基础：按钮、表单标签、常规文本 */
  --font-md:   var(--_font-14);   /* 中：表单输入、卡片内容 */
  --font-body: var(--_font-15);   /* 正文：页面主体文字 */
  --font-lg:   var(--_font-16);   /* 大：模态框标题、大按钮 */
  --font-xl:   var(--_font-18);   /* 特大：页面标题（top-bar） */
  --font-2xl:  var(--_font-20);   /* 超大：页面主标题（header h1） */
  --font-3xl:  var(--_font-26);   /* 登录/注册页 logo 标题 */
  --font-stat: var(--_font-28);   /* 统计数字 */

  /* ---------- 字重（语义命名）---------- */
  --weight-normal:   var(--_w-normal);
  --weight-medium:   var(--_w-medium);
  --weight-semibold: var(--_w-semibold);
  --weight-bold:     var(--_w-bold);

  /* ---------- 间距（语义命名）---------- */
  --space-1: var(--_sp-4);
  --space-2: var(--_sp-6);
  --space-3: var(--_sp-8);
  --space-4: var(--_sp-10);
  --space-5: var(--_sp-12);
  --space-6: var(--_sp-14);
  --space-7: var(--_sp-16);
  --space-8: var(--_sp-20);
  --space-9: var(--_sp-24);
  --space-10: var(--_sp-32);
  --space-11: var(--_sp-40);

  /* ---------- 圆角（语义命名）---------- */
  --radius-xs: var(--_r-6);    /* 极小：输入框内部元素 */
  --radius-sm: var(--_r-8);    /* 小：输入框、小按钮 */
  --radius-md: var(--_r-12);   /* 中：按钮、徽章 */
  --radius-lg: var(--_r-16);   /* 大：卡片、容器 */
  --radius-xl: var(--_r-20);   /* 特大：大按钮、标签 */
  --radius-2xl: var(--_r-28);  /* 超大：user_home 余额卡片 */

  /* ---------- 过渡 ---------- */
  --transition-fast: 0.15s;
  --transition-base: 0.2s;
  --transition-slow: 0.3s;

  /* ---------- 字间距 ---------- */
  --tracking-tight:  0.07px;
  --tracking-normal: 0.08px;
  --tracking-wide:   0.12px;
  --tracking-wider:  0.28px;

  /* ============================================================
   * 组件级 Token（具体 UI 元素，改这里只影响该组件）
   * ============================================================ */

  /* 导航栏 */
  --nav-height:           64px;
  --nav-page-title-size:  var(--font-xl);
  --nav-page-title-weight:var(--weight-semibold);
  --nav-back-font-size:   var(--font-base);
  --nav-back-radius:      var(--radius-md);

  /* 页面主标题（header h1 / .header h1）*/
  --header-title-size:    var(--font-2xl);
  --header-title-weight:  var(--weight-semibold);

  /* 卡片 */
  --card-radius:          var(--radius-lg);
  --card-padding:         var(--space-7);
  --card-title-size:      var(--font-sm);
  --card-title-weight:    var(--weight-semibold);
  --card-title-tracking:  var(--tracking-wider);

  /* 面板头部（panel-header）*/
  --panel-header-size:    var(--font-md);
  --panel-header-weight:  var(--weight-semibold);
  --panel-header-padding: var(--space-6) var(--space-7);

  /* 按钮 */
  --btn-font-size:        var(--font-base);
  --btn-font-weight:      var(--weight-medium);
  --btn-radius:           var(--radius-md);
  --btn-padding-y:        var(--_sp-8);
  --btn-padding-x:        var(--_sp-14);
  --btn-sm-font-size:     var(--font-sm);
  --btn-sm-padding-y:     var(--_sp-6);
  --btn-sm-padding-x:     var(--_sp-10);
  --btn-sm-radius:        var(--_r-8);

  /* 表单 */
  --input-font-size:      var(--font-md);
  --input-padding-y:      var(--_sp-10);
  --input-padding-x:      var(--_sp-14);
  --input-radius:         var(--radius-sm);
  --label-font-size:      var(--font-md);
  --label-font-weight:    var(--weight-medium);

  /* 表格 */
  --table-header-size:    var(--font-sm);
  --table-header-weight:  var(--weight-semibold);
  --table-cell-size:      var(--font-base);
  --table-cell-padding:   var(--_sp-8);

  /* 徽章 */
  --badge-font-size:      var(--font-sm);
  --badge-font-weight:    var(--weight-medium);
  --badge-radius:         var(--_r-10);
  --badge-padding-y:      var(--_sp-4);
  --badge-padding-x:      var(--_sp-8);

  /* Tab 导航 */
  --tab-font-size:        var(--font-md);
  --tab-font-weight:      var(--weight-medium);
  --tab-padding:          var(--_sp-12) var(--_sp-16);

  /* 模态框关闭按钮（× 符号）*/
  --modal-close-size:     22px;
  --modal-title-sm-size:  17px;

  /* 统计卡片数值 */
  --stat-value-size:      var(--font-stat);
  --stat-value-weight:    var(--weight-bold);
  --stat-label-size:      var(--font-sm);

  /* 登录/注册页 */
  --auth-logo-size:       var(--font-3xl);
  --auth-logo-weight:     var(--weight-semibold);
  --auth-subtitle-size:   var(--font-md);
  --auth-container-radius:var(--radius-lg);
  --auth-container-padding:var(--space-11);

  /* Section 标题（小写全大写标签）*/
  --section-title-size:   var(--font-sm);
  --section-title-weight: var(--weight-semibold);
  --section-title-tracking:var(--tracking-wider);

  /* 快速下单 - 方向列徽章 */
  --quick-order-outcome-size:   var(--font-body);    /* 16px，比普通徽章(12px)大 */
  --quick-order-outcome-weight: var(--weight-bold);

  /* Builder API / Redeem 区块 */
  --builder-card-title-size:    var(--font-sm);
  --builder-card-title-weight:  var(--weight-semibold);
  --redeem-btn-bg:              #7c3aed;
  --redeem-btn-hover:           #6d28d9;

  /* 统计卡片扩展色 */
  --stat-card-orange:           #b45309;
  --stat-card-teal:             #0e7490;
  --stat-card-teal-text:        #0e7490;

  /* 徽章颜色 */
  --badge-success-bg:           #dcfce7;
  --badge-success-text:         #166534;
  --badge-danger-text:          #991b1b;
  --badge-warning-text:         #854d0e;
  --badge-admin-text:           #1e40af;
  --badge-user-bg:              #f5f3ff;
  --badge-user-text:            #5b21b6;

  /* 按钮 hover 深色 */
  --btn-success-hover:          #166534;
  --btn-danger-hover:           #b91c1c;
  --btn-warning-hover:          #b45309;

  /* Alert 边框 */
  --alert-success-border:       #bbf7d0;
  --alert-error-border:         #fecaca;
  --alert-error-text:           #991b1b;

  /* 余额/信息框 */
  --balance-box-border:         #bfdbfe;
  --balance-box-text:           #1e40af;
  --input-readonly-bg:          #f1f5f9;
  --text-timestamp:             #64748b;

  /* 导航链接边框 */
  --nav-link-border:            #bfdbfe;

  /* teal 按钮 hover */
  --btn-teal-hover:             #0c6480;
}