/* ==============================================
   PALETA DE COLORES PROFESIONAL - EL ESPIA
   Sin fosforescencia, sin glows, sin gradientes
   ============================================== */

:root {
  /* === BACKGROUNDS === */
  --bg-primary: #0A0A0A;          /* Negro principal */
  --bg-secondary: #111111;         /* Sidebar */
  --bg-tertiary: #1A1A1A;          /* Inputs, hover cards */
  --bg-card: #141414;              /* Cards */
  --bg-hover: #1F1F1F;             /* Hover sutil */
  
  /* === VERDE PROFESIONAL (Sin brillo ni efectos) === */
  --accent-primary: #10B981;       /* Verde esmeralda elegante */
  --accent-hover: #059669;         /* Verde oscuro hover */
  --accent-light: #34D399;         /* Verde claro para badges */
  --accent-subtle: rgba(16, 185, 129, 0.08);  /* Fondo ultra sutil */
  --accent-border: rgba(16, 185, 129, 0.2);   /* Bordes suaves */
  
  /* === TEXTOS === */
  --text-primary: #F9FAFB;         /* Blanco suave */
  --text-secondary: #D1D5DB;       /* Gris claro */
  --text-muted: #9CA3AF;           /* Gris medio */
  --text-placeholder: #6B7280;     /* Placeholder inputs */
  
  /* === BORDES === */
  --border-primary: #1F2937;       /* Gris oscuro */
  --border-hover: #374151;         /* Gris medio hover */
  --border-focus: #10B981;         /* Verde en focus */
  
  /* === SOMBRAS (Solo negras, sin colores) === */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 4px 6px 0 rgba(0, 0, 0, 0.15);
  
  /* === ESTADOS === */
  --success: #10B981;              /* Verde */
  --error: #EF4444;                /* Rojo */
  --warning: #F59E0B;              /* Naranja */
  --info: #3B82F6;                 /* Azul */
  
  /* === TIPOGRAFÍA === */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
  
  /* === ESPACIADO === */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-2xl: 48px;
  
  /* === BORDES RADIUS === */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  
  /* === TRANSICIONES === */
  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;
  
  /* === LAYOUT === */
  --sidebar-width: 240px;
  --sidebar-width-collapsed: 64px;
  --topbar-height: 60px;
  --max-width-content: 1400px;
}