/* chrisipeters.com Design Tokens
   Dark editorial magazine palette.
   Typography: Inter (headings + body), Fira Code (code). */

:root {
  /* Backgrounds */
  --cp-void: #0c0c0c;
  --cp-deep: #1a1a2e;
  --cp-midnight: #16213e;
  --cp-elevated: #222244;
  --cp-surface: #2a2a4a;

  /* Text */
  --cp-text: #f5f5f7;
  --cp-text-secondary: #a0a0b8;
  --cp-text-muted: #666680;
  --cp-text-dim: #555566;

  /* Accents */
  --cp-emerald: #00e5a0;
  --cp-emerald-hover: #00c98c;
  --cp-cyan: #00c4d4;
  --cp-violet: #7c5cfc;
  --cp-coral: #ff6b6b;
  --cp-amber: #ffc857;

  /* SL OnStage colors */
  --cp-purple: #A855F7;
  --cp-magenta: #EC4899;

  /* Glass */
  --cp-glass-bg: rgba(255, 255, 255, 0.03);
  --cp-glass-border: rgba(255, 255, 255, 0.06);
  --cp-glass-hover: rgba(255, 255, 255, 0.1);

  /* Typography */
  --cp-font: 'Inter', system-ui, -apple-system, sans-serif;
  --cp-font-mono: 'Fira Code', monospace;

  /* Widths & Spacing */
  --cp-content-width: 720px;
  --cp-page-width: 1200px;
  --cp-gutter: clamp(24px, 5vw, 80px);

  /* Shadows */
  --cp-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
  --cp-shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
}

/* Body base styles */
html {
  overflow-x: hidden;
}

body {
  background: var(--cp-void);
  color: var(--cp-text-secondary);
  font-family: var(--cp-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  outline: none;
  box-shadow: none;
  border: none;
}

/* MudBlazor layout overrides — prevent overflow and remove default padding */
.mud-layout {
  overflow-x: hidden !important;
}
.mud-main-content {
  padding: 0 !important;
  overflow-x: hidden !important;
}
.mud-drawer-content, .mud-appbar {
  overflow-x: hidden !important;
}

/* MudBlazor dark theme overrides */
.mud-theme-dark {
  --mud-palette-background: var(--cp-void);
  --mud-palette-surface: var(--cp-deep);
  --mud-palette-appbar-background: rgba(12, 12, 12, 0.85);
  --mud-palette-primary: var(--cp-emerald);
  --mud-palette-primary-text: var(--cp-void);
  --mud-palette-secondary: var(--cp-violet);
  --mud-palette-text-primary: var(--cp-text);
  --mud-palette-text-secondary: var(--cp-text-secondary);
  --mud-palette-text-disabled: var(--cp-text-muted);
  --mud-palette-action-default: var(--cp-text-secondary);
  --mud-palette-divider: var(--cp-glass-border);
  --mud-palette-lines-default: var(--cp-glass-border);
  --mud-palette-lines-inputs: var(--cp-glass-border);
}