/* Custom Styling for Emerald & Slate with Warm Gold Accents */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  --bg-main: #090e17;
  --bg-card: rgba(15, 23, 42, 0.75);
  --border-card: rgba(255, 255, 255, 0.08);
  --emerald-primary: #10b981;
  --emerald-glow: rgba(16, 185, 129, 0.25);
  --gold-accent: #f59e0b;
  --gold-glow: rgba(245, 158, 11, 0.2);
}

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  background-color: var(--bg-main);
  color: #f1f5f9;
  overflow-x: hidden;
}

.font-mono {
  font-family: 'JetBrains Mono', monospace;
}

/* Glassmorphism Cards */
.glass-panel {
  background: rgba(15, 23, 42, 0.78);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.glass-panel-accent {
  background: radial-gradient(circle at top right, rgba(16, 185, 129, 0.08), rgba(15, 23, 42, 0.85) 60%);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(16, 185, 129, 0.25);
}

/* Glow effects */
.glow-emerald {
  box-shadow: 0 0 25px -5px var(--emerald-glow);
}

.glow-gold {
  box-shadow: 0 0 20px -5px var(--gold-glow);
}

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

::-webkit-scrollbar-track {
  background: #090e17;
}

::-webkit-scrollbar-thumb {
  background: #1e293b;
  border-radius: 4px;
  border: 2px solid #090e17;
}

::-webkit-scrollbar-thumb:hover {
  background: #334155;
}

/* Smooth Transitions */
* {
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

/* Progress bar animation */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.animate-shimmer {
  background: linear-gradient(90deg, #10b981 0%, #34d399 50%, #10b981 100%);
  background-size: 200% 100%;
  animation: shimmer 2s infinite linear;
}