@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500&display=swap');
@import "tailwindcss";

@theme {
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
  
  /* Clinical Enterprise Color Palette */
  --color-primary: #0F172A; /* Slate 900 - Deep Professional Navy */
  --color-primary-hover: #0B1120;
  --color-brand-blue: #2563EB; /* Bright Blue for primary actions */
  --color-brand-blue-hover: #1D4ED8;
  --color-ai: #0891B2; /* Cyan 600 - Precise, technical highlight */
  
  --color-background: #F8FAFC; /* Slate 50 - Softer production bg */
  --color-background-secondary: #F1F5F9; /* Slate 100 */
  --color-background-tertiary: #E2E8F0; /* Slate 200 */
  
  --color-text-primary: #020617; /* Slate 950 for absolute high contrast */
  --color-text-secondary: #334155; /* Slate 700 */
  --color-text-muted: #64748B; /* Slate 500 */
  
  --color-border: #E2E8F0; /* Slate 200 */
  --color-border-strong: #CBD5E1; /* Slate 300 */

  /* Semantic Clinical Colors */
  --color-success: #059669; /* Emerald 600 - More accessible */
  --color-warning: #D97706; /* Amber 600 */
  --color-danger: #DC2626; /* Red 600 */
  --color-info: #2563EB; /* Blue 600 */

  --shadow-subtle: 0 1px 2px rgba(0,0,0,0.02), 0 4px 12px rgba(0,0,0,0.03);
  --shadow-floating: 0 4px 24px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.02);
}

@layer base {
  html, body, #root, .app-root {
    height: 100%;
    margin: 0;
    padding: 0;
  }
  body {
    @apply bg-background text-text-primary font-sans antialiased;
    letter-spacing: -0.015em;
    line-height: 1.5;
  }
}

/* High-Trust Surfaces */
.surface-card {
  @apply bg-white border border-border shadow-subtle rounded-xl;
}

.surface-card-hover:hover {
  @apply border-border-strong shadow-floating transition-all duration-300;
}

/* Data Grid Structure */
.bg-clinical-grid {
  background-size: 24px 24px;
  background-image: 
    linear-gradient(to right, rgba(226, 232, 240, 0.5) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(226, 232, 240, 0.5) 1px, transparent 1px);
}

/* Technical Detail View */
.detail-label {
  @apply text-[11px] font-bold uppercase tracking-widest text-text-muted;
}

.detail-value {
  @apply text-sm font-semibold text-text-primary;
}

/* Custom Text Selection */
::selection {
  @apply bg-brand-blue/15 text-brand-blue;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  @apply bg-slate-300 rounded-full;
}

::-webkit-scrollbar-thumb:hover {
  @apply bg-slate-400;
}

@keyframes scan-line {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}

@keyframes pulse-slow {
  0%, 100% { opacity: 0.3; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.05); }
}

@keyframes glitch {
  0% { transform: translate(0); }
  20% { transform: translate(-2px, 2px); }
  40% { transform: translate(-2px, -2px); }
  60% { transform: translate(2px, 2px); }
  80% { transform: translate(2px, -2px); }
  100% { transform: translate(0); }
}

.animate-scan-line {
  animation: scan-line 3s linear infinite;
}

.animate-pulse-slow {
  animation: pulse-slow 4s ease-in-out infinite;
}

.animate-glitch {
  animation: glitch 0.3s ease-in-out infinite;
}