@import url("./tokens/colors.css");
@import url("./tokens/typography.css");
@import url("./tokens/spacing.css");
@import url("./tokens/elevation.css");
@import url("./tokens/radius.css");

:root {
  --st-app-bg: var(--st-color-surface-background);
  --st-surface: var(--st-color-surface-white);

  --st-border: var(--st-color-border-default);
  --st-border-soft: var(--st-color-border-subtle);

  --st-text-primary: var(--st-color-text-primary);
  --st-text-secondary: var(--st-color-text-secondary);
  --st-action-default: var(--st-color-text-secondary);

  --st-forest-green: var(--st-color-brand-primary);
  --st-charcoal: var(--st-color-text-primary);
  --st-chainsaw-orange: var(--st-color-accent-orange);
  --st-growth-ring-gold: var(--st-color-warning);
  --st-steel-gray: var(--st-color-text-muted);

  --st-selected-bg: var(--st-color-brand-primary-light);
  --st-hover-bg: var(--st-color-surface-muted);

  --st-radius-button: var(--st-radius-md);
  --st-radius-card: var(--st-radius-xl);

  --st-space-xs: var(--st-space-1);
  --st-space-sm: var(--st-space-2);
  --st-space-md: var(--st-space-4);
  --st-space-lg: var(--st-space-6);
  --st-space-xl: var(--st-space-8);

  --st-header-height: var(--st-shell-topbar-height);
  --st-sidebar-width: var(--st-shell-sidebar-width);
  --st-sidebar-collapsed-width: var(--st-shell-sidebar-collapsed-width);
  --st-content-max-width: none;

  --st-shadow-sm: var(--st-elevation-sm);
  --st-shadow-md: var(--st-elevation-md);
  --st-shadow-lg: var(--st-elevation-lg);

  --sidebar-bg: var(--st-surface);
  --app-bg: var(--st-app-bg);
  --surface-base: var(--st-surface);
  --surface-card: var(--st-surface);
  --surface-panel: var(--st-surface);
  --border-soft: var(--st-border-soft);
  --text-strong: var(--st-text-primary);
  --text-muted: var(--st-text-secondary);
  --shadow-card: var(--st-shadow-sm);
  --shadow-panel: var(--st-shadow-md);

  --radius-button: var(--st-radius-button);
  --radius-card: var(--st-radius-card);
  --radius-pill: var(--st-radius-pill);

  --btn-primary-bg: var(--st-forest-green);
  --btn-primary-text: var(--st-color-surface-white);
  --btn-critical-bg: var(--st-chainsaw-orange);
  --btn-critical-text: var(--st-color-text-primary);

  --status-success-bg: var(--st-color-success-surface);
  --status-success-text: var(--st-color-success);
  --status-warning-bg: var(--st-color-warning-surface);
  --status-warning-text: var(--st-color-warning);
  --status-error-bg: var(--st-color-danger-surface);
  --status-error-text: var(--st-color-danger);
  --status-info-bg: var(--st-color-info-surface);
  --status-info-text: var(--st-color-info);

  --space-xs: var(--st-space-xs);
  --space-sm: var(--st-space-sm);
  --space-md: var(--st-space-md);
  --space-lg: var(--st-space-lg);
  --space-xl: var(--st-space-xl);
}
