/*
 * KenTrade shared design tokens.
 * Keep these values available to both the front end and block editor.
 */
:root {
    --kt-white: var(--wp--preset--color--white);
    --kt-navy: var(--wp--custom--kentrade--color--navy);
    --kt-blue: var(--wp--custom--kentrade--color--blue);
    --kt-blue-bright: var(--wp--custom--kentrade--color--blue-bright);
    --kt-red: var(--wp--custom--kentrade--color--red);
    --kt-ink: var(--wp--custom--kentrade--color--ink);
    --kt-muted: var(--wp--custom--kentrade--color--muted);
    --kt-line: var(--wp--custom--kentrade--color--line);
    --kt-surface: var(--wp--custom--kentrade--color--surface);
    --kt-radius-sm: var(--wp--custom--kentrade--radius--sm);
    --kt-radius-md: var(--wp--custom--kentrade--radius--md);
    --kt-radius-lg: var(--wp--custom--kentrade--radius--lg);
    --kt-shadow-card: var(--wp--custom--kentrade--shadow--card);
    --kt-shadow-hover: var(--wp--custom--kentrade--shadow--hover);

    /* Named aliases for the spacing presets already exposed in the editor. */
    --kt-space-xs: var(--wp--preset--spacing--10);
    --kt-space-sm: var(--wp--preset--spacing--20);
    --kt-space-md: var(--wp--preset--spacing--30);
    --kt-space-lg: var(--wp--preset--spacing--40);
    --kt-space-xl: var(--wp--preset--spacing--50);
    --kt-space-2xl: var(--wp--preset--spacing--60);
    --kt-space-3xl: var(--wp--preset--spacing--70);
    --kt-space-4xl: var(--wp--preset--spacing--80);

    /* Keep component typography aligned with the editor's font-size presets. */
    --kt-font-size-sm: var(--wp--preset--font-size--small);
    --kt-font-size-md: var(--wp--preset--font-size--medium);
    --kt-font-size-lg: var(--wp--preset--font-size--large);
    --kt-font-size-xl: var(--wp--preset--font-size--x-large);
    --kt-font-size-2xl: var(--wp--preset--font-size--xx-large);
    --kt-font-size-display: var(--wp--preset--font-size--display);
}