@tailwind components;

@layer components {
  .card {
    @apply relative m-[0.6rem] box-border min-h-[2rem] rounded-[0.5rem] p-[0.6rem] text-[1.3rem] text-label;
  }
  .card-border {
    @apply border border-border bg-background shadow-blur;
  }
  .card-header {
    @apply -mx-[0.6rem] flex items-center justify-between border-b border-b-border p-4;
  }
  .card-footer {
    @apply -mx-[0.6rem] mt-2 flex items-center justify-center border-t border-t-border py-4;
  }

  input[type="file"] {
    @apply h-[40px] w-[200px] cursor-pointer rounded-md border border-input bg-field px-3 py-2 text-sm text-foreground;
  }
}