Calendar content (days/weekdays) doesn't scale when container width increases

[cnakarimi]

I'm using the Hero UI component with the Persian calendar (fa-IR-u-ca-persian). I noticed that when I increase the width of the calendar container (e.g., via flex, grid, or setting a wider width manually), the outer calendar box grows, but the inner content (day cells, weekday labels) stays the same size and doesn't stretch or scale with the container.

Here's a simplified version of my code:

<Calendar
aria-label="Date (International Calendar)"
showMonthAndYearPickers
pageBehavior="single"
color="danger"
className="sm:w-[350px] md:w-[450px] sm:-[400px]"
classNames={{
base: "",
headerWrapper: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
header: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
title: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0 ",
gridWrapper: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
grid: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
gridCell: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
gridCellButton: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
gridHeader: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
gridHeaderRow: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
gridHeaderCell: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
gridBody: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
gridBodyRow: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
cell: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
cellButton: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
pickerWrapper: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
pickerMonthList: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
pickerYearList: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
pickerHighlight: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
pickerItem: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
helperWrapper: "!mr-0 !ml-0 !pl-0 !pr-0 !px-0",
}}
/>