/*
 * CoreCloud design tokens — TCM Connect Design System.
 * Source of truth: Claude Design "TCM Connect Design System" → tokens/
 * (colors, spacing, borders, motion). Typography tokens live in
 * typography-overrides.css; the Ant theme mapping in ant-design-overrides.css.
 */
:root {
    /* ---- Spacing scale (4px base: 4 · 8 · 12 · 16 · 24 · 32 · 48) ------- */
    --size-xxs: 0.25rem; /* 4px */
    --size-xs: 0.5rem; /* 8px */
    --size-sm: 0.75rem; /* 12px */
    --size-md: 1rem; /* 16px */
    --size-lg: 1.5rem; /* 24px */
    --size-xl: 2rem; /* 32px */
    --size-xxl: 3rem; /* 48px */

    /* Aliases for spacing */
    --spacing-xxs: var(--size-xxs);
    --spacing-xs: var(--size-xs);
    --spacing-sm: var(--size-sm);
    --spacing-md: var(--size-md);
    --spacing-lg: var(--size-lg);
    --spacing-xl: var(--size-xl);
    --spacing-xxl: var(--size-xxl);

    /* Control heights — Large is the default for page-level actions,
       Default for actions inside a card or table, Small only where a
       control sits inline with 12px text. */
    --control-lg: 40px;
    --control-md: 32px;
    --control-sm: 24px;

    /* Fixed layout measures */
    --sidebar-width: 216px;
    --page-padding: 24px;
    --card-padding: 16px;
    --row-padding-y: 14px;
    --row-padding-x: 16px;
    /* Content column cap, and the min track for a reflowing card set —
       `repeat(auto-fit, minmax(var(--card-min), 1fr))`, no breakpoint list. */
    --content-max: 1560px;
    --card-min: 27rem;

    /* Chips wrapping inside a table cell: 4px between, 5px between lines.
       Set on the container, never as per-chip margins. */
    --chip-gap: 5px 4px;

    /* Reading measures */
    --measure-prose: 76ch;
    --measure-note: 84ch;

    /* ---- Colour ---------------------------------------------------------- */
    /* Primary ramp — TCM blue replaces Ant's default #1890ff. */
    --primary-1: #DAE4F2;
    --primary-2: #B6C9E6;
    --primary-3: #91AED9;
    --primary-4: #3761A0;
    --primary-5: #2C4D80;
    --primary-6: #213A60;
    --primary-7: #0B1320;

    /* Status — Ant defaults, deliberately untouched, so green/red/amber keep
       the same meaning across TCM tools and other Ant-based tooling. */
    --success: #52c41a;
    --success-hover: #73d13d;
    --success-bg: #f6ffed;
    --success-border: #b7eb8f;
    --error: #ff4d4f;
    --error-hover: #ff7875;
    --error-bg: #fff2f0;
    --error-border: #ffccc7;
    --warning: #faad14;
    --warning-bg: #fffbe6;
    --warning-border: #ffe58f;
    --warning-text: #874d00;
    --info: #1890ff;
    --info-bg: #e6f7ff;

    /* Neutrals — Ant 4 greys. Text is never pure black and surfaces are
       never pure grey; the ink alphas do the work. */
    --neutral-white: #ffffff;
    --neutral-fill: #fafafa;
    --neutral-split: #f0f0f0;
    --neutral-border: #d9d9d9;
    --neutral-layout: #f0f2f5;
    --neutral-ink-85: rgba(0, 0, 0, 0.85);
    --neutral-ink-65: rgba(0, 0, 0, 0.65);
    --neutral-ink-45: rgba(0, 0, 0, 0.45);
    --neutral-ink-25: rgba(0, 0, 0, 0.25);
    --neutral-ink-06: rgba(0, 0, 0, 0.06);

    /* Semantic aliases — prefer these in component code */
    --accent: var(--primary-4);
    --accent-hover: var(--primary-3);
    --accent-active: var(--primary-6);
    --accent-quiet: var(--primary-1);
    --accent-quiet-border: var(--primary-3);

    --text-body: var(--neutral-ink-85);
    --text-muted: var(--neutral-ink-65);
    --text-secondary: var(--neutral-ink-45);
    --text-disabled: var(--neutral-ink-25);
    --text-on-accent: var(--neutral-white);
    --text-link: var(--primary-4);
    --text-link-hover: var(--primary-3);

    --surface-page: var(--neutral-layout);
    --surface-card: var(--neutral-white);
    --surface-sunken: var(--neutral-fill);
    /* Two blues carry meaning beyond decoration: selected rows/cards and the
       active nav item. Neither is used ornamentally. */
    --surface-selected: #F4F7FC;
    --surface-nav-active: #E9EFF8;
    --surface-disabled: #f5f5f5;

    --border-strong: var(--neutral-border);
    --border-split: var(--neutral-split);
    --border-accent-quiet: var(--primary-1);

    --destructive: var(--error);
    --destructive-bg: #FFF1F0;
    --destructive-border: var(--error);

    /* ---- Borders, corners, elevation -------------------------------------- */
    /* 2px radius on everything; circles only for icon buttons, the only pill
       is the Switch. */
    --radius: 2px;
    --radius-pill: 100px;
    --radius-circle: 50%;

    --border-width: 1px;
    --border-nav-active: 3px;

    /* Shadows are rare and functional: overlays and hover-lift on clickable
       cards. Cards at rest have no shadow. */
    --shadow-popover: 0 6px 16px rgba(0, 0, 0, 0.12);
    --shadow-modal: 0 8px 24px rgba(0, 0, 0, 0.25);
    --shadow-card-hover: 0 2px 8px rgba(0, 0, 0, 0.15);
    --shadow-button: 0 2px 0 rgba(0, 0, 0, 0.045);
    --scrim: rgba(0, 0, 0, 0.45);

    /* Icon sizes — 14px table-header affordances, 16px default, 20px page
       headers, 24px feature glyphs, 48px empty states (at 1.5 stroke). */
    --icon-sm: 14px;
    --icon-md: 16px;
    --icon-lg: 20px;
    --icon-xl: 24px;
    --icon-stroke: 2;

    /* ---- Motion — functional only: state changes fade, nothing moves ------ */
    --duration-fast: 0.2s;
    --duration-base: 0.3s;
    --easing: ease;
    --transition-state: all var(--duration-base) var(--easing);
    --transition-hover: background var(--duration-fast) var(--easing), color var(--duration-fast) var(--easing);

    /* ---- Font stacks (faces are registered per app in app.css) ------------ */
    --font-ui: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'Inconsolata', ui-monospace, SFMono-Regular, Menlo, monospace;

    /* ---- Legacy CoreCloud aliases (kept for existing styles) -------------- */
    --color-border: var(--neutral-border);
    --color-text-secondary: var(--neutral-ink-45);
    --color-text-disabled: var(--neutral-ink-25);
    --color-bg-disabled: var(--surface-disabled);
    --color-bg-disabled-active: #e6e6e6;
    --color-border-split: var(--neutral-split);
    --color-bg-table-header: var(--neutral-fill);
    --color-text-body-muted: var(--neutral-ink-65);
}
