
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --background: 195 25% 95%; /* light desaturated blue */
    --foreground: 205 15% 28%; /* dark blue-gray for text */

    --card: 195 25% 95%;
    --card-foreground: 205 15% 28%;
 
    --popover: 195 25% 95%;
    --popover-foreground: 205 15% 28%;
 
    --primary: 196 31% 59%; /* calm blue */
    --primary-foreground: 0 0% 100%;
 
    --secondary: 196 31% 85%;
    --secondary-foreground: 196 31% 35%;
 
    --muted: 195 20% 90%;
    --muted-foreground: 195 10% 50%;
 
    --accent: 140 23% 66%; /* light desaturated green for focus/emphasis */
    --accent-foreground: 0 0% 100%;
 
    --destructive: 356 79% 59%; /* warm red for errors */
    --destructive-foreground: 0 0% 100%;

    --border: 195 20% 88%;
    --input: 0 0% 100%;
    --ring: 140 23% 66%; /* light desaturated green for focus ring */
 
    --radius: 0.75rem;
  }
 
  .dark {
    /* For now, dark theme will be the same as light. Can be configured later. */
    --background: 195 25% 95%;
    --foreground: 205 15% 28%;

    --card: 195 25% 95%;
    --card-foreground: 205 15% 28%;
 
    --popover: 195 25% 95%;
    --popover-foreground: 205 15% 28%;
 
    --primary: 196 31% 59%;
    --primary-foreground: 0 0% 100%;
 
    --secondary: 196 31% 85%;
    --secondary-foreground: 196 31% 35%;
 
    --muted: 195 20% 90%;
    --muted-foreground: 195 10% 50%;
 
    --accent: 140 23% 66%;
    --accent-foreground: 0 0% 100%;
 
    --destructive: 356 79% 59%;
    --destructive-foreground: 0 0% 100%;

    --border: 195 20% 88%;
    --input: 0 0% 100%;
    --ring: 140 23% 66%;
 
    --radius: 0.75rem;
  }
}

body {
  font-family: 'Inter', Arial, Helvetica, sans-serif; /* Ensure Inter is primary */
  font-size: 14px; /* Set base font size to 14px */
}

@layer base {
  * {
    border-color: hsl(var(--border));
  }
  body {
    background-color: hsl(var(--background));
    color: hsl(var(--foreground));
  }
}

@layer utilities {
  .animate-infinite-scroll {
    animation: infinite-scroll 40s linear infinite;
  }

  @keyframes infinite-scroll {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(-50%);
    }
  }
}


/* Print Styles */
@media print {
  /* Default page setup */
  @page {
    size: A4 portrait;
    margin: 1cm;
  }
  
  body.print-body, html {
    background: #fff !important;
    color: #000 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* Hide all elements by default when print-body class is active */
  body.print-body > *:not(.print-this-container) {
    display: none !important;
  }

  /* Ensure the printable container itself is styled correctly */
  .print-this-container {
    display: block !important; /* Make sure it's visible */
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #fff !important;
    overflow: visible !important;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }

  .print-hidden {
    display: none !important;
  }

  /* Ensure content inside the printable container is legible */
  .print-this-container * {
    color: #000 !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border-color: #ccc !important;
  }
  .print-this-container .badge {
    border: 1px solid #ccc !important;
    color: #333 !important;
  }
  .print-this-container .text-destructive {
     color: #000 !important;
  }

  /* New rule for forcing page breaks */
  .print-page-break {
    page-break-before: always;
    padding-top: 1cm; /* Adjust if header needs space from top margin */
  }
}
