@patternfly/patternfly 6.5.0-prerelease.3 → 6.5.0-prerelease.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (246) hide show
  1. package/README.md +1 -1
  2. package/assets/images/RHAiExperienceIcon.svg +27 -0
  3. package/assets/images/RHAutomationsLogo.svg +96 -0
  4. package/assets/images/RHServerStackIcon.svg +16 -0
  5. package/assets/images/compass--hero-bg.png +0 -0
  6. package/assets/images/compass--rh-wallpaper-dark.png +0 -0
  7. package/assets/images/compass--rh-wallpaper-light.png +0 -0
  8. package/assets/images/compass--wallpaper-dark.png +0 -0
  9. package/assets/images/compass--wallpaper-light.png +0 -0
  10. package/base/normalize.scss +7 -0
  11. package/base/patternfly-common.css +46 -0
  12. package/base/patternfly-common.scss +56 -0
  13. package/base/patternfly-variables.css +42 -0
  14. package/base/tokens/tokens-local.scss +66 -0
  15. package/components/Accordion/accordion.scss +0 -1
  16. package/components/ActionList/action-list.css +2 -0
  17. package/components/ActionList/action-list.scss +2 -0
  18. package/components/Button/button.css +34 -4
  19. package/components/Button/button.scss +40 -4
  20. package/components/Card/card.css +12 -0
  21. package/components/Card/card.scss +15 -1
  22. package/components/Compass/compass.css +306 -0
  23. package/components/Compass/compass.scss +337 -0
  24. package/components/DataList/data-list.css +5 -1
  25. package/components/DataList/data-list.scss +6 -1
  26. package/components/Drawer/drawer.css +43 -3
  27. package/components/Drawer/drawer.scss +52 -4
  28. package/components/ExpandableSection/expandable-section.css +3 -0
  29. package/components/ExpandableSection/expandable-section.scss +3 -0
  30. package/components/Hero/hero.css +74 -0
  31. package/components/Hero/hero.scss +86 -0
  32. package/components/MenuToggle/menu-toggle.css +4 -0
  33. package/components/MenuToggle/menu-toggle.scss +5 -0
  34. package/components/Table/table.css +3 -0
  35. package/components/Table/table.scss +5 -0
  36. package/components/Tabs/tabs.css +16 -1
  37. package/components/Tabs/tabs.scss +21 -1
  38. package/components/_index.css +578 -84
  39. package/components/_index.scss +3 -1
  40. package/docs/components/Avatar/examples/Avatar.md +4 -4
  41. package/docs/components/Brand/examples/Brand.md +2 -2
  42. package/docs/components/Button/examples/Button.md +116 -0
  43. package/docs/components/Card/examples/Card.md +154 -0
  44. package/docs/components/Compass/examples/Compass.css +11 -0
  45. package/docs/components/Compass/examples/Compass.md +91 -0
  46. package/docs/components/DataList/examples/DataList.md +184 -188
  47. package/docs/components/DescriptionList/examples/DescriptionList.md +2 -2
  48. package/docs/components/Divider/examples/Divider.md +2 -2
  49. package/docs/components/Drawer/examples/Drawer.md +83 -17
  50. package/docs/components/Hero/examples/Hero.md +25 -0
  51. package/docs/components/Icon/examples/Icon.md +1 -1
  52. package/docs/components/InputGroup/examples/InputGroup.md +1 -1
  53. package/docs/components/JumpLinks/examples/JumpLinks.md +2 -2
  54. package/docs/components/Masthead/examples/masthead.md +1 -1
  55. package/docs/components/Menu/examples/Menu.md +2 -2
  56. package/docs/components/MenuToggle/examples/MenuToggle.md +40 -0
  57. package/docs/components/Page/examples/Page.md +2 -2
  58. package/docs/components/Pagination/examples/Pagination.md +3 -3
  59. package/docs/components/ProgressStepper/examples/ProgressStepper.md +2 -2
  60. package/docs/components/Sidebar/examples/Sidebar.md +1 -1
  61. package/docs/components/Table/examples/Table.md +91 -3
  62. package/docs/components/Tabs/examples/Tabs.md +998 -83
  63. package/docs/components/Toolbar/examples/Toolbar.md +7 -7
  64. package/docs/components/Wizard/examples/Wizard.md +15 -15
  65. package/docs/demos/Card/examples/Card.md +14 -2
  66. package/docs/demos/Compass/examples/Compass.md +6246 -0
  67. package/docs/demos/Dashboard/examples/Dashboard.md +1 -4
  68. package/docs/demos/DescriptionList/examples/DescriptionList.md +42 -35
  69. package/docs/demos/Drawer/examples/Drawer.md +42 -35
  70. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +143 -165
  71. package/docs/demos/Tabs/examples/Tabs.md +72 -9
  72. package/docs/demos/Wizard/examples/Wizard.md +31 -34
  73. package/docs/layouts/Bullseye/examples/Bullseye.css +2 -2
  74. package/docs/layouts/Bullseye/examples/Bullseye.md +2 -1
  75. package/docs/layouts/Flex/examples/Flex.css +3 -3
  76. package/docs/layouts/Flex/examples/Flex.md +3 -2
  77. package/docs/layouts/Gallery/examples/Gallery.css +2 -2
  78. package/docs/layouts/Gallery/examples/Gallery.md +4 -3
  79. package/docs/layouts/Grid/examples/Grid.css +1 -1
  80. package/docs/layouts/Grid/examples/Grid.md +6 -5
  81. package/docs/layouts/Level/examples/Level.css +3 -3
  82. package/docs/layouts/Level/examples/Level.md +2 -1
  83. package/docs/layouts/Split/examples/Split.css +1 -1
  84. package/docs/layouts/Split/examples/Split.md +2 -1
  85. package/docs/layouts/Stack/examples/Stack.css +3 -3
  86. package/docs/layouts/Stack/examples/Stack.md +2 -1
  87. package/docs/utilities/Accessibility/examples/Accessibility.md +3 -2
  88. package/docs/utilities/Alignment/examples/Alignment.css +4 -4
  89. package/docs/utilities/Alignment/examples/Alignment.md +3 -2
  90. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +5 -4
  91. package/docs/utilities/BoxShadow/examples/box-shadow.css +2 -2
  92. package/docs/utilities/BoxShadow/examples/box-shadow.md +2 -1
  93. package/docs/utilities/Display/examples/Display.css +1 -1
  94. package/docs/utilities/Display/examples/Display.md +3 -2
  95. package/docs/utilities/Flex/examples/Flex.css +7 -7
  96. package/docs/utilities/Flex/examples/Flex.md +3 -2
  97. package/docs/utilities/Float/examples/Float.css +2 -2
  98. package/docs/utilities/Float/examples/Float.md +3 -2
  99. package/docs/utilities/Sizing/examples/Sizing.md +8 -7
  100. package/docs/utilities/Spacing/examples/Spacing.css +2 -2
  101. package/docs/utilities/Spacing/examples/Spacing.md +3 -2
  102. package/docs/utilities/Text/examples/Text.md +5 -4
  103. package/icons/PfIcons/add-circle-o.svg +4 -0
  104. package/icons/PfIcons/ansible-tower.svg +4 -0
  105. package/icons/PfIcons/applications.svg +4 -0
  106. package/icons/PfIcons/arrow.svg +4 -0
  107. package/icons/PfIcons/asleep.svg +4 -0
  108. package/icons/PfIcons/attention-bell.svg +4 -0
  109. package/icons/PfIcons/automation.svg +4 -0
  110. package/icons/PfIcons/bell.svg +4 -0
  111. package/icons/PfIcons/blueprint.svg +4 -0
  112. package/icons/PfIcons/build.svg +4 -0
  113. package/icons/PfIcons/builder-image.svg +4 -0
  114. package/icons/PfIcons/bundle.svg +4 -0
  115. package/icons/PfIcons/catalog.svg +4 -0
  116. package/icons/PfIcons/chat.svg +4 -0
  117. package/icons/PfIcons/close.svg +4 -0
  118. package/icons/PfIcons/cloud-security.svg +4 -0
  119. package/icons/PfIcons/cloud-tenant.svg +4 -0
  120. package/icons/PfIcons/cluster.svg +4 -0
  121. package/icons/PfIcons/connected.svg +4 -0
  122. package/icons/PfIcons/container-node.svg +4 -0
  123. package/icons/PfIcons/cpu.svg +4 -0
  124. package/icons/PfIcons/critical-risk.svg +4 -0
  125. package/icons/PfIcons/data-processor.svg +4 -0
  126. package/icons/PfIcons/data-sink.svg +4 -0
  127. package/icons/PfIcons/data-source.svg +4 -0
  128. package/icons/PfIcons/degraded.svg +4 -0
  129. package/icons/PfIcons/disconnected.svg +4 -0
  130. package/icons/PfIcons/domain.svg +4 -0
  131. package/icons/PfIcons/edit.svg +4 -0
  132. package/icons/PfIcons/enhancement.svg +4 -0
  133. package/icons/PfIcons/enterprise.svg +4 -0
  134. package/icons/PfIcons/equalizer.svg +4 -0
  135. package/icons/PfIcons/error-circle-o.svg +4 -0
  136. package/icons/PfIcons/export.svg +4 -0
  137. package/icons/PfIcons/filter.svg +4 -0
  138. package/icons/PfIcons/flavor.svg +4 -0
  139. package/icons/PfIcons/folder-close.svg +4 -0
  140. package/icons/PfIcons/folder-open.svg +4 -0
  141. package/icons/PfIcons/globe-route.svg +4 -0
  142. package/icons/PfIcons/help.svg +4 -0
  143. package/icons/PfIcons/history.svg +4 -0
  144. package/icons/PfIcons/home.svg +4 -0
  145. package/icons/PfIcons/import.svg +4 -0
  146. package/icons/PfIcons/in-progress.svg +4 -0
  147. package/icons/PfIcons/info.svg +4 -0
  148. package/icons/PfIcons/infrastructure.svg +4 -0
  149. package/icons/PfIcons/integration.svg +4 -0
  150. package/icons/PfIcons/key.svg +4 -0
  151. package/icons/PfIcons/locked.svg +4 -0
  152. package/icons/PfIcons/maintenance.svg +4 -0
  153. package/icons/PfIcons/memory.svg +4 -0
  154. package/icons/PfIcons/messages.svg +4 -0
  155. package/icons/PfIcons/middleware.svg +4 -0
  156. package/icons/PfIcons/migration.svg +4 -0
  157. package/icons/PfIcons/module.svg +4 -0
  158. package/icons/PfIcons/monitoring.svg +4 -0
  159. package/icons/PfIcons/multicluster.svg +4 -0
  160. package/icons/PfIcons/namespaces.svg +4 -0
  161. package/icons/PfIcons/network.svg +4 -0
  162. package/icons/PfIcons/new-process.svg +4 -0
  163. package/icons/PfIcons/not-started.svg +4 -0
  164. package/icons/PfIcons/off.svg +4 -0
  165. package/icons/PfIcons/ok.svg +4 -0
  166. package/icons/PfIcons/on-running.svg +4 -0
  167. package/icons/PfIcons/on.svg +4 -0
  168. package/icons/PfIcons/open-drawer-right.svg +4 -0
  169. package/icons/PfIcons/openshift.svg +4 -0
  170. package/icons/PfIcons/openstack.svg +4 -0
  171. package/icons/PfIcons/optimize.svg +4 -0
  172. package/icons/PfIcons/orders.svg +4 -0
  173. package/icons/PfIcons/os-image.svg +4 -0
  174. package/icons/PfIcons/package.svg +4 -0
  175. package/icons/PfIcons/panel-close.svg +4 -0
  176. package/icons/PfIcons/panel-open.svg +4 -0
  177. package/icons/PfIcons/paused.svg +4 -0
  178. package/icons/PfIcons/pending.svg +4 -0
  179. package/icons/PfIcons/pficon-dragdrop.svg +4 -0
  180. package/icons/PfIcons/pficon-history.svg +4 -0
  181. package/icons/PfIcons/pficon-network-range.svg +4 -0
  182. package/icons/PfIcons/pficon-satellite.svg +4 -0
  183. package/icons/PfIcons/pficon-sort-common-asc.svg +4 -0
  184. package/icons/PfIcons/pficon-sort-common-desc.svg +4 -0
  185. package/icons/PfIcons/pficon-template.svg +4 -0
  186. package/icons/PfIcons/pficon-vcenter.svg +4 -0
  187. package/icons/PfIcons/plugged.svg +4 -0
  188. package/icons/PfIcons/port.svg +4 -0
  189. package/icons/PfIcons/print.svg +4 -0
  190. package/icons/PfIcons/private.svg +4 -0
  191. package/icons/PfIcons/process-automation.svg +4 -0
  192. package/icons/PfIcons/project.svg +4 -0
  193. package/icons/PfIcons/rebalance.svg +4 -0
  194. package/icons/PfIcons/rebooting.svg +4 -0
  195. package/icons/PfIcons/regions.svg +4 -0
  196. package/icons/PfIcons/registry.svg +4 -0
  197. package/icons/PfIcons/remove2.svg +4 -0
  198. package/icons/PfIcons/replicator.svg +4 -0
  199. package/icons/PfIcons/repository.svg +4 -0
  200. package/icons/PfIcons/resource-pool.svg +4 -0
  201. package/icons/PfIcons/resources-almost-empty.svg +4 -0
  202. package/icons/PfIcons/resources-almost-full.svg +4 -0
  203. package/icons/PfIcons/resources-empty.svg +4 -0
  204. package/icons/PfIcons/resources-full.svg +4 -0
  205. package/icons/PfIcons/running.svg +4 -0
  206. package/icons/PfIcons/save.svg +4 -0
  207. package/icons/PfIcons/screen.svg +4 -0
  208. package/icons/PfIcons/security.svg +4 -0
  209. package/icons/PfIcons/server-group.svg +4 -0
  210. package/icons/PfIcons/server.svg +4 -0
  211. package/icons/PfIcons/service-catalog.svg +4 -0
  212. package/icons/PfIcons/service.svg +4 -0
  213. package/icons/PfIcons/services.svg +4 -0
  214. package/icons/PfIcons/severity-critical.svg +4 -0
  215. package/icons/PfIcons/severity-important.svg +4 -0
  216. package/icons/PfIcons/severity-minor.svg +4 -0
  217. package/icons/PfIcons/severity-moderate.svg +4 -0
  218. package/icons/PfIcons/severity-none.svg +4 -0
  219. package/icons/PfIcons/severity-undefined.svg +4 -0
  220. package/icons/PfIcons/spinner.svg +4 -0
  221. package/icons/PfIcons/spinner2.svg +4 -0
  222. package/icons/PfIcons/storage-domain.svg +4 -0
  223. package/icons/PfIcons/task.svg +4 -0
  224. package/icons/PfIcons/tenant.svg +4 -0
  225. package/icons/PfIcons/thumb-tack.svg +4 -0
  226. package/icons/PfIcons/topology.svg +4 -0
  227. package/icons/PfIcons/treeview.svg +4 -0
  228. package/icons/PfIcons/trend-down.svg +4 -0
  229. package/icons/PfIcons/trend-up.svg +4 -0
  230. package/icons/PfIcons/unknown.svg +4 -0
  231. package/icons/PfIcons/unlocked.svg +4 -0
  232. package/icons/PfIcons/unplugged.svg +4 -0
  233. package/icons/PfIcons/user.svg +4 -0
  234. package/icons/PfIcons/users.svg +4 -0
  235. package/icons/PfIcons/virtual-machine.svg +4 -0
  236. package/icons/PfIcons/volume.svg +4 -0
  237. package/icons/PfIcons/warning-triangle.svg +4 -0
  238. package/icons/PfIcons/zone.svg +4 -0
  239. package/package.json +28 -13
  240. package/patternfly-base-no-globals.css +88 -0
  241. package/patternfly-base.css +95 -0
  242. package/patternfly-no-globals.css +666 -84
  243. package/patternfly.css +673 -84
  244. package/patternfly.min.css +1 -1
  245. package/patternfly.min.css.map +1 -1
  246. package/sass-utilities/namespaces-components.scss +6 -0
