fix(react-popover): update styles to not use CSS shorthands

[layershifter]

Pull request checklist

• Addresses an existing issue: extracted from makeStyles: do not use shorthand expansion #20539, related to RFC: Do not allow CSS shorthands in makeStyles() calls #20573
• Include a change request file using $ yarn change

Description of changes

This PR:

• updates styles to not use CSS shorthands
• updates stories to not use CSS shorthands
• cleanups types, removes codesandbox-dependency comments

[fabricteam]

📊 Bundle size report

_{🤖 This report was generated against bd3e92b5193176665879abd667db4350ffcc35ea}

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit cbf802f:

Sandbox	Source
@fluentui/react 8 starter	Configuration
@fluentui/react-components 9 starter	Configuration

[size-auditor]

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: bd3e92b5193176665879abd667db4350ffcc35ea (build)

[fabricteam]

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	847	875	5000
BaseButton	mount	899	909	5000
Breadcrumb	mount	2401	2388	1000
ButtonNext	mount	552	546	5000
Checkbox	mount	1438	1419	5000
CheckboxBase	mount	1207	1248	5000
ChoiceGroup	mount	4222	4179	5000
ComboBox	mount	949	967	1000
CommandBar	mount	8926	8916	1000
ContextualMenu	mount	7425	7397	1000
DefaultButton	mount	1071	1057	5000
DetailsRow	mount	3367	3296	5000
DetailsRowFast	mount	3408	3362	5000
DetailsRowNoStyles	mount	3206	3209	5000
Dialog	mount	2301	2290	1000
DocumentCardTitle	mount	222	233	1000
Dropdown	mount	2812	2853	5000
FluentProviderNext	mount	3670	3715	5000
FluentProviderWithTheme	mount	289	305	10
FluentProviderWithTheme	virtual-rerender	175	186	10
FluentProviderWithTheme	virtual-rerender-with-unmount	326	333	10
FocusTrapZone	mount	1638	1630	5000
FocusZone	mount	1685	1711	5000
IconButton	mount	1618	1604	5000
Label	mount	420	400	5000
Layer	mount	2629	2686	5000
Link	mount	504	518	5000
MakeStyles	mount	1694	1679	50000
MenuButton	mount	1387	1362	5000
MessageBar	mount	1793	1813	5000
Nav	mount	2915	2906	1000
OverflowSet	mount	1071	1086	5000
Panel	mount	2173	2215	1000
Persona	mount	817	839	1000
Pivot	mount	1334	1336	1000
PrimaryButton	mount	1193	1201	5000
Rating	mount	6702	6745	5000
SearchBox	mount	1231	1249	5000
Shimmer	mount	2287	2280	5000
Slider	mount	1771	1753	5000
SpinButton	mount	4367	4460	5000
Spinner	mount	475	480	5000
SplitButton	mount	2742	2794	5000
Stack	mount	543	533	5000
StackWithIntrinsicChildren	mount	1562	1561	5000
StackWithTextChildren	mount	4040	4078	5000
SwatchColorPicker	mount	9091	9061	5000
TagPicker	mount	2350	2346	5000
TeachingBubble	mount	11338	11324	5000
Text	mount	477	476	5000
TextField	mount	1280	1290	5000
ThemeProvider	mount	1127	1126	5000
ThemeProvider	virtual-rerender	610	623	5000
ThemeProvider	virtual-rerender-with-unmount	1698	1710	5000
Toggle	mount	803	791	5000
buttonNative	mount	222	213	5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
AccordionMinimalPerf.default	146	123	1.19:1
AttachmentMinimalPerf.default	147	132	1.11:1
ChatWithPopoverPerf.default	332	305	1.09:1
BoxMinimalPerf.default	304	288	1.06:1
ChatDuplicateMessagesPerf.default	267	253	1.06:1
FormMinimalPerf.default	353	333	1.06:1
ButtonMinimalPerf.default	153	146	1.05:1
ButtonSlotsPerf.default	483	459	1.05:1
ChatMinimalPerf.default	570	545	1.05:1
PortalMinimalPerf.default	159	152	1.05:1
ReactionMinimalPerf.default	327	310	1.05:1
HeaderMinimalPerf.default	315	303	1.04:1
ListMinimalPerf.default	442	427	1.04:1
RefMinimalPerf.default	210	202	1.04:1
AttachmentSlotsPerf.default	929	906	1.03:1
DialogMinimalPerf.default	658	637	1.03:1
FlexMinimalPerf.default	258	250	1.03:1
HeaderSlotsPerf.default	644	626	1.03:1
ListNestedPerf.default	476	463	1.03:1
SegmentMinimalPerf.default	301	293	1.03:1
TextMinimalPerf.default	301	292	1.03:1
AnimationMinimalPerf.default	369	361	1.02:1
AvatarMinimalPerf.default	171	167	1.02:1
ButtonOverridesMissPerf.default	1435	1412	1.02:1
DropdownManyItemsPerf.default	573	562	1.02:1
ImageMinimalPerf.default	324	318	1.02:1
LabelMinimalPerf.default	330	324	1.02:1
MenuMinimalPerf.default	732	715	1.02:1
PopupMinimalPerf.default	512	501	1.02:1
TreeMinimalPerf.default	682	671	1.02:1
CardMinimalPerf.default	474	469	1.01:1
CarouselMinimalPerf.default	408	403	1.01:1
DividerMinimalPerf.default	313	309	1.01:1
GridMinimalPerf.default	293	290	1.01:1
InputMinimalPerf.default	1120	1104	1.01:1
ItemLayoutMinimalPerf.default	1013	1000	1.01:1
ProviderMinimalPerf.default	972	959	1.01:1
SliderMinimalPerf.default	1430	1411	1.01:1
StatusMinimalPerf.default	583	580	1.01:1
TableManyItemsPerf.default	1593	1585	1.01:1
TextAreaMinimalPerf.default	418	414	1.01:1
ToolbarMinimalPerf.default	800	792	1.01:1
TreeWith60ListItems.default	155	154	1.01:1
VideoMinimalPerf.default	541	534	1.01:1
CheckboxMinimalPerf.default	2274	2272	1:1
DropdownMinimalPerf.default	2579	2567	1:1
ListWith60ListItems.default	551	553	1:1
LoaderMinimalPerf.default	579	577	1:1
MenuButtonMinimalPerf.default	1381	1375	1:1
ProviderMergeThemesPerf.default	1465	1468	1:1
RadioGroupMinimalPerf.default	370	369	1:1
SplitButtonMinimalPerf.default	3602	3616	1:1
TableMinimalPerf.default	341	341	1:1
CustomToolbarPrototype.default	3486	3488	1:1
TooltipMinimalPerf.default	873	869	1:1
EmbedMinimalPerf.default	3475	3501	0.99:1
DatepickerMinimalPerf.default	4601	4708	0.98:1
ListCommonPerf.default	525	535	0.98:1
RosterPerf.default	1012	1032	0.98:1
LayoutMinimalPerf.default	305	315	0.97:1
SkeletonMinimalPerf.default	297	305	0.97:1
IconMinimalPerf.default	505	523	0.97:1
AlertMinimalPerf.default	223	234	0.95:1

[ling1726]

👍