@import 'tailwindcss';

@theme {
  --color-bg-primary: #0d1117;
  --color-bg-secondary: #161b22;
  --color-bg-tertiary: #21262d;
  --color-border-default: #30363d;
  --color-border-muted: #21262d;
  --color-text-primary: #e6edf3;
  --color-text-secondary: #7d8590;
  --color-text-muted: #6e7681;
  --color-accent-blue: #1f6c92;
  --color-accent-blue-bright: #80b9d5;
  --color-success: #3fb950;
  --color-warning: #d29922;
  --color-danger: #f85149;
  --color-info: #58a6ff;

  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Menlo', monospace;

  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
}

:root {
  --color-bg-primary: #0d1117;
  --color-bg-secondary: #161b22;
  --color-bg-tertiary: #21262d;
  --color-border-default: #30363d;
  --color-border-muted: #21262d;
  --color-text-primary: #e6edf3;
  --color-text-secondary: #7d8590;
  --color-text-muted: #6e7681;
  --color-accent-blue: #1f6c92;
  --color-accent-blue-bright: #80b9d5;
  --color-success: #3fb950;
  --color-warning: #d29922;
  --color-danger: #f85149;
  --color-info: #58a6ff;
}

html {
  background: #0d1117;
  color-scheme: dark;
}

body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button, input, textarea, select {
  font: inherit;
}

input:focus, textarea:focus, select:focus, button:focus-visible {
  outline: none;
}

input[type="checkbox"]:focus, input[type="radio"]:focus {
  outline: 2px solid #80b9d5;
  outline-offset: 2px;
}

/* Scrollbar dark */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0d1117; }
::-webkit-scrollbar-thumb { background: #30363d; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #484f58; }

/* Line clamp */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Skeleton loader */
@keyframes skeleton-pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 0.7; }
}
.skeleton {
  animation: skeleton-pulse 1.5s ease-in-out infinite;
  background: #21262d;
  border-radius: 4px;
}

/* Focus visible para a11y */
*:focus-visible {
  outline: 2px solid #80b9d5;
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}