package/patternfly.css CHANGED
@@ -119,11 +119,18 @@ pre) {
119
119
  :where(a) {
120
120
  color: var(--pf-t--global--text--color--link--default);
121
121
  text-decoration-line: var(--pf-t--global--text-decoration--link--line--default);
122
+ text-decoration-style: var(--pf-t--global--text-decoration--link--style--default);
123
+ text-decoration-color: var(--pf-t--global--text-decoration--color--default);
124
+ text-underline-offset: max(var(--pf-t--global--text-decoration--offset--default), 0.28em);
125
+ transition: ease text-underline-offset 0.3s;
122
126
  }
123
127
 
124
128
  :where(a:hover, a:focus) {
125
129
  color: var(--pf-t--global--text--color--link--hover);
126
130
  text-decoration-line: var(--pf-t--global--text-decoration--link--line--hover);
131
+ text-decoration-style: var(--pf-t--global--text-decoration--link--style--hover);
132
+ text-decoration-color: var(--pf-t--global--text-decoration--color--hover);
133
+ text-underline-offset: max(var(--pf-t--global--text-decoration--offset--hover), 0.33em);
127
134
  }
128
135
 
129
136
  :where(a,
@@ -196,11 +203,57 @@ button) {
196
203
  --pf-t--global--duration--200: 1ms !important;
197
204
  --pf-t--global--duration--100: 1ms !important;
198
205
  --pf-t--global--duration--50: 1ms !important;
206
+ --pf-v6-global--thinking-active--Animation--Duration: 0 !important;
199
207
  }
200
208
 
209
+ .pf-v6-m-ai-indicator {
210
+ position: relative;
211
+ }
212
+ .pf-v6-m-ai-indicator::before {
213
+ position: absolute;
214
+ inset: 0;
215
+ pointer-events: none;
216
+ content: "";
217
+ background: linear-gradient(to right, #f56e6e 0%, #876fd4 65%, #5e40be 100%) border-box;
218
+ border: var(--pf-t--global--border--width--extra-strong) solid transparent;
219
+ border-radius: inherit;
220
+ mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
221
+ mask-composite: exclude;
222
+ }
223
+
224
+ @property --pf-v6-global--thinking--BoxShadow--Spread {
225
+ syntax: "<length>";
226
+ initial-value: 0;
227
+ inherits: false;
228
+ }
229
+ .pf-v6-m-thinking {
230
+ box-shadow: 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--End-End), 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--Start-End), 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--End-Start), 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--Start-Start);
231
+ animation: pf-v6-global-thinking var(--pf-v6-global--thinking-active--Animation--Duration) infinite ease-in-out;
232
+ }
233
+ .pf-v6-m-thinking.pf-m-inset {
234
+ box-shadow: inset 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--End-End), inset 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--Start-End), inset 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--End-Start), inset 0 0 var(--pf-v6-global--thinking--BoxShadow--Spread) var(--pf-v6-global--thinking--BoxShadow--Color--Start-Start);
235
+ }
236
+
237
+ @keyframes pf-v6-global-thinking {
238
+ 50% {
239
+ --pf-v6-global--thinking--BoxShadow--Spread: var(--pf-v6-global--thinking-active--BoxShadow--Spread);
240
+ }
241
+ }
201
242
  :root {
202
243
  --pf-v6-global--danger-jiggle--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
203
244
  --pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
245
+ --pf-v6-global--thinking--BoxShadow--Spread: 0px;
246
+ --pf-v6-global--thinking--BoxShadow--Color--Start-Start: oklch(45.9% 0.187 3.815deg);
247
+ --pf-v6-global--thinking--BoxShadow--Color--Start-End: oklch(50% 0.134 242.749deg);
248
+ --pf-v6-global--thinking--BoxShadow--Color--End-Start: oklch(45.9% 0.187 3.815deg);
249
+ --pf-v6-global--thinking--BoxShadow--Color--End-End: oklch(43.2% 0.232 292.759deg);
250
+ --pf-v6-global--thinking-active--BoxShadow--Spread: 15px;
251
+ --pf-v6-global--thinking-active--Animation--Duration: 0;
252
+ }
253
+ @media screen and (prefers-reduced-motion: no-preference) {
254
+ :root {
255
+ --pf-v6-global--thinking-active--Animation--Duration: 2s;
256
+ }
204
257
  }
205
258
 
