/* ============================================================
 * variables.css - 全局 CSS 变量(移动端三端共用)
 * 文档依据: 02-手机端功能模块页面设计.md 3.1/3.2/3.3
 * ============================================================ */
:root {
  /* —— 主色(品牌色,金融担保信任感) —— */
  --color-primary:        #1A8A5B;
  --color-primary-light:  #2BA977;
  --color-primary-dark:   #136A45;
  --color-primary-bg:     #E8F5EE;

  /* —— 辅助色 —— */
  --color-secondary:      #F5A623;
  --color-secondary-bg:   #FFF4E0;
  --color-accent:         #2E7CF6;

  /* —— 状态色 —— */
  --color-success:        #1A8A5B;
  --color-warning:        #F5A623;
  --color-danger:         #E54D42;
  --color-info:           #2E7CF6;

  /* —— 中性色 —— */
  --color-text-primary:   #1A1A1A;
  --color-text-regular:   #4A4A4A;
  --color-text-secondary: #8A8A8A;
  --color-text-placeholder:#BFBFBF;
  --color-text-disabled:  #D0D0D0;
  --color-text-inverse:   #FFFFFF;

  /* —— 边框/分割线 —— */
  --color-border:         #EAEAEA;
  --color-border-light:   #F2F2F2;
  --color-divider:        #EFEFEF;

  /* —— 背景 —— */
  --color-bg-page:        #F5F6F8;
  --color-bg-card:        #FFFFFF;
  --color-bg-mask:        rgba(0,0,0,0.45);

  /* —— 阴影 —— */
  --shadow-card:          0 2px 8px rgba(0,0,0,0.06);
  --shadow-tabbar:        0 -2px 8px rgba(0,0,0,0.06);
  --shadow-popup:         0 4px 24px rgba(0,0,0,0.12);

  /* —— 字号层级(固定 1rem = 37.5px, 不随屏幕变化) —— */
  --font-size-display:  .56rem;
  --font-size-title:    .48rem;
  --font-size-subtitle: .43rem;
  --font-size-body:     .37rem;
  --font-size-caption:  .32rem;
  --font-size-mini:     .27rem;

  /* —— 字重 —— */
  --font-weight-regular: 400;
  --font-weight-medium:  500;
  --font-weight-bold:    700;

  /* —— 行高 —— */
  --line-height-tight:   1.2;
  --line-height-base:    1.5;
  --line-height-loose:   1.7;

  /* —— 字体族 —— */
  --font-family: -apple-system, BlinkMacSystemFont, "PingFang SC",
                 "Helvetica Neue", "Microsoft YaHei", sans-serif;

  /* —— 间距(4 的倍数) —— */
  --grid-base: 4px;
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  12px;
  --space-lg:  16px;
  --space-xl:  20px;
  --space-xxl: 24px;

  /* —— 卡片间距 —— */
  --gap-card:    12px;
  --gap-section: 16px;

  /* —— 圆角 —— */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;

  /* —— 安全区 —— */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}