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

:root {
    --font-sans: "Inter var";
    --background: 0 0% 100%;
    --foreground: 240 10% 3.9%;
    --border: 240 5.9% 90%;
    --muted: 240 4.8% 95.9%;
    --muted-foreground: 240 3.8% 46.1%;
    --primary: 240 5.9% 10%;
    --primary-foreground: 0 0% 98%;
}

@layer base {
    body {
        font-family: var(--font-sans), sans-serif;
    }
}

@layer utilities {
    .bg-background {
        background-color: hsl(var(--background));
    }

    .text-foreground {
        color: hsl(var(--foreground));
    }

    .bg-border {
        background-color: hsl(var(--border));
    }

    .text-muted-foreground {
        color: hsl(var(--muted-foreground));
    }

    .hover\:bg-muted:hover {
        background-color: hsl(var(--muted));
    }

    .data-\[state\=selected\]\:bg-muted[data-state="selected"] {
        background-color: hsl(var(--muted));
    }

    .tr-border-b {
        @apply border-b;
    }

    .hover\:bg-muted\/50:hover {
        background-color: hsl(var(--muted) / 50%);
    }

    .thead-tr-border-b > tr {
        @apply border-b;
    }

    .ring-offset-background {
        --tw-ring-offset-color: hsl(var(--background));
    }

    .border-input {
        --tw-border-opacity: 1;
        border-color: hsl(var(--border) / var(--tw-border-opacity));
    }

    .button-base {
        @apply inline-flex items-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50;
    }

    .button-combobox {
        @apply ring-offset-background border border-input bg-background h-10 pl-4 py-2 w-full justify-between;
    }

    .select-component {
        @apply ring-offset-background border border-input bg-background h-10 px-4 py-2 w-full;
    }

    .button-icon {
        @apply mr-2 mb-2 h-6 w-6 shrink-0 opacity-50;
    }

    .no-spinner::-webkit-inner-spin-button,
    .no-spinner::-webkit-outer-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }

    .no-spinner {
      -moz-appearance: textfield;
    }
}


@media print
{
    @page {
        size: landscape;
        margin: unset;
    }
    .no-print, .no-print *
    {
        display: none !important;
    }
}