how to split application.tailwind.css into multiple files?

[laptopmutia]

I'm using rails8 and propshaft
and I want to split the content inside application.tailwind.css into multiple time

lets say I have 2 files

app/assets/stylesheets/application.tailwind.css
and
app/assets/stylesheets/pagy.css

how to add this pagy.css to application.tailwind.css ?

the pagy.css class is like this

.pagy {
  @apply flex space-x-1 font-semibold text-sm text-gray-500;
  a:not(.gap) {
    @apply block rounded-lg px-3 py-1 bg-gray-200;
    &:hover {
      @apply bg-gray-300;
    }
    &:not([href]) { /* disabled links */
      @apply text-gray-300 bg-gray-100 cursor-default;
    }
    &.current {
      @apply text-white bg-gray-400;
    }
  }
  label {
    @apply inline-block whitespace-nowrap bg-gray-200 rounded-lg px-3 py-0.5;
    input {
      @apply bg-gray-100 border-none rounded-md;
    }
  }
}

and my application.tailwind.css

@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
  .sidebar-link-icon-active {
    @apply h-6 w-6 shrink-0 text-science-blue-600;
  }
}

I have tried to add

@import 'assets/pagy.css' 

but its not works

[flavorjones]

You may want to read the upstream conversations about the design decisions made upstream, for example tailwindlabs/tailwindcss#6612

If you decide you really want to generate multiple files, then I would recommend dropping this gem, and using tailwindcss-ruby to run the commands you want with the input and output files you want.

[laptopmutia]

I think I wording it wrong, I just want to generate 1 files

I mean I just want to do somethings like import, in application.tailwind.css is that possible?

multiple input files, and generate only 1 files