206
259
  @property --pf-v6-global--danger-jiggle--TranslateX {
@@ -7209,6 +7262,11 @@ button) {
7209
7262
  --pf-t--global--text--color--status--unread--on-default--default: var(--pf-t--global--text--color--inverse);
7210
7263
  --pf-t--global--text--color--status--unread--on-default--hover: var(--pf-t--global--text--color--inverse);
7211
7264
  --pf-t--global--color--status--read--on-secondary: var(--pf-t--global--background--color--control--default);
7265
+ --pf-t--global--text-decoration--color--default: var(--pf-t--global--border--color--default);
7266
+ --pf-t--global--text-decoration--color--hover: currentcolor;
7267
+ --pf-t--global--text-decoration--offset--hover: calc(var(--pf-t--global--spacer--xs) + 1px);
7268
+ --pf-t--global--text-decoration--link--style--default: var(--pf-t--global--text-decoration--style--200);
7269
+ --pf-t--global--text-decoration--link--style--hover: var(--pf-t--global--text-decoration--style--200);
7212
7270
  --pf-t--global--font--size--heading--xs: var(--pf-t--global--font--size--md);
7213
7271
  --pf-t--global--font--size--heading--sm: var(--pf-t--global--font--size--lg);
7214
7272
  --pf-t--global--font--size--heading--md: var(--pf-t--global--font--size--xl);
@@ -7314,6 +7372,43 @@ button) {
7314
7372
  var(--pf-t--global--box-shadow--color--lg--directional);
7315
7373
  --pf-t--global--list-style: disc outside;
7316
7374
  --pf-t--temp--dev--tbd: #BC11E0;
7375
+ --pf-t--global--background--color--glass--filter--base: none;
7376
+ --pf-t--global--background--color--glass--opacity--base: 1;
7377
+ --pf-t--global--background--color--glass--default--base: var(--pf-t--global--background--color--primary--default);
7378
+ --pf-t--global--background--color--glass--filter: var(--pf-t--global--background--color--glass--filter--base);
7379
+ --pf-t--global--background--color--glass--opacity: var(--pf-t--global--background--color--glass--opacity--base);
7380
+ --pf-t--global--background--color--glass--default: var(--pf-t--global--background--color--glass--default--base);
7381
+ --pf-t--global--dark--background--color--glass--filter: var(--pf-t--global--background--color--glass--filter--base);
7382
+ --pf-t--global--dark--background--color--glass--opacity: var(--pf-t--global--background--color--glass--opacity--base);
7383
+ --pf-t--global--dark--background--color--glass--default: var(--pf-t--global--background--color--glass--default--base);
7384
+ --pf-t--global--light--glass--background--color--glass--color: #ffffff;
7385
+ --pf-t--global--light--glass--background--color--glass--filter: blur(12.5px);
7386
+ --pf-t--global--light--glass--background--color--glass--opacity: 85%;
7387
+ --pf-t--global--light--glass--background--color--glass--default: color-mix(in srgb, var(--pf-t--global--light--glass--background--color--glass--color) var(--pf-t--global--light--glass--background--color--glass--opacity), transparent );
7388
+ --pf-t--global--dark--glass--background--color--glass--color: #1d1d1d;
7389
+ --pf-t--global--dark--glass--background--color--glass--filter: blur(12.5px);
7390
+ --pf-t--global--dark--glass--background--color--glass--opacity: 85%;
7391
+ --pf-t--global--dark--glass--background--color--glass--default: color-mix(in srgb, var(--pf-t--global--dark--glass--background--color--glass--color) var(--pf-t--global--dark--glass--background--color--glass--opacity), transparent );
7392
+ }
7393
+ :root:where(.pf-v6-theme-dark) {
7394
+ --pf-t--global--background--color--glass--filter: var(--pf-t--global--dark--background--color--glass--filter);
7395
+ --pf-t--global--background--color--glass--opacity: var(--pf-t--global--dark--background--color--glass--opacity);
7396
+ --pf-t--global--background--color--glass--default: var(--pf-t--global--dark--background--color--glass--default);
7397
+ }
7398
+ :root:where(.pf-v6-theme-glass) {
7399
+ --pf-t--global--background--color--glass--filter: var(--pf-t--global--light--glass--background--color--glass--filter);
7400
+ --pf-t--global--background--color--glass--opacity: var(--pf-t--global--light--glass--background--color--glass--opacity);
7401
+ --pf-t--global--background--color--glass--default: var(--pf-t--global--light--glass--background--color--glass--default);
7402
+ }
7403
+ :root:where(.pf-v6-theme-glass.pf-v6-theme-dark) {
7404
+ --pf-t--global--background--color--glass--filter: var(--pf-t--global--dark--glass--background--color--glass--filter);
7405
+ --pf-t--global--background--color--glass--opacity: var(--pf-t--global--dark--glass--background--color--glass--opacity);
7406
+ --pf-t--global--background--color--glass--default: var(--pf-t--global--dark--glass--background--color--glass--default);
7407
+ }
7408
+ :root:where(.pf-v6-theme-high-contrast) {
7409
+ --pf-t--global--background--color--glass--filter: var(--pf-t--global--background--color--glass--filter--base);
7410
+ --pf-t--global--background--color--glass--opacity: var(--pf-t--global--background--color--glass--opacity--base);
7411
+ --pf-t--global--background--color--glass--default: var(--pf-t--global--background--color--glass--default--base);
7317
7412
  }
7318
7413
 
7319
7414
  :root:where(.pf-v6-theme-dark) {
@@ -9254,6 +9349,7 @@ button) {
9254
9349
  --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
9255
9350
  --pf-v6-c-action-list--m-vertical--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
9256
9351
  --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
9352
+ --pf-v6-c-action-list--m-vertical--m-icons--RowGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
9257
9353
  }
9258
9354
 
9259
9355
  .pf-v6-c-action-list,
@@ -9268,6 +9364,7 @@ button) {
9268
9364
  }
9269
9365
  .pf-v6-c-action-list.pf-m-icons {
9270
9366
  --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
9367
+ --pf-v6-c-action-list--m-vertical--RowGap: var(--pf-v6-c-action-list--m-vertical--m-icons--RowGap);
9271
9368
  column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
9272
9369
  }
9273
9370
  .pf-v6-c-action-list.pf-m-vertical, .pf-v6-c-action-list.pf-m-vertical .pf-v6-c-action-list__group {
@@ -10490,10 +10587,17 @@ button.pf-v6-c-breadcrumb__link {
10490
10587
  --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
10491
10588
  --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
10492
10589
  --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
10590
+ --pf-v6-c-button--m-link--m-inline--TextDecorationColor: var(--pf-t--global--text-decoration--color--default);
10493
10591
  --pf-v6-c-button--m-link--m-inline--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
10494
10592
  --pf-v6-c-button--m-link--m-inline--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
10593
+ --pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--default);
10594
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: var(--pf-t--global--text-decoration--color--hover);
10495
10595
  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
10496
10596
  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
10597
+ --pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
10598
+ --pf-v6-c-button--m-link--m-inline--TransitionProperty: color, text-underline-offset;
10599
+ --pf-v6-c-button--m-link--m-inline--TransitionDuration: var(--pf-t--global--motion--duration--fade--default), var(--pf-t--global--motion--duration--lg);
10600
+ --pf-v6-c-button--m-link--m-inline--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate), var(--pf-t--global--motion--timing-function--default);
10497
10601
  --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
10498
10602
  --pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart: calc(var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart) + 1rem + var(--pf-t--global--spacer--sm));
10499
10603
  --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
@@ -10503,10 +10607,8 @@ button.pf-v6-c-breadcrumb__link {
10503
10607
  --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
10504
10608
  --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
10505
10609
  --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
10506
- --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
10507
10610
  --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
10508
10611
  --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
10509
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
10510
10612
  --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
10511
10613
  --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
10512
10614
  --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
@@ -10692,6 +10794,14 @@ button.pf-v6-c-breadcrumb__link {
10692
10794
  --pf-v6-c-button--hamburger-icon--arrow--collapse--path: path("M3,7 L1,5 L3,3");
10693
10795
  --pf-v6-c-button--hamburger-icon--bottom--collapse--path: path("M9,9 L5,9");
10694
10796
  --pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX: -1;
10797
+ --pf-v6-c-button--m-circle--ScaleX: 1.29;
10798
+ --pf-v6-c-button--m-circle--ScaleY: 1.29;
10799
+ --pf-v6-c-button--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
10800
+ --pf-v6-c-button--m-circle--Padding--base: var(--pf-t--global--spacer--control--vertical--default);
10801
+ --pf-v6-c-button--m-circle--PaddingBlockStart: var(--pf-v6-c-button--m-circle--Padding--base);
10802
+ --pf-v6-c-button--m-circle--PaddingInlineEnd: 0;
10803
+ --pf-v6-c-button--m-circle--PaddingBlockEnd: var(--pf-v6-c-button--m-circle--Padding--base);
10804
+ --pf-v6-c-button--m-circle--PaddingInlineStart: 0;
10695
10805
  }
10696
10806
 
10697
10807
  .pf-v6-c-button {
@@ -10823,12 +10933,13 @@ button.pf-v6-c-breadcrumb__link {
10823
10933
  --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineEnd);
10824
10934
  --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingBlockEnd);
10825
10935
  --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineStart);
10936
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-link--m-inline--TransitionDuration);
10937
+ --pf-v6-c-button--TransitionTimingFunction: var(--pf-v6-c-button--m-link--m-inline--TransitionTimingFunction);
10938
+ --pf-v6-c-button--TransitionProperty: var(--pf-v6-c-button--m-link--m-inline--TransitionProperty);
10826
10939
  --pf-v6-c-button--BackgroundColor: transparent;
10827
10940
  --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart);
10828
10941
  --pf-v6-c-button--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--TextDecorationLine);
10829
10942
  --pf-v6-c-button--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--TextDecorationStyle);
10830
- --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
10831
- --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
10832
10943
  --pf-v6-c-button--hover--BackgroundColor: transparent;
10833
10944
  --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
10834
10945
  --pf-v6-c-button--disabled--BackgroundColor: transparent;
@@ -10837,6 +10948,8 @@ button.pf-v6-c-breadcrumb__link {
10837
10948
  --pf-v6-c-button--m-link--Color: var(--pf-v6-c-button--m-link--m-inline--Color);
10838
10949
  --pf-v6-c-button--m-link__icon--Color: var(--pf-v6-c-button--m-link--m-inline__icon--Color);
10839
10950
  --pf-v6-c-button--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--TextDecorationColor);
10951
+ --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
10952
+ --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
10840
10953
  --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
10841
10954
  --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
10842
10955
  --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
@@ -10844,6 +10957,7 @@ button.pf-v6-c-breadcrumb__link {
10844
10957
  --pf-v6-c-button--hover--BorderWidth: 0;
10845
10958
  --pf-v6-c-button--m-clicked--BorderWidth: 0;
10846
10959
  text-align: start;
10960
+ text-underline-offset: var(--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset);
10847
10961
  white-space: normal;
10848
10962
  background: transparent;
10849
10963
  outline-offset: 0.125rem;
@@ -10854,6 +10968,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
10854
10968
  --pf-v6-c-button__icon--m-end--MarginInlineStart: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart);
10855
10969
  }
10856
10970
 
10971
+ .pf-v6-c-button.pf-m-link.pf-m-inline:hover, .pf-v6-c-button.pf-m-link.pf-m-inline:focus {
10972
+ --pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset);
10973
+ }
10857
10974
  .pf-v6-c-button.pf-m-link.pf-m-danger {
10858
10975
  --pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-link--m-danger--Color);
10859
10976
  --pf-v6-c-button--m-danger--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--BackgroundColor);
@@ -11059,6 +11176,16 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
11059
11176
  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
11060
11177
  --pf-v6-c-button--hover__icon--ScaleX: 1;
11061
11178
  }
