/*
    Atlassian Design System tokens.
    https://atlassian.design

    Values taken from the published @atlaskit/tokens package (atlassian-light,
    atlassian-spacing, atlassian-shape, atlassian-typography) rather than
    transcribed from the documentation site, so they are exact and can be
    refreshed by re-reading that package.

    Naming follows ADS's own semantic token names with a --ds- prefix. Use the
    semantic token, never the raw hex: color.text rather than #292A2E. That is
    the whole point of the layer, and it is what makes a dark theme a matter of
    redefining this file rather than auditing every rule.

    Two things we deliberately do not take from Atlassian: the Atlassian Sans
    and Atlassian Mono typefaces, and any Atlassian brand mark. Both are
    proprietary to Atlassian and not ours to ship. The font tokens below carry
    ADS's own fallback stack, which is what actually renders.
*/

:root {
    /* ---------------------------------------------------------- text */
    --ds-text: #292A2E;
    --ds-text-subtle: #505258;
    --ds-text-subtlest: #6B6E76;
    --ds-text-inverse: #FFFFFF;
    --ds-text-disabled: #080F214A;
    --ds-text-brand: #1868DB;
    --ds-text-selected: #1868DB;
    --ds-text-danger: #AE2E24;
    --ds-text-warning: #9E4C00;
    --ds-text-success: #4C6B1F;
    --ds-text-accent-blue: #1558BC;
    --ds-text-accent-orange: #9E4C00;
    --ds-text-accent-teal: #206A83;
    --ds-text-accent-gray: #505258;
    --ds-text-accent-green: #4C6B1F;
    --ds-link: #1868DB;

    /* ---------------------------------------------------------- surface */
    --ds-surface: #FFFFFF;
    --ds-surface-sunken: #F8F8F8;
    --ds-surface-raised: #FFFFFF;
    --ds-surface-overlay: #FFFFFF;
    --ds-surface-hovered: #F0F1F2;
    --ds-surface-pressed: #DDDEE1;

    /* ---------------------------------------------------------- background */
    --ds-background-neutral: #0515240F;
    --ds-background-neutral-hovered: #0B120E24;
    --ds-background-neutral-subtle-hovered: #0515240F;
    --ds-background-selected: #E9F2FE;
    --ds-background-selected-hovered: #CFE1FD;
    --ds-background-selected-pressed: #8FB8F6;
    --ds-background-brand-bold: #1868DB;
    --ds-background-brand-bold-hovered: #1558BC;
    --ds-background-input: #FFFFFF;
    --ds-background-input-hovered: #F8F8F8;
    --ds-background-danger: #FFECEB;

    --ds-background-accent-blue-subtlest: #E9F2FE;
    --ds-background-accent-orange-subtlest: #FFF5DB;
    --ds-background-accent-teal-subtlest: #E7F9FF;
    --ds-background-accent-gray-subtlest: #F0F1F2;
    --ds-background-accent-red-subtlest: #FFECEB;
    --ds-background-accent-magenta-subtlest: #FFECF8;
    --ds-background-accent-green-subtlest: #DCFFF1;

    /* ---------------------------------------------------------- border */
    --ds-border: #0B120E24;
    --ds-border-bold: #7D818A;
    --ds-border-input: #8C8F97;
    --ds-border-focused: #4688EC;
    --ds-border-width: 1px;
    --ds-border-width-selected: 2px;
    --ds-border-width-focused: 2px;

    /* ---------------------------------------------------------- icon */
    --ds-icon: #292A2E;
    --ds-icon-subtle: #505258;

    /* ---------------------------------------------------------- elevation */
    --ds-shadow-raised: 0 1px 1px #1E1F2140, 0 0 1px #1E1F214F;
    --ds-shadow-overlay: 0 8px 12px #1E1F2126, 0 0 1px #1E1F214F;
    --ds-shadow-overflow: 0 0 8px #1E1F2129, 0 0 1px #1E1F211F;

    /* ---------------------------------------------------------- space */
    --ds-space-0: 0px;
    --ds-space-025: 2px;
    --ds-space-050: 4px;
    --ds-space-075: 6px;
    --ds-space-100: 8px;
    --ds-space-150: 12px;
    --ds-space-200: 16px;
    --ds-space-250: 20px;
    --ds-space-300: 24px;
    --ds-space-400: 32px;
    --ds-space-500: 40px;
    --ds-space-600: 48px;
    --ds-space-800: 64px;
    --ds-space-1000: 80px;

    /* ---------------------------------------------------------- radius */
    --ds-radius-xsmall: 2px;
    --ds-radius-small: 4px;
    --ds-radius-medium: 6px;
    --ds-radius-large: 8px;
    --ds-radius-xlarge: 12px;
    --ds-radius-full: 9999px;

    /* ---------------------------------------------------------- type */
    --ds-font-family-body: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, "Helvetica Neue", sans-serif;
    --ds-font-family-code: ui-monospace, Menlo, "Segoe UI Mono", "Ubuntu Mono", monospace;

    --ds-font-weight-regular: 400;
    --ds-font-weight-medium: 500;
    --ds-font-weight-semibold: 600;
    --ds-font-weight-bold: 653;

    --ds-font-body: normal var(--ds-font-weight-regular) 14px/20px var(--ds-font-family-body);
    --ds-font-body-large: normal var(--ds-font-weight-regular) 16px/24px var(--ds-font-family-body);
    --ds-font-body-small: normal var(--ds-font-weight-regular) 12px/16px var(--ds-font-family-body);

    --ds-font-heading-xxsmall: normal var(--ds-font-weight-bold) 12px/16px var(--ds-font-family-body);
    --ds-font-heading-xsmall: normal var(--ds-font-weight-bold) 14px/20px var(--ds-font-family-body);
    --ds-font-heading-small: normal var(--ds-font-weight-bold) 16px/20px var(--ds-font-family-body);
    --ds-font-heading-medium: normal var(--ds-font-weight-bold) 20px/24px var(--ds-font-family-body);
    --ds-font-heading-large: normal var(--ds-font-weight-bold) 24px/28px var(--ds-font-family-body);
}
