/**
 * Mobile palette + spacing — re-exports canonical tokens from lib/beenvoice-theme.ts
 */
import {
  background,
  border,
  border50,
  foreground,
  muted,
  mutedForeground,
  primary,
  primaryForeground,
  radius,
  shadowMd,
  shadowSm,
  surface80,
} from "@/lib/beenvoice-theme";

export const colors = {
  background,
  backgroundMuted: muted,
  foreground,
  card: background,
  cardGlass: surface80,
  primary,
  primaryForeground,
  muted,
  mutedForeground,
  border,
  borderGlass: border50,
  secondary: border,
  secondaryForeground: primary,
  accent: muted,
  destructive: "#EF4444",
  destructiveForeground: primaryForeground,
  destructiveBg: "#FEF2F2",
  success: "#16A34A",
  successBg: "#F0FDF4",
  warning: "#D97706",
  warningBg: "#FFFBEB",
  brand: primary,
  brandDark: foreground,
  text: foreground,
  textMuted: mutedForeground,
};

export const spacing = {
  xs: 4,
  sm: 8,
  md: 16,
  lg: 24,
  xl: 32,
};

export const radii = {
  sm: radius.sm,
  md: radius.md,
  lg: radius.lg,
  xl: radius.xl,
  card: radius.lg,
  pill: radius.pill,
};

export const fonts = {
  heading: "PlayfairDisplay_700Bold",
  headingSemi: "PlayfairDisplay_600SemiBold",
  body: "Inter_400Regular",
  bodyMedium: "Inter_500Medium",
  bodySemiBold: "Inter_600SemiBold",
  bodyBold: "Inter_700Bold",
  mono: "SpaceMono",
} as const;

export const layout = {
  /** Bottom inset when tab bar is `position: absolute` */
  tabBarInset: 96,
};