11179
+ .pf-v6-c-button.pf-m-circle {
11180
+ --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-circle--BorderRadius);
11181
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-circle--PaddingBlockStart);
11182
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-circle--PaddingInlineEnd);
11183
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-circle--PaddingBlockEnd);
11184
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-circle--PaddingInlineStart);
11185
+ }
11186
+ .pf-v6-c-button.pf-m-circle .pf-v6-c-button__icon {
11187
+ scale: var(--pf-v6-c-button--m-circle--ScaleX) var(--pf-v6-c-button--m-circle--ScaleY);
11188
+ }
11062
11189
  .pf-v6-c-button:hover, .pf-v6-c-button:focus {
11063
11190
  --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
11064
11191
  --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
@@ -11596,6 +11723,12 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
11596
11723
  .pf-v6-c-card.pf-m-selectable.pf-m-clickable .pf-v6-c-card__selectable-actions :is(.pf-v6-c-check__input, .pf-v6-c-radio__input):where(:disabled) ~ :is(.pf-v6-c-check__label, .pf-v6-c-radio__label), .pf-v6-c-card.pf-m-selectable.pf-m-clickable.pf-m-disabled {
11597
11724
  --pf-v6-c-card--BackgroundColor: var(--pf-v6-c-card--m-selectable--m-disabled--BackgroundColor);
11598
11725
  }
11726
+ .pf-v6-c-card__actions:has(> .pf-v6-c-card__selectable-actions input.pf-v6-screen-reader), .pf-v6-c-card.pf-m-clickable:not(.pf-m-selectable) {
11727
+ --pf-v6-c-card__actions--PaddingInlineStart: 0;
11728
+ --pf-v6-c-card__actions--MarginBlockStart: 0;
11729
+ --pf-v6-c-card__actions--MarginBlockEnd: 0;
11730
+ }
11731
+
11599
11732
  .pf-v6-c-card.pf-m-compact {
11600
11733
  --pf-v6-c-card__title-text--FontSize: var(--pf-v6-c-card--m-compact__title-text--FontSize);
11601
11734
  --pf-v6-c-card__body--FontSize: var(--pf-v6-c-card--m-compact__body--FontSize);
@@ -11701,6 +11834,12 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
11701
11834
  overflow-wrap: var(--pf-v6-c-card__title-text--OverflowWrap);
11702
11835
  }
11703
11836
 
11837
+ .pf-v6-c-card__subtitle {
11838
+ padding-block-start: var(--pf-t--global--spacer--sm);
11839
+ font-size: var(--pf-t--global--font--size--body--sm);
11840
+ color: var(--pf-t--global--text--color--subtle);
11841
+ }
11842
+
11704
11843
  .pf-v6-c-card__actions {
11705
11844
  display: flex;
11706
11845
  gap: var(--pf-v6-c-card__actions--Gap);
@@ -12270,6 +12409,312 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12270
12409
  margin-inline-start: var(--pf-v6-c-code-editor__tab-icon--text--MarginInlineStart);
12271
12410
  }
12272
12411
 
12412
+ .pf-v6-c-compass {
12413
+ --pf-v6-c-compass--BackgroundImage: var(--pf-v6-c-compass--BackgroundImage--light);
12414
+ --pf-v6-c-compass--BackgroundImage--light: none;
12415
+ --pf-v6-c-compass--BackgroundImage--dark: none;
12416
+ --pf-v6-c-compass--Padding: var(--pf-t--global--spacer--inset--page-chrome);
12417
+ --pf-v6-c-compass--Gap: var(--pf-t--global--spacer--inset--page-chrome);
12418
+ --pf-v6-c-compass__nav--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
12419
+ --pf-v6-c-compass__nav--PaddingBlockStart: 0;
12420
+ --pf-v6-c-compass__nav--PaddingBlockEnd: 0;
12421
+ --pf-v6-c-compass__nav--PaddingInlineStart: var(--pf-t--global--spacer--sm);
12422
+ --pf-v6-c-compass__nav--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
12423
+ --pf-v6-c-compass__nav-main--PaddingInlineStart: var(--pf-t--global--spacer--lg);
12424
+ --pf-v6-c-compass__nav-main--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
12425
+ --pf-v6-c-compass__sidebar--PaddingBlockStart: var(--pf-t--global--spacer--sm);
12426
+ --pf-v6-c-compass__sidebar--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
12427
+ --pf-v6-c-compass__sidebar--PaddingInlineStart: var(--pf-t--global--spacer--sm);
12428
+ --pf-v6-c-compass__sidebar--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
12429
+ --pf-v6-c-compass__main--RowGap: var(--pf-t--global--spacer--md);
12430
+ --pf-v6-c-compass__main-header-content--RowGap: var(--pf-t--global--spacer--sm);
12431
+ --pf-v6-c-compass__main-header-content--ColumnGap: var(--pf-t--global--spacer--md);
12432
+ --pf-v6-c-compass__main-footer--MarginBlockStart: calc(var(--pf-v6-c-compass__main--RowGap) * -1 + var(--pf-v6-c-compass--Gap));
12433
+ --pf-v6-c-compass__panel--BackgroundColor: var(--pf-t--global--background--color--glass--default);
12434
+ --pf-v6-c-compass__panel--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
12435
+ --pf-v6-c-compass__panel--BorderRadius: var(--pf-t--global--border--radius--large);
12436
+ --pf-v6-c-compass__panel--m-pill--BorderRadius: var(--pf-t--global--border--radius--pill);
12437
+ --pf-v6-c-compass__panel--PaddingBlockStart: var(--pf-t--global--spacer--inset--page-chrome);
12438
+ --pf-v6-c-compass__panel--PaddingBlockEnd: var(--pf-t--global--spacer--inset--page-chrome);
12439
+ --pf-v6-c-compass__panel--PaddingInlineStart: var(--pf-t--global--spacer--inset--page-chrome);
12440
+ --pf-v6-c-compass__panel--PaddingInlineEnd: var(--pf-t--global--spacer--inset--page-chrome);
12441
+ --pf-v6-c-compass__panel--BorderWidth: var(--pf-t--global--border--width--regular);
12442
+ --pf-v6-c-compass__panel--BorderColor: var(--pf-t--global--border--color--alt);
12443
+ --pf-v6-c-compass__panel--BoxShadow: var(--pf-t--global--box-shadow--md);
12444
+ --pf-v6-c-compass__message-bar--Width: 450px;
12445
+ --pf-v6-c-compass__message-bar--MinWidth: 300px;
12446
+ --pf-v6-c-compass__message-bar--MaxWidth: 600px;
12447
+ --pf-v6-c-compass--section--slide--length--header: 100%;
12448
+ --pf-v6-c-compass--section--slide--length--sidebar: 100%;
12449
+ --pf-v6-c-compass--section--slide--length--main-footer: 100%;
12450
+ --pf-v6-c-compass--section--slide--length--footer: 100%;
12451
+ --pf-v6-c-compass--section--duration: var(--pf-t--global--motion--duration--fade--short);
12452
+ --pf-v6-c-compass--section--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
12453
+ --pf-v6-c-compass--section--TransitionDuration: var(--pf-v6-c-compass--section--duration), 0s, 0s, 0s, 0s, 0s;
12454
+ --pf-v6-c-compass--section--TransitionProperty: opacity, visibility, translate, height, width, margin;
12455
+ --pf-v6-c-compass--section--TransitionDelay: 0s, var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration);
12456
+ --pf-v6-c-compass--section--m-expanded--duration: var(--pf-t--global--motion--duration--fade--default);
12457
+ --pf-v6-c-compass--section--m-expanded--TransitionDuration: var(--pf-v6-c-compass--section--m-expanded--duration), 0s, 0s, 0s, 0s, 0s;
12458
+ --pf-v6-c-compass--section--m-expanded--TransitionDelay: 0s;
12459
+ }
12460
+ @media screen and (prefers-reduced-motion: no-preference) {
12461
+ .pf-v6-c-compass {
12462
+ --pf-v6-c-compass--section--TransitionDuration: var(--pf-v6-c-compass--section--duration), 0s, var(--pf-v6-c-compass--section--duration), 0s, 0s, 0s;
12463
+ --pf-v6-c-compass--section--TransitionDelay: 0s, var(--pf-v6-c-compass--section--duration), 0s, var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration);
12464
+ --pf-v6-c-compass--section--m-expanded--TransitionDuration: var(--pf-v6-c-compass--section--m-expanded--duration), 0s, var(--pf-v6-c-compass--section--m-expanded--duration), 0s, 0s, 0s;
12465
+ }
12466
+ .pf-v6-c-compass.pf-m-animate-smoothly {
12467
+ --pf-v6-c-compass--section--TransitionProperty: opacity, visibility, translate, height, width, margin;
12468
+ --pf-v6-c-compass--section--slide--length--header: 10rem;
12469
+ --pf-v6-c-compass--section--slide--length--sidebar: var(--pf-t--global--spacer--4xl);
12470
+ --pf-v6-c-compass--section--slide--length--main-footer: 6rem;
12471
+ --pf-v6-c-compass--section--slide--length--footer: 6rem;
12472
+ --pf-v6-c-compass--section--TransitionDuration: var(--pf-v6-c-compass--section--duration), 0s, var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration), var(--pf-v6-c-compass--section--duration);
12473
+ --pf-v6-c-compass--section--TransitionDelay: 0s, var(--pf-v6-c-compass--section--duration), 0s, 0s, 0s;
12474
+ --pf-v6-c-compass--section--m-expanded--TransitionDuration: var(--pf-v6-c-compass--section--m-expanded--duration), 0s, var(--pf-v6-c-compass--section--m-expanded--duration), var(--pf-v6-c-compass--section--m-expanded--duration), var(--pf-v6-c-compass--section--m-expanded--duration);
12475
+ }
12476
+ }
12477
+
12478
+ .pf-v6-c-compass {
12479
+ interpolate-size: allow-keywords;
12480
+ display: grid;
12481
+ grid-template-areas: "header header header" "sidebar-start main sidebar-end";
12482
+ grid-template-rows: auto 1fr;
12483
+ grid-template-columns: auto 1fr auto;
12484
+ grid-auto-rows: auto;
12485
+ align-items: center;
12486
+ justify-content: center;
12487
+ height: 100dvh;
12488
+ padding: var(--pf-v6-c-compass--Padding);
12489
+ overflow: hidden;
12490
+ background-image: var(--pf-v6-c-compass--BackgroundImage);
12491
+ background-size: cover;
12492
+ }
12493
+ :root:where(.pf-v6-theme-dark) .pf-v6-c-compass {
12494
+ --pf-v6-c-compass--BackgroundImage: var(--pf-v6-c-compass--BackgroundImage--dark);
12495
+ }
12496
+ .pf-v6-c-compass__panel.pf-m-no-glass, .pf-v6-c-compass.pf-m-no-glass {
12497
+ --pf-v6-c-compass__panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
12498
+ }
12499
+
12500
+ .pf-v6-c-compass__header,
12501
+ .pf-v6-c-compass__sidebar:is(.pf-m-start, .pf-m-end),
12502
+ .pf-v6-c-compass__main-footer,
12503
+ .pf-v6-c-compass__footer {
12504
+ margin: 0;
12505
+ visibility: hidden;
12506
+ opacity: 0;
12507
+ transition-delay: var(--pf-v6-c-compass--section--TransitionDelay);
12508
+ transition-timing-function: var(--pf-v6-c-compass--section--TransitionTimingFunction);
12509
+ transition-duration: var(--pf-v6-c-compass--section--TransitionDuration);
12510
+ transition-property: var(--pf-v6-c-compass--section--TransitionProperty);
12511
+ }
12512
+ .pf-v6-c-compass__header.pf-m-expanded,
12513
+ .pf-v6-c-compass__sidebar:is(.pf-m-start, .pf-m-end).pf-m-expanded,
12514
+ .pf-v6-c-compass__main-footer.pf-m-expanded,
12515
+ .pf-v6-c-compass__footer.pf-m-expanded {
12516
+ --pf-v6-c-compass--section--TransitionDelay: var(--pf-v6-c-compass--section--m-expanded--TransitionDelay);
12517
+ --pf-v6-c-compass--section--TransitionDuration: var(--pf-v6-c-compass--section--m-expanded--TransitionDuration);
12518
+ visibility: visible;
12519
+ opacity: 1;
12520
+ translate: 0;
12521
+ }
12522
+
12523
+ .pf-v6-c-compass__header,
12524
+ .pf-v6-c-compass__main-footer,
12525
+ .pf-v6-c-compass__footer {
12526
+ height: 0;
12527
+ }
12528
+ .pf-v6-c-compass__header.pf-m-expanded,
12529
+ .pf-v6-c-compass__main-footer.pf-m-expanded,
12530
+ .pf-v6-c-compass__footer.pf-m-expanded {
12531
+ height: auto;
12532
+ }
12533
+
12534
+ .pf-v6-c-compass__header {
12535
+ display: grid;
12536
+ grid-area: header;
12537
+ grid-template-columns: 1fr auto 1fr;
12538
+ align-items: start;
12539
+ translate: 0 calc(var(--pf-v6-c-compass--section--slide--length--header) * -1);
12540
+ }
12541
+ .pf-v6-c-compass__header.pf-m-expanded {
12542
+ margin-block-end: var(--pf-v6-c-compass--Gap);
12543
+ }
12544
+
12545
+ .pf-v6-c-compass__profile {
12546
+ justify-self: end;
12547
+ }
12548
+ .pf-v6-c-compass__profile .pf-v6-c-menu-toggle.pf-m-plain {
12549
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
12550
+ }
12551
+
12552
+ .pf-v6-c-compass__nav {
12553
+ --pf-v6-c-compass__panel--PaddingBlockStart: var(--pf-v6-c-compass__nav--PaddingBlockStart);
12554
+ --pf-v6-c-compass__panel--PaddingBlockEnd: var(--pf-v6-c-compass__nav--PaddingBlockEnd);
12555
+ --pf-v6-c-compass__panel--PaddingInlineStart: var(--pf-v6-c-compass__nav--PaddingInlineStart);
12556
+ --pf-v6-c-compass__panel--PaddingInlineEnd: var(--pf-v6-c-compass__nav--PaddingInlineEnd);
12557
+ display: flex;
12558
+ flex-direction: column;
12559
+ gap: var(--pf-v6-c-compass__nav--RowGap);
12560
+ align-items: center;
12561
+ justify-self: stretch;
12562
+ }
12563
+
12564
+ .pf-v6-c-compass__nav-content {
12565
+ display: flex;
12566
+ align-items: center;
12567
+ }
12568
+
12569
+ .pf-v6-c-compass__nav-main {
12570
+ padding-inline-start: var(--pf-v6-c-compass__nav-main--PaddingInlineStart);
12571
+ padding-inline-end: var(--pf-v6-c-compass__nav-main--PaddingInlineEnd);
12572
+ }
12573
+
12574
+ .pf-v6-c-compass__sidebar {
12575
+ --pf-v6-c-compass__panel--PaddingBlockStart: var(--pf-v6-c-compass__sidebar--PaddingBlockStart);
12576
+ --pf-v6-c-compass__panel--PaddingBlockEnd: var(--pf-v6-c-compass__sidebar--PaddingBlockEnd);
12577
+ --pf-v6-c-compass__panel--PaddingInlineStart: var(--pf-v6-c-compass__sidebar--PaddingInlineStart);
12578
+ --pf-v6-c-compass__panel--PaddingInlineEnd: var(--pf-v6-c-compass__sidebar--PaddingInlineEnd);
12579
+ display: flex;
12580
+ width: 0;
12581
+ }
12582
+ .pf-v6-c-compass__sidebar.pf-m-expanded {
12583
+ width: auto;
12584
+ }
12585
+ .pf-v6-c-compass__sidebar.pf-m-start {
12586
+ translate: calc(var(--pf-v6-c-compass--section--slide--length--sidebar) * -1);
12587
+ grid-area: sidebar-start;
12588
+ }
12589
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-compass__sidebar.pf-m-start {
12590
+ translate: var(--pf-v6-c-compass--section--slide--length--sidebar);
12591
+ }
12592
+
12593
+ .pf-v6-c-compass__sidebar.pf-m-start.pf-m-expanded {
12594
+ margin-inline-end: var(--pf-v6-c-compass--Gap);
12595
+ }
12596
+ .pf-v6-c-compass__sidebar.pf-m-end {
12597
+ translate: var(--pf-v6-c-compass--section--slide--length--sidebar);
12598
+ grid-area: sidebar-end;
12599
+ }
12600
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-compass__sidebar.pf-m-end {
12601
+ translate: calc(var(--pf-v6-c-compass--section--slide--length--sidebar) * -1);
12602
+ }
12603
+
12604
+ .pf-v6-c-compass__sidebar.pf-m-end.pf-m-expanded {
12605
+ margin-inline-start: var(--pf-v6-c-compass--Gap);
12606
+ }
12607
+
12608
+ .pf-v6-c-compass__main {
12609
+ display: flex;
12610
+ flex-direction: column;
12611
+ grid-area: main;
12612
+ gap: var(--pf-v6-c-compass__main--RowGap);
12613
+ align-self: stretch;
12614
+ min-height: 0;
12615
+ }
12616
+
12617
+ .pf-v6-c-compass__main-header-content {
12618
+ display: flex;
12619
+ gap: var(--pf-v6-c-compass__main-header-content--RowGap) var(--pf-v6-c-compass__main-header-content--ColumnGap);
12620
+ }
12621
+
12622
+ .pf-v6-c-compass__main-header-title {
12623
+ flex-grow: 1;
12624
+ }
12625
+
12626
+ .pf-v6-c-compass__content {
12627
+ display: flex;
12628
+ flex: 1 0 0;
12629
+ flex-direction: column;
12630
+ min-height: 0;
12631
+ overflow: auto;
12632
+ }
12633
+ .pf-v6-c-compass__content > *:last-child {
12634
+ flex-grow: 1;
12635
+ max-height: 100%;
12636
+ }
12637
+
12638
+ .pf-v6-c-compass__main-footer {
12639
+ display: flex;
12640
+ justify-content: center;
12641
+ min-height: 0;
12642
+ translate: 0 var(--pf-v6-c-compass--section--slide--length--main-footer);
12643
+ }
12644
+ .pf-v6-c-compass__main-footer.pf-m-expanded {
12645
+ margin-block-start: var(--pf-v6-c-compass__main-footer--MarginBlockStart);
12646
+ }
12647
+
12648
+ .pf-v6-c-compass__footer {
12649
+ display: flex;
12650
+ grid-column: 1/-1;
12651
+ justify-content: center;
12652
+ translate: 0 var(--pf-v6-c-compass--section--slide--length--main-footer);
12653
+ }
12654
+ .pf-v6-c-compass__footer.pf-m-expanded {
12655
+ margin-block-start: var(--pf-v6-c-compass--Gap);
12656
+ }
12657
+
12658
+ .pf-v6-c-compass__message-bar {
12659
+ width: var(--pf-v6-c-compass__message-bar--Width);
12660
+ min-width: var(--pf-v6-c-compass__message-bar--MinWidth);
12661
+ max-width: var(--pf-v6-c-compass__message-bar--MaxWidth);
12662
+ }
12663
+
12664
+ .pf-v6-c-compass__panel {
12665
+ padding-block-start: var(--pf-v6-c-compass__panel--PaddingBlockStart);
12666
+ padding-block-end: var(--pf-v6-c-compass__panel--PaddingBlockEnd);
12667
+ padding-inline-start: var(--pf-v6-c-compass__panel--PaddingInlineStart);
12668
+ padding-inline-end: var(--pf-v6-c-compass__panel--PaddingInlineEnd);
12669
+ background-color: var(--pf-v6-c-compass__panel--BackgroundColor);
12670
+ backdrop-filter: var(--pf-v6-c-compass__panel--BackdropFilter);
12671
+ border: var(--pf-v6-c-compass__panel--BorderWidth) solid var(--pf-v6-c-compass__panel--BorderColor);
12672
+ border-radius: var(--pf-v6-c-compass__panel--BorderRadius);
12673
+ box-shadow: var(--pf-v6-c-compass__panel--BoxShadow);
12674
+ }
12675
+ .pf-v6-c-compass__panel.pf-m-no-border {
12676
+ border-width: 0;
12677
+ }
12678
+ .pf-v6-c-compass__panel.pf-m-no-padding {
12679
+ padding: 0;
12680
+ }
12681
+ .pf-v6-c-compass__panel.pf-m-full-height {
12682
+ height: 100%;
12683
+ }
12684
+ .pf-v6-c-compass__panel.pf-m-pill {
12685
+ border-radius: var(--pf-v6-c-compass__panel--m-pill--BorderRadius);
12686
+ }
12687
+ .pf-v6-c-compass__panel.pf-m-scrollable {
12688
+ overflow: auto;
12689
+ }
12690
+
12691
+ /* stylelint-disable */
12692
+ @media (max-width: 1200px) {
12693
+ .pf-v6-c-compass * {
12694
+ display: none;
12695
+ }
12696
+ .pf-v6-c-compass {
12697
+ position: relative;
12698
+ display: grid;
12699
+ grid-template-columns: auto;
12700
+ grid-template-rows: auto;
12701
+ place-content: center;
12702
+ gap: 0;
12703
+ }
12704
+ .pf-v6-c-compass::after {
12705
+ padding: 1em;
12706
+ border-radius: var(--pf-t--global--border--radius--large);
12707
+ background: var(--pf-t--global--background--color--primary--default);
12708
+ content: "This page is optimized for wide screens.\a\aPlease view on a larger display and/or make your browser window wider.";
12709
+ width: 80%;
12710
+ width: 300px;
12711
+ border: 1px solid var(--pf-t--global--border--color--default);
12712
+ box-shadow: var(--pf-t--global--box-shadow--md);
12713
+ white-space: pre-wrap;
12714
+ text-align: center;
12715
+ }
12716
+ }
12717
+ /* stylelint-enable */
12273
12718
  :root {
12274
12719
  --pf-v6-c-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
12275
12720
  --pf-v6-c-content--LineHeight: var(--pf-t--global--font--line-height--body);
@@ -12964,7 +13409,8 @@ ul) {
12964
13409
  --pf-v6-c-data-list--sm--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
12965
13410
  --pf-v6-c-data-list--sm--BorderBlockStartColor: var(--pf-t--global--border--color--default);
12966
13411
  --pf-v6-c-data-list--MarginInlineStart: var(--pf-t--global--spacer--md);
12967
- --pf-v6-c-data-list__item--BackgroundColor: var( --pf-t--global--background--color--primary--default);
13412
+ --pf-v6-c-data-list__item--BackgroundColor: var(--pf-t--global--background--color--primary--default);
13413
+ --pf-v6-c-data-list--pf-m-plain__item--BackgroundColor: transparent;
12968
13414
  --pf-v6-c-data-list__item--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
12969
13415
  --pf-v6-c-data-list__item--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
12970
13416
  --pf-v6-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
@@ -13119,6 +13565,9 @@ ul) {
13119
13565
  .pf-v6-c-data-list.pf-m-drag-over {
13120
13566
  overflow-anchor: none;
13121
13567
  }
13568
+ .pf-v6-c-data-list.pf-m-plain {
13569
+ --pf-v6-c-data-list__item--BackgroundColor: var(--pf-v6-c-data-list--pf-m-plain__item--BackgroundColor);
13570
+ }
13122
13571
 
13123
13572
  .pf-v6-c-data-list.pf-m-truncate,
13124
13573
  .pf-v6-c-data-list__item-row.pf-m-truncate,
@@ -14526,6 +14975,7 @@ ul) {
14526
14975
  }
