/* Auto-generated from: FlexSecurity.tokens.json
 * Important! Should be in the format R G B (without commas)
 * @see https://tailwindcss.com/docs/customizing-colors#using-css-variables
 */

html {

  /* Color palette */
  --prtl-primary-50: 243 247 235;
  --prtl-primary-100: 231 239 216;
  --prtl-primary-200: 208 223 177;
  --prtl-primary-300: 184 208 137;
  --prtl-primary-400: 161 192 98;
  --prtl-primary-500: 137 176 59;
  --prtl-primary-600: 110 141 47;
  --prtl-primary-700: 82 106 35;
  --prtl-primary-800: 55 70 24;
  --prtl-primary-900: 27 35 12;

  --prtl-accent-50: 238 243 232;
  --prtl-accent-100: 221 230 209;
  --prtl-accent-200: 188 205 163;
  --prtl-accent-300: 154 181 117;
  --prtl-accent-400: 121 156 71;
  --prtl-accent-500: 87 131 25;
  --prtl-accent-600: 70 105 20;
  --prtl-accent-700: 52 79 15;
  --prtl-accent-800: 35 52 10;
  --prtl-accent-900: 17 26 5;

  /* On-color utilities */
  --prtl-text-on-branded-top-bar: 0 0 0;
  --prtl-text-on-accent-bg-color: var(--prtl-text-on-dark-bg-color);

  /* Primary action — buttons, navs, tabs */
  --prtl-bg-action: var(--prtl-accent-500);
  --prtl-bg-action-hover: var(--prtl-accent-600);
  --prtl-bg-action-pressed: var(--prtl-accent-700);
  --prtl-border-action: var(--prtl-accent-500);
  --prtl-icon-action: var(--prtl-accent-500);
  --prtl-text-action: var(--prtl-accent-500);
  --prtl-text-action-hover: var(--prtl-accent-600);

  /* Branded surfaces */
  --prtl-bg-branded-top-bar: 243 244 246;
  --prtl-bg-branded-top-bar-pressed: 229 231 235;
  --prtl-bg-branded-surface: var(--prtl-accent-500);
  --prtl-bg-branded-footer: var(--prtl-accent-500);
  --prtl-bg-branded-page-header: var(--prtl-accent-50);

  /* Secondary menu */
  --prtl-bg-secondary-menu: var(--prtl-accent-50);

  /* Links, breadcrumbs */
  --prtl-text-link: var(--prtl-accent-600);
  --prtl-text-link-hover: var(--prtl-accent-700);

  /* Page titles */
  --prtl-text-page-title: var(--prtl-accent-500);

  /* Shape */
  /* One of 'rounded', 'straight', 'circular' */
  --prtl-shape: circular;
}
