After additional investigation, I was able to locate the issue.
The Calendar cells calculation depend on two variable, the global font size, and the variable `$calendar-cell-size-px`. This is why only changing the global font-size creates smaller text and popup width, but the same cells widths.
In this case, we have two options:
1) Set the `$calendar-cell-size-px` variable to scale the same as the font size. For example, for font size 0.825 the `$calendar-cell-size-px` has to be 40 * 0.825.
2) Set a global CSS that will apply this font size to all components and elements on the page. This will also require removing the scss variable font-size 0.825 as it will be set via the CSS:
font-size: 0.825 rem
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.