14527
14976
 
14528
14977
  .pf-v6-c-drawer {
14978
+ --pf-v6-c-drawer--m-pill--m-inline__main--Gap: var(--pf-t--global--spacer--inset--page-chrome);
14529
14979
  --pf-v6-c-drawer__section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
14530
14980
  --pf-v6-c-drawer__section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
14531
14981
  --pf-v6-c-drawer__content--FlexBasis: 100%;
@@ -14556,6 +15006,7 @@ ul) {
14556
15006
  --pf-v6-c-drawer__panel--TransitionProperty: opacity, visibility, transform;
14557
15007
  --pf-v6-c-drawer__panel--Opacity: 0;
14558
15008
  --pf-v6-c-drawer--m-expanded__panel--Opacity: 1;
15009
+ --pf-v6-c-drawer--m-expanded__panel--inset: 0px;
14559
15010
  --pf-v6-c-drawer__panel--FlexBasis: 100%;
14560
15011
  --pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
14561
15012
  --pf-v6-c-drawer__panel--md--FlexBasis: 50%;
@@ -14571,6 +15022,16 @@ ul) {
14571
15022
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--FlexDirection: column;
14572
15023
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--md--FlexBasis--min: 1.5rem;
14573
15024
  --pf-v6-c-drawer--m-panel-bottom__panel--m-resizable--MinHeight: 1.5rem;
15025
+ --pf-v6-c-drawer--m-pill__panel--BorderBlockStartWidth: var(--pf-t--global--border--width--regular);
15026
+ --pf-v6-c-drawer--m-pill__panel--BorderBlockEndWidth: var(--pf-t--global--border--width--regular);
15027
+ --pf-v6-c-drawer--m-pill__panel--BorderInlineStartWidth: var(--pf-t--global--border--width--regular);
15028
+ --pf-v6-c-drawer--m-pill__panel--BorderInlineEndWidth: var(--pf-t--global--border--width--regular);
15029
+ --pf-v6-c-drawer--m-pill__panel--BorderColor: var(--pf-t--global--border--color--default);
15030
+ --pf-v6-c-drawer--m-pill__panel--BorderRadius: var(--pf-t--global--border--radius--large);
15031
+ --pf-v6-c-drawer--m-pill--m-expanded__panel--inset: var(--pf-t--global--spacer--inset--page-chrome);
15032
+ --pf-v6-c-drawer__panel--m-glass--BackgroundColor: var(--pf-t--global--background--color--glass--default);
15033
+ --pf-v6-c-drawer__panel--m-glass--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
15034
+ --pf-v6-c-drawer__panel--m-glass--BorderColor: var(--pf-t--global--border--color--alt);
14574
15035
  --pf-v6-c-drawer__head--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
14575
15036
  --pf-v6-c-drawer__head--PaddingBlockStart: var(--pf-t--global--spacer--sm);
14576
15037
  --pf-v6-c-drawer__head--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -14687,6 +15148,8 @@ ul) {
14687
15148
  .pf-v6-c-drawer.pf-m-inline, .pf-v6-c-drawer.pf-m-static {
14688
15149
  --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-v6-c-drawer__panel--m-inline--BackgroundColor);
14689
15150
  --pf-v6-c-drawer__panel--BorderInlineStartWidth: var(--pf-v6-c-drawer--m-inline__panel--after--Width);
15151
+ --pf-v6-c-drawer--m-pill__main--Gap: var(--pf-v6-c-drawer--m-pill--m-inline__main--Gap);
15152
+ --pf-v6-c-drawer--m-pill--m-expanded__panel--inset: 0;
14690
15153
  }
