/* ============================================================
   同城分类信息平台 · 设计 Token v0.1（三端共用源）
   依据《P0 移动端设计 Token 规范 v0.1》——色/字/距/角/影/动效全部
   来自规范实算值，业务代码禁止写死色值/字号/间距，换肤只改这里。
   PC 与管理后台只加密度层，不新造颜色。
   ============================================================ */
page,
:root {
  /* ---- 品牌主色（青绿系 10 级）内容=绿 ---- */
  --brand-50: #E6F7F0;
  --brand-100: #CCEFDE;
  --brand-200: #99E3C6;
  --brand-300: #5CD3A9;
  --brand-400: #2BBD92;
  --brand-500: #00A876;
  --brand-600: #007F53;   /* 主按钮底/链接字（白字 5.05 AA） */
  --brand-700: #00694A;   /* 浅绿底小字（对 #E6F7F0 6.07 AA） */
  --brand-800: #00543B;
  --brand-900: #003E2C;

  /* ---- 中性色（冷灰 9 级 + 黑白）---- */
  --gray-50: #F7F8FA;     /* 页面背景 */
  --gray-100: #F2F3F5;    /* 卡片浅底/输入填充 */
  --gray-200: #E5E7EB;    /* 分割线（装饰） */
  --gray-300: #D3D8DE;    /* 禁用描边/占位底 */
  --gray-400: #8A94A0;    /* 输入默认描边（非文字 3:1） */
  --gray-500: #6B7280;    /* 占位符/辅助说明（4.83 AA） */
  --gray-600: #4B5563;    /* 次要文字（7.56 AA） */
  --gray-700: #374151;
  --gray-800: #1F2937;
  --gray-900: #111827;    /* 正文/标题主文字 */
  --pure-white: #FFFFFF;
  --pure-black: #000000;

  /* ---- 功能色（fill/graphic/text 三档）---- */
  --success-50: #E8F7EE;  --success: #16A34A;  --success-text: #15803D;
  --warn-50: #FEF3C7;     --warn: #F59E0B;     --warn-text: #B45309;
  --error-50: #FDECEC;    --error: #DC2626;    --error-text: #B91C1C;
  --info-50: #E8F1FE;     --info: #2563EB;     --info-text: #2563EB;

  /* ---- 商业化色（收入位专用，与内容区强区分）商业=橙 ---- */
  --promo-50: #FFF3EC;
  --promo-100: #FFE4D6;
  --promo-500: #E8590C;   /* 置顶徽章/推广按钮/大号价格(≥20px600) */
  --promo-600: #C2410C;   /* 小号价格/付费解锁小字（5.18 AA） */
  --vip-50: #FFF8E6;
  --vip-200: #E5C97E;
  --vip-500: #B88A2E;
  --vip-700: #8A6116;

  /* ---- 分类宫格图标色（装饰性，均伴随文字标签）---- */
  --cat-ershou: #00A876;   /* 二手闲置 */
  --cat-fangwu: #5B6BF0;   /* 房屋租售 */
  --cat-zhaopin: #2563EB;  /* 招聘 */
  --cat-jianzhi: #0EA5E9;  /* 兼职 */
  --cat-cheliang: #E8590C; /* 车辆买卖 */
  --cat-fuwu: #7C5CFC;     /* 生活服务 */
  --cat-chongwu: #E0518F;  /* 宠物 */
  --cat-jiaoyu: #D97706;   /* 教育培训 */
  --cat-gongju: #64748B;   /* 便民工具 */
  --cat-zixun: #DC2626;    /* 本地资讯 */

  /* ---- 字体族 ---- */
  --font-base: -apple-system, "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  --font-num: "DIN Alternate", "Helvetica Neue", -apple-system, "PingFang SC", sans-serif;

  /* ---- 字号阶梯（8 档，px；行高/字重见规范）---- */
  --font-display-size: 24px;  --font-display-lh: 32px;   /* 600 */
  --font-title-lg-size: 20px; --font-title-lg-lh: 28px;  /* 600 */
  --font-title-size: 17px;    --font-title-lh: 24px;     /* 600 */
  --font-body-lg-size: 17px;  --font-body-lg-lh: 24px;   /* 400 */
  --font-body-size: 16px;     --font-body-lh: 24px;      /* 400 */
  --font-body-sm-size: 14px;  --font-body-sm-lh: 22px;   /* 400 */
  --font-caption-size: 12px;  --font-caption-lh: 16px;   /* 400 */
  --font-micro-size: 10px;    --font-micro-lh: 14px;     /* 500 */
  --fw-medium: 500;
  --fw-semibold: 600;

  /* ---- 间距（4/8 双基准，px）---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;   /* 页面左右边距 */
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* ---- 尺寸与触控 ---- */
  --touch-target: 44px;
  --height-btn-md: 44px;
  --height-btn-lg: 48px;
  --height-input: 44px;
  --height-badge: 20px;
  --height-tag: 24px;
  --height-tabbar: 56px;
  --height-navbar: 44px;
  --gutter-page: 16px;

  /* ---- 圆角与描边 ---- */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 999px;
  --border-hairline: 1px solid var(--gray-200);
  --border-input: 1px solid var(--gray-400);

  /* ---- 阴影（亮色四级）---- */
  --shadow-card: 0 1px 2px rgba(17,24,39,.04), 0 1px 3px rgba(17,24,39,.06);
  --shadow-raised: 0 4px 12px rgba(17,24,39,.08);
  --shadow-float: 0 8px 24px rgba(17,24,39,.12);
  --shadow-modal: 0 16px 48px rgba(17,24,39,.16);

  /* ---- 透明度 ---- */
  --overlay-modal: rgba(17,24,39,.55);
  --overlay-sheet: rgba(17,24,39,.45);
  --disabled-bg-alpha: .32;
  --image-placeholder-alpha: .6;

  /* ---- 动效 ---- */
  --duration-fast: 150ms;
  --duration-base: 240ms;
  --duration-slow: 320ms;
  --ease-out: cubic-bezier(0.3, 0, 0.6, 1);
  --ease-in: cubic-bezier(0.4, 0, 0.7, 1);
}

/* 减弱动效偏好 */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}
