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

@layer base {
  /* Ensure all interactive button elements show pointer cursor */
  button,
  [type="button"],
  [type="submit"],
  [type="reset"],
  a {
    cursor: pointer;
  }

  /* Disabled submit buttons show reduced opacity and not-allowed cursor */
  [type="submit"]:disabled,
  button[type="submit"]:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }
}

@layer components {
  /* Primary button - sage green */
  .btn-primary {
    @apply inline-flex items-center px-4 py-2 bg-sage-500 text-white text-sm font-medium rounded-lg hover:bg-sage-600 focus:outline-none focus:ring-2 focus:ring-sage-500 focus:ring-offset-1 disabled:opacity-50 disabled:cursor-not-allowed;
  }

  /* Secondary button - outlined */
  .btn-secondary {
    @apply inline-flex items-center px-4 py-2 border border-gray-300 rounded-lg text-sm font-medium text-warm-gray bg-white hover:bg-cream focus:outline-none focus:ring-2 focus:ring-sage-500 focus:ring-offset-1;
  }

  /* Danger button - red */
  .btn-danger {
    @apply inline-flex items-center px-4 py-2 bg-red-600 text-white text-sm font-medium rounded-lg hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-1;
  }

  /* Ghost button - text only */
  .btn-ghost {
    @apply inline-flex items-center px-4 py-2 text-sm font-medium text-warm-gray hover:text-warm-black hover:bg-cream rounded-lg focus:outline-none;
  }

  /* Small button variant */
  .btn-sm {
    @apply px-3 py-1.5 text-xs;
  }

  /* Large button variant */
  .btn-lg {
    @apply px-6 py-3 text-base;
  }

  /* Copilot markdown content styling */
  .copilot-markdown p {
    @apply mb-2 last:mb-0;
  }
  .copilot-markdown strong {
    @apply font-semibold;
  }
  .copilot-markdown em {
    @apply italic;
  }
  .copilot-markdown h1,
  .copilot-markdown h2,
  .copilot-markdown h3 {
    @apply font-semibold mt-3 mb-1;
  }
  .copilot-markdown h1 {
    @apply text-base;
  }
  .copilot-markdown h2 {
    @apply text-sm;
  }
  .copilot-markdown h3 {
    @apply text-sm;
  }
  .copilot-markdown ul {
    @apply list-disc pl-4 mb-2 space-y-0.5;
  }
  .copilot-markdown ol {
    @apply list-decimal pl-4 mb-2 space-y-0.5;
  }
  .copilot-markdown li {
    @apply text-sm;
  }
  .copilot-markdown code {
    @apply bg-gray-100 text-gray-800 px-1 py-0.5 rounded text-xs font-mono;
  }
  .copilot-markdown pre {
    @apply bg-gray-100 rounded p-3 mb-2 overflow-x-auto;
  }
  .copilot-markdown pre code {
    @apply bg-transparent p-0;
  }
  .copilot-markdown a {
    @apply text-sage-600 underline hover:text-sage-700;
  }
  .copilot-markdown blockquote {
    @apply border-l-2 border-gray-300 pl-3 italic text-gray-600 mb-2;
  }
  .copilot-markdown table {
    @apply w-full text-sm mb-2;
  }
  .copilot-markdown th {
    @apply text-left font-semibold border-b border-gray-300 pb-1;
  }
  .copilot-markdown td {
    @apply border-b border-gray-100 py-1;
  }
}