14691
15154
  .pf-v6-c-drawer.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable), .pf-v6-c-drawer.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable) {
14692
15155
  padding-inline-start: var(--pf-v6-c-drawer--m-inline__panel--PaddingInlineStart);
@@ -14710,7 +15173,7 @@ ul) {
14710
15173
  --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDelay--expand--focus);
14711
15174
  }
14712
15175
  .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
14713
- transform: translateX(-100%);
15176
+ transform: translateX(calc(-100% - var(--pf-v6-c-drawer--m-expanded__panel--inset)));
14714
15177
  --pf-v6-c-drawer__panel--Opacity: var(--pf-v6-c-drawer--m-expanded__panel--Opacity);
14715
15178
  visibility: visible;
14716
15179
  }
@@ -14722,7 +15185,7 @@ ul) {
14722
15185
  transform: translateX(0);
14723
15186
  }
14724
15187
  .pf-v6-c-drawer.pf-m-expanded.pf-m-panel-bottom > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
14725
- transform: translate(0, -100%);
15188
+ transform: translate(0, calc(-100% - var(--pf-v6-c-drawer--m-expanded__panel--inset)));
14726
15189
  }
14727
15190
  .pf-v6-c-drawer.pf-m-resizing {
14728
15191
  --pf-v6-c-drawer__panel--TransitionProperty: none;
@@ -14731,6 +15194,26 @@ ul) {
14731
15194
  .pf-v6-c-drawer.pf-m-resizing .pf-v6-c-drawer__splitter {
14732
15195
  pointer-events: auto;
14733
15196
  }
15197
+ @media screen and (min-width: 48rem) {
15198
+ .pf-v6-c-drawer.pf-m-pill {
15199
+ --pf-v6-c-drawer__main--Gap: var(--pf-v6-c-drawer--m-pill__main--Gap, revert);
15200
+ --pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer--m-pill__panel--BorderColor);
15201
+ --pf-v6-c-drawer__panel--BorderRadius: var(--pf-v6-c-drawer--m-pill__panel--BorderRadius);
15202
+ --pf-v6-c-drawer--m-expanded__panel--inset: var(--pf-v6-c-drawer--m-pill--m-expanded__panel--inset);
15203
+ --pf-v6-c-drawer__panel--MarginBlock: var(--pf-v6-c-drawer--m-pill--m-expanded__panel--inset);
15204
+ }
15205
+ .pf-v6-c-drawer.pf-m-pill > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
15206
+ border-block-start-width: var(--pf-v6-c-drawer--m-pill__panel--BorderBlockStartWidth);
15207
+ border-block-end-width: var(--pf-v6-c-drawer--m-pill__panel--BorderBlockEndWidth);
15208
+ border-inline-start-width: var(--pf-v6-c-drawer--m-pill__panel--BorderInlineStartWidth);
15209
+ border-inline-end-width: var(--pf-v6-c-drawer--m-pill__panel--BorderInlineEndWidth);
15210
+ }
15211
+ .pf-v6-c-drawer.pf-m-pill > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-glass) {
15212
+ --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-v6-c-drawer__panel--m-glass--BackgroundColor);
15213
+ --pf-v6-c-drawer__panel--BorderColor: var(--pf-v6-c-drawer__panel--m-glass--BorderColor);
15214
+ backdrop-filter: var(--pf-v6-c-drawer__panel--m-glass--BackdropFilter);
15215
+ }
15216
+ }
14734
15217
 
14735
15218
  .pf-v6-c-drawer__section {
14736
15219
  flex-grow: 0;
@@ -14746,6 +15229,7 @@ ul) {
14746
15229
  .pf-v6-c-drawer__main {
14747
15230
  display: flex;
14748
15231
  flex: 1;
15232
+ gap: var(--pf-v6-c-drawer__main--Gap, 0);
14749
15233
  overflow: hidden;
14750
15234
  }
14751
15235
 
@@ -14784,6 +15268,8 @@ ul) {
14784
15268
  row-gap: var(--pf-v6-c-drawer__panel--RowGap);
14785
15269
  order: 1;
14786
15270
  max-height: var(--pf-v6-c-drawer__panel--MaxHeight);
15271
+ margin-block: var(--pf-v6-c-drawer__panel--MarginBlock, revert);
15272
+ margin-inline: var(--pf-v6-c-drawer__panel--MarginInline, revert);
14787
15273
  overflow: auto;
14788
15274
  visibility: hidden;
14789
15275
  background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
@@ -14792,6 +15278,7 @@ ul) {
14792
15278
  border-block-end-width: var(--pf-v6-c-drawer__panel--BorderBlockEndWidth);
14793
15279
  border-inline-start-width: var(--pf-v6-c-drawer__panel--BorderInlineStartWidth);
14794
15280
  border-inline-end-width: var(--pf-v6-c-drawer__panel--BorderInlineEndWidth);
15281
+ border-radius: var(--pf-v6-c-drawer__panel--BorderRadius, revert);
14795
15282
  box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
14796
15283
  opacity: var(--pf-v6-c-drawer__panel--Opacity);
14797
15284
  transition-delay: var(--pf-v6-c-drawer__panel--TransitionDelay);
@@ -14979,7 +15466,7 @@ ul) {
14979
15466
  padding-inline-end: var(--pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd);
14980
15467
  }
14981
15468
  .pf-v6-c-drawer.pf-m-panel-left.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
14982
- transform: translateX(0);
15469
+ transform: translateX(var(--pf-v6-c-drawer--m-expanded__panel--inset));
14983
15470
  }
14984
15471
  .pf-v6-c-drawer.pf-m-panel-left > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable > .pf-v6-c-drawer__splitter {
14985
15472
  --pf-v6-c-drawer__splitter-handle--InsetInlineStart: var(--pf-v6-c-drawer--m-panel-left__splitter-handle--InsetInlineStart);
@@ -14991,6 +15478,8 @@ ul) {
14991
15478
  --pf-v6-c-drawer__panel--FlexBasis--min: var(--pf-v6-c-drawer--m-panel-bottom__panel--FlexBasis--min);
14992
15479
  --pf-v6-c-drawer__panel--BorderInlineStartWidth: 0;
14993
15480
  --pf-v6-c-drawer__panel--BorderBlockStartWidth: var(--pf-v6-c-drawer--m-panel-bottom__panel--after--Height);
15481
+ --pf-v6-c-drawer__panel--MarginBlock: initial;
15482
+ --pf-v6-c-drawer__panel--MarginInline: var(--pf-v6-c-drawer--m-expanded__panel--inset);
14994
15483
  min-width: auto;
14995
15484
  min-height: var(--pf-v6-c-drawer--m-panel-bottom__panel--md--MinHeight);
14996
15485
  }
