/* =============================================================
   寿光市人民政府门户网站（静态演示样板）
   文件：assets/css/tokens.css
   职责：全站设计令牌。颜色、字号、间距、圆角、阴影、层级、
         动效时长统一在此维护；关怀模式/高对比度通过变量覆盖实现。
   ============================================================= */

:root {
  /* ---------- 品牌与语义色 ---------- */
  --c-gov-blue:        #0F4C81;   /* 政务深蓝 · 主色 */
  --c-gov-blue-dark:   #0A3A63;
  --c-gov-blue-deep:   #072B4A;
  --c-gov-blue-light:  #2E6FA7;
  --c-gov-blue-pale:   #E8F0F7;
  --c-gov-blue-mist:   #F2F6FA;

  --c-sg-green:        #0D9488;   /* 寿光绿 · 城市特色辅色 */
  --c-sg-green-dark:   #0B7A70;
  --c-sg-green-pale:   #E6F5F3;

  --c-warm:            #D97706;   /* 暖色 · 重要提醒点缀 */
  --c-warm-dark:       #B45E05;
  --c-warm-pale:       #FBF0DF;

  --c-danger:          #B4232C;
  --c-danger-pale:     #FBEAEB;
  --c-success:         #1A7F37;
  --c-success-pale:    #E7F4EB;
  --c-info-pale:       #EAF2FB;

  /* ---------- 中性色 ---------- */
  --c-text:            #1F2937;
  --c-text-secondary:  #44505F;
  --c-text-muted:      #66707D;
  --c-text-invert:     #FFFFFF;
  --c-border:          #D4DBE3;
  --c-border-light:    #E6EAF0;
  --c-bg:              #FFFFFF;
  --c-bg-page:         #F4F6F9;
  --c-bg-soft:         #EFF2F6;
  --c-bg-footer:       #13304C;
  --c-bg-footer-deep:  #0D2338;

  /* ---------- 字体 ---------- */
  --font-base: -apple-system, "PingFang SC", "Microsoft YaHei",
               "Source Han Sans SC", "Noto Sans CJK SC",
               "Helvetica Neue", Arial, sans-serif;
  --fs-root: 16px;
  --fs-xs:   0.8125rem;  /* 13px 极少用 */
  --fs-sm:   0.875rem;   /* 14px 辅助文字下限 */
  --fs-base: 1rem;       /* 16px 导航/按钮下限 */
  --fs-md:   1.0625rem;  /* 17px 正文 */
  --fs-lg:   1.25rem;    /* 20px */
  --fs-xl:   1.5rem;     /* 24px */
  --fs-2xl:  1.75rem;    /* 28px */
  --fs-3xl:  2rem;       /* 32px */
  --lh-body:  1.75;
  --lh-loose: 1.9;
  --lh-tight: 1.35;

  /* ---------- 间距 ---------- */
  --sp-1: 4px;  --sp-2: 8px;   --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px;  --sp-8: 32px; --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px;

  /* ---------- 圆角 / 阴影 / 描边 ---------- */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --shadow-sm: 0 1px 2px rgba(13, 38, 66, 0.06);
  --shadow-md: 0 2px 10px rgba(13, 38, 66, 0.08);
  --shadow-lg: 0 8px 24px rgba(13, 38, 66, 0.13);
  --ring-card: inset 0 0 0 1px var(--c-border-light);

  /* ---------- 布局 ---------- */
  --container-max: 1240px;
  --header-h: 60px;
  --z-dropdown: 90;
  --z-nav: 100;
  --z-float: 200;
  --z-modal: 300;
  --z-skip: 400;

  /* ---------- 动效 ---------- */
  --dur-fast: 160ms;
  --dur-base: 220ms;
  --dur-slow: 300ms;
  --ease: cubic-bezier(0.25, 0.6, 0.3, 1);

  /* ---------- 控件 ---------- */
  --tap-min: 44px;              /* 交互目标尺寸基准 */
  --focus-color: #0F4C81;
}

/* =============================================================
   关怀模式（body.care-mode）：大字号、更松行高、关闭动效时长
   ============================================================= */
body.care-mode {
  --fs-root: 20px;
  --fs-xs:   0.95rem;
  --fs-sm:   1rem;
  --fs-base: 1.05rem;
  --fs-md:   1.1rem;
  --fs-lg:   1.3rem;
  --fs-xl:   1.55rem;
  --fs-2xl:  1.8rem;
  --fs-3xl:  2.05rem;
  --lh-body:  1.9;
  --lh-loose: 2.0;
  --dur-fast: 0ms;
  --dur-base: 0ms;
  --dur-slow: 0ms;
  --shadow-md: 0 0 0 1px var(--c-border);
  --shadow-lg: 0 0 0 1px var(--c-border);
}

/* =============================================================
   高对比度（body.high-contrast，可与关怀模式叠加）
   ============================================================= */
body.high-contrast {
  --c-gov-blue:       #003366;
  --c-gov-blue-dark:  #002244;
  --c-gov-blue-light: #004A8F;
  --c-gov-blue-pale:  #DCE8F5;
  --c-sg-green:       #00665C;
  --c-sg-green-dark:  #004D45;
  --c-warm:           #8A4B00;
  --c-text:           #000000;
  --c-text-secondary: #111111;
  --c-text-muted:     #26303B;
  --c-border:         #41505F;
  --c-border-light:   #8A97A5;
  --c-bg-page:        #FFFFFF;
  --c-bg-soft:        #F1F1F1;
  --focus-color:      #000000;
}

/* =============================================================
   减少动态效果：系统偏好层面直接归零动效时长
   ============================================================= */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-slow: 0ms;
  }
}

/* 站内"减少动效"开关（body.reduce-motion，由无障碍页/关怀模式设置） */
body.reduce-motion {
  --dur-fast: 0ms;
  --dur-base: 0ms;
  --dur-slow: 0ms;
}
