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

@layer base {
  @font-face {
    font-family: "Inter";
    font-weight: 400;
    src: url("./assets/fonts/Inter-Regular.ttf") format("truetype");
  }

  @font-face {
    font-family: "Inter";
    font-weight: 500;
    src: url("./assets/fonts/Inter-Medium.ttf") format("truetype");
  }

  @font-face {
    font-family: "Roboto Mono";
    font-weight: 400;
    src: url("./assets/fonts/RobotoMono-Regular.ttf") format("truetype");
  }

  @font-face {
    font-family: "Roboto Mono";
    font-weight: 500;
    src: url("./assets/fonts/RobotoMono-Medium.ttf") format("truetype");
  }

  :root {
    @apply bg-ui-bg-subtle text-ui-fg-base antialiased;
    text-rendering: optimizeLegibility;
  }
}

@layer components {
  .worfklow-grid {
    background-image: radial-gradient(
      theme("colors.ui-border-strong") 1px,
      transparent 0
    );
    background-size: 40px 40px;
    background-repeat: repeat;
  }
}