/* static/css/input.css */
@import url('https://fonts.googleapis.com/css2?family=League+Spartan:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Ledger&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

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

@layer base {
  /* Default typography styles */
  h1, h2, h3, h4, h5, h6 {
    @apply font-title;
  }

  h1 {
    @apply text-4xl font-bold mb-6;
  }

  h2 {
    @apply text-3xl font-bold mb-4;
  }

  h3 {
    @apply text-2xl font-bold mb-3;
  }

  .subtitle {
    @apply font-subtitle text-lg;
  }

  .section-header {
    @apply font-section text-xl font-medium;
  }

  body {
    @apply font-body text-base antialiased;
  }
}

@layer components {
  /* Common component styles */
  .btn-primary {
    @apply bg-brand-blue-light hover:bg-opacity-90 text-white;
  }

  .btn-secondary {
    @apply bg-brand-blue-gray hover:bg-opacity-90 text-white;
  }

  .btn-accent {
    @apply bg-brand-gold hover:bg-opacity-90 text-white;
  }

  .card {
    @apply bg-white dark:bg-brand-blue-dark;
  }

  .alert-error {
    @apply bg-brand-red text-white;
  }
}


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

@layer base {
  h1, h2, h3, h4, h5, h6 {
    @apply font-heading;
  }
  
  body {
    @apply font-body;
  }
}

@layer components {
  .notification-badge {
    @apply absolute top-0 right-0 -mt-1 -mr-1 bg-error text-white text-xs font-medium rounded-full w-5 h-5 flex items-center justify-center;
  }
}

@layer utilities {
  .theme-aware-logo {
    @apply h-8 w-32 object-contain;
  }
}

.radial-progress {
  background: conic-gradient(from 0deg, 
    rgb(var(--p)) calc(var(--value) * 1%), 
    rgba(var(--p), 0.1) calc(var(--value) * 1%));
}

/* Enhanced progress bars */
.progress-success {
  --progress-color: oklch(var(--su));
}

.progress-warning {
  --progress-color: oklch(var(--wa));
}

.progress-error {
  --progress-color: oklch(var(--er));
}

.progress-info {
  --progress-color: oklch(var(--in));
}

/* Smooth animations for progress elements */
.progress, .radial-progress {
  transition: all 0.3s ease-in-out;
}

/* Hover effects for requirement cards */
.card:hover {
  transform: translateY(-2px);
  transition: transform 0.2s ease-in-out;
}

/* Toast notification positioning */
.toast {
  z-index: 9999;
}

/* Badge enhancements */
.badge-xs {
  font-size: 0.65rem;
  padding: 0.125rem 0.375rem;
}

/* Activity item hover effect */
.activity-item:hover {
  background-color: rgba(var(--b3), 0.5);
  transition: background-color 0.2s ease-in-out;
}