/*
A26 Web Design System
Normalized Tokens
Version: v1.0.0-alpha.0005

Purpose:
Clean A26 token names mapped from the source token file.
This file is a starter framework and should be expanded through controlled A26 updates.
*/

@layer a26.tokens.normalized {
  :root {
    /* Typography: default leading */
    --a26-font-family-system: "SF Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --a26-type-large-title-size: 34px;
    --a26-type-large-title-weight: 400;
    --a26-type-large-title-weight-bold: 700;
    --a26-type-large-title-line-height: 1.2058823529;

    --a26-type-title-1-size: 28px;
    --a26-type-title-1-weight: 400;
    --a26-type-title-1-weight-bold: 700;
    --a26-type-title-1-line-height: 1.2142857143;

    --a26-type-title-2-size: 22px;
    --a26-type-title-2-weight: 400;
    --a26-type-title-2-weight-bold: 700;
    --a26-type-title-2-line-height: 1.2727272727;

    --a26-type-title-3-size: 20px;
    --a26-type-title-3-weight: 400;
    --a26-type-title-3-weight-bold: 600;
    --a26-type-title-3-line-height: 1.25;

    --a26-type-headline-size: 17px;
    --a26-type-headline-weight: 600;
    --a26-type-headline-line-height: 1.2941176471;

    --a26-type-body-size: 17px;
    --a26-type-body-weight: 400;
    --a26-type-body-weight-bold: 600;
    --a26-type-body-line-height: 1.2941176471;

    --a26-type-callout-size: 16px;
    --a26-type-callout-weight: 400;
    --a26-type-callout-weight-bold: 600;
    --a26-type-callout-line-height: 1.3125;

    --a26-type-subheadline-size: 15px;
    --a26-type-subheadline-weight: 400;
    --a26-type-subheadline-weight-bold: 600;
    --a26-type-subheadline-line-height: 1.3333333333;

    --a26-type-footnote-size: 13px;
    --a26-type-footnote-weight: 400;
    --a26-type-footnote-weight-bold: 600;
    --a26-type-footnote-line-height: 1.3846153846;

    --a26-type-caption-1-size: 12px;
    --a26-type-caption-1-weight: 400;
    --a26-type-caption-1-weight-bold: 500;
    --a26-type-caption-1-line-height: 1.3333333333;

    --a26-type-caption-2-size: 11px;
    --a26-type-caption-2-weight: 400;
    --a26-type-caption-2-weight-bold: 600;
    --a26-type-caption-2-line-height: 1.1818181818;

    /* Labels */
    --a26-label-light-primary: #000000;
    --a26-label-light-secondary: #3C3C4399;
    --a26-label-light-tertiary: #3C3C434D;
    --a26-label-light-quaternary: #3C3C432E;

    --a26-label-dark-primary: #FFFFFF;
    --a26-label-dark-secondary: #EBEBF599;
    --a26-label-dark-tertiary: #EBEBF54D;
    --a26-label-dark-quaternary: #EBEBF529;

    /* Backgrounds */
    --a26-bg-light-primary: #FFFFFF;
    --a26-bg-light-secondary: #F2F2F7;
    --a26-bg-light-tertiary: #FFFFFF;

    --a26-bg-grouped-light-primary: #F2F2F7;
    --a26-bg-grouped-light-secondary: #FFFFFF;
    --a26-bg-grouped-light-tertiary: #F2F2F7;

    --a26-bg-dark-base-primary: #000000;
    --a26-bg-dark-base-secondary: #1C1C1E;
    --a26-bg-dark-base-tertiary: #2C2C2E;

    --a26-bg-dark-elevated-primary: #1C1C1E;
    --a26-bg-dark-elevated-secondary: #2C2C2E;
    --a26-bg-dark-elevated-tertiary: #3A3A3C;

    --a26-bg-grouped-dark-base-primary: #000000;
    --a26-bg-grouped-dark-base-secondary: #1C1C1E;
    --a26-bg-grouped-dark-base-tertiary: #2C2C2E;

    --a26-bg-grouped-dark-elevated-primary: #1C1C1E;
    --a26-bg-grouped-dark-elevated-secondary: #2C2C2E;
    --a26-bg-grouped-dark-elevated-tertiary: #3A3A3C;

    /* Fills */
    --a26-fill-light-primary: #78787833;
    --a26-fill-light-secondary: #78788029;
    --a26-fill-light-tertiary: #7676801F;
    --a26-fill-light-quaternary: #74748014;

    --a26-fill-dark-primary: #7878805C;
    --a26-fill-dark-secondary: #78788052;
    --a26-fill-dark-tertiary: #7676803D;
    --a26-fill-dark-quaternary: #7676802E;

    /* Separators */
    --a26-separator-light-nonopaque: #0000001F;
    --a26-separator-light-opaque: #C6C6C8;
    --a26-separator-light-vibrant: #E6E6E6;

    --a26-separator-dark-nonopaque: #FFFFFF1F;
    --a26-separator-dark-opaque: #38383A;
    --a26-separator-dark-vibrant: #1A1A1A;

    /* Accents */
    --a26-accent-light-red: #FF383C;
    --a26-accent-light-orange: #FF8D28;
    --a26-accent-light-yellow: #FFCC00;
    --a26-accent-light-green: #34C759;
    --a26-accent-light-mint: #00C8B3;
    --a26-accent-light-teal: #00C3D0;
    --a26-accent-light-cyan: #00C0E8;
    --a26-accent-light-blue: #0088FF;
    --a26-accent-light-indigo: #6155F5;
    --a26-accent-light-purple: #CB30E0;
    --a26-accent-light-pink: #FF2D55;
    --a26-accent-light-brown: #AC7F5E;

    --a26-accent-dark-red: #FF4245;
    --a26-accent-dark-orange: #FF9230;
    --a26-accent-dark-yellow: #FFD600;
    --a26-accent-dark-green: #30D158;
    --a26-accent-dark-mint: #00DAC3;
    --a26-accent-dark-teal: #00D2E0;
    --a26-accent-dark-cyan: #3CD3FE;
    --a26-accent-dark-blue: #0091FF;
    --a26-accent-dark-indigo: #6D7CFF;
    --a26-accent-dark-purple: #DB34F2;
    --a26-accent-dark-pink: #FF375F;
    --a26-accent-dark-brown: #B78A66;

    /* A26-owned starter tokens */
    --a26-space-1: 4px;
    --a26-space-2: 8px;
    --a26-space-3: 12px;
    --a26-space-4: 16px;
    --a26-space-5: 20px;
    --a26-space-6: 24px;
    --a26-space-8: 32px;

    --a26-radius-sm: 8px;
    --a26-radius-md: 12px;
    --a26-radius-lg: 16px;
    --a26-radius-xl: 20px;
    --a26-radius-pill: 999px;

    --a26-hit-target-min: 44px;
    --a26-toolbar-height: 52px;
    --a26-toolbar-height-compact: 44px;

    /* Materials: source-derived starter fills */
    --a26-material-light-thick-fill: #FFFFFFD6;
    --a26-material-light-regular-fill: #FFFFFF99;
    --a26-material-light-thin-fill: #FFFFFF66;
    --a26-material-light-ultrathin-fill: #FFFFFF12;

    --a26-material-dark-thick-fill: #00000099;
    --a26-material-dark-regular-fill: #00000069;
    --a26-material-dark-thin-fill: #00000042;
    --a26-material-dark-ultrathin-fill: #00000000;

    --a26-glass-clear-fill-source: #FFFFFF40;

  }
}
