Offset-top only

[DoctorSte]

I need to offset my toaster, but I only want to offset it from the top.
Any way to do that through Tailwind classes? Would be great it that was a separate prop.

[DoctorSte]

Found a workaround for this in this form:

   <Toaster
        position="top-right"
        closeButton
        visibleToasts={5}
        toastOptions={{
          unstyled: true,
          classNames: {
            toast:
              "flex items-center rounded-xl w-full p-2 bg-indigo-600 border-2 border-indigo-500 text-base **mt-12** gap-0.5",
            error: "bg-red-500 border-red-400 text-red-50",
            success: "bg-green-600 border-green-500 text-green-50",
            warning: "bg-yellow-400 border-yellow-300 text-yellow-900",
            info: "bg-blue-700 border-blue-600 text-blue-50",
          },
        }}
      />

[DoctorSte]

Would also be great to have breakpoints on this, so I can specify if I want that offset on all resolutions or just on some.
For instance, if I want to offset-top on lg and change that to offset-bottom on md and lower.

If the offset could work with tailwind classes as well it would solve it. Same for positioning.
eg.

offset="top-0 lg:top-20 bottom-20 lg:bottom-0" 
position="bottom-center lg:top-right"

[Krzysztof Durek]

Was struggling with this and accidentally found it

toastOptions={{
  style: {
    top: 16,
  },
}}

EDIT:
Actually not good for responsive, margin seems the best