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

:root {
  --font-sans: 'Prompt', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

body {
  font-family: var(--font-sans);
  background-color: #0F172A;
  color: #F8FAFC;
  overflow-x: hidden;
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #1E293B;
}
::-webkit-scrollbar-thumb {
  background: #475569;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #64748B;
}

/* Glassmorphism panels */
.glass-panel {
  background: rgba(30, 41, 59, 0.7);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.glass-card {
  background: rgba(15, 23, 42, 0.65);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

/* Gantt Chart SVG Styles */
.gantt-grid-line {
  stroke: rgba(255, 255, 255, 0.06);
  stroke-width: 1;
}

.gantt-month-boundary {
  stroke: rgba(255, 255, 255, 0.15);
  stroke-width: 1.5;
}

.gantt-today-line {
  stroke: #EF4444;
  stroke-width: 2;
  stroke-dasharray: 4 3;
}

.gantt-task-bar {
  rx: 6;
  ry: 6;
  transition: transform 0.15s ease, filter 0.15s ease;
  cursor: pointer;
}

.gantt-task-bar:hover {
  filter: brightness(1.15) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.5));
}

.gantt-milestone-diamond {
  transform-origin: center;
  transition: transform 0.2s ease, filter 0.2s ease;
  cursor: pointer;
}

.gantt-milestone-diamond:hover {
  transform: scale(1.25);
  filter: drop-shadow(0 0 10px rgba(250, 204, 21, 0.8));
}

/* Dependency connection lines */
.dependency-path {
  fill: none;
  stroke: rgba(148, 163, 184, 0.45);
  stroke-width: 1.5;
  stroke-dasharray: 3 3;
  transition: stroke 0.2s ease;
}

.dependency-path:hover {
  stroke: #38BDF8;
  stroke-width: 2.5;
  stroke-dasharray: none;
}

/* Pulse animation for today marker & critical milestones */
@keyframes pulseGlow {
  0%, 100% {
    filter: drop-shadow(0 0 4px rgba(239, 68, 68, 0.6));
  }
  50% {
    filter: drop-shadow(0 0 12px rgba(239, 68, 68, 0.95));
  }
}

.pulse-glow {
  animation: pulseGlow 2s infinite ease-in-out;
}

/* Tooltip container */
#gantt-tooltip {
  position: absolute;
  pointer-events: none;
  z-index: 100;
  transition: opacity 0.15s ease, transform 0.1s ease;
}

/* 16:9 Presentation Canvas Container */
.aspect-16-9 {
  aspect-ratio: 16 / 9;
}

@media print {
  body {
    background-color: white !important;
    color: black !important;
  }
  .no-print {
    display: none !important;
  }
  .print-only {
    display: block !important;
  }
}