/* ==========================================================================
   财小云客户服务中心 · 设计底座（T61）
   取值全部来自《财小云设计系统 v1.2 Aurora》tokens（colors / spacing / typography / effects），
   替换此前引用的中兴新云设计系统子集（两套设计系统不混用；中兴新云设计系统不随服务中心公开发布）。

   兼容说明：service_center.css 与 phone-auth.css 沿用 --ztc-* 变量名，本文件把这些名字
   映射到财小云取值；新写样式请直接用 --cxy-*。
   ========================================================================== */

/* ── 字体：西文与数字用设计系统字体（SIL OFL 1.1，见 ../fonts/OFL.txt）；
   中文用本机已装的 Noto Sans SC 或系统字体（苹方 / 微软雅黑），不下载 1MB 以上的中文字库 ── */
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 400; font-display: swap;
  src: local('Source Sans 3'), local('SourceSans3-Regular'), url("../fonts/source-sans-3-400.27ab01c4cb50.woff2") format('woff2'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 600; font-display: swap;
  src: local('Source Sans 3 SemiBold'), local('SourceSans3-Semibold'), url("../fonts/source-sans-3-600.9a35cba76eda.woff2") format('woff2'); }
@font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 700; font-display: swap;
  src: local('Source Sans 3 Bold'), local('SourceSans3-Bold'), url("../fonts/source-sans-3-700.9b13bd3653e3.woff2") format('woff2'); }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/space-grotesk-600.49f2dd2d2132.woff2") format('woff2'); }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 700; font-display: swap;
  src: url("../fonts/space-grotesk-700.f9e147a59a93.woff2") format('woff2'); }

:root {
  /* ── 财小云设计系统 v1.2 ── */
  --cxy-blue: #2563EB;
  --cxy-blue-deep: #1D4ED8;
  --cxy-blue-700: #1E40AF;
  --cxy-cyan: #22D3EE;
  --cxy-ink: #0F172A;
  --cxy-ink-2: #334155;
  --cxy-text: #475569;
  --cxy-muted: #94A3B8;
  --cxy-subtle: #F8FAFC;
  --cxy-subtle-2: #F1F5F9;
  --cxy-border: #E8EDF3;
  --cxy-border-strong: #D7DEE8;
  --cxy-tint-blue-bg: #EFF4FF;
  --cxy-tint-blue-fg: #1D4ED8;
  --cxy-tint-green-bg: #E7F8F0;
  --cxy-tint-amber-bg: #FFF4E5;
  --cxy-tint-amber-fg: #B45309;
  --cxy-tint-red-bg: #FEECEC;
  --cxy-negative: #E5484D;
  --cxy-negative-ink: #C2342E;
  --cxy-space-1: 4px;
  --cxy-space-2: 8px;
  --cxy-space-3: 12px;
  --cxy-space-4: 16px;
  --cxy-space-5: 20px;
  --cxy-space-6: 24px;
  --cxy-space-7: 32px;
  --cxy-space-8: 40px;
  --cxy-radius-xs: 6px;
  --cxy-radius-sm: 10px;
  --cxy-radius-md: 14px;
  --cxy-radius-lg: 18px;
  --cxy-radius-pill: 999px;
  --cxy-font-sans: 'Source Sans 3', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', system-ui, sans-serif;
  --cxy-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --cxy-font-num: 'Space Grotesk', 'Source Sans 3', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;  /* KPI / 金额，配 tabular-nums */
  --cxy-ring: 0 0 0 3px rgba(37, 99, 235, 0.28);
  --cxy-duration-fast: 150ms;
  --cxy-ease-standard: cubic-bezier(0.2, 0, 0, 1);

  /* ── 兼容层：--ztc-* 名字 → 财小云取值 ── */
  --ztc-white: #FFFFFF;
  --ztc-bg: var(--cxy-subtle);
  --ztc-border: var(--cxy-border);
  --ztc-border-default: var(--cxy-border);
  --ztc-border-strong: var(--cxy-border-strong);
  --ztc-border-w: 1px;
  --ztc-text: var(--cxy-ink-2);
  --ztc-text-default: var(--cxy-ink-2);
  --ztc-text-muted: var(--cxy-text);              /* 次级说明用正文灰，--cxy-muted 小字不达 AA */
  --ztc-text-on-dark: #FFFFFF;
  --ztc-surface-page: #FFFFFF;
  --ztc-surface-subtle: var(--cxy-subtle);
  --ztc-surface-hover: var(--cxy-subtle-2);
  --ztc-surface-selected: var(--cxy-tint-blue-bg);
  --ztc-brand-primary: var(--cxy-blue);
  --ztc-accent-bar: var(--cxy-blue);
  --ztc-action: var(--cxy-blue);
  --ztc-action-hover: var(--cxy-blue-deep);
  --ztc-action-ink: #FFFFFF;
  --ztc-focus-ring: var(--cxy-blue);
  --ztc-focus-ring-width: 2px;
  --ztc-focus-ring-offset: 2px;
  --ztc-error: var(--cxy-negative);
  --ztc-error-hover: var(--cxy-negative-ink);
  --ztc-error-ink: var(--cxy-negative-ink);
  --ztc-on-error: #FFFFFF;
  --ztc-tint-info-bg: var(--cxy-tint-blue-bg);
  --ztc-tint-info-fg: var(--cxy-tint-blue-fg);
  --ztc-tint-success-bg: var(--cxy-tint-green-bg);
  --ztc-tint-success-fg: #15803D;                 /* 同色相加深一档，浅绿底上 ≥4.5:1 */
  --ztc-tint-warning-bg: var(--cxy-tint-amber-bg);
  --ztc-tint-warning-fg: var(--cxy-tint-amber-fg);
  --ztc-tint-error-bg: var(--cxy-tint-red-bg);
  --ztc-tint-error-fg: var(--cxy-negative-ink);
  --ztc-space-1: var(--cxy-space-1);
  --ztc-space-2: var(--cxy-space-2);
  --ztc-space-3: var(--cxy-space-3);
  --ztc-space-4: var(--cxy-space-4);
  --ztc-space-5: var(--cxy-space-5);
  --ztc-space-6: var(--cxy-space-6);
  --ztc-space-8: var(--cxy-space-8);
  --ztc-radius-sm: var(--cxy-radius-xs);
  --ztc-radius-card: var(--cxy-radius-lg);
  --ztc-radius-pill: var(--cxy-radius-pill);
  --ztc-ui-xs: 12px;
  --ztc-ui-sm: 13px;
  --ztc-ui-base: 14px;
  --ztc-ui-md: 16px;
  --ztc-ui-lg: 18px;
  --ztc-ui-xl: 20px;
  --ztc-ui-2xl: 24px;
  --ztc-ui-3xl: 30px;
  --ztc-weight-semibold: 600;
  --ztc-weight-bold: 700;
  --ztc-leading-relaxed: 1.65;
  --ztc-font-sans: var(--cxy-font-sans);
  --ztc-font-serif: var(--cxy-font-sans);         /* 财小云不用衬线标题 */
  --ztc-duration-fast: var(--cxy-duration-fast);
  --ztc-ease-standard: var(--cxy-ease-standard);
  --ztc-z-nav: 200;
}

