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

/* Global base styles */
@layer base {
  html, body {
    font-family: 'Inter', sans-serif;
    background-color: #FFFFFF;
    color: #0F172A; /* slate-950 for text on light bg */
  }
}

/* Print rule OUTSIDE layer block */
@media print {
  .no-print {
    display: none !important;
  }
}

/* Utility classes */
@layer utilities {
  .nav-bg {
    background-color: #0F172A;  /* dark slate for navbar */
  }

  .logo-text {
    color: #22C55E; /* emerald green */
  }
  
  /* Enhanced focus indicators for accessibility */
  .focus-visible-ring {
    @apply focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-blue-500;
  }
  
  /* High contrast focus for dark backgrounds */
  .focus-visible-ring-light {
    @apply focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-white;
  }
}

/* Reusable components */
@layer components {
  .btn-primary {
    @apply bg-emerald-600 hover:bg-emerald-700 text-white font-medium px-4 py-2 rounded-md transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500;
  }

  .btn-secondary {
    @apply bg-slate-200 hover:bg-slate-300 text-slate-800 font-medium px-4 py-2 rounded-md transition-colors duration-150 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-slate-500;
  }

  .link {
    @apply text-emerald-600 hover:text-emerald-700 font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-emerald-500 rounded;
  }
  
  /* Enhanced error styling for better contrast */
  .error-text {
    @apply text-red-700 font-medium;
  }
  
  .error-border {
    @apply border-red-500 focus:border-red-500 focus:ring-red-500;
  }
  
  /* Success messaging with proper contrast */
  .success-text {
    @apply text-green-800 font-medium;
  }
  
  /* Warning styling */
  .warning-text {
    @apply text-amber-800 font-medium;
  }
  
  /* High contrast mode support */
  @media (prefers-contrast: high) {
    .btn-primary {
      @apply bg-emerald-800 hover:bg-emerald-900 border-2 border-white;
    }
    
    .btn-secondary {
      @apply bg-slate-100 hover:bg-white text-slate-900 border-2 border-slate-800;
    }
    
    .link {
      @apply text-emerald-800 hover:text-emerald-900 underline;
    }
  }
  
  /* Reduced motion support */
  @media (prefers-reduced-motion: reduce) {
    .btn-primary,
    .btn-secondary,
    .link {
      @apply transition-none;
    }
  }
}