@@ -15545,6 +16034,9 @@ ul) {
15545
16034
  --pf-v6-c-expandable-section__content--Opacity: 0;
15546
16035
  --pf-v6-c-expandable-section__content--TranslateY: 0;
15547
16036
  --pf-v6-c-expandable-section__content--PaddingInlineStart: 0;
16037
+ --pf-v6-c-expandable-section__content--MaxHeight: 0px;
16038
+ --pf-v6-c-expandable-section__content--Visibility: hidden;
16039
+ --pf-v6-c-expandable-section__content--Opacity: 0;
15548
16040
  --pf-v6-c-expandable-section--m-expand-top__content--TranslateY: 0;
15549
16041
  --pf-v6-c-expandable-section--m-expand-bottom__content--TranslateY: 0;
15550
16042
  --pf-v6-c-expandable-section--m-expanded__content--Opacity: 1;
@@ -16653,81 +17145,6 @@ ul) {
16653
17145
  pointer-events: none;
16654
17146
  }
16655
17147
 
16656
- .pf-v6-c-hint {
16657
- --pf-v6-c-hint--GridRowGap: var(--pf-t--global--spacer--sm);
16658
- --pf-v6-c-hint--PaddingBlockStart: var(--pf-t--global--spacer--lg);
16659
- --pf-v6-c-hint--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
16660
- --pf-v6-c-hint--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
16661
- --pf-v6-c-hint--PaddingInlineStart: var(--pf-t--global--spacer--lg);
16662
- --pf-v6-c-hint--BackgroundColor: var(--pf-t--global--background--color--primary--default);
16663
- --pf-v6-c-hint--BorderColor: var(--pf-t--global--border--color--status--info--default);
16664
- --pf-v6-c-hint--BorderWidth: var(--pf-t--global--border--width--box--status--default);
16665
- --pf-v6-c-hint--BorderRadius: var(--pf-t--global--border--radius--medium);
16666
- --pf-v6-c-hint--Color: var(--pf-t--global--text--color--regular);
16667
- --pf-v6-c-hint__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
16668
- --pf-v6-c-hint__body--FontSize: var(--pf-t--global--font--size--body--default);
16669
- --pf-v6-c-hint__footer--MarginBlockStart: var(--pf-t--global--spacer--sm);
16670
- --pf-v6-c-hint__footer--child--MarginInlineEnd: var(--pf-t--global--spacer--md);
16671
- --pf-v6-c-hint__actions--MarginInlineStart: var(--pf-t--global--spacer--2xl);
16672
- --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
16673
- --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
16674
- }
16675
-
16676
- .pf-v6-c-hint {
16677
- display: grid;
16678
- grid-template-columns: 1fr auto;
16679
- grid-row-gap: var(--pf-v6-c-hint--GridRowGap);
16680
- padding-block-start: var(--pf-v6-c-hint--PaddingBlockStart);
16681
- padding-block-end: var(--pf-v6-c-hint--PaddingBlockEnd);
16682
- padding-inline-start: var(--pf-v6-c-hint--PaddingInlineStart);
16683
- padding-inline-end: var(--pf-v6-c-hint--PaddingInlineEnd);
16684
- color: var(--pf-v6-c-hint--Color);
16685
- background-color: var(--pf-v6-c-hint--BackgroundColor);
16686
- border: var(--pf-v6-c-hint--BorderWidth) solid var(--pf-v6-c-hint--BorderColor);
16687
- border-radius: var(--pf-v6-c-hint--BorderRadius);
16688
- }
16689
- .pf-v6-c-hint .pf-v6-c-button.pf-m-link.pf-m-inline {
16690
- text-align: start;
16691
- white-space: normal;
16692
- }
16693
-
16694
- .pf-v6-c-hint__actions {
16695
- display: inline-grid;
16696
- grid-row: 1;
16697
- grid-column: 2;
16698
- grid-auto-flow: column;
16699
- align-self: start;
16700
- margin-block-start: var(--pf-v6-c-hint__actions--c-menu-toggle--MarginBlockStart);
16701
- margin-block-end: var(--pf-v6-c-hint__actions--c-menu-toggle--MarginBlockEnd);
16702
- margin-inline-start: var(--pf-v6-c-hint__actions--MarginInlineStart);
16703
- text-align: end;
16704
- }
16705
- .pf-v6-c-hint__actions.pf-m-no-offset {
16706
- --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockStart: 0;
16707
- --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockEnd: 0;
16708
- }
16709
- .pf-v6-c-hint__actions + .pf-v6-c-hint__body {
16710
- grid-column: 1;
16711
- }
16712
-
16713
- .pf-v6-c-hint__title {
16714
- align-self: center;
16715
- font-weight: var(--pf-v6-c-hint__title--FontWeight);
16716
- }
16717
-
16718
- .pf-v6-c-hint__body {
16719
- grid-column: 1/-1;
16720
- font-size: var(--pf-v6-c-hint__body--FontSize);
16721
- }
16722
-
16723
- .pf-v6-c-hint__footer {
16724
- grid-column: 1/-1;
16725
- margin-block-start: var(--pf-v6-c-hint__footer--MarginBlockStart);
16726
- }
16727
- .pf-v6-c-hint__footer > :not(:last-child) {
16728
- margin-inline-end: var(--pf-v6-c-hint__footer--child--MarginInlineEnd);
16729
- }
16730
-
16731
17148
  .pf-v6-c-helper-text {
16732
17149
  --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
16733
17150
  --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
@@ -16813,6 +17230,156 @@ ul) {
16813
17230
  color: var(--pf-v6-c-helper-text__item-text--Color);
16814
17231
  }
16815
17232
 
