/* @footway/fw-design-system 3.4.2 0c8f65ce9c3f standard */
:root,
.dark {
  --radius: 0rem;
  --background: #1a1a1a;
  --foreground: #f5f5f5;
  --secondary-foreground: #d8d8d8;
  --muted-foreground: #a3a3a3;
  --muted-foreground-2: #858585;
  --page: #1a1a1a;
  --surface: #000000;
  --surface-grey: #555555;
  --border: #555555;
  --input: #555555;
  --divider: #2f2f2f;
  --panel-border: #3a3a3a;
  --grid-line: rgba(255, 255, 255, 0.06);
  --nav-underline: #c58cff;
  --primary-rgb: 190,100,255;
  --primary-bright: #e6c4ff;
  --primary-hover-fg: #f4e6ff;
  --primary-foreground: #ffffff;
  --success-rgb: 60,230,140;
  --success-fg: #9df3bf;
  --success-hover-fg: #dafbe7;
  --warning-rgb: 255,205,60;
  --warning-fg: #f7dc9c;
  --warning-hover-fg: #fdf1d4;
  --warning-foreground: #000000;
  --destructive-rgb: 255,95,80;
  --destructive-fg: #ffb0a8;
  --destructive-hover-fg: #ffe1dd;
  --destructive-foreground: #000000;
  --disabled-rgb: 110,110,110;
  --disabled-foreground: #8c8c8c;
  --lamp-primary: 184,77,255;
  --lamp-success: 46,224,128;
  --lamp-warning: 255,196,46;
  --lamp-danger: 255,84,66;
  --lamp-neutral: 160,160,160;
  --ghost-hover-rgb: 255,255,255;
  --btn-tint: 0.12;
  --btn-base: var(--surface);
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 48px;
  --space-5: 64px;
  --audience-public: oklch(0.6968 0.1929 302.13);
  --audience-b2c: var(--audience-public);
  --audience-b2b: oklch(0.7505 0.1898 150.07);
  --audience-zt: oklch(0.6501 0.2008 24.97);
  --audience-dc: oklch(0.7005 0.1503 245.04);
  --audience-fin: oklch(0.8206 0.1601 92.32);
  --audience-cs: oklch(0.7197 0.17 49.97);
  --audience-pim: oklch(0.76 0.13 185);
  --audience-ta: oklch(0.6742 0.1821 349.03);
  --audience-dev: oklch(0.6581 0.1826 274.71);
  --chart-4: #a3a3a3;
  --chart-5: #555555;
  --chart-cell: 8px;
  --chart-font-size: 13.3333px;
  --chart-heading-size: 26.6667px;
}

.light {
  --background: #ebebeb;
  --foreground: #1c1c1c;
  --secondary-foreground: #2e2e2e;
  --muted-foreground: #656565;
  --muted-foreground-2: #6e6e6e;
  --page: #ebebeb;
  --surface: #ffffff;
  --surface-grey: #b8b8b8;
  --border: #b8b8b8;
  --input: #b8b8b8;
  --divider: #d6d6d6;
  --panel-border: #c8c8c8;
  --grid-line: rgba(0, 0, 0, 0.07);
  --nav-underline: #7a1fd0;
  --primary-rgb: 138,43,226;
  --primary-bright: #6416b0;
  --primary-hover-fg: #3f0a75;
  --primary-foreground: #ffffff;
  --success-rgb: 16,150,80;
  --success-fg: #0b6136;
  --success-hover-fg: #063d22;
  --warning-rgb: 204,145,0;
  --warning-fg: #6e4c00;
  --warning-hover-fg: #4a3300;
  --warning-foreground: #000000;
  --destructive-rgb: 214,52,38;
  --destructive-fg: #9e2216;
  --destructive-hover-fg: #6b150c;
  --destructive-foreground: #ffffff;
  --disabled-rgb: 170,170,170;
  --disabled-foreground: #8a8a8a;
  --lamp-primary: 138,43,226;
  --lamp-success: 16,170,90;
  --lamp-warning: 220,160,0;
  --lamp-danger: 220,55,40;
  --lamp-neutral: 140,140,140;
  --ghost-hover-rgb: 0,0,0;
  --chart-4: #656565;
  --chart-5: #b8b8b8;
}

.surfaces-standard {
  --background: #000000;
  --page: #000000;
  --surface: #141414;
  --btn-base: var(--background);
}

.light.surfaces-standard,
.light .surfaces-standard {
  --background: #ffffff;
  --page: #ffffff;
  --surface: #f0f0f0;
}

:root,
.dark,
.light,
.surfaces-standard {
  --surface-raised: var(--surface);
  --card: var(--surface);
  --card-foreground: var(--muted-foreground);
  --popover: var(--surface);
  --popover-foreground: var(--muted-foreground);
  --secondary: var(--surface);
  --muted: var(--surface);
  --accent: var(--surface);
  --accent-foreground: var(--foreground);
  --primary: rgb(var(--primary-rgb));
  --ring: var(--primary);
  --success: rgb(var(--success-rgb));
  --warning: rgb(var(--warning-rgb));
  --destructive: rgb(var(--destructive-rgb));
  --disabled: rgb(var(--disabled-rgb));
  --table-head-bg: color-mix(in srgb, rgb(var(--primary-rgb)) 14%, var(--surface));
  --table-head-border: color-mix(in srgb, rgb(var(--primary-rgb)) 50%, var(--surface));
  --h2-size: 26px;
  --leading-body: 18px;
  --h2-color: color-mix(in srgb, var(--muted-foreground) 75%, var(--background));
  --section-gap: 64px;
  --chart-1: var(--primary);
  --chart-2: color-mix(in srgb, var(--primary) 70%, var(--surface));
  --chart-3: color-mix(in srgb, var(--primary) 45%, var(--surface));
  --sidebar: var(--surface);
  --sidebar-foreground: var(--foreground);
  --sidebar-primary: var(--primary);
  --sidebar-primary-foreground: var(--primary-foreground);
  --sidebar-accent: var(--surface);
  --sidebar-accent-foreground: var(--foreground);
  --sidebar-border: var(--panel-border);
  --sidebar-ring: var(--primary);
  --p-100: var(--primary);
  --p-70: color-mix(in oklab, var(--primary) 70%, transparent);
  --p-45: color-mix(in oklab, var(--primary) 45%, transparent);
  --p-25: color-mix(in oklab, var(--primary) 25%, transparent);
  --p-12: color-mix(in oklab, var(--primary) 12%, transparent);
}

:root,
.dark {
  --overlay: rgba(0, 0, 0, 0.6);
}

.light {
  --overlay: rgba(0, 0, 0, 0.35);
}