@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --gym-dark: #0a0a0f;
  --gym-darker: #050508;
  --gym-accent: #00ff88;
  --gym-secondary: #ff6b35;
  --gym-warning: #ffcc00;
  --gym-muted: #1a1a24;
  --gym-border: #2a2a3a;
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html,
body {
  max-width: 100vw;
  overflow-x: hidden;
  background: var(--gym-darker);
  color: white;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

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

::-webkit-scrollbar-track {
  background: var(--gym-dark);
}

::-webkit-scrollbar-thumb {
  background: var(--gym-border);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--gym-accent);
}

/* Glowing text effect */
.glow-text {
  text-shadow: 0 0 10px var(--gym-accent), 0 0 20px var(--gym-accent), 0 0 30px var(--gym-accent);
}

/* Card styles */
.card {
  @apply bg-gym-muted border border-gym-border rounded-2xl p-4 backdrop-blur-sm;
  background: linear-gradient(135deg, rgba(26, 26, 36, 0.9) 0%, rgba(10, 10, 15, 0.95) 100%);
}

/* Progress bar animation */
@keyframes progress-fill {
  from { width: 0%; }
}

.animate-progress {
  animation: progress-fill 1s ease-out forwards;
}

/* Rep counter pulse */
@keyframes rep-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

.rep-pulse {
  animation: rep-pulse 0.3s ease-out;
}

/* Breathing indicator */
@keyframes breathe {
  0%, 100% { opacity: 0.4; transform: scale(0.95); }
  50% { opacity: 1; transform: scale(1.05); }
}

.breathe {
  animation: breathe 4s ease-in-out infinite;
}