@import "tailwindcss";
@import "uniwind";

@import "heroui-native/styles";

/* End-user path: heroui-native lives in the project's node_modules, one
   level up from this src/global.css file. */
@source '../node_modules/heroui-native/lib';

@layer theme {
  @variant light {
    --background: #f7f6fb;
    --foreground: #0b0b18;
    --surface: #ffffff;
    --surface-foreground: var(--foreground);
    --surface-secondary: #f0eef8;
    --surface-secondary-foreground: var(--foreground);
    --surface-tertiary: var(--border);
    --surface-tertiary-foreground: var(--foreground);
    --overlay: var(--surface);
    --overlay-foreground: var(--foreground);
    --backdrop: rgba(4, 4, 10, 0.78);
    --muted: #5c5880;
    --default: var(--surface-secondary);
    --default-foreground: var(--foreground);
    --accent: #7a34d4;
    --accent-foreground: #ffffff;
    --field-background: var(--surface);
    --field-foreground: var(--foreground);
    --field-border: var(--border);
    --success: #059669;
    --warning: #d97706;
    --danger: #dc2626;
    --segment: var(--surface-secondary);
    --segment-foreground: var(--foreground);
    --border: #e2dff0;
    --separator: var(--border);
    --subtle: #9991b8;
  }

  @variant dark {
    --background: #0e0e1c;
    --foreground: #ede9ff;
    --surface: #171730;
    --surface-foreground: var(--foreground);
    --surface-secondary: #1e1e3c;
    --surface-secondary-foreground: var(--foreground);
    --surface-tertiary: var(--border);
    --surface-tertiary-foreground: var(--foreground);
    --overlay: var(--surface);
    --overlay-foreground: var(--foreground);
    --backdrop: rgba(4, 4, 10, 0.78);
    --muted: #9b96c0;
    --default: var(--surface-secondary);
    --default-foreground: var(--foreground);
    --accent: #b060ff;
    --accent-foreground: #ffffff;
    --field-background: var(--surface);
    --field-foreground: var(--foreground);
    --field-border: var(--border);
    --success: #14f195;
    --warning: #f5a623;
    --danger: #ff4d4f;
    --segment: var(--surface-secondary);
    --segment-foreground: var(--foreground);
    --border: #252548;
    --separator: var(--border);
    --subtle: #605c88;
  }
}

@theme inline {
  --color-subtle: var(--subtle);
}

@theme {
  --font-normal: "DMSans_400Regular";
  --font-medium: "DMSans_500Medium";
  --font-semibold: "DMSans_600SemiBold";
}