/* ── 基础层：只去掉浏览器默认噪音，并把品牌基线落到裸标签 ── */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--cxy-font-sans);
  font-size: 14px;
  line-height: 1.6;
  color: var(--cxy-ink-2);
  background: #FFFFFF;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6 { margin: 0; font-family: var(--cxy-font-sans); font-weight: 700; line-height: 1.3; color: var(--cxy-ink); text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
a { color: var(--cxy-blue); text-decoration: none; text-underline-offset: 0.18em; transition: color var(--cxy-duration-fast) var(--cxy-ease-standard); }
a:hover { color: var(--cxy-blue-deep); text-decoration: underline; }
p a, li a, td a { text-decoration: underline; }
table { border-collapse: collapse; width: 100%; font-size: 13px; }
th, td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--cxy-border); }
th { font-weight: 600; color: var(--cxy-text); background: var(--cxy-subtle); white-space: nowrap; }
th[data-align="right"], td[data-align="right"] { text-align: right; font-variant-numeric: tabular-nums; }
button, input, select, textarea { font: inherit; color: inherit; }
::placeholder { color: #64748B; opacity: 1; }   /* 白底与浅灰底均 ≥4.5:1 */
img, svg, video, canvas { display: block; max-width: 100%; height: auto; }
code, pre, kbd, samp { font-family: var(--cxy-font-mono); font-size: 0.92em; }
code { padding: 0.12em 0.36em; background: var(--cxy-subtle-2); border-radius: var(--cxy-radius-xs); }
pre { margin: 0; padding: 16px; overflow: auto; background: var(--cxy-subtle); border: 1px solid var(--cxy-border); border-radius: var(--cxy-radius-sm); }
pre code { padding: 0; background: none; }
hr { height: 1px; margin: 24px 0; border: 0; background: var(--cxy-border); }
:focus-visible { outline: 2px solid var(--cxy-blue); outline-offset: 2px; }

/* 无障碍工具类 */
.cxy-skip-link {
  position: absolute; left: 16px; top: -100px; z-index: 1000;
  padding: 12px 16px; background: var(--cxy-blue); color: #FFFFFF; border-radius: var(--cxy-radius-sm);
  font-size: 13px; font-weight: 600; text-decoration: none;
}
.cxy-skip-link:focus { top: 16px; color: #FFFFFF; }
.cxy-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
