/*
 * UniDoc UI redesign — P0 design tokens (CSS-only, reversible).
 *
 * Loaded AFTER app.css and app-docs-theme.css, so the trailing :root below wins
 * by source order and remaps the SHELL colour variables those stylesheets read
 * (--accent, --ink, --line, --canvas-bg, …) onto one iOS system-blue palette.
 *
 * Light theme only. This layer introduces NO dark mode. It touches shell chrome
 * only; it never redefines page/paper/document variables, so document pixels are
 * unchanged. Removing the two <link>s in index.html fully reverts the redesign.
 *
 * Token values are taken verbatim from the approved high-fidelity prototype
 * docs/source/UNIDOC_EDITOR_PROTOTYPE_20260929.html (blocks "iOS", "背板 v0.3").
 */

:root {
  /* ---- iOS system palette (new canonical --ui-* tokens) ---- */
  --ui-bg: #f2f2f7;              /* grouped background */
  --ui-surface: #ffffff;        /* cards / raised surfaces */
  --ui-surface-2: #f2f2f7;      /* recessed / grouped grey */
  --ui-raised: #ffffff;
  --ui-fill: rgba(118, 118, 128, .12);   /* iOS fill */
  --ui-glass: rgba(249, 249, 251, .82);
  --ui-seg-thumb: #ffffff;      /* segmented-control thumb */

  --ui-line: rgba(60, 60, 67, .18);       /* 0.5px hairline separator */
  --ui-line-soft: rgba(60, 60, 67, .10);  /* soft hairline */

  --ui-ink: #1d1d1f;            /* primary label (icon grey #1D1D1F) */
  --ui-ink-2: #6e6e73;          /* secondary label / icon grey */
  --ui-ink-3: #aeaeb2;          /* tertiary label / icon grey */

  --ui-hover: rgba(118, 118, 128, .08);
  --ui-press: rgba(118, 118, 128, .16);

  --ui-accent: #007aff;                    /* iOS system blue */
  --ui-accent-hover: #0066d6;
  --ui-accent-weak: rgba(0, 122, 255, .12);
  --ui-accent-ink: #ffffff;                /* white text on solid blue */
  --ui-accent-strong: #0071e3;             /* solid primary button fill */
  --ui-accent-strong-hover: #0066cc;
  --ui-accent-text: #0066cc;               /* blue text / links */
  --ui-focus: #007aff;

  --ui-ok: #34c759;
  --ui-warn: #ff9500;
  --ui-danger: #ff3b30;

  /* Brand gradients: logo keeps its blue->cyan identity; AI avatar reuses it. */
  --ui-ai: linear-gradient(135deg, #315e8a 0%, #2098b0 55%, #1bc4e0 100%);

  --ui-canvas: #eef0f4;         /* clean gradient endpoint behind pages */

  /* ---- Radii (iOS 6/8/12/16 + pill) ---- */
  --ui-r-1: 6px;
  --ui-r-2: 8px;
  --ui-r-3: 12px;
  --ui-r-4: 16px;
  --ui-r-pill: 999px;

  /* ---- Elevation ---- */
  --ui-shadow-1: 0 1px 2px rgba(0, 0, 0, .06);
  --ui-shadow-2: 0 8px 24px rgba(0, 0, 0, .10), 0 0 0 .5px rgba(0, 0, 0, .06);
  --ui-shadow-3: 0 22px 60px rgba(0, 0, 0, .18), 0 0 0 .5px rgba(0, 0, 0, .08);
  /* soft 4-layer paper shadow (shell drop-shadow around the page, not content) */
  --ui-paper-shadow:
    0 0 0 .5px rgba(0, 0, 0, .04),
    0 1px 3px rgba(0, 0, 0, .06),
    0 8px 28px rgba(0, 0, 0, .06),
    0 22px 60px rgba(0, 0, 0, .05);

  /* clean vertical canvas backdrop — no glows, no dot grid */
  --ui-canvas-gradient: linear-gradient(180deg, #fbfbfd 0%, #eef0f4 100%);

  color-scheme: light;
}

/*
 * Legacy variable remap.
 *
 * These are the shell variables app.css defines and app-docs-theme.css
 * overrides. Because this rule is the LAST :root in the cascade, it wins and
 * repoints every consumer of these names at the iOS tokens above. Geometry
 * variables (--page-w/-h/-pad, --selection-ui-scale) and document-content
 * variables are deliberately NOT listed here, so page layout and paper content
 * are untouched.
 */
:root {
  --accent: var(--ui-accent);
  --accent-dark: var(--ui-accent-text);
  --accent-weak: var(--ui-accent-weak);

  --ink: var(--ui-ink);
  --ink-2: var(--ui-ink-2);

  --line: var(--ui-line);
  --line-soft: var(--ui-line-soft);

  --hover: var(--ui-hover);
  --press: var(--ui-press);
  --on: var(--ui-accent-weak);

  --ribbon-bg: var(--ui-surface);
  --ribbon-border: var(--ui-line-soft);

  --canvas-bg: var(--ui-canvas);
  --selection-bg: rgba(0, 122, 255, .18);

  /* app-docs-theme.css surface/shadow tokens, re-pointed to iOS values so its
     popover/dialog/menu rules that read them adopt the iOS look automatically. */
  --ui-surface-muted: var(--ui-surface-2);
  --ui-surface-tonal: var(--ui-fill);
  --ui-surface-border: var(--ui-line);
  --ui-surface-shadow: var(--ui-shadow-2);
  --ui-dialog-shadow: var(--ui-shadow-3);
  --ui-scrim: rgba(0, 0, 0, .28);
  --ui-radius-sm: var(--ui-r-2);
  --ui-radius-md: var(--ui-r-3);
  --ui-radius-lg: var(--ui-r-4);
  --ui-shadow: var(--ui-shadow-1);
}