/* eslint-disable */

/**
 * Do not edit directly
 * Generated by cocokits 'token-generator'
 */

@mixin use_theme_theme-a {
  :where(.cck-theme-frames-x__theme--theme-a),
  :where([data-cck-theme*='frames-x__theme--theme-a']) {
    @include variables_theme_theme-a;
  }
}

@mixin variables_theme_theme-a {
  --base-surface-1: var(--colors-alpha-light-900);
  --base-surface-2: var(--colors-gray-50);
  --base-fill-1: var(--colors-gray-100);
  --base-fill-2: var(--colors-gray-200);
  --base-fill-3: var(--colors-gray-300);
  --base-fill-4: var(--colors-gray-400);
  --base-fill-5: var(--colors-gray-600);
  --base-border: var(--colors-gray-200);
  --base-disabled: var(--colors-alpha-dark-200);
  --state-brand-active: var(--colors-blue-600);
  --state-brand-hover: var(--colors-blue-500);
  --state-brand-selected: var(--colors-blue-400);
  --state-danger-active: var(--colors-red-600);
  --state-danger-hover: var(--colors-red-400);
  --state-danger-selected: var(--colors-red-200);
  --state-highlight-active: var(--colors-orange-600);
  --state-highlight-hover: var(--colors-orange-300);
  --state-highlight-selected: var(--colors-orange-200);
  --state-success-active: var(--colors-green-600);
  --state-success-hover: var(--colors-green-400);
  --state-success-selected: var(--colors-green-300);
}