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

@layer base {
  :root {
    --background: 210 40% 98%;
    --foreground: 224 71% 4%;
    --card: 210 40% 100%;
    --card-foreground: 224 71% 4%;
    --popover: 210 40% 100%;
    --popover-foreground: 224 71% 4%;
    --primary: 217 91% 60%;
    --primary-foreground: 210 40% 98%;
    --secondary: 210 40% 96.1%;
    --secondary-foreground: 222 47% 11%;
    --muted: 210 40% 96.1%;
    --muted-foreground: 215.4 16.3% 46.9%;
    --accent: 262 84% 60%;
    --accent-foreground: 210 40% 98%;
    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;
    --border: 214.3 31.8% 91.4%;
    --input: 214.3 31.8% 91.4%;
    --ring: 217 91% 60%;
    --radius: 0.5rem;

    --chart-1: 217 91% 60%;
    --chart-2: 262 84% 60%;
    --chart-3: 162 76% 42%;
    --chart-4: 343 89% 60%;
    --chart-5: 43 96% 56%;

    --stone-200: 240 5% 90%;
  }

  .dark {
    --background: 222 84% 4.9%;
    --foreground: 210 40% 98%;
    --card: 222 84% 6.9%;
    --card-foreground: 210 40% 98%;
    --popover: 222 84% 4.9%;
    --popover-foreground: 210 40% 98%;
    --primary: 217 91% 60%;
    --primary-foreground: 210 40% 98%;
    --secondary: 217.2 32.6% 17.5%;
    --secondary-foreground: 210 40% 98%;
    --muted: 217.2 32.6% 17.5%;
    --muted-foreground: 215 20.2% 65.1%;
    --accent: 262 84% 60%;
    --accent-foreground: 210 40% 98%;
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 210 40% 98%;
    --border: 217.2 32.6% 17.5%;
    --input: 217.2 32.6% 17.5%;
    --ring: 217 91% 60%;

    --chart-1: 217 91% 60%;
    --chart-2: 262 84% 60%;
    --chart-3: 162 76% 42%;
    --chart-4: 343 89% 60%;
    --chart-5: 43 96% 56%;

    --stone-200: 240 5% 25%;
  }
}

@layer base {
  * {
    @apply border-border;
  }
  body {
    @apply bg-background text-foreground;
  }
}

@media print {
  body.printing * {
    visibility: hidden;
  }

  body.printing .printable-area,
  body.printing .printable-area * {
    visibility: visible;
  }

  body.printing .printable-area {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    padding: 2rem;
    margin: 0;
    border: none !important;
    box-shadow: none !important;
  }
  
  body.printing .no-print-in-area {
    display: none !important;
  }

  body.printing .prose {
    font-size: 12pt !important;
    color: #000 !important;
  }
  
  body.printing a {
    text-decoration: none;
    color: #000;
  }

  body.printing .print-references ul {
    list-style: disc;
    padding-left: 20px;
    margin-top: 1rem;
  }

   body.printing .print-references a::after {
    content: ' (' attr(href) ')' !important;
    font-size: 9pt;
  }
}