/* Design System - CourtMaster */

:root {
  --background: hsl(220, 15%, 8%);
  --foreground: hsl(0, 0%, 98%);
  --card: hsl(220, 13%, 12%);
  --card-foreground: hsl(0, 0%, 98%);
  --primary: hsl(62, 83%, 59%);
  --primary-foreground: hsl(220, 15%, 8%);
  --secondary: hsl(220, 13%, 18%);
  --secondary-foreground: hsl(0, 0%, 98%);
  --muted: hsl(220, 13%, 18%);
  --muted-foreground: hsl(0, 0%, 65%);
  --accent: hsl(62, 83%, 59%);
  --accent-foreground: hsl(220, 15%, 8%);
  --border: hsl(220, 13%, 20%);
}

/* Tailwind Config Extension */
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .text-primary {
    color: var(--primary);
  }

  .text-foreground {
    color: var(--foreground);
  }

  .text-muted-foreground {
    color: var(--muted-foreground);
  }

  .bg-background {
    background-color: var(--background);
  }

  .bg-card {
    background-color: var(--card);
  }

  .border-border {
    border-color: var(--border) !important;
  }

  .border-primary {
    border-color: var(--primary);
  }

  .bg-gradient-hero {
    background: linear-gradient(135deg, hsl(220, 15%, 8%), hsl(220, 13%, 15%));
  }

  .bg-gradient-accent {
    background: linear-gradient(135deg, hsl(71, 100%, 66%), hsl(75, 95%, 62%));
  }

  .shadow-glow {
    box-shadow: 0 0 40px hsla(71, 100%, 66%, 0.2);
  }
}

/* Component Styles */
.card {
  background-color: var(--card);
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  transition: all 0.3s ease;
}

.card:hover {
  border-color: var(--primary);
  box-shadow: 0 0 40px hsla(71, 100%, 66%, 0.2);
}

.btn-primary {
  background-color: var(--primary);
  color: var(--primary-foreground);
  transition: all 0.3s ease;
}

.btn-primary:hover {
  opacity: 0.9;
}

.btn-download {
  color: var(--foreground);
  text-decoration: none;
  display: inline-flex;
}

.btn-download:hover {
  transform: translateY(-2px);
}

/* Animations */
@keyframes pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.8;
  }
}

.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Typography */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.2;
  font-weight: 700;
}

/* Smooth scroll */
html {
  scroll-behavior: smooth;
}

/* Backdrop blur support */
.backdrop-blur-lg {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}