@import './globals.css';

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

@layer components {
      .border-border {
        border-color: var(--border); /* Example using a CSS variable */
      }
      .outline-ring\/50 {
        outline-color: var(--ring);
        outline-width: 50%;
      }
      .bg-background {
        background-color: var(--background);
      }
      .text-foreground {
        color: var(--foreground);
      }
    }

@media print {
    .no-print {
        display: none !important;
    }
    body {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .print-container {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        padding: 1rem;
    }
    main.flex-1 {
        overflow-y: visible !important;
    }
    div.flex-1 {
        overflow: visible !important;
    }
    .bg-white {
        border: none !important;
        box-shadow: none !important;
    }
    .rounded-xl {
        border-radius: 0 !important;
    }
    .p-6 {
        padding: 0.5rem !important;
    }
    table {
        width: 100%;
        font-size: 10pt;
        page-break-inside: auto;
    }
    tr {
        page-break-inside: avoid;
        page-break-after: auto;
    }
    thead {
        display: table-header-group;
    }
    tbody {
        display: table-row-group;
    }
    th, td {
        padding: 4px 8px !important;
    }
    h1, h2, h3, h4 {
        page-break-after: avoid;
    }
    .grid {
        display: block !important;
    }
    .grid > div {
        margin-bottom: 1rem;
        page-break-inside: avoid;
    }
}