17233
+ .pf-v6-c-hero {
17234
+ --pf-v6-c-hero--PaddingBlockStart: var(--pf-t--global--spacer--xl);
17235
+ --pf-v6-c-hero--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
17236
+ --pf-v6-c-hero--PaddingInlineStart: var(--pf-t--global--spacer--3xl);
17237
+ --pf-v6-c-hero--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
17238
+ --pf-v6-c-hero--gradient--angle: 109deg;
17239
+ --pf-v6-c-hero--gradient--stop-1--light: transparent;
17240
+ --pf-v6-c-hero--gradient--stop-2--light: transparent;
17241
+ --pf-v6-c-hero--gradient--stop-3--light: transparent;
17242
+ --pf-v6-c-hero--gradient--stop-1--dark: transparent;
17243
+ --pf-v6-c-hero--gradient--stop-2--dark: transparent;
17244
+ --pf-v6-c-hero--gradient--stop-3--dark: transparent;
17245
+ --pf-v6-c-hero--BackgroundColor: var(--pf-t--global--background--color--glass--default);
17246
+ --pf-v6-c-hero--BackdropFilter: var(--pf-t--global--background--color--glass--filter);
17247
+ --pf-v6-c-hero--BackgroundImage--light: none;
17248
+ --pf-v6-c-hero--BackgroundImage--dark: none;
17249
+ --pf-v6-c-hero--BackgroundRepeat: no-repeat;
17250
+ --pf-v6-c-hero--BackgroundPosition: right center;
17251
+ --pf-v6-c-hero--BackgroundSize: contain;
17252
+ --pf-v6-c-hero--BorderStyle: solid;
17253
+ --pf-v6-c-hero--BorderBlockStartWidth: var(--pf-t--global--border--width--regular);
17254
+ --pf-v6-c-hero--BorderBlockEndWidth: var(--pf-t--global--border--width--regular);
17255
+ --pf-v6-c-hero--BorderInlineStartWidth: var(--pf-t--global--border--width--regular);
17256
+ --pf-v6-c-hero--BorderInlineEndWidth: var(--pf-t--global--border--width--regular);
17257
+ --pf-v6-c-hero--BorderColor: var(--pf-t--global--border--color--default);
17258
+ --pf-v6-c-hero--m-glass--BorderColor: var(--pf-t--global--border--color--alt);
17259
+ --pf-v6-c-hero--m-glass--BoxShadow: var(--pf-t--global--box-shadow--md);
17260
+ --pf-v6-c-hero--BorderStartStartRadius: 24px;
17261
+ --pf-v6-c-hero--BorderStartEndRadius: 72px;
17262
+ --pf-v6-c-hero--BorderEndEndRadius: 24px;
17263
+ --pf-v6-c-hero--BorderEndStartRadius: 72px;
17264
+ --pf-v6-c-hero__body--Width: 800px;
17265
+ --pf-v6-c-hero__body--MaxWidth: 80%;
17266
+ }
17267
+
17268
+ .pf-v6-c-hero {
17269
+ display: flex;
17270
+ padding-block-start: var(--pf-v6-c-hero--PaddingBlockStart);
17271
+ padding-block-end: var(--pf-v6-c-hero--PaddingBlockEnd);
17272
+ padding-inline-start: var(--pf-v6-c-hero--PaddingInlineStart);
17273
+ padding-inline-end: var(--pf-v6-c-hero--PaddingInlineEnd);
17274
+ background-image: var(--pf-v6-c-hero--BackgroundImage, var(--pf-v6-c-hero--BackgroundImage--light)), linear-gradient(var(--pf-v6-c-hero--gradient--angle), var(--pf-v6-c-hero--gradient--stop-1, var(--pf-v6-c-hero--gradient--stop-1--light)) 0%, var(--pf-v6-c-hero--gradient--stop-2, var(--pf-v6-c-hero--gradient--stop-2--light)) 50%, var(--pf-v6-c-hero--gradient--stop-3, var(--pf-v6-c-hero--gradient--stop-3--light)) 100%);
17275
+ background-repeat: var(--pf-v6-c-hero--BackgroundRepeat);
17276
+ background-position: var(--pf-v6-c-hero--BackgroundPosition);
17277
+ background-size: var(--pf-v6-c-hero--BackgroundSize);
17278
+ border-color: var(--pf-v6-c-hero--BorderColor);
17279
+ border-style: var(--pf-v6-c-hero--BorderStyle);
17280
+ border-block-start-width: var(--pf-v6-c-hero--BorderBlockStartWidth);
17281
+ border-block-end-width: var(--pf-v6-c-hero--BorderBlockEndWidth);
17282
+ border-inline-start-width: var(--pf-v6-c-hero--BorderInlineStartWidth);
17283
+ border-inline-end-width: var(--pf-v6-c-hero--BorderInlineEndWidth);
17284
+ border-start-start-radius: var(--pf-v6-c-hero--BorderStartStartRadius);
17285
+ border-start-end-radius: var(--pf-v6-c-hero--BorderStartEndRadius);
17286
+ border-end-start-radius: var(--pf-v6-c-hero--BorderEndStartRadius);
17287
+ border-end-end-radius: var(--pf-v6-c-hero--BorderEndEndRadius);
17288
+ }
17289
+ :root:where(.pf-v6-theme-dark) .pf-v6-c-hero {
17290
+ --pf-v6-c-hero--BackgroundImage: var(--pf-v6-c-hero--BackgroundImage--dark);
17291
+ --pf-v6-c-hero--gradient--stop-1: var(--pf-v6-c-hero--gradient--stop-1--dark);
17292
+ --pf-v6-c-hero--gradient--stop-2: var(--pf-v6-c-hero--gradient--stop-2--dark);
17293
+ --pf-v6-c-hero--gradient--stop-3: var(--pf-v6-c-hero--gradient--stop-3--dark);
17294
+ }
17295
+ :root:where(.pf-v6-theme-glass) .pf-v6-c-hero {
17296
+ --pf-v6-c-hero--BorderColor: var(--pf-v6-c-hero--m-glass--BorderColor);
17297
+ box-shadow: var(--pf-v6-c-hero--m-glass--BoxShadow);
17298
+ }
17299
+ .pf-v6-c-hero:not(.pf-m-no-glass) {
17300
+ background-color: var(--pf-v6-c-hero--BackgroundColor);
17301
+ backdrop-filter: var(--pf-v6-c-hero--BackdropFilter);
17302
+ }
17303
+
17304
+ .pf-v6-c-hero__body {
17305
+ width: min(var(--pf-v6-c-hero__body--Width), var(--pf-v6-c-hero__body--MaxWidth));
17306
+ }
17307
+
17308
+ .pf-v6-c-hint {
17309
+ --pf-v6-c-hint--GridRowGap: var(--pf-t--global--spacer--sm);
17310
+ --pf-v6-c-hint--PaddingBlockStart: var(--pf-t--global--spacer--lg);
17311
+ --pf-v6-c-hint--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
17312
+ --pf-v6-c-hint--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
17313
+ --pf-v6-c-hint--PaddingInlineStart: var(--pf-t--global--spacer--lg);
17314
+ --pf-v6-c-hint--BackgroundColor: var(--pf-t--global--background--color--primary--default);
17315
+ --pf-v6-c-hint--BorderColor: var(--pf-t--global--border--color--status--info--default);
17316
+ --pf-v6-c-hint--BorderWidth: var(--pf-t--global--border--width--box--status--default);
17317
+ --pf-v6-c-hint--BorderRadius: var(--pf-t--global--border--radius--medium);
17318
+ --pf-v6-c-hint--Color: var(--pf-t--global--text--color--regular);
17319
+ --pf-v6-c-hint__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
17320
+ --pf-v6-c-hint__body--FontSize: var(--pf-t--global--font--size--body--default);
17321
+ --pf-v6-c-hint__footer--MarginBlockStart: var(--pf-t--global--spacer--sm);
17322
+ --pf-v6-c-hint__footer--child--MarginInlineEnd: var(--pf-t--global--spacer--md);
17323
+ --pf-v6-c-hint__actions--MarginInlineStart: var(--pf-t--global--spacer--2xl);
17324
+ --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
17325
+ --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
17326
+ }
17327
+
17328
+ .pf-v6-c-hint {
17329
+ display: grid;
17330
+ grid-template-columns: 1fr auto;
17331
+ grid-row-gap: var(--pf-v6-c-hint--GridRowGap);
17332
+ padding-block-start: var(--pf-v6-c-hint--PaddingBlockStart);
17333
+ padding-block-end: var(--pf-v6-c-hint--PaddingBlockEnd);
17334
+ padding-inline-start: var(--pf-v6-c-hint--PaddingInlineStart);
17335
+ padding-inline-end: var(--pf-v6-c-hint--PaddingInlineEnd);
17336
+ color: var(--pf-v6-c-hint--Color);
17337
+ background-color: var(--pf-v6-c-hint--BackgroundColor);
17338
+ border: var(--pf-v6-c-hint--BorderWidth) solid var(--pf-v6-c-hint--BorderColor);
17339
+ border-radius: var(--pf-v6-c-hint--BorderRadius);
17340
+ }
17341
+ .pf-v6-c-hint .pf-v6-c-button.pf-m-link.pf-m-inline {
17342
+ text-align: start;
17343
+ white-space: normal;
17344
+ }
17345
+
17346
+ .pf-v6-c-hint__actions {
17347
+ display: inline-grid;
17348
+ grid-row: 1;
17349
+ grid-column: 2;
17350
+ grid-auto-flow: column;
17351
+ align-self: start;
17352
+ margin-block-start: var(--pf-v6-c-hint__actions--c-menu-toggle--MarginBlockStart);
17353
+ margin-block-end: var(--pf-v6-c-hint__actions--c-menu-toggle--MarginBlockEnd);
17354
+ margin-inline-start: var(--pf-v6-c-hint__actions--MarginInlineStart);
17355
+ text-align: end;
17356
+ }
17357
+ .pf-v6-c-hint__actions.pf-m-no-offset {
17358
+ --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockStart: 0;
17359
+ --pf-v6-c-hint__actions--c-menu-toggle--MarginBlockEnd: 0;
17360
+ }
17361
+ .pf-v6-c-hint__actions + .pf-v6-c-hint__body {
17362
+ grid-column: 1;
17363
+ }
17364
+
17365
+ .pf-v6-c-hint__title {
17366
+ align-self: center;
17367
+ font-weight: var(--pf-v6-c-hint__title--FontWeight);
17368
+ }
17369
+
17370
+ .pf-v6-c-hint__body {
17371
+ grid-column: 1/-1;
17372
+ font-size: var(--pf-v6-c-hint__body--FontSize);
17373
+ }
17374
+
17375
+ .pf-v6-c-hint__footer {
17376
+ grid-column: 1/-1;
17377
+ margin-block-start: var(--pf-v6-c-hint__footer--MarginBlockStart);
17378
+ }
17379
+ .pf-v6-c-hint__footer > :not(:last-child) {
17380
+ margin-inline-end: var(--pf-v6-c-hint__footer--child--MarginInlineEnd);
17381
+ }
17382
+
16816
17383
  .pf-v6-c-icon {
16817
17384
  --pf-v6-c-icon--Width: var(--pf-t--global--icon--size--font--body--default);
16818
17385
  --pf-v6-c-icon--Height: var(--pf-t--global--icon--size--font--body--default);
@@ -19826,6 +20393,7 @@ ul.pf-v6-c-list {
19826
20393
  --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
19827
20394
  --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
19828
20395
  --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
20396
+ --pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
19829
20397
  --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
19830
20398
  --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
19831
20399
  --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
@@ -19954,6 +20522,9 @@ ul.pf-v6-c-list {
19954
20522
  --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
19955
20523
  --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
19956
20524
  }
20525
+ .pf-v6-c-menu-toggle.pf-m-plain.pf-m-circle {
20526
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius);
20527
+ }
19957
20528
  .pf-v6-c-menu-toggle.pf-m-plain::before {
19958
20529
  --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
19959
20530
  --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
@@ -26633,6 +27204,9 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
26633
27204
  .pf-v6-c-table:not(.pf-m-sticky-header) > .pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:last-child) td:where(.pf-v6-c-table__td):not([rowspan]) {
26634
27205
  --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockEnd);
26635
27206
  }
27207
+ .pf-v6-c-table.pf-m-plain {
27208
+ --pf-v6-c-table--BackgroundColor: transparent;
27209
+ }
26636
27210
  .pf-v6-c-table.pf-m-striped:not(.pf-m-expandable) > tbody:where(.pf-v6-c-table__tbody) > tr:where(.pf-v6-c-table__tr):nth-child(odd), .pf-v6-c-table.pf-m-striped.pf-m-expandable > tbody:where(.pf-v6-c-table__tbody):nth-of-type(odd) > tr:where(.pf-v6-c-table__tr),
26637
27211
  .pf-v6-c-table > .pf-m-striped > tr:nth-child(odd),
26638
27212
  .pf-v6-c-table > .pf-m-striped-even > tr:nth-child(even),
@@ -28470,6 +29044,9 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
28470
29044
  --pf-v6-c-tabs__add--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
28471
29045
  --pf-v6-c-tabs__add--PaddingInlineStart: var(--pf-t--global--spacer--sm);
28472
29046
  --pf-v6-c-tabs__add--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
29047
+ --pf-v6-c-tabs--m-nav__link--BorderRadius: var(--pf-t--global--border--radius--pill);
29048
+ --pf-v6-c-tabs--m-nav__link--disabled--Color: var(--pf-t--global--text--color--disabled);
29049
+ --pf-v6-c-tabs--m-nav--m-subtab__scroll-button--button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
28473
29050
  --pf-v6-c-tabs__link-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
28474
29051
  --pf-v6-c-tabs__link-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
28475
29052
  --pf-v6-c-tabs__link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
@@ -28747,6 +29324,18 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
28747
29324
  .pf-v6-c-tabs.pf-m-overflow .pf-v6-c-tabs__list {
28748
29325
  overflow: visible;
28749
29326
  }
29327
+ .pf-v6-c-tabs.pf-m-nav {
29328
+ --pf-v6-c-tabs__link--disabled--BackgroundColor: transparent;
29329
+ --pf-v6-c-tabs__link--disabled--Color: var(--pf-v6-c-tabs--m-nav__link--disabled--Color);
29330
+ --pf-v6-c-tabs__link--BorderRadius: var(--pf-v6-c-tabs--m-nav__link--BorderRadius);
29331
+ }
29332
+ .pf-v6-c-tabs.pf-m-nav::before,
29333
+ .pf-v6-c-tabs.pf-m-nav .pf-v6-c-tabs__link::before {
29334
+ border: 0;
29335
+ }
29336
+ .pf-v6-c-tabs.pf-m-nav.pf-m-subtab .pf-v6-c-tabs__scroll-button .pf-v6-c-button {
29337
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-tabs--m-nav--m-subtab__scroll-button--button--FontSize);
29338
+ }
28750
29339
 
28751
29340
  .pf-v6-c-tabs__toggle {
28752
29341
  display: var(--pf-v6-c-tabs__toggle--Display);
@@ -28796,7 +29385,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
28796
29385
  }
28797
29386
  .pf-v6-c-tabs__item.pf-m-current {
28798
29387
  --pf-v6-c-tabs__link--Color: var(--pf-v6-c-tabs__item--m-current__link--Color);
28799
- --pf-v6-c-tabs__link--after--BorderColor: var(--pf-v6-c-tabs__item--m-current__link--after--BorderColor);
29388
+ --pf-v6-c-tabs__link--after--BorderColor: var(--pf-v6-c-tabs--link-accent--color);
28800
29389
  --pf-v6-c-tabs__link--after--BorderWidth: var(--pf-v6-c-tabs__item--m-current__link--after--BorderWidth);
28801
29390
  --pf-v6-c-tabs__item--BackgroundColor: var(--pf-v6-c-tabs__item--m-current--BackgroundColor);
28802
29391
  }