@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');

:root {
  --radius: 0.875rem;
  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);
  --radius-2xl: calc(var(--radius) + 8px);
  --radius-3xl: calc(var(--radius) + 12px);

  --background: #ffffff;
  --foreground: #0f172a;
  --surface: #f8fafc;

  --card: #ffffff;
  --card-foreground: #0f172a;
  --popover: #ffffff;
  --popover-foreground: #0f172a;

  --primary: #2563eb;
  --primary-foreground: #ffffff;
  --primary-soft: #eff6ff;

  --secondary: #f1f5f9;
  --secondary-foreground: #1e293b;
  --muted: #f1f5f9;
  --muted-foreground: #64748b;
  --accent: #f1f5f9;
  --accent-foreground: #1e293b;

  --destructive: #ef4444;
  --destructive-foreground: #ffffff;
  --success: #10b981;
  --success-foreground: #ffffff;
  --warning: #f59e0b;
  --warning-foreground: #78350f;

  --border: #e2e8f0;
  --input: #e2e8f0;
  --ring: #2563eb;

  --chart-1: #2563eb;
  --chart-2: #38bdf8;
  --chart-3: #10b981;
  --chart-4: #f59e0b;
  --chart-5: #64748b;

  --sidebar: #ffffff;
  --sidebar-foreground: #334155;
  --sidebar-primary: #2563eb;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #f8fafc;
  --sidebar-accent-foreground: #0f172a;
  --sidebar-border: #f1f5f9;

  --shadow-xs2: 0 1px 2px 0 rgba(15, 23, 42, 0.04);
  --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px -12px rgba(15, 23, 42, 0.12);
  --shadow-float: 0 24px 60px -24px rgba(15, 23, 42, 0.28);
  --shadow-glow: 0 20px 60px -20px rgba(37, 99, 235, 0.45);
  --shadow-primary: 0 8px 24px -8px rgba(37, 99, 235, 0.45);
  --shadow-primary-lg: 0 14px 40px -12px rgba(37, 99, 235, 0.55);
}

* {
  box-sizing: border-box;
  border-color: var(--border);
}

html {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  letter-spacing: -0.011em;
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, .font-display {
  font-family: 'Plus Jakarta Sans', 'Inter', ui-sans-serif, sans-serif;
  letter-spacing: -0.028em;
}

.surface-panel {
  background-color: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-card);
}

.grid-backdrop {
  background-image:
    linear-gradient(to right, rgba(15, 23, 42, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(15, 23, 42, 0.05) 1px, transparent 1px);
  background-size: 56px 56px;
}

.text-gradient {
  background-image: linear-gradient(120deg, var(--foreground) 20%, var(--primary) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}