/* @ios27_design_system/tokens 1.0.2 — MIT License, (c) Dcode Labs — https://github.com/seunghan91/ios27-design-system */
/* iOS 27 Design Tokens — Colors */
/* Auto-generated from tokens/colors.json */

:root {
  --ios27-color-accent-red: #ff383c;
  --ios27-color-accent-orange: #ff8d28;
  --ios27-color-accent-yellow: #ffcc00;
  --ios27-color-accent-green: #34c759;
  --ios27-color-accent-mint: #00c8b3;
  --ios27-color-accent-teal: #00c3d0;
  --ios27-color-accent-cyan: #00c0e8;
  --ios27-color-accent-blue: #0088ff;
  --ios27-color-accent-indigo: #6155f5;
  --ios27-color-accent-purple: #cb30e0;
  --ios27-color-accent-pink: #ff2d55;
  --ios27-color-accent-brown: #ac7f5e;
  --ios27-color-label-primary: #000000;
  --ios27-color-label-secondary: #3c3c4399;
  --ios27-color-label-tertiary: #3c3c434d;
  --ios27-color-label-quaternary: #3c3c432e;
  --ios27-color-bg-primary: #ffffff;
  --ios27-color-bg-secondary: #f2f2f7;
  --ios27-color-bg-tertiary: #ffffff;
  --ios27-color-bg-primary-elevated: #ffffff;
  --ios27-color-bg-secondary-elevated: #f2f2f7;
  --ios27-color-bg-tertiary-elevated: #ffffff;
  --ios27-color-bg-grouped-primary: #f2f2f7;
  --ios27-color-bg-grouped-secondary: #ffffff;
  --ios27-color-bg-grouped-tertiary: #f2f2f7;
  --ios27-color-bg-grouped-primary-elevated: #f2f2f7;
  --ios27-color-bg-grouped-secondary-elevated: #ffffff;
  --ios27-color-bg-grouped-tertiary-elevated: #f2f2f7;
  --ios27-color-fill-primary: #78788033;
  --ios27-color-fill-secondary: #78788029;
  --ios27-color-fill-tertiary: #7676801f;
  --ios27-color-fill-quaternary: #74748014;
  --ios27-color-gray-black: #000000;
  --ios27-color-gray-gray: #8e8e93;
  --ios27-color-gray-gray2: #aeaeb2;
  --ios27-color-gray-gray3: #c7c7cc;
  --ios27-color-gray-gray4: #d1d1d6;
  --ios27-color-gray-gray5: #e5e5ea;
  --ios27-color-gray-gray6: #f2f2f7;
  --ios27-color-gray-white: #ffffff;
  --ios27-color-separator-opaque: #c6c6c8;
  --ios27-color-separator-nonOpaque: #0000001f;
  --ios27-color-separator-vibrant: #e6e6e6;
  --ios27-color-overlay-default: #00000033;
  --ios27-color-overlay-activityView: #00000033;
  --ios27-color-overlay-alert: #29293a3b;
}

:root[data-theme="dark"] {
  --ios27-color-accent-red: #ff4245;
  --ios27-color-accent-orange: #ff9230;
  --ios27-color-accent-yellow: #ffd600;
  --ios27-color-accent-green: #30d158;
  --ios27-color-accent-mint: #00dac3;
  --ios27-color-accent-teal: #00d2e0;
  --ios27-color-accent-cyan: #3cd3fe;
  --ios27-color-accent-blue: #0091ff;
  --ios27-color-accent-indigo: #6d7cff;
  --ios27-color-accent-purple: #db34f2;
  --ios27-color-accent-pink: #ff375f;
  --ios27-color-accent-brown: #b78a66;
  --ios27-color-label-primary: #ffffff;
  --ios27-color-label-secondary: #ebebf5b3;
  --ios27-color-label-tertiary: #ebebf54d;
  --ios27-color-label-quaternary: #ebebf529;
  --ios27-color-bg-primary: #000000;
  --ios27-color-bg-secondary: #1c1c1e;
  --ios27-color-bg-tertiary: #2c2c2e;
  --ios27-color-bg-primary-elevated: #1c1c1e;
  --ios27-color-bg-secondary-elevated: #2c2c2e;
  --ios27-color-bg-tertiary-elevated: #3a3a3c;
  --ios27-color-bg-grouped-primary: #000000;
  --ios27-color-bg-grouped-secondary: #1c1c1e;
  --ios27-color-bg-grouped-tertiary: #2c2c2e;
  --ios27-color-bg-grouped-primary-elevated: #1c1c1e;
  --ios27-color-bg-grouped-secondary-elevated: #2c2c2e;
  --ios27-color-bg-grouped-tertiary-elevated: #3a3a3c;
  --ios27-color-fill-primary: #7878805c;
  --ios27-color-fill-secondary: #78788052;
  --ios27-color-fill-tertiary: #7676803d;
  --ios27-color-fill-quaternary: #7676802e;
  --ios27-color-gray-black: #000000;
  --ios27-color-gray-gray: #8e8e93;
  --ios27-color-gray-gray2: #636366;
  --ios27-color-gray-gray3: #48484a;
  --ios27-color-gray-gray4: #3a3a3c;
  --ios27-color-gray-gray5: #2c2c2e;
  --ios27-color-gray-gray6: #1c1c1e;
  --ios27-color-gray-white: #ffffff;
  --ios27-color-separator-opaque: #38383a;
  --ios27-color-separator-nonOpaque: #ffffff2b;
  --ios27-color-separator-vibrant: #1a1a1a;
  --ios27-color-overlay-default: #0000007a;
  --ios27-color-overlay-activityView: #0000004a;
  --ios27-color-overlay-alert: #1212128f;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ios27-color-accent-red: #ff4245;
    --ios27-color-accent-orange: #ff9230;
    --ios27-color-accent-yellow: #ffd600;
    --ios27-color-accent-green: #30d158;
    --ios27-color-accent-mint: #00dac3;
    --ios27-color-accent-teal: #00d2e0;
    --ios27-color-accent-cyan: #3cd3fe;
    --ios27-color-accent-blue: #0091ff;
    --ios27-color-accent-indigo: #6d7cff;
    --ios27-color-accent-purple: #db34f2;
    --ios27-color-accent-pink: #ff375f;
    --ios27-color-accent-brown: #b78a66;
    --ios27-color-label-primary: #ffffff;
    --ios27-color-label-secondary: #ebebf5b3;
    --ios27-color-label-tertiary: #ebebf54d;
    --ios27-color-label-quaternary: #ebebf529;
    --ios27-color-bg-primary: #000000;
    --ios27-color-bg-secondary: #1c1c1e;
    --ios27-color-bg-tertiary: #2c2c2e;
    --ios27-color-bg-primary-elevated: #1c1c1e;
    --ios27-color-bg-secondary-elevated: #2c2c2e;
    --ios27-color-bg-tertiary-elevated: #3a3a3c;
    --ios27-color-bg-grouped-primary: #000000;
    --ios27-color-bg-grouped-secondary: #1c1c1e;
    --ios27-color-bg-grouped-tertiary: #2c2c2e;
    --ios27-color-bg-grouped-primary-elevated: #1c1c1e;
    --ios27-color-bg-grouped-secondary-elevated: #2c2c2e;
    --ios27-color-bg-grouped-tertiary-elevated: #3a3a3c;
    --ios27-color-fill-primary: #7878805c;
    --ios27-color-fill-secondary: #78788052;
    --ios27-color-fill-tertiary: #7676803d;
    --ios27-color-fill-quaternary: #7676802e;
    --ios27-color-gray-black: #000000;
    --ios27-color-gray-gray: #8e8e93;
    --ios27-color-gray-gray2: #636366;
    --ios27-color-gray-gray3: #48484a;
    --ios27-color-gray-gray4: #3a3a3c;
    --ios27-color-gray-gray5: #2c2c2e;
    --ios27-color-gray-gray6: #1c1c1e;
    --ios27-color-gray-white: #ffffff;
    --ios27-color-separator-opaque: #38383a;
    --ios27-color-separator-nonOpaque: #ffffff2b;
    --ios27-color-separator-vibrant: #1a1a1a;
    --ios27-color-overlay-default: #0000007a;
    --ios27-color-overlay-activityView: #0000004a;
    --ios27-color-overlay-alert: #1212128f;
  }
}