@patternfly/react-templates 6.0.0-alpha.24 → 6.0.0-alpha.26

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.
@@ -2035,7 +2035,10 @@ button.pf-v6-c-breadcrumb__link {
2035
2035
  }
2036
2036
 
2037
2037
  :where(:root, .pf-v6-c-button) {
2038
- --pf-v6-c-button--Display: inline-block;
2038
+ --pf-v6-c-button--Display: inline-flex;
2039
+ --pf-v6-c-button--AlignItems: baseline;
2040
+ --pf-v6-c-button--JustifyContent: center;
2041
+ --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
2039
2042
  --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2040
2043
  --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2041
2044
  --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -2116,6 +2119,7 @@ button.pf-v6-c-breadcrumb__link {
2116
2119
  --pf-v6-c-button--m-link--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
2117
2120
  --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2118
2121
  --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
2122
+ --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
2119
2123
  --pf-v6-c-button--m-link--m-inline--FontSize: initial;
2120
2124
  --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
2121
2125
  --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
@@ -2128,6 +2132,9 @@ button.pf-v6-c-breadcrumb__link {
2128
2132
  --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));
2129
2133
  --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
2130
2134
  --pf-v6-c-button--m-link--m-inline--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
2135
+ --pf-v6-c-button--span--m-link--m-inline--Display: inline;
2136
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--xs);
2137
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--xs);
2131
2138
  --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
2132
2139
  --pf-v6-c-button--m-plain--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2133
2140
  --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
@@ -2140,7 +2147,8 @@ button.pf-v6-c-breadcrumb__link {
2140
2147
  --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2141
2148
  --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
2142
2149
  --pf-v6-c-button--m-plain--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2143
- --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--icon--color--disabled);
2150
+ --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
2151
+ --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
2144
2152
  --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
2145
2153
  --pf-v6-c-button--m-plain--m-small--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2146
2154
  --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
@@ -2235,8 +2243,10 @@ button.pf-v6-c-breadcrumb__link {
2235
2243
  --pf-v6-c-button__icon--Color: var(--pf-t--global--icon--color--regular);
2236
2244
  --pf-v6-c-button--hover__icon--Color: var(--pf-t--global--icon--color--regular);
2237
2245
  --pf-v6-c-button--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
2238
- --pf-v6-c-button__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--xs);
2239
- --pf-v6-c-button__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--xs);
2246
+ --pf-v6-c-button__icon--MarginInlineStart: 0;
2247
+ --pf-v6-c-button__icon--MarginInlineEnd: 0;
2248
+ --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
2249
+ --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
2240
2250
  --pf-v6-c-button__progress--width: calc(var(--pf-v6-c-spinner--m-md--diameter) + var(--pf-t--global--spacer--sm));
2241
2251
  --pf-v6-c-button__progress--Opacity: 0;
2242
2252
  --pf-v6-c-button__progress--TranslateY: -50%;
@@ -2251,16 +2261,17 @@ button.pf-v6-c-breadcrumb__link {
2251
2261
  --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-v6-c-spinner--Color);
2252
2262
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
2253
2263
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
2254
- --pf-v6-c-button__count--MarginInlineStart: var(--pf-t--global--spacer--sm);
2255
2264
  --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
2265
+ --pf-v6-c-button--m-block--Display: flex;
2266
+ --pf-v6-c-button--m-block--Width: 100%;
2256
2267
  }
2257
2268
 
2258
2269
  .pf-v6-c-button {
2259
2270
  position: relative;
2260
2271
  display: var(--pf-v6-c-button--Display);
2261
- flex: var(--pf-v6-c-button--Flex, initial);
2262
- align-items: var(--pf-v6-c-button--AlignItems, initial);
2263
- justify-content: var(--pf-v6-c-button--JustifyContent, initial);
2272
+ gap: var(--pf-v6-c-button--Gap);
2273
+ align-items: var(--pf-v6-c-button--AlignItems);
2274
+ justify-content: var(--pf-v6-c-button--JustifyContent);
2264
2275
  padding-block-start: var(--pf-v6-c-button--PaddingBlockStart);
2265
2276
  padding-block-end: var(--pf-v6-c-button--PaddingBlockEnd);
2266
2277
  padding-inline-start: var(--pf-v6-c-button--PaddingInlineStart);
@@ -2367,6 +2378,7 @@ button.pf-v6-c-breadcrumb__link {
2367
2378
  }
2368
2379
 
2369
2380
  .pf-v6-c-button.pf-m-link.pf-m-inline {
2381
+ --pf-v6-c-button--Display: var(--pf-v6-c-button--m-link--m-inline--Display);
2370
2382
  --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-link--m-inline--FontSize);
2371
2383
  --pf-v6-c-button--LineHeight: var(--pf-v6-c-button--m-link--m-inline--LineHeight);
2372
2384
  --pf-v6-c-button--FontWeight: var(--pf-v6-c-button--m-link--m-inline--FontWeight);
@@ -2382,12 +2394,17 @@ button.pf-v6-c-breadcrumb__link {
2382
2394
  --pf-v6-c-button--disabled--BackgroundColor: transparent;
2383
2395
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-link--m-inline--disabled--Color);
2384
2396
  --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-link--m-inline--disabled__icon--Color);
2385
- display: inline;
2386
2397
  text-align: start;
2387
2398
  white-space: normal;
2388
2399
  outline-offset: 0.125rem;
2389
2400
  }
2390
2401
 
2402
+ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2403
+ --pf-v6-c-button--m-link--m-inline--Display: var(--pf-v6-c-button--span--m-link--m-inline--Display);
2404
+ --pf-v6-c-button__icon--m-start--MarginInlineEnd: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd);
2405
+ --pf-v6-c-button__icon--m-end--MarginInlineStart: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart);
2406
+ }
2407
+
2391
2408
  .pf-v6-c-button.pf-m-link.pf-m-danger {
2392
2409
  --pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-link--m-danger--Color);
2393
2410
  --pf-v6-c-button--m-danger--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--BackgroundColor);
@@ -2502,6 +2519,7 @@ button.pf-v6-c-breadcrumb__link {
2502
2519
  --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-plain--m-clicked--Color);
2503
2520
  --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-plain--m-clicked--BackgroundColor);
2504
2521
  --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-plain--disabled--Color);
2522
+ --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-plain--disabled__icon--Color);
2505
2523
  --pf-v6-c-button--disabled--BackgroundColor: var(--pf-v6-c-button--m-plain--disabled--BackgroundColor);
2506
2524
  --pf-v6-c-button--m-small--PaddingBlockStart: var(--pf-v6-c-button--m-plain--m-small--PaddingBlockStart);
2507
2525
  --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineEnd);
@@ -2522,8 +2540,8 @@ button.pf-v6-c-breadcrumb__link {
2522
2540
  }
2523
2541
 
2524
2542
  .pf-v6-c-button.pf-m-block {
2525
- display: block;
2526
- width: 100%;
2543
+ --pf-v6-c-button--Display: var(--pf-v6-c-button--m-block--Display);
2544
+ width: var(--pf-v6-c-button--m-block--Width);
2527
2545
  }
2528
2546
 
2529
2547
  .pf-v6-c-button.pf-m-small {
@@ -2604,15 +2622,17 @@ button.pf-v6-c-breadcrumb__link {
2604
2622
  }
2605
2623
 
2606
2624
  .pf-v6-c-button__icon {
2625
+ margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
2626
+ margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
2607
2627
  color: var(--pf-v6-c-button__icon--Color);
2608
2628
  }
2609
2629
 
2610
2630
  .pf-v6-c-button__icon.pf-m-start {
2611
- margin-inline-end: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
2631
+ --pf-v6-c-button__icon--MarginInlineEnd: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
2612
2632
  }
2613
2633
 
2614
2634
  .pf-v6-c-button__icon.pf-m-end {
2615
- margin-inline-start: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
2635
+ --pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
2616
2636
  }
2617
2637
 
2618
2638
  .pf-v6-c-button__progress {
@@ -2631,7 +2651,6 @@ button.pf-v6-c-breadcrumb__link {
2631
2651
  .pf-v6-c-button__count {
2632
2652
  display: inline-flex;
2633
2653
  align-items: center;
2634
- margin-inline-start: var(--pf-v6-c-button__count--MarginInlineStart);
2635
2654
  }
2636
2655
 
2637
2656
  :where(:root, .pf-v6-c-calendar-month) {
@@ -3225,18 +3244,15 @@ button.pf-v6-c-breadcrumb__link {
3225
3244
  --pf-v6-c-clipboard-copy__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
3226
3245
  --pf-v6-c-clipboard-copy__expandable-content--OutlineOffset: var(--pf-t--global--spacer--xs);
3227
3246
  --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--xs);
3228
- --pf-v6-c-clipboard-copy--m-inline--PaddingBlockStart: 0;
3229
- --pf-v6-c-clipboard-copy--m-inline--PaddingBlockEnd: 0;
3230
3247
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart: var(--pf-t--global--spacer--xs);
3248
+ --pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
3231
3249
  --pf-v6-c-clipboard-copy--m-inline--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
3250
+ --pf-v6-c-clipboard-copy__actions--Gap: var(--pf-t--global--spacer--sm);
3251
+ --pf-v6-c-clipboard-copy__actions--MarginInlineStart: var(--pf-t--global--spacer--xs);
3252
+ --pf-v6-c-clipboard-copy__actions-item--button--Color: var(--pf-t--global--icon--color--subtle);
3253
+ --pf-v6-c-clipboard-copy__actions-item--button--hover--Color: var(--pf-t--global--icon--color--regular);
3232
3254
  --pf-v6-c-clipboard-copy__text--m-code--FontFamily: var(--pf-t--global--font--family--mono);
3233
3255
  --pf-v6-c-clipboard-copy__text--m-code--FontSize: var(--pf-t--global--font--size--body--default);
3234
- --pf-v6-c-clipboard-copy__actions-item--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--xs));
3235
- --pf-v6-c-clipboard-copy__actions-item--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--xs));
3236
- --pf-v6-c-clipboard-copy__actions-item--button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
3237
- --pf-v6-c-clipboard-copy__actions-item--button--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
3238
- --pf-v6-c-clipboard-copy__actions-item--button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
3239
- --pf-v6-c-clipboard-copy__actions-item--button--PaddingInlineStart: var(--pf-t--global--spacer--xs);
3240
3256
  }
3241
3257
 
3242
3258
  .pf-v6-c-clipboard-copy.pf-m-expanded .pf-v6-c-clipboard-copy__toggle-icon {
@@ -3245,9 +3261,8 @@ button.pf-v6-c-breadcrumb__link {
3245
3261
 
3246
3262
  .pf-v6-c-clipboard-copy.pf-m-inline {
3247
3263
  display: inline;
3248
- padding-block-start: var(--pf-v6-c-clipboard-copy--m-inline--PaddingBlockStart);
3249
- padding-block-end: var(--pf-v6-c-clipboard-copy--m-inline--PaddingBlockEnd);
3250
3264
  padding-inline-start: var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart);
3265
+ padding-inline-end: var(--pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd);
3251
3266
  white-space: nowrap;
3252
3267
  background-color: var(--pf-v6-c-clipboard-copy--m-inline--BackgroundColor);
3253
3268
  }
@@ -3307,18 +3322,13 @@ button.pf-v6-c-breadcrumb__link {
3307
3322
 
3308
3323
  .pf-v6-c-clipboard-copy__actions {
3309
3324
  display: inline-flex;
3325
+ gap: var(--pf-v6-c-clipboard-copy__actions--Gap);
3326
+ margin-inline-start: var(--pf-v6-c-clipboard-copy__actions--MarginInlineStart);
3310
3327
  }
3311
3328
 
3312
- .pf-v6-c-clipboard-copy__actions-item {
3313
- margin-block-start: calc(-1 * var(--pf-v6-c-clipboard-copy__actions-item--button--PaddingBlockStart));
3314
- margin-block-end: calc(-1 * var(--pf-v6-c-clipboard-copy__actions-item--button--PaddingBlockEnd));
3315
- }
3316
-
3317
- .pf-v6-c-clipboard-copy__actions-item .pf-v6-c-button {
3318
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-clipboard-copy__actions-item--button--PaddingBlockStart);
3319
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-clipboard-copy__actions-item--button--PaddingInlineEnd);
3320
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-clipboard-copy__actions-item--button--PaddingBlockEnd);
3321
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-clipboard-copy__actions-item--button--PaddingInlineStart);
3329
+ .pf-v6-c-clipboard-copy__actions-item .pf-v6-c-button.pf-m-plain {
3330
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--Color);
3331
+ --pf-v6-c-button--m-plain--hover--Color: var(--pf-v6-c-clipboard-copy__actions-item--button--hover--Color);
3322
3332
  }
3323
3333
 
3324
3334
  :where(:root, .pf-v6-c-code-block) {
@@ -6293,6 +6303,66 @@ ol) {
6293
6303
  justify-content: center;
6294
6304
  }
6295
6305
 
6306
+ :where(:root, .pf-v6-c-file-upload) {
6307
+ --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--sm);
6308
+ --pf-v6-c-file-upload--PaddingBlockStart: var(--pf-t--global--spacer--sm);
6309
+ --pf-v6-c-file-upload--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
6310
+ --pf-v6-c-file-upload--PaddingInlineStart: var(--pf-t--global--spacer--sm);
6311
+ --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
6312
+ --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
6313
+ --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
6314
+ --pf-v6-c-file-upload--BorderColor: transparent;
6315
+ --pf-v6-c-file-upload--BorderStyle: solid;
6316
+ --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
6317
+ --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
6318
+ --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
6319
+ --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
6320
+ }
6321
+
6322
+ .pf-v6-c-file-upload {
6323
+ position: relative;
6324
+ display: flex;
6325
+ flex-direction: column;
6326
+ row-gap: var(--pf-v6-c-file-upload--RowGap);
6327
+ padding-block-start: var(--pf-v6-c-file-upload--PaddingBlockStart);
6328
+ padding-block-end: var(--pf-v6-c-file-upload--PaddingBlockEnd);
6329
+ padding-inline-start: var(--pf-v6-c-file-upload--PaddingInlineStart);
6330
+ padding-inline-end: var(--pf-v6-c-file-upload--PaddingInlineEnd);
6331
+ border: var(--pf-v6-c-file-upload--BorderWidth) var(--pf-v6-c-file-upload--BorderStyle) var(--pf-v6-c-file-upload--BorderColor);
6332
+ border-radius: var(--pf-v6-c-file-upload--BorderRadius);
6333
+ }
6334
+
6335
+ .pf-v6-c-file-upload.pf-m-drag-hover {
6336
+ --pf-v6-c-file-upload--BorderColor: var(--pf-v6-c-file-upload--m-drag-hover--BorderColor);
6337
+ --pf-v6-c-file-upload--BorderStyle: var(--pf-v6-c-file-upload--m-drag-hover--BorderStyle);
6338
+ }
6339
+
6340
+ .pf-v6-c-file-upload.pf-m-loading .pf-v6-c-file-upload__file-details {
6341
+ position: relative;
6342
+ }
6343
+
6344
+ .pf-v6-c-file-upload__file-select .pf-v6-c-button.pf-m-control {
6345
+ outline-offset: var(--pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset);
6346
+ }
6347
+
6348
+ .pf-v6-c-file-upload__file-details {
6349
+ position: relative;
6350
+ display: flex;
6351
+ }
6352
+
6353
+ .pf-v6-c-file-upload__file-details .pf-v6-c-form-control {
6354
+ flex: 1 1 auto;
6355
+ min-height: var(--pf-v6-c-file-upload__file-details__c-form-control--MinHeight);
6356
+ border-block-start: 0;
6357
+ }
6358
+
6359
+ .pf-v6-c-file-upload__file-details-spinner {
6360
+ position: absolute;
6361
+ inset-block-start: 50%;
6362
+ inset-inline-start: 50%;
6363
+ transform: translate(-50%, -50%);
6364
+ }
6365
+
6296
6366
  :where(:root, .pf-v6-c-expandable-section) {
6297
6367
  --pf-v6-c-expandable-section__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
6298
6368
  --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -6441,66 +6511,6 @@ ol) {
6441
6511
  padding-inline-end: var(--pf-v6-c-expandable-section__content--PaddingInlineEnd);
6442
6512
  }
6443
6513
 
6444
- :where(:root, .pf-v6-c-file-upload) {
6445
- --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--sm);
6446
- --pf-v6-c-file-upload--PaddingBlockStart: var(--pf-t--global--spacer--sm);
6447
- --pf-v6-c-file-upload--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
6448
- --pf-v6-c-file-upload--PaddingInlineStart: var(--pf-t--global--spacer--sm);
6449
- --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
6450
- --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
6451
- --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
6452
- --pf-v6-c-file-upload--BorderColor: transparent;
6453
- --pf-v6-c-file-upload--BorderStyle: solid;
6454
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
6455
- --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
6456
- --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
6457
- --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
6458
- }
6459
-
6460
- .pf-v6-c-file-upload {
6461
- position: relative;
6462
- display: flex;
6463
- flex-direction: column;
6464
- row-gap: var(--pf-v6-c-file-upload--RowGap);
6465
- padding-block-start: var(--pf-v6-c-file-upload--PaddingBlockStart);
6466
- padding-block-end: var(--pf-v6-c-file-upload--PaddingBlockEnd);
6467
- padding-inline-start: var(--pf-v6-c-file-upload--PaddingInlineStart);
6468
- padding-inline-end: var(--pf-v6-c-file-upload--PaddingInlineEnd);
6469
- border: var(--pf-v6-c-file-upload--BorderWidth) var(--pf-v6-c-file-upload--BorderStyle) var(--pf-v6-c-file-upload--BorderColor);
6470
- border-radius: var(--pf-v6-c-file-upload--BorderRadius);
6471
- }
6472
-
6473
- .pf-v6-c-file-upload.pf-m-drag-hover {
6474
- --pf-v6-c-file-upload--BorderColor: var(--pf-v6-c-file-upload--m-drag-hover--BorderColor);
6475
- --pf-v6-c-file-upload--BorderStyle: var(--pf-v6-c-file-upload--m-drag-hover--BorderStyle);
6476
- }
6477
-
6478
- .pf-v6-c-file-upload.pf-m-loading .pf-v6-c-file-upload__file-details {
6479
- position: relative;
6480
- }
6481
-
6482
- .pf-v6-c-file-upload__file-select .pf-v6-c-button.pf-m-control {
6483
- outline-offset: var(--pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset);
6484
- }
6485
-
6486
- .pf-v6-c-file-upload__file-details {
6487
- position: relative;
6488
- display: flex;
6489
- }
6490
-
6491
- .pf-v6-c-file-upload__file-details .pf-v6-c-form-control {
6492
- flex: 1 1 auto;
6493
- min-height: var(--pf-v6-c-file-upload__file-details__c-form-control--MinHeight);
6494
- border-block-start: 0;
6495
- }
6496
-
6497
- .pf-v6-c-file-upload__file-details-spinner {
6498
- position: absolute;
6499
- inset-block-start: 50%;
6500
- inset-inline-start: 50%;
6501
- transform: translate(-50%, -50%);
6502
- }
6503
-
6504
6514
  :where(:root, .pf-v6-c-form) {
6505
6515
  --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--lg);
6506
6516
  --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--sm);
@@ -7289,84 +7299,6 @@ select ~ .pf-v6-c-form-control__utilities {
7289
7299
  --pf-v6-c-form-control__utilities--PaddingInlineEnd: 0;
7290
7300
  }
7291
7301
 
7292
- :where(:root, .pf-v6-c-helper-text) {
7293
- --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
7294
- --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
7295
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-t--global--icon--color--regular);
7296
- --pf-v6-c-helper-text__item-text--Color: var(--pf-t--global--text--color--regular);
7297
- --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-t--global--font--weight--body);
7298
- --pf-v6-c-helper-text__item-icon--m-indeterminate--Color: var(--pf-t--global--icon--color--subtle);
7299
- --pf-v6-c-helper-text__item-text--m-indeterminate--Color: var(--pf-t--global--text--color--subtle);
7300
- --pf-v6-c-helper-text__item-icon--m-warning--Color: var(--pf-t--global--icon--color--status--warning--default);
7301
- --pf-v6-c-helper-text__item-text--m-warning--FontWeight: var(--pf-t--global--font--weight--body--bold);
7302
- --pf-v6-c-helper-text__item-icon--m-success--Color: var(--pf-t--global--icon--color--status--success--default);
7303
- --pf-v6-c-helper-text__item-text--m-success--FontWeight: var(--pf-t--global--font--weight--body--bold);
7304
- --pf-v6-c-helper-text__item-icon--m-error--Color: var(--pf-t--global--icon--color--status--danger--default);
7305
- --pf-v6-c-helper-text__item-text--m-error--FontWeight: var(--pf-t--global--font--weight--body--bold);
7306
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-t--global--icon--color--regular);
7307
- --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color: var(--pf-t--global--icon--color--subtle);
7308
- --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color: var(--pf-t--global--text--color--subtle);
7309
- --pf-v6-c-helper-text--m-dynamic--m-warning__item-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
7310
- --pf-v6-c-helper-text--m-dynamic--m-warning__item-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
7311
- --pf-v6-c-helper-text--m-dynamic--m-success__item-icon--Color: var(--pf-t--global--icon--color--status--success--default);
7312
- --pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
7313
- --pf-v6-c-helper-text__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--xs);
7314
- }
7315
-
7316
- .pf-v6-c-helper-text {
7317
- display: grid;
7318
- gap: var(--pf-v6-c-helper-text--Gap);
7319
- font-size: var(--pf-v6-c-helper-text--FontSize);
7320
- }
7321
-
7322
- .pf-v6-c-helper-text.pf-m-hidden {
7323
- visibility: hidden;
7324
- opacity: 0;
7325
- }
7326
-
7327
- .pf-v6-c-helper-text__item {
7328
- display: flex;
7329
- font-weight: var(--pf-v6-c-helper-text__item-text--FontWeight);
7330
- }
7331
-
7332
- .pf-v6-c-helper-text__item.pf-m-indeterminate {
7333
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-indeterminate--Color);
7334
- --pf-v6-c-helper-text__item-text--Color: var(--pf-v6-c-helper-text__item-text--m-indeterminate--Color);
7335
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color);
7336
- --pf-v6-c-helper-text--m-dynamic__item-text--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color);
7337
- }
7338
-
7339
- .pf-v6-c-helper-text__item.pf-m-warning {
7340
- --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-warning--FontWeight);
7341
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-warning--Color);
7342
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-warning__item-icon--Color);
7343
- }
7344
-
7345
- .pf-v6-c-helper-text__item.pf-m-success {
7346
- --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-success--FontWeight);
7347
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-success--Color);
7348
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-success__item-icon--Color);
7349
- }
7350
-
7351
- .pf-v6-c-helper-text__item.pf-m-error {
7352
- --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-error--FontWeight);
7353
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-error--Color);
7354
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color);
7355
- }
7356
-
7357
- .pf-v6-c-helper-text__item.pf-m-dynamic {
7358
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic__item-icon--Color);
7359
- }
7360
-
7361
- .pf-v6-c-helper-text__item-icon {
7362
- margin-inline-end: var(--pf-v6-c-helper-text__item-icon--MarginInlineEnd);
7363
- color: var(--pf-v6-c-helper-text__item-icon--Color);
7364
- }
7365
-
7366
- .pf-v6-c-helper-text__item-text {
7367
- color: var(--pf-v6-c-helper-text__item-text--Color);
7368
- }
7369
-
7370
7302
  :where(:root, .pf-v6-c-hint) {
7371
7303
  --pf-v6-c-hint--GridRowGap: var(--pf-t--global--spacer--sm);
7372
7304
  --pf-v6-c-hint--PaddingBlockStart: var(--pf-t--global--spacer--lg);
@@ -7452,57 +7384,213 @@ select ~ .pf-v6-c-form-control__utilities {
7452
7384
  margin-inline-end: var(--pf-v6-c-hint__footer--child--MarginInlineEnd);
7453
7385
  }
7454
7386
 
7455
- :where(:root, .pf-v6-c-icon) {
7456
- --pf-v6-c-icon--Width: 1em;
7457
- --pf-v6-c-icon--Height: 1em;
7458
- --pf-v6-c-icon--m-sm--Width: var(--pf-t--global--icon--size--sm);
7459
- --pf-v6-c-icon--m-sm--Height: var(--pf-t--global--icon--size--sm);
7460
- --pf-v6-c-icon--m-md--Width: var(--pf-t--global--icon--size--md);
7461
- --pf-v6-c-icon--m-md--Height: var(--pf-t--global--icon--size--md);
7462
- --pf-v6-c-icon--m-lg--Width: var(--pf-t--global--icon--size--lg);
7463
- --pf-v6-c-icon--m-lg--Height: var(--pf-t--global--icon--size--lg);
7464
- --pf-v6-c-icon--m-xl--Width: var(--pf-t--global--icon--size--xl);
7465
- --pf-v6-c-icon--m-xl--Height: var(--pf-t--global--icon--size--xl);
7466
- --pf-v6-c-icon--m-2xl--Width: var(--pf-t--global--icon--size--2xl);
7467
- --pf-v6-c-icon--m-2xl--Height: var(--pf-t--global--icon--size--2xl);
7468
- --pf-v6-c-icon--m-3xl--Width: var(--pf-t--global--icon--size--3xl);
7469
- --pf-v6-c-icon--m-3xl--Height: var(--pf-t--global--icon--size--3xl);
7470
- --pf-v6-c-icon--m-body-sm--Width: var(--pf-t--global--icon--size--font--body--sm);
7471
- --pf-v6-c-icon--m-body-sm--Height: var(--pf-t--global--icon--size--font--body--sm);
7472
- --pf-v6-c-icon--m-body-default--Width: var(--pf-t--global--icon--size--font--body--default);
7473
- --pf-v6-c-icon--m-body-default--Height: var(--pf-t--global--icon--size--font--body--default);
7474
- --pf-v6-c-icon--m-body-lg--Width: var(--pf-t--global--icon--size--font--body--lg);
7475
- --pf-v6-c-icon--m-body-lg--Height: var(--pf-t--global--icon--size--font--body--lg);
7476
- --pf-v6-c-icon--m-heading-sm--Width: var(--pf-t--global--icon--size--font--heading--h6);
7477
- --pf-v6-c-icon--m-heading-sm--Height: var(--pf-t--global--icon--size--font--heading--h6);
7478
- --pf-v6-c-icon--m-heading-md--Width: var(--pf-t--global--icon--size--font--heading--h5);
7479
- --pf-v6-c-icon--m-heading-md--Height: var(--pf-t--global--icon--size--font--heading--h5);
7480
- --pf-v6-c-icon--m-heading-lg--Width: var(--pf-t--global--icon--size--font--heading--h4);
7481
- --pf-v6-c-icon--m-heading-lg--Height: var(--pf-t--global--icon--size--font--heading--h4);
7482
- --pf-v6-c-icon--m-heading-xl--Width: var(--pf-t--global--icon--size--font--heading--h3);
7483
- --pf-v6-c-icon--m-heading-xl--Height: var(--pf-t--global--icon--size--font--heading--h3);
7484
- --pf-v6-c-icon--m-heading-2xl--Width: var(--pf-t--global--icon--size--font--heading--h2);
7485
- --pf-v6-c-icon--m-heading-2xl--Height: var(--pf-t--global--icon--size--font--heading--h2);
7486
- --pf-v6-c-icon--m-heading-3xl--Width: var(--pf-t--global--icon--size--font--heading--h1);
7487
- --pf-v6-c-icon--m-heading-3xl--Height: var(--pf-t--global--icon--size--font--heading--h1);
7488
- --pf-v6-c-icon--m-inline--Width: 1em;
7489
- --pf-v6-c-icon--m-inline--Height: 1em;
7490
- --pf-v6-c-icon__content--svg--VerticalAlign: -.125em;
7491
- --pf-v6-c-icon__content--Color: initial;
7492
- --pf-v6-c-icon__content--m-danger--Color: var(--pf-t--global--icon--color--status--danger--default);
7493
- --pf-v6-c-icon__content--m-warning--Color: var(--pf-t--global--icon--color--status--warning--default);
7494
- --pf-v6-c-icon__content--m-success--Color: var(--pf-t--global--icon--color--status--success--default);
7495
- --pf-v6-c-icon__content--m-info--Color: var(--pf-t--global--icon--color--status--info--default);
7496
- --pf-v6-c-icon__content--m-custom--Color: var(--pf-t--global--icon--color--status--custom--default);
7497
- --pf-v6-c-icon--m-inline__content--Color: initial;
7498
- --pf-v6-c-icon__content--FontSize: 1em;
7499
- --pf-v6-c-icon--m-sm__content--FontSize: var(--pf-t--global--icon--size--sm);
7500
- --pf-v6-c-icon--m-md__content--FontSize: var(--pf-t--global--icon--size--md);
7501
- --pf-v6-c-icon--m-lg__content--FontSize: var(--pf-t--global--icon--size--lg);
7502
- --pf-v6-c-icon--m-xl__content--FontSize: var(--pf-t--global--icon--size--xl);
7503
- --pf-v6-c-icon--m-2xl__content--FontSize: var(--pf-t--global--icon--size--2xl);
7504
- --pf-v6-c-icon--m-3xl__content--FontSize: var(--pf-t--global--icon--size--3xl);
7505
- --pf-v6-c-icon--m-body-sm__content--FontSize: var(--pf-t--global--icon--size--font--body--sm);
7387
+ :where(:root, .pf-v6-c-helper-text) {
7388
+ --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
7389
+ --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
7390
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-t--global--icon--color--regular);
7391
+ --pf-v6-c-helper-text__item-text--Color: var(--pf-t--global--text--color--regular);
7392
+ --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-t--global--font--weight--body);
7393
+ --pf-v6-c-helper-text__item-icon--m-indeterminate--Color: var(--pf-t--global--icon--color--subtle);
7394
+ --pf-v6-c-helper-text__item-text--m-indeterminate--Color: var(--pf-t--global--text--color--subtle);
7395
+ --pf-v6-c-helper-text__item-icon--m-warning--Color: var(--pf-t--global--icon--color--status--warning--default);
7396
+ --pf-v6-c-helper-text__item-text--m-warning--FontWeight: var(--pf-t--global--font--weight--body--bold);
7397
+ --pf-v6-c-helper-text__item-icon--m-success--Color: var(--pf-t--global--icon--color--status--success--default);
7398
+ --pf-v6-c-helper-text__item-text--m-success--FontWeight: var(--pf-t--global--font--weight--body--bold);
7399
+ --pf-v6-c-helper-text__item-icon--m-error--Color: var(--pf-t--global--icon--color--status--danger--default);
7400
+ --pf-v6-c-helper-text__item-text--m-error--FontWeight: var(--pf-t--global--font--weight--body--bold);
7401
+ --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-t--global--icon--color--regular);
7402
+ --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color: var(--pf-t--global--icon--color--subtle);
7403
+ --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color: var(--pf-t--global--text--color--subtle);
7404
+ --pf-v6-c-helper-text--m-dynamic--m-warning__item-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
7405
+ --pf-v6-c-helper-text--m-dynamic--m-warning__item-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
7406
+ --pf-v6-c-helper-text--m-dynamic--m-success__item-icon--Color: var(--pf-t--global--icon--color--status--success--default);
7407
+ --pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
7408
+ --pf-v6-c-helper-text__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--xs);
7409
+ }
7410
+
7411
+ .pf-v6-c-helper-text {
7412
+ display: grid;
7413
+ gap: var(--pf-v6-c-helper-text--Gap);
7414
+ font-size: var(--pf-v6-c-helper-text--FontSize);
7415
+ }
7416
+
7417
+ .pf-v6-c-helper-text.pf-m-hidden {
7418
+ visibility: hidden;
7419
+ opacity: 0;
7420
+ }
7421
+
7422
+ .pf-v6-c-helper-text__item {
7423
+ display: flex;
7424
+ font-weight: var(--pf-v6-c-helper-text__item-text--FontWeight);
7425
+ }
7426
+
7427
+ .pf-v6-c-helper-text__item.pf-m-indeterminate {
7428
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-indeterminate--Color);
7429
+ --pf-v6-c-helper-text__item-text--Color: var(--pf-v6-c-helper-text__item-text--m-indeterminate--Color);
7430
+ --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color);
7431
+ --pf-v6-c-helper-text--m-dynamic__item-text--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color);
7432
+ }
7433
+
7434
+ .pf-v6-c-helper-text__item.pf-m-warning {
7435
+ --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-warning--FontWeight);
7436
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-warning--Color);
7437
+ --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-warning__item-icon--Color);
7438
+ }
7439
+
7440
+ .pf-v6-c-helper-text__item.pf-m-success {
7441
+ --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-success--FontWeight);
7442
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-success--Color);
7443
+ --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-success__item-icon--Color);
7444
+ }
7445
+
7446
+ .pf-v6-c-helper-text__item.pf-m-error {
7447
+ --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-error--FontWeight);
7448
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-error--Color);
7449
+ --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color);
7450
+ }
7451
+
7452
+ .pf-v6-c-helper-text__item.pf-m-dynamic {
7453
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic__item-icon--Color);
7454
+ }
7455
+
7456
+ .pf-v6-c-helper-text__item-icon {
7457
+ margin-inline-end: var(--pf-v6-c-helper-text__item-icon--MarginInlineEnd);
7458
+ color: var(--pf-v6-c-helper-text__item-icon--Color);
7459
+ }
7460
+
7461
+ .pf-v6-c-helper-text__item-text {
7462
+ color: var(--pf-v6-c-helper-text__item-text--Color);
7463
+ }
7464
+
7465
+ :where(:root, .pf-v6-c-input-group) {
7466
+ --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--xs);
7467
+ --pf-v6-c-input-group__item--offset: var(--pf-t--global--border--width--control--default);
7468
+ --pf-v6-c-input-group__item--BorderWidth--base: var(--pf-t--global--border--width--control--default);
7469
+ --pf-v6-c-input-group__item--BorderColor--base: var(--pf-t--global--border--color--default);
7470
+ --pf-v6-c-input-group__item--BackgroundColor: transparent;
7471
+ --pf-v6-c-input-group__item--AlignItems: start;
7472
+ --pf-v6-c-input-group__item--m-box--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7473
+ --pf-v6-c-input-group__item--m-box--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7474
+ --pf-v6-c-input-group__item--m-box--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7475
+ --pf-v6-c-input-group__item--m-box--BorderWidth: var(--pf-v6-c-input-group__item--BorderWidth--base);
7476
+ --pf-v6-c-input-group__item--m-box--BorderRadius: var(--pf-t--global--border--radius--small);
7477
+ --pf-v6-c-input-group__item--m-box--BorderBlockStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7478
+ --pf-v6-c-input-group__item--m-box--BorderInlineEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7479
+ --pf-v6-c-input-group__item--m-box--BorderBlockEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7480
+ --pf-v6-c-input-group__item--m-box--BorderInlineStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7481
+ --pf-v6-c-input-group__item--m-plain--BackgroundColor: transparent;
7482
+ --pf-v6-c-input-group__text--FontSize: var(--pf-t--global--font--size--body--default);
7483
+ --pf-v6-c-input-group__text--Color: var(--pf-t--global--text--color--regular);
7484
+ --pf-v6-c-input-group__item--m-disabled__text--Color: var(--pf-t--global--text--color--on-disabled);
7485
+ --pf-v6-c-input-group__item--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7486
+ }
7487
+
7488
+ .pf-v6-c-input-group {
7489
+ display: flex;
7490
+ gap: var(--pf-v6-c-input-group--Gap);
7491
+ width: 100%;
7492
+ }
7493
+
7494
+ .pf-v6-c-input-group__item {
7495
+ position: relative;
7496
+ display: flex;
7497
+ align-items: var(--pf-v6-c-input-group__item--AlignItems);
7498
+ min-width: var(--pf-v6-c-input-group__item--MinWidth, revert);
7499
+ max-width: var(--pf-v6-c-input-group__item--MaxWidth, revert);
7500
+ background-color: var(--pf-v6-c-input-group__item--BackgroundColor);
7501
+ border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7502
+ border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7503
+ border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7504
+ border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
7505
+ }
7506
+
7507
+ .pf-v6-c-input-group__item.pf-m-box {
7508
+ --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-box--BackgroundColor);
7509
+ padding-inline-start: var(--pf-v6-c-input-group__item--m-box--PaddingInlineStart);
7510
+ padding-inline-end: var(--pf-v6-c-input-group__item--m-box--PaddingInlineEnd);
7511
+ border: var(--pf-v6-c-input-group__item--m-box--BorderWidth) solid;
7512
+ border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7513
+ border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7514
+ border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7515
+ border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
7516
+ border-radius: var(--pf-v6-c-input-group__item--m-box--BorderRadius);
7517
+ }
7518
+
7519
+ .pf-v6-c-input-group__item.pf-m-plain {
7520
+ --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-plain--BackgroundColor);
7521
+ border: none;
7522
+ }
7523
+
7524
+ .pf-v6-c-input-group__item.pf-m-disabled {
7525
+ --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-disabled--BackgroundColor);
7526
+ --pf-v6-c-input-group__text--Color: var(--pf-v6-c-input-group__item--m-disabled__text--Color);
7527
+ }
7528
+
7529
+ .pf-v6-c-input-group__item.pf-m-fill {
7530
+ flex-grow: 1;
7531
+ }
7532
+
7533
+ .pf-v6-c-input-group__text {
7534
+ align-self: center;
7535
+ font-size: var(--pf-v6-c-input-group__text--FontSize);
7536
+ color: var(--pf-v6-c-input-group__text--Color);
7537
+ }
7538
+
7539
+ label.pf-v6-c-input-group__text {
7540
+ cursor: pointer;
7541
+ }
7542
+
7543
+ :where(:root, .pf-v6-c-icon) {
7544
+ --pf-v6-c-icon--Width: 1em;
7545
+ --pf-v6-c-icon--Height: 1em;
7546
+ --pf-v6-c-icon--m-sm--Width: var(--pf-t--global--icon--size--sm);
7547
+ --pf-v6-c-icon--m-sm--Height: var(--pf-t--global--icon--size--sm);
7548
+ --pf-v6-c-icon--m-md--Width: var(--pf-t--global--icon--size--md);
7549
+ --pf-v6-c-icon--m-md--Height: var(--pf-t--global--icon--size--md);
7550
+ --pf-v6-c-icon--m-lg--Width: var(--pf-t--global--icon--size--lg);
7551
+ --pf-v6-c-icon--m-lg--Height: var(--pf-t--global--icon--size--lg);
7552
+ --pf-v6-c-icon--m-xl--Width: var(--pf-t--global--icon--size--xl);
7553
+ --pf-v6-c-icon--m-xl--Height: var(--pf-t--global--icon--size--xl);
7554
+ --pf-v6-c-icon--m-2xl--Width: var(--pf-t--global--icon--size--2xl);
7555
+ --pf-v6-c-icon--m-2xl--Height: var(--pf-t--global--icon--size--2xl);
7556
+ --pf-v6-c-icon--m-3xl--Width: var(--pf-t--global--icon--size--3xl);
7557
+ --pf-v6-c-icon--m-3xl--Height: var(--pf-t--global--icon--size--3xl);
7558
+ --pf-v6-c-icon--m-body-sm--Width: var(--pf-t--global--icon--size--font--body--sm);
7559
+ --pf-v6-c-icon--m-body-sm--Height: var(--pf-t--global--icon--size--font--body--sm);
7560
+ --pf-v6-c-icon--m-body-default--Width: var(--pf-t--global--icon--size--font--body--default);
7561
+ --pf-v6-c-icon--m-body-default--Height: var(--pf-t--global--icon--size--font--body--default);
7562
+ --pf-v6-c-icon--m-body-lg--Width: var(--pf-t--global--icon--size--font--body--lg);
7563
+ --pf-v6-c-icon--m-body-lg--Height: var(--pf-t--global--icon--size--font--body--lg);
7564
+ --pf-v6-c-icon--m-heading-sm--Width: var(--pf-t--global--icon--size--font--heading--h6);
7565
+ --pf-v6-c-icon--m-heading-sm--Height: var(--pf-t--global--icon--size--font--heading--h6);
7566
+ --pf-v6-c-icon--m-heading-md--Width: var(--pf-t--global--icon--size--font--heading--h5);
7567
+ --pf-v6-c-icon--m-heading-md--Height: var(--pf-t--global--icon--size--font--heading--h5);
7568
+ --pf-v6-c-icon--m-heading-lg--Width: var(--pf-t--global--icon--size--font--heading--h4);
7569
+ --pf-v6-c-icon--m-heading-lg--Height: var(--pf-t--global--icon--size--font--heading--h4);
7570
+ --pf-v6-c-icon--m-heading-xl--Width: var(--pf-t--global--icon--size--font--heading--h3);
7571
+ --pf-v6-c-icon--m-heading-xl--Height: var(--pf-t--global--icon--size--font--heading--h3);
7572
+ --pf-v6-c-icon--m-heading-2xl--Width: var(--pf-t--global--icon--size--font--heading--h2);
7573
+ --pf-v6-c-icon--m-heading-2xl--Height: var(--pf-t--global--icon--size--font--heading--h2);
7574
+ --pf-v6-c-icon--m-heading-3xl--Width: var(--pf-t--global--icon--size--font--heading--h1);
7575
+ --pf-v6-c-icon--m-heading-3xl--Height: var(--pf-t--global--icon--size--font--heading--h1);
7576
+ --pf-v6-c-icon--m-inline--Width: 1em;
7577
+ --pf-v6-c-icon--m-inline--Height: 1em;
7578
+ --pf-v6-c-icon__content--svg--VerticalAlign: -.125em;
7579
+ --pf-v6-c-icon__content--Color: initial;
7580
+ --pf-v6-c-icon__content--m-danger--Color: var(--pf-t--global--icon--color--status--danger--default);
7581
+ --pf-v6-c-icon__content--m-warning--Color: var(--pf-t--global--icon--color--status--warning--default);
7582
+ --pf-v6-c-icon__content--m-success--Color: var(--pf-t--global--icon--color--status--success--default);
7583
+ --pf-v6-c-icon__content--m-info--Color: var(--pf-t--global--icon--color--status--info--default);
7584
+ --pf-v6-c-icon__content--m-custom--Color: var(--pf-t--global--icon--color--status--custom--default);
7585
+ --pf-v6-c-icon--m-inline__content--Color: initial;
7586
+ --pf-v6-c-icon__content--FontSize: 1em;
7587
+ --pf-v6-c-icon--m-sm__content--FontSize: var(--pf-t--global--icon--size--sm);
7588
+ --pf-v6-c-icon--m-md__content--FontSize: var(--pf-t--global--icon--size--md);
7589
+ --pf-v6-c-icon--m-lg__content--FontSize: var(--pf-t--global--icon--size--lg);
7590
+ --pf-v6-c-icon--m-xl__content--FontSize: var(--pf-t--global--icon--size--xl);
7591
+ --pf-v6-c-icon--m-2xl__content--FontSize: var(--pf-t--global--icon--size--2xl);
7592
+ --pf-v6-c-icon--m-3xl__content--FontSize: var(--pf-t--global--icon--size--3xl);
7593
+ --pf-v6-c-icon--m-body-sm__content--FontSize: var(--pf-t--global--icon--size--font--body--sm);
7506
7594
  --pf-v6-c-icon--m-body-default__content--FontSize: var(--pf-t--global--icon--size--font--body--default);
7507
7595
  --pf-v6-c-icon--m-body-lg__content--FontSize: var(--pf-t--global--icon--size--font--body--lg);
7508
7596
  --pf-v6-c-icon--m-heading-sm__content--FontSize: var(--pf-t--global--icon--size--font--heading--h6);
@@ -7747,717 +7835,628 @@ select ~ .pf-v6-c-form-control__utilities {
7747
7835
  transform: translateY(calc(-50% - 0.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign)));
7748
7836
  }
7749
7837
 
7750
- :where(:root, .pf-v6-c-input-group) {
7751
- --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--xs);
7752
- --pf-v6-c-input-group__item--offset: var(--pf-t--global--border--width--control--default);
7753
- --pf-v6-c-input-group__item--BorderWidth--base: var(--pf-t--global--border--width--control--default);
7754
- --pf-v6-c-input-group__item--BorderColor--base: var(--pf-t--global--border--color--default);
7755
- --pf-v6-c-input-group__item--BackgroundColor: transparent;
7756
- --pf-v6-c-input-group__item--AlignItems: start;
7757
- --pf-v6-c-input-group__item--m-box--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7758
- --pf-v6-c-input-group__item--m-box--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7759
- --pf-v6-c-input-group__item--m-box--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7760
- --pf-v6-c-input-group__item--m-box--BorderWidth: var(--pf-v6-c-input-group__item--BorderWidth--base);
7761
- --pf-v6-c-input-group__item--m-box--BorderRadius: var(--pf-t--global--border--radius--small);
7762
- --pf-v6-c-input-group__item--m-box--BorderBlockStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7763
- --pf-v6-c-input-group__item--m-box--BorderInlineEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7764
- --pf-v6-c-input-group__item--m-box--BorderBlockEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7765
- --pf-v6-c-input-group__item--m-box--BorderInlineStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7766
- --pf-v6-c-input-group__item--m-plain--BackgroundColor: transparent;
7767
- --pf-v6-c-input-group__text--FontSize: var(--pf-t--global--font--size--body--default);
7768
- --pf-v6-c-input-group__text--Color: var(--pf-t--global--text--color--regular);
7769
- --pf-v6-c-input-group__item--m-disabled__text--Color: var(--pf-t--global--text--color--on-disabled);
7770
- --pf-v6-c-input-group__item--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7771
- }
7772
-
7773
- .pf-v6-c-input-group {
7774
- display: flex;
7775
- gap: var(--pf-v6-c-input-group--Gap);
7776
- width: 100%;
7777
- }
7778
-
7779
- .pf-v6-c-input-group__item {
7780
- position: relative;
7781
- display: flex;
7782
- align-items: var(--pf-v6-c-input-group__item--AlignItems);
7783
- min-width: var(--pf-v6-c-input-group__item--MinWidth, revert);
7784
- max-width: var(--pf-v6-c-input-group__item--MaxWidth, revert);
7785
- background-color: var(--pf-v6-c-input-group__item--BackgroundColor);
7786
- border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7787
- border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7788
- border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7789
- border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
7790
- }
7791
-
7792
- .pf-v6-c-input-group__item.pf-m-box {
7793
- --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-box--BackgroundColor);
7794
- padding-inline-start: var(--pf-v6-c-input-group__item--m-box--PaddingInlineStart);
7795
- padding-inline-end: var(--pf-v6-c-input-group__item--m-box--PaddingInlineEnd);
7796
- border: var(--pf-v6-c-input-group__item--m-box--BorderWidth) solid;
7797
- border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7798
- border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7799
- border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7800
- border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
7801
- border-radius: var(--pf-v6-c-input-group__item--m-box--BorderRadius);
7838
+ :where(:root, .pf-v6-c-sidebar) {
7839
+ --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
7840
+ --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
7841
+ --pf-v6-c-sidebar--BorderWidth--base: var(--pf-t--global--border--width--regular);
7842
+ --pf-v6-c-sidebar--BorderColor--base: var(--pf-t--global--border--color--default);
7843
+ --pf-v6-c-sidebar__panel--PaddingBlockStart: 0;
7844
+ --pf-v6-c-sidebar__panel--PaddingInlineEnd: 0;
7845
+ --pf-v6-c-sidebar__panel--PaddingBlockEnd: 0;
7846
+ --pf-v6-c-sidebar__panel--PaddingInlineStart: 0;
7847
+ --pf-v6-c-sidebar__panel--Order: -1;
7848
+ --pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
7849
+ --pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
7850
+ --pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
7851
+ --pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
7852
+ --pf-v6-c-sidebar__content--PaddingBlockStart: 0;
7853
+ --pf-v6-c-sidebar__content--PaddingInlineEnd: 0;
7854
+ --pf-v6-c-sidebar__content--PaddingBlockEnd: 0;
7855
+ --pf-v6-c-sidebar__content--PaddingInlineStart: 0;
7856
+ --pf-v6-c-sidebar__content--Order: 1;
7857
+ --pf-v6-c-sidebar__content--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
7858
+ --pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
7859
+ --pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
7860
+ --pf-v6-c-sidebar__content--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
7861
+ --pf-v6-c-sidebar__main--FlexDirection: column;
7862
+ --pf-v6-c-sidebar__main--md--FlexDirection: row;
7863
+ --pf-v6-c-sidebar__main--AlignItems: stretch;
7864
+ --pf-v6-c-sidebar__main--md--AlignItems: flex-start;
7865
+ --pf-v6-c-sidebar__main--child--MarginBlockStart: 0;
7866
+ --pf-v6-c-sidebar--m-gutter__main--Gap: var(--pf-v6-c-sidebar--inset);
7867
+ --pf-v6-c-sidebar__main--m-border--before--Display: none;
7868
+ --pf-v6-c-sidebar__main--m-border--before--md--Display: block;
7869
+ --pf-v6-c-sidebar__main--m-border--before--BorderWidth: var(--pf-v6-c-sidebar--BorderWidth--base);
7870
+ --pf-v6-c-sidebar__main--m-border--before--BorderColor: var(--pf-v6-c-sidebar--BorderColor--base);
7871
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: -1;
7872
+ --pf-v6-c-sidebar--m-panel-right__panel--md--Order: 1;
7873
+ --pf-v6-c-sidebar--m-panel-right__content--md--Order: -1;
7874
+ --pf-v6-c-sidebar--m-stack__main--FlexDirection: column;
7875
+ --pf-v6-c-sidebar--m-stack__main--AlignItems: stretch;
7876
+ --pf-v6-c-sidebar--m-stack__panel--Position: sticky;
7877
+ --pf-v6-c-sidebar--m-stack__panel--InsetBlockStart: 0;
7878
+ --pf-v6-c-sidebar--m-stack__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
7879
+ --pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order: -1;
7880
+ --pf-v6-c-sidebar--m-split__main--AlignItems: flex-start;
7881
+ --pf-v6-c-sidebar--m-split__main--FlexDirection: row;
7882
+ --pf-v6-c-sidebar--m-split__panel--Position: static;
7883
+ --pf-v6-c-sidebar--m-split__panel--InsetBlockStart: auto;
7884
+ --pf-v6-c-sidebar--m-split--m-panel-right__panel--Order: 1;
7885
+ --pf-v6-c-sidebar--m-split__main--m-border--before--Display: block;
7886
+ --pf-v6-c-sidebar__panel--FlexBasis--base: auto;
7887
+ --pf-v6-c-sidebar__panel--BoxShadow--base: var(--pf-t--global--box-shadow--md--bottom);
7888
+ --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
7889
+ --pf-v6-c-sidebar__panel--InsetBlockStart: 0;
7890
+ --pf-v6-c-sidebar__panel--md--InsetBlockStart: auto;
7891
+ --pf-v6-c-sidebar__panel--Position: sticky;
7892
+ --pf-v6-c-sidebar__panel--md--Position: static;
7893
+ --pf-v6-c-sidebar__panel--FlexBasis-base: auto;
7894
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis-base);
7895
+ --pf-v6-c-sidebar__panel--md--FlexBasis: 15.625rem;
7896
+ --pf-v6-c-sidebar__panel--m-split--FlexBasis: 15.625rem;
7897
+ --pf-v6-c-sidebar__panel--m-stack--FlexBasis: auto;
7898
+ --pf-v6-c-sidebar__panel--ZIndex: var(--pf-t--global--z-index--xs);
7899
+ --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7900
+ --pf-v6-c-sidebar__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7901
+ --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7902
+ --pf-v6-c-sidebar__content--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7903
+ --pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart: 0;
7904
+ --pf-v6-c-sidebar__panel--m-sticky--Position: sticky;
7802
7905
  }
7803
7906
 
7804
- .pf-v6-c-input-group__item.pf-m-plain {
7805
- --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-plain--BackgroundColor);
7806
- border: none;
7907
+ .pf-v6-c-sidebar {
7908
+ height: 100%;
7807
7909
  }
7808
7910
 
7809
- .pf-v6-c-input-group__item.pf-m-disabled {
7810
- --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-disabled--BackgroundColor);
7811
- --pf-v6-c-input-group__text--Color: var(--pf-v6-c-input-group__item--m-disabled__text--Color);
7911
+ @media (min-width: 768px) {
7912
+ .pf-v6-c-sidebar {
7913
+ --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar__main--md--FlexDirection);
7914
+ --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar__main--md--AlignItems);
7915
+ --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar__main--m-border--before--md--Display);
7916
+ --pf-v6-c-sidebar__panel--BoxShadow: none;
7917
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--md--FlexBasis);
7918
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--md--InsetBlockStart);
7919
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--md--Position);
7920
+ }
7812
7921
  }
7813
-
7814
- .pf-v6-c-input-group__item.pf-m-fill {
7815
- flex-grow: 1;
7922
+ @media (min-width: 1200px) {
7923
+ .pf-v6-c-sidebar {
7924
+ --pf-v6-c-sidebar--inset: var(--pf-v6-c-sidebar--xl--inset);
7925
+ }
7926
+ }
7927
+ .pf-v6-c-sidebar.pf-m-gutter > .pf-v6-c-sidebar__main {
7928
+ gap: var(--pf-v6-c-sidebar--m-gutter__main--Gap);
7816
7929
  }
7817
7930
 
7818
- .pf-v6-c-input-group__text {
7819
- align-self: center;
7820
- font-size: var(--pf-v6-c-input-group__text--FontSize);
7821
- color: var(--pf-v6-c-input-group__text--Color);
7931
+ .pf-v6-c-sidebar.pf-m-panel-right {
7932
+ --pf-v6-c-sidebar__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--Order);
7933
+ --pf-v6-c-sidebar__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--Order);
7822
7934
  }
7823
7935
 
7824
- label.pf-v6-c-input-group__text {
7825
- cursor: pointer;
7936
+ @media (min-width: 768px) {
7937
+ .pf-v6-c-sidebar.pf-m-panel-right {
7938
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--md--Order);
7939
+ --pf-v6-c-sidebar--m-panel-right__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--md--Order);
7940
+ }
7941
+ }
7942
+ .pf-v6-c-sidebar.pf-m-stack {
7943
+ --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-stack__main--FlexDirection);
7944
+ --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-stack__main--AlignItems);
7945
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-stack__panel--Position);
7946
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-stack__panel--InsetBlockStart);
7947
+ --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar--m-stack__panel--BoxShadow);
7948
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-stack--FlexBasis);
7949
+ --pf-v6-c-sidebar__main--m-border--before--Display: none;
7950
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order);
7826
7951
  }
7827
7952
 
7828
- :where(:root, .pf-v6-c-jump-links) {
7829
- --pf-v6-c-jump-links__list--Display: flex;
7830
- --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
7831
- --pf-v6-c-jump-links__list--PaddingInlineEnd: var(--pf-t--global--spacer--md);
7832
- --pf-v6-c-jump-links__list--PaddingBlockEnd: 0;
7833
- --pf-v6-c-jump-links__list--PaddingInlineStart: var(--pf-t--global--spacer--md);
7834
- --pf-v6-c-jump-links--m-vertical__list--PaddingBlockStart: var(--pf-t--global--spacer--md);
7835
- --pf-v6-c-jump-links--m-vertical__list--PaddingInlineEnd: 0;
7836
- --pf-v6-c-jump-links--m-vertical__list--PaddingBlockEnd: var(--pf-t--global--spacer--md);
7837
- --pf-v6-c-jump-links--m-vertical__list--PaddingInlineStart: 0;
7838
- --pf-v6-c-jump-links__list--FlexDirection: row;
7839
- --pf-v6-c-jump-links--m-vertical__list--FlexDirection: column;
7840
- --pf-v6-c-jump-links__list--before--BorderColor: var(--pf-t--global--border--color--default);
7841
- --pf-v6-c-jump-links__list--before--BorderBlockStartWidth: var(--pf-t--global--border--width--box--default);
7842
- --pf-v6-c-jump-links__list--before--BorderInlineEndWidth: 0;
7843
- --pf-v6-c-jump-links__list--before--BorderBlockEndWidth: 0;
7844
- --pf-v6-c-jump-links__list--before--BorderInlineStartWidth: 0;
7845
- --pf-v6-c-jump-links--m-vertical__list--before--BorderInlineStartWidth: var(--pf-t--global--border--width--box--default);
7846
- --pf-v6-c-jump-links--m-vertical__list--before--BorderBlockStartWidth: 0;
7847
- --pf-v6-c-jump-links__list__list--MarginBlockStart: calc(var(--pf-t--global--spacer--sm) * -1);
7848
- --pf-v6-c-jump-links__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
7849
- --pf-v6-c-jump-links__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7850
- --pf-v6-c-jump-links__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
7851
- --pf-v6-c-jump-links__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7852
- --pf-v6-c-jump-links__list__list__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
7853
- --pf-v6-c-jump-links__list__list__link--PaddingInlineStart: var(--pf-t--global--spacer--lg);
7854
- --pf-v6-c-jump-links__list__list__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
7855
- --pf-v6-c-jump-links__link--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--sm));
7856
- --pf-v6-c-jump-links__link--before--BorderBlockStartWidth: 0;
7857
- --pf-v6-c-jump-links__link--before--BorderInlineEndWidth: 0;
7858
- --pf-v6-c-jump-links__link--before--BorderBlockEndWidth: 0;
7859
- --pf-v6-c-jump-links__link--before--BorderInlineStartWidth: 0;
7860
- --pf-v6-c-jump-links__link--before--BorderColor: transparent;
7861
- --pf-v6-c-jump-links__item--m-current__link--before--BorderBlockStartWidth: var(--pf-t--global--border--width--extra-strong);
7862
- --pf-v6-c-jump-links__item--m-current__link--before--BorderInlineStartWidth: 0;
7863
- --pf-v6-c-jump-links__item--m-current__link--before--BorderColor: var(--pf-t--global--border--color--clicked);
7864
- --pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderBlockStartWidth: 0;
7865
- --pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderInlineStartWidth: var(--pf-t--global--border--width--extra-strong);
7866
- --pf-v6-c-jump-links__link-text--Color: var(--pf-t--global--text--color--subtle);
7867
- --pf-v6-c-jump-links__link--hover__link-text--Color: var(--pf-t--global--text--color--subtle);
7868
- --pf-v6-c-jump-links__item--m-current__link-text--Color: var(--pf-t--global--text--color--regular);
7869
- --pf-v6-c-jump-links__label--MarginBlockEnd: var(--pf-t--global--spacer--md);
7870
- --pf-v6-c-jump-links__label--Display: block;
7871
- --pf-v6-c-jump-links__toggle--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--button--vertical--default));
7872
- --pf-v6-c-jump-links__toggle--MarginBlockEnd--base: calc(-1 * var(--pf-t--global--spacer--button--vertical--default));
7873
- --pf-v6-c-jump-links__toggle--MarginBlockEnd: var(--pf-v6-c-jump-links__toggle--MarginBlockEnd--base);
7874
- --pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd: calc(var(--pf-v6-c-jump-links__toggle--MarginBlockEnd--base) + var(--pf-t--global--spacer--md));
7875
- --pf-v6-c-jump-links__toggle--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--md));
7876
- --pf-v6-c-jump-links__toggle--Display: none;
7877
- --pf-v6-c-jump-links__toggle-icon--Color: currentcolor;
7878
- --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-t--global--transition);
7879
- --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
7880
- --pf-v6-c-jump-links--m-expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
7881
- --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
7882
- --pf-v6-c-jump-links__toggle-text--MarginInlineStart: var(--pf-t--global--spacer--md);
7883
- --pf-v6-c-jump-links__toggle-text--Color: var(--pf-t--global--text--color--regular);
7953
+ .pf-v6-c-sidebar.pf-m-split {
7954
+ --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-split__main--FlexDirection);
7955
+ --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-split__main--AlignItems);
7956
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-split__panel--Position);
7957
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-split__panel--InsetBlockStart);
7958
+ --pf-v6-c-sidebar__panel--BoxShadow: none;
7959
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-split--FlexBasis);
7960
+ --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar--m-split__main--m-border--before--Display);
7961
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-split--m-panel-right__panel--Order);
7884
7962
  }
7885
7963
 
7886
- .pf-v6-c-jump-links {
7964
+ .pf-v6-c-sidebar__main {
7887
7965
  display: flex;
7966
+ flex-direction: var(--pf-v6-c-sidebar__main--FlexDirection);
7967
+ align-items: var(--pf-v6-c-sidebar__main--AlignItems);
7888
7968
  }
7889
7969
 
7890
- .pf-v6-c-jump-links.pf-m-center {
7891
- justify-content: center;
7970
+ .pf-v6-c-sidebar__main.pf-m-border::before {
7971
+ display: var(--pf-v6-c-sidebar__main--m-border--before--Display);
7972
+ flex: 0 0 var(--pf-v6-c-sidebar__main--m-border--before--BorderWidth);
7973
+ align-self: stretch;
7974
+ content: "";
7975
+ background-color: var(--pf-v6-c-sidebar__main--m-border--before--BorderColor);
7892
7976
  }
7893
7977
 
7894
- .pf-v6-c-jump-links.pf-m-center .pf-v6-c-jump-links__main {
7895
- align-items: center;
7978
+ .pf-v6-c-sidebar__panel {
7979
+ position: var(--pf-v6-c-sidebar__panel--Position);
7980
+ inset-block-start: var(--pf-v6-c-sidebar__panel--InsetBlockStart);
7981
+ z-index: var(--pf-v6-c-sidebar__panel--ZIndex);
7982
+ flex-basis: var(--pf-v6-c-sidebar__panel--FlexBasis);
7983
+ flex-shrink: 0;
7984
+ order: var(--pf-v6-c-sidebar__panel--Order);
7985
+ padding-block-start: var(--pf-v6-c-sidebar__panel--PaddingBlockStart);
7986
+ padding-block-end: var(--pf-v6-c-sidebar__panel--PaddingBlockEnd);
7987
+ padding-inline-start: var(--pf-v6-c-sidebar__panel--PaddingInlineStart);
7988
+ padding-inline-end: var(--pf-v6-c-sidebar__panel--PaddingInlineEnd);
7989
+ background-color: var(--pf-v6-c-sidebar__panel--BackgroundColor);
7990
+ box-shadow: var(--pf-v6-c-sidebar__panel--BoxShadow);
7896
7991
  }
7897
7992
 
7898
- .pf-v6-c-jump-links.pf-m-vertical, .pf-v6-c-jump-links.pf-m-expandable {
7899
- --pf-v6-c-jump-links__list--PaddingBlockStart: var(--pf-v6-c-jump-links--m-vertical__list--PaddingBlockStart);
7900
- --pf-v6-c-jump-links__list--PaddingInlineEnd: var(--pf-v6-c-jump-links--m-vertical__list--PaddingInlineEnd);
7901
- --pf-v6-c-jump-links__list--PaddingBlockEnd: var(--pf-v6-c-jump-links--m-vertical__list--PaddingBlockEnd);
7902
- --pf-v6-c-jump-links__list--PaddingInlineStart: var(--pf-v6-c-jump-links--m-vertical__list--PaddingInlineStart);
7903
- --pf-v6-c-jump-links__list--before--BorderBlockStartWidth: var(--pf-v6-c-jump-links--m-vertical__list--before--BorderBlockStartWidth);
7904
- --pf-v6-c-jump-links__list--before--BorderInlineStartWidth: var(--pf-v6-c-jump-links--m-vertical__list--before--BorderInlineStartWidth);
7905
- --pf-v6-c-jump-links__item--m-current__link--before--BorderBlockStartWidth: var(--pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderBlockStartWidth);
7906
- --pf-v6-c-jump-links__item--m-current__link--before--BorderInlineStartWidth: var(--pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderInlineStartWidth);
7907
- --pf-v6-c-jump-links__list--FlexDirection: var(--pf-v6-c-jump-links--m-vertical__list--FlexDirection);
7908
- flex-direction: column;
7993
+ .pf-v6-c-sidebar__panel.pf-m-padding {
7994
+ --pf-v6-c-sidebar__panel--PaddingBlockStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart);
7995
+ --pf-v6-c-sidebar__panel--PaddingInlineEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd);
7996
+ --pf-v6-c-sidebar__panel--PaddingBlockEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd);
7997
+ --pf-v6-c-sidebar__panel--PaddingInlineStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart);
7909
7998
  }
7910
7999
 
7911
- .pf-v6-c-jump-links.pf-m-expandable {
7912
- --pf-v6-c-jump-links__list--Display: none;
7913
- --pf-v6-c-jump-links__toggle--Display: block;
7914
- --pf-v6-c-jump-links__label--Display: none;
8000
+ .pf-v6-c-sidebar__panel.pf-m-sticky {
8001
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--m-sticky--Position);
8002
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart);
7915
8003
  }
7916
8004
 
7917
- .pf-v6-c-jump-links.pf-m-non-expandable {
7918
- --pf-v6-c-jump-links__list--Display: flex;
7919
- --pf-v6-c-jump-links__toggle--Display: none;
7920
- --pf-v6-c-jump-links__label--Display: block;
8005
+ .pf-v6-c-sidebar__panel.pf-m-static {
8006
+ --pf-v6-c-sidebar__panel--Position: static;
8007
+ --pf-v6-c-sidebar__panel--InsetBlockStart: auto;
7921
8008
  }
7922
8009
 
7923
- @media (min-width: 576px) {
7924
- .pf-v6-c-jump-links.pf-m-expandable-on-sm {
7925
- --pf-v6-c-jump-links__list--Display: none;
7926
- --pf-v6-c-jump-links__toggle--Display: block;
7927
- --pf-v6-c-jump-links__label--Display: none;
7928
- }
7929
- .pf-v6-c-jump-links.pf-m-non-expandable-on-sm {
7930
- --pf-v6-c-jump-links__list--Display: flex;
7931
- --pf-v6-c-jump-links__toggle--Display: none;
7932
- --pf-v6-c-jump-links__label--Display: block;
7933
- }
7934
- }
7935
- @media (min-width: 768px) {
7936
- .pf-v6-c-jump-links.pf-m-expandable-on-md {
7937
- --pf-v6-c-jump-links__list--Display: none;
7938
- --pf-v6-c-jump-links__toggle--Display: block;
7939
- --pf-v6-c-jump-links__label--Display: none;
7940
- }
7941
- .pf-v6-c-jump-links.pf-m-non-expandable-on-md {
7942
- --pf-v6-c-jump-links__list--Display: flex;
7943
- --pf-v6-c-jump-links__toggle--Display: none;
7944
- --pf-v6-c-jump-links__label--Display: block;
7945
- }
7946
- }
7947
- @media (min-width: 992px) {
7948
- .pf-v6-c-jump-links.pf-m-expandable-on-lg {
7949
- --pf-v6-c-jump-links__list--Display: none;
7950
- --pf-v6-c-jump-links__toggle--Display: block;
7951
- --pf-v6-c-jump-links__label--Display: none;
7952
- }
7953
- .pf-v6-c-jump-links.pf-m-non-expandable-on-lg {
7954
- --pf-v6-c-jump-links__list--Display: flex;
7955
- --pf-v6-c-jump-links__toggle--Display: none;
7956
- --pf-v6-c-jump-links__label--Display: block;
7957
- }
7958
- }
7959
- @media (min-width: 1200px) {
7960
- .pf-v6-c-jump-links.pf-m-expandable-on-xl {
7961
- --pf-v6-c-jump-links__list--Display: none;
7962
- --pf-v6-c-jump-links__toggle--Display: block;
7963
- --pf-v6-c-jump-links__label--Display: none;
7964
- }
7965
- .pf-v6-c-jump-links.pf-m-non-expandable-on-xl {
7966
- --pf-v6-c-jump-links__list--Display: flex;
7967
- --pf-v6-c-jump-links__toggle--Display: none;
7968
- --pf-v6-c-jump-links__label--Display: block;
7969
- }
7970
- }
7971
- @media (min-width: 1450px) {
7972
- .pf-v6-c-jump-links.pf-m-expandable-on-2xl {
7973
- --pf-v6-c-jump-links__list--Display: none;
7974
- --pf-v6-c-jump-links__toggle--Display: block;
7975
- --pf-v6-c-jump-links__label--Display: none;
7976
- }
7977
- .pf-v6-c-jump-links.pf-m-non-expandable-on-2xl {
7978
- --pf-v6-c-jump-links__list--Display: flex;
7979
- --pf-v6-c-jump-links__toggle--Display: none;
7980
- --pf-v6-c-jump-links__label--Display: block;
7981
- }
7982
- }
7983
- .pf-v6-c-jump-links.pf-m-expanded {
7984
- --pf-v6-c-jump-links__list--Display: flex;
7985
- --pf-v6-c-jump-links__toggle--MarginBlockEnd: var(--pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd);
7986
- --pf-v6-c-jump-links__toggle-icon--Rotate: var(--pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate);
7987
- --pf-v6-c-jump-links__toggle-icon--Color: var(--pf-v6-c-jump-links--m-expanded__toggle-icon--Color);
8010
+ .pf-v6-c-sidebar__panel.pf-m-secondary {
8011
+ --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-v6-c-sidebar__panel--m-secondary--BackgroundColor);
7988
8012
  }
7989
8013
 
7990
- .pf-v6-c-jump-links__list {
7991
- position: relative;
7992
- display: var(--pf-v6-c-jump-links__list--Display);
7993
- flex-direction: var(--pf-v6-c-jump-links__list--FlexDirection);
7994
- padding-block-start: var(--pf-v6-c-jump-links__list--PaddingBlockStart);
7995
- padding-block-end: var(--pf-v6-c-jump-links__list--PaddingBlockEnd);
7996
- padding-inline-start: var(--pf-v6-c-jump-links__list--PaddingInlineStart);
7997
- padding-inline-end: var(--pf-v6-c-jump-links__list--PaddingInlineEnd);
8014
+ .pf-v6-c-sidebar__content {
8015
+ flex-grow: 1;
8016
+ order: var(--pf-v6-c-sidebar__content--Order);
8017
+ padding-block-start: var(--pf-v6-c-sidebar__content--PaddingBlockStart);
8018
+ padding-block-end: var(--pf-v6-c-sidebar__content--PaddingBlockEnd);
8019
+ padding-inline-start: var(--pf-v6-c-sidebar__content--PaddingInlineStart);
8020
+ padding-inline-end: var(--pf-v6-c-sidebar__content--PaddingInlineEnd);
8021
+ background-color: var(--pf-v6-c-sidebar__content--BackgroundColor);
7998
8022
  }
7999
8023
 
8000
- .pf-v6-c-jump-links__list::before {
8001
- position: absolute;
8002
- inset: 0;
8003
- pointer-events: none;
8004
- content: "";
8005
- border: solid var(--pf-v6-c-jump-links__list--before--BorderColor);
8006
- border-block-start-width: var(--pf-v6-c-jump-links__list--before--BorderBlockStartWidth);
8007
- border-block-end-width: var(--pf-v6-c-jump-links__list--before--BorderBlockEndWidth);
8008
- border-inline-start-width: var(--pf-v6-c-jump-links__list--before--BorderInlineStartWidth);
8009
- border-inline-end-width: var(--pf-v6-c-jump-links__list--before--BorderInlineEndWidth);
8024
+ .pf-v6-c-sidebar__content.pf-m-padding {
8025
+ --pf-v6-c-sidebar__content--PaddingBlockStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
8026
+ --pf-v6-c-sidebar__content--PaddingInlineEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd);
8027
+ --pf-v6-c-sidebar__content--PaddingBlockEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd);
8028
+ --pf-v6-c-sidebar__content--PaddingInlineStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
8010
8029
  }
8011
8030
 
8012
- .pf-v6-c-jump-links__list .pf-v6-c-jump-links__list {
8013
- --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
8014
- --pf-v6-c-jump-links__list--PaddingBlockEnd: 0;
8015
- --pf-v6-c-jump-links__link--PaddingBlockStart: var(--pf-v6-c-jump-links__list__list__link--PaddingBlockStart);
8016
- --pf-v6-c-jump-links__link--PaddingBlockEnd: var(--pf-v6-c-jump-links__list__list__link--PaddingBlockEnd);
8017
- --pf-v6-c-jump-links__link--PaddingInlineStart: var(--pf-v6-c-jump-links__list__list__link--PaddingInlineStart);
8018
- margin-block-start: var(--pf-v6-c-jump-links__list__list--MarginBlockStart);
8031
+ .pf-v6-c-sidebar__content.pf-m-no-background {
8032
+ --pf-v6-c-sidebar__content--BackgroundColor: transparent;
8019
8033
  }
8020
8034
 
8021
- .pf-v6-c-jump-links__link {
8022
- position: relative;
8023
- display: flex;
8024
- flex: 1;
8025
- padding-block-start: var(--pf-v6-c-jump-links__link--PaddingBlockStart);
8026
- padding-block-end: var(--pf-v6-c-jump-links__link--PaddingBlockEnd);
8027
- padding-inline-start: var(--pf-v6-c-jump-links__link--PaddingInlineStart);
8028
- padding-inline-end: var(--pf-v6-c-jump-links__link--PaddingInlineEnd);
8029
- text-decoration: none;
8030
- outline-offset: var(--pf-v6-c-jump-links__link--OutlineOffset);
8035
+ .pf-v6-c-sidebar__content.pf-m-secondary {
8036
+ --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-v6-c-sidebar__content--m-secondary--BackgroundColor);
8031
8037
  }
8032
8038
 
8033
- .pf-v6-c-jump-links__link:hover, .pf-v6-c-jump-links__link:focus {
8034
- --pf-v6-c-jump-links__link-text--Color: var(--pf-v6-c-jump-links__link--hover__link-text--Color);
8039
+ .pf-v6-c-sidebar__content + .pf-v6-c-sidebar__panel {
8040
+ --pf-v6-c-sidebar__panel--Order: 1;
8035
8041
  }
8036
8042
 
8037
- .pf-v6-c-jump-links__link::before {
8038
- position: absolute;
8039
- inset: 0;
8040
- pointer-events: none;
8041
- content: "";
8042
- border-color: var(--pf-v6-c-jump-links__link--before--BorderColor);
8043
- border-style: solid;
8044
- border-block-start-width: var(--pf-v6-c-jump-links__link--before--BorderBlockStartWidth);
8045
- border-block-end-width: var(--pf-v6-c-jump-links__link--before--BorderBlockEndWidth);
8046
- border-inline-start-width: var(--pf-v6-c-jump-links__link--before--BorderInlineStartWidth);
8047
- border-inline-end-width: var(--pf-v6-c-jump-links__link--before--BorderInlineEndWidth);
8043
+ :where(.pf-v6-c-sidebar__content:first-child) {
8044
+ --pf-v6-c-sidebar__content--Order: -1;
8048
8045
  }
8049
8046
 
8050
- .pf-v6-c-jump-links__item {
8051
- --pf-v6-c-jump-links__list--before--BorderColor: transparent;
8047
+ .pf-v6-c-sidebar.pf-m-no-background,
8048
+ .pf-v6-c-sidebar__panel.pf-m-no-background,
8049
+ .pf-v6-c-sidebar__content.pf-m-no-background {
8050
+ background-color: transparent;
8052
8051
  }
8053
8052
 
8054
- .pf-v6-c-jump-links__item.pf-m-current > .pf-v6-c-jump-links__link {
8055
- --pf-v6-c-jump-links__link--before--BorderBlockStartWidth: var(--pf-v6-c-jump-links__item--m-current__link--before--BorderBlockStartWidth);
8056
- --pf-v6-c-jump-links__link--before--BorderInlineStartWidth: var(--pf-v6-c-jump-links__item--m-current__link--before--BorderInlineStartWidth);
8057
- --pf-v6-c-jump-links__link--before--BorderColor: var(--pf-v6-c-jump-links__item--m-current__link--before--BorderColor);
8058
- --pf-v6-c-jump-links__link-text--Color: var(--pf-v6-c-jump-links__item--m-current__link-text--Color);
8053
+ .pf-v6-c-sidebar__panel.pf-m-width-default {
8054
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8059
8055
  }
8060
8056
 
8061
- .pf-v6-c-jump-links__link-text {
8062
- color: var(--pf-v6-c-jump-links__link-text--Color);
8057
+ .pf-v6-c-sidebar__panel.pf-m-width-25 {
8058
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8063
8059
  }
8064
8060
 
8065
- .pf-v6-c-jump-links__label {
8066
- display: var(--pf-v6-c-jump-links__label--Display);
8067
- margin-block-end: var(--pf-v6-c-jump-links__label--MarginBlockEnd);
8061
+ .pf-v6-c-sidebar__panel.pf-m-width-33 {
8062
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8068
8063
  }
8069
8064
 
8070
- .pf-v6-c-jump-links__main {
8071
- display: flex;
8072
- flex-direction: column;
8065
+ .pf-v6-c-sidebar__panel.pf-m-width-50 {
8066
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8073
8067
  }
8074
8068
 
8075
- .pf-v6-c-jump-links__toggle {
8076
- display: var(--pf-v6-c-jump-links__toggle--Display);
8077
- margin-block-start: var(--pf-v6-c-jump-links__toggle--MarginBlockStart);
8078
- margin-block-end: var(--pf-v6-c-jump-links__toggle--MarginBlockEnd);
8079
- margin-inline-start: var(--pf-v6-c-jump-links__toggle--MarginInlineStart);
8069
+ .pf-v6-c-sidebar__panel.pf-m-width-66 {
8070
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8080
8071
  }
8081
8072
 
8082
- .pf-v6-c-jump-links__toggle .pf-v6-c-button {
8083
- display: flex;
8084
- align-items: center;
8073
+ .pf-v6-c-sidebar__panel.pf-m-width-75 {
8074
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8085
8075
  }
8086
8076
 
8087
- .pf-v6-c-jump-links__toggle-icon {
8088
- display: inline-block;
8089
- color: var(--pf-v6-c-jump-links__toggle-icon--Color);
8090
- transition: var(--pf-v6-c-jump-links__toggle-icon--Transition);
8091
- transform: rotate(var(--pf-v6-c-jump-links__toggle-icon--Rotate));
8077
+ .pf-v6-c-sidebar__panel.pf-m-width-100 {
8078
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8092
8079
  }
8093
8080
 
8094
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-jump-links__toggle-icon {
8095
- scale: -1 1;
8081
+ @media (min-width: 576px) {
8082
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-sm {
8083
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8084
+ }
8085
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-sm {
8086
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8087
+ }
8088
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-sm {
8089
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8090
+ }
8091
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-sm {
8092
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8093
+ }
8094
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-sm {
8095
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8096
+ }
8097
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-sm {
8098
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8099
+ }
8100
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-sm {
8101
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8102
+ }
8096
8103
  }
8097
-
8098
- .pf-v6-c-jump-links__toggle-text {
8099
- margin-inline-start: var(--pf-v6-c-jump-links__toggle-text--MarginInlineStart);
8100
- color: var(--pf-v6-c-jump-links__toggle-text--Color);
8104
+ @media (min-width: 768px) {
8105
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-md {
8106
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8107
+ }
8108
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-md {
8109
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8110
+ }
8111
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-md {
8112
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8113
+ }
8114
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-md {
8115
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8116
+ }
8117
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-md {
8118
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8119
+ }
8120
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-md {
8121
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8122
+ }
8123
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-md {
8124
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8125
+ }
8101
8126
  }
8102
-
8103
- :where(:root, .pf-v6-c-sidebar) {
8104
- --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
8105
- --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
8106
- --pf-v6-c-sidebar--BorderWidth--base: var(--pf-t--global--border--width--regular);
8107
- --pf-v6-c-sidebar--BorderColor--base: var(--pf-t--global--border--color--default);
8108
- --pf-v6-c-sidebar__panel--PaddingBlockStart: 0;
8109
- --pf-v6-c-sidebar__panel--PaddingInlineEnd: 0;
8110
- --pf-v6-c-sidebar__panel--PaddingBlockEnd: 0;
8111
- --pf-v6-c-sidebar__panel--PaddingInlineStart: 0;
8112
- --pf-v6-c-sidebar__panel--Order: -1;
8113
- --pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
8114
- --pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
8115
- --pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
8116
- --pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
8117
- --pf-v6-c-sidebar__content--PaddingBlockStart: 0;
8118
- --pf-v6-c-sidebar__content--PaddingInlineEnd: 0;
8119
- --pf-v6-c-sidebar__content--PaddingBlockEnd: 0;
8120
- --pf-v6-c-sidebar__content--PaddingInlineStart: 0;
8121
- --pf-v6-c-sidebar__content--Order: 1;
8122
- --pf-v6-c-sidebar__content--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
8123
- --pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
8124
- --pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
8125
- --pf-v6-c-sidebar__content--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
8126
- --pf-v6-c-sidebar__main--FlexDirection: column;
8127
- --pf-v6-c-sidebar__main--md--FlexDirection: row;
8128
- --pf-v6-c-sidebar__main--AlignItems: stretch;
8129
- --pf-v6-c-sidebar__main--md--AlignItems: flex-start;
8130
- --pf-v6-c-sidebar__main--child--MarginBlockStart: 0;
8131
- --pf-v6-c-sidebar--m-gutter__main--Gap: var(--pf-v6-c-sidebar--inset);
8132
- --pf-v6-c-sidebar__main--m-border--before--Display: none;
8133
- --pf-v6-c-sidebar__main--m-border--before--md--Display: block;
8134
- --pf-v6-c-sidebar__main--m-border--before--BorderWidth: var(--pf-v6-c-sidebar--BorderWidth--base);
8135
- --pf-v6-c-sidebar__main--m-border--before--BorderColor: var(--pf-v6-c-sidebar--BorderColor--base);
8136
- --pf-v6-c-sidebar--m-panel-right__panel--Order: -1;
8137
- --pf-v6-c-sidebar--m-panel-right__panel--md--Order: 1;
8138
- --pf-v6-c-sidebar--m-panel-right__content--md--Order: -1;
8139
- --pf-v6-c-sidebar--m-stack__main--FlexDirection: column;
8140
- --pf-v6-c-sidebar--m-stack__main--AlignItems: stretch;
8141
- --pf-v6-c-sidebar--m-stack__panel--Position: sticky;
8142
- --pf-v6-c-sidebar--m-stack__panel--InsetBlockStart: 0;
8143
- --pf-v6-c-sidebar--m-stack__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
8144
- --pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order: -1;
8145
- --pf-v6-c-sidebar--m-split__main--AlignItems: flex-start;
8146
- --pf-v6-c-sidebar--m-split__main--FlexDirection: row;
8147
- --pf-v6-c-sidebar--m-split__panel--Position: static;
8148
- --pf-v6-c-sidebar--m-split__panel--InsetBlockStart: auto;
8149
- --pf-v6-c-sidebar--m-split--m-panel-right__panel--Order: 1;
8150
- --pf-v6-c-sidebar--m-split__main--m-border--before--Display: block;
8151
- --pf-v6-c-sidebar__panel--FlexBasis--base: auto;
8152
- --pf-v6-c-sidebar__panel--BoxShadow--base: var(--pf-t--global--box-shadow--md--bottom);
8153
- --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
8154
- --pf-v6-c-sidebar__panel--InsetBlockStart: 0;
8155
- --pf-v6-c-sidebar__panel--md--InsetBlockStart: auto;
8156
- --pf-v6-c-sidebar__panel--Position: sticky;
8157
- --pf-v6-c-sidebar__panel--md--Position: static;
8158
- --pf-v6-c-sidebar__panel--FlexBasis-base: auto;
8159
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis-base);
8160
- --pf-v6-c-sidebar__panel--md--FlexBasis: 15.625rem;
8161
- --pf-v6-c-sidebar__panel--m-split--FlexBasis: 15.625rem;
8162
- --pf-v6-c-sidebar__panel--m-stack--FlexBasis: auto;
8163
- --pf-v6-c-sidebar__panel--ZIndex: var(--pf-t--global--z-index--xs);
8164
- --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8165
- --pf-v6-c-sidebar__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
8166
- --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8167
- --pf-v6-c-sidebar__content--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
8168
- --pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart: 0;
8169
- --pf-v6-c-sidebar__panel--m-sticky--Position: sticky;
8170
- }
8171
-
8172
- .pf-v6-c-sidebar {
8173
- height: 100%;
8174
- }
8175
-
8176
- @media (min-width: 768px) {
8177
- .pf-v6-c-sidebar {
8178
- --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar__main--md--FlexDirection);
8179
- --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar__main--md--AlignItems);
8180
- --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar__main--m-border--before--md--Display);
8181
- --pf-v6-c-sidebar__panel--BoxShadow: none;
8182
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--md--FlexBasis);
8183
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--md--InsetBlockStart);
8184
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--md--Position);
8127
+ @media (min-width: 992px) {
8128
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-lg {
8129
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8130
+ }
8131
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-lg {
8132
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8133
+ }
8134
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-lg {
8135
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8136
+ }
8137
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-lg {
8138
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8139
+ }
8140
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-lg {
8141
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8142
+ }
8143
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-lg {
8144
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8145
+ }
8146
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-lg {
8147
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8185
8148
  }
8186
8149
  }
8187
8150
  @media (min-width: 1200px) {
8188
- .pf-v6-c-sidebar {
8189
- --pf-v6-c-sidebar--inset: var(--pf-v6-c-sidebar--xl--inset);
8151
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-xl {
8152
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8153
+ }
8154
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-xl {
8155
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8156
+ }
8157
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-xl {
8158
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8159
+ }
8160
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-xl {
8161
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8162
+ }
8163
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-xl {
8164
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8165
+ }
8166
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-xl {
8167
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8168
+ }
8169
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-xl {
8170
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8190
8171
  }
8191
8172
  }
8192
- .pf-v6-c-sidebar.pf-m-gutter > .pf-v6-c-sidebar__main {
8193
- gap: var(--pf-v6-c-sidebar--m-gutter__main--Gap);
8194
- }
8195
-
8196
- .pf-v6-c-sidebar.pf-m-panel-right {
8197
- --pf-v6-c-sidebar__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--Order);
8198
- --pf-v6-c-sidebar__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--Order);
8199
- }
8200
-
8201
- @media (min-width: 768px) {
8202
- .pf-v6-c-sidebar.pf-m-panel-right {
8203
- --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--md--Order);
8204
- --pf-v6-c-sidebar--m-panel-right__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--md--Order);
8173
+ @media (min-width: 1450px) {
8174
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-2xl {
8175
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8176
+ }
8177
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-2xl {
8178
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8179
+ }
8180
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-2xl {
8181
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8182
+ }
8183
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-2xl {
8184
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8185
+ }
8186
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-2xl {
8187
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8188
+ }
8189
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-2xl {
8190
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8191
+ }
8192
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-2xl {
8193
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8205
8194
  }
8206
8195
  }
8207
- .pf-v6-c-sidebar.pf-m-stack {
8208
- --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-stack__main--FlexDirection);
8209
- --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-stack__main--AlignItems);
8210
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-stack__panel--Position);
8211
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-stack__panel--InsetBlockStart);
8212
- --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar--m-stack__panel--BoxShadow);
8213
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-stack--FlexBasis);
8214
- --pf-v6-c-sidebar__main--m-border--before--Display: none;
8215
- --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order);
8196
+ :where(:root, .pf-v6-c-jump-links) {
8197
+ --pf-v6-c-jump-links__list--Display: flex;
8198
+ --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
8199
+ --pf-v6-c-jump-links__list--PaddingInlineEnd: var(--pf-t--global--spacer--md);
8200
+ --pf-v6-c-jump-links__list--PaddingBlockEnd: 0;
8201
+ --pf-v6-c-jump-links__list--PaddingInlineStart: var(--pf-t--global--spacer--md);
8202
+ --pf-v6-c-jump-links--m-vertical__list--PaddingBlockStart: var(--pf-t--global--spacer--md);
8203
+ --pf-v6-c-jump-links--m-vertical__list--PaddingInlineEnd: 0;
8204
+ --pf-v6-c-jump-links--m-vertical__list--PaddingBlockEnd: var(--pf-t--global--spacer--md);
8205
+ --pf-v6-c-jump-links--m-vertical__list--PaddingInlineStart: 0;
8206
+ --pf-v6-c-jump-links__list--FlexDirection: row;
8207
+ --pf-v6-c-jump-links--m-vertical__list--FlexDirection: column;
8208
+ --pf-v6-c-jump-links__list--before--BorderColor: var(--pf-t--global--border--color--default);
8209
+ --pf-v6-c-jump-links__list--before--BorderBlockStartWidth: var(--pf-t--global--border--width--box--default);
8210
+ --pf-v6-c-jump-links__list--before--BorderInlineEndWidth: 0;
8211
+ --pf-v6-c-jump-links__list--before--BorderBlockEndWidth: 0;
8212
+ --pf-v6-c-jump-links__list--before--BorderInlineStartWidth: 0;
8213
+ --pf-v6-c-jump-links--m-vertical__list--before--BorderInlineStartWidth: var(--pf-t--global--border--width--box--default);
8214
+ --pf-v6-c-jump-links--m-vertical__list--before--BorderBlockStartWidth: 0;
8215
+ --pf-v6-c-jump-links__list__list--MarginBlockStart: calc(var(--pf-t--global--spacer--sm) * -1);
8216
+ --pf-v6-c-jump-links__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
8217
+ --pf-v6-c-jump-links__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8218
+ --pf-v6-c-jump-links__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
8219
+ --pf-v6-c-jump-links__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8220
+ --pf-v6-c-jump-links__list__list__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
8221
+ --pf-v6-c-jump-links__list__list__link--PaddingInlineStart: var(--pf-t--global--spacer--lg);
8222
+ --pf-v6-c-jump-links__list__list__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
8223
+ --pf-v6-c-jump-links__link--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--sm));
8224
+ --pf-v6-c-jump-links__link--before--BorderBlockStartWidth: 0;
8225
+ --pf-v6-c-jump-links__link--before--BorderInlineEndWidth: 0;
8226
+ --pf-v6-c-jump-links__link--before--BorderBlockEndWidth: 0;
8227
+ --pf-v6-c-jump-links__link--before--BorderInlineStartWidth: 0;
8228
+ --pf-v6-c-jump-links__link--before--BorderColor: transparent;
8229
+ --pf-v6-c-jump-links__item--m-current__link--before--BorderBlockStartWidth: var(--pf-t--global--border--width--extra-strong);
8230
+ --pf-v6-c-jump-links__item--m-current__link--before--BorderInlineStartWidth: 0;
8231
+ --pf-v6-c-jump-links__item--m-current__link--before--BorderColor: var(--pf-t--global--border--color--clicked);
8232
+ --pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderBlockStartWidth: 0;
8233
+ --pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderInlineStartWidth: var(--pf-t--global--border--width--extra-strong);
8234
+ --pf-v6-c-jump-links__link-text--Color: var(--pf-t--global--text--color--subtle);
8235
+ --pf-v6-c-jump-links__link--hover__link-text--Color: var(--pf-t--global--text--color--subtle);
8236
+ --pf-v6-c-jump-links__item--m-current__link-text--Color: var(--pf-t--global--text--color--regular);
8237
+ --pf-v6-c-jump-links__label--MarginBlockEnd: var(--pf-t--global--spacer--md);
8238
+ --pf-v6-c-jump-links__label--Display: block;
8239
+ --pf-v6-c-jump-links__toggle--MarginBlockEnd: 0;
8240
+ --pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd: var(--pf-t--global--spacer--sm);
8241
+ --pf-v6-c-jump-links__toggle--Display: none;
8242
+ --pf-v6-c-jump-links__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
8243
+ --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-t--global--transition);
8244
+ --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
8245
+ --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
8246
+ --pf-v6-c-jump-links__toggle-text--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
8247
+ --pf-v6-c-jump-links__toggle-text--Color: var(--pf-t--global--text--color--regular);
8216
8248
  }
8217
8249
 
8218
- .pf-v6-c-sidebar.pf-m-split {
8219
- --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-split__main--FlexDirection);
8220
- --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-split__main--AlignItems);
8221
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-split__panel--Position);
8222
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-split__panel--InsetBlockStart);
8223
- --pf-v6-c-sidebar__panel--BoxShadow: none;
8224
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-split--FlexBasis);
8225
- --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar--m-split__main--m-border--before--Display);
8226
- --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-split--m-panel-right__panel--Order);
8250
+ .pf-v6-c-jump-links {
8251
+ display: flex;
8227
8252
  }
8228
8253
 
8229
- .pf-v6-c-sidebar__main {
8230
- display: flex;
8231
- flex-direction: var(--pf-v6-c-sidebar__main--FlexDirection);
8232
- align-items: var(--pf-v6-c-sidebar__main--AlignItems);
8254
+ .pf-v6-c-jump-links.pf-m-center {
8255
+ justify-content: center;
8233
8256
  }
8234
8257
 
8235
- .pf-v6-c-sidebar__main.pf-m-border::before {
8236
- display: var(--pf-v6-c-sidebar__main--m-border--before--Display);
8237
- flex: 0 0 var(--pf-v6-c-sidebar__main--m-border--before--BorderWidth);
8238
- align-self: stretch;
8239
- content: "";
8240
- background-color: var(--pf-v6-c-sidebar__main--m-border--before--BorderColor);
8258
+ .pf-v6-c-jump-links.pf-m-center .pf-v6-c-jump-links__main {
8259
+ align-items: center;
8241
8260
  }
8242
8261
 
8243
- .pf-v6-c-sidebar__panel {
8244
- position: var(--pf-v6-c-sidebar__panel--Position);
8245
- inset-block-start: var(--pf-v6-c-sidebar__panel--InsetBlockStart);
8246
- z-index: var(--pf-v6-c-sidebar__panel--ZIndex);
8247
- flex-basis: var(--pf-v6-c-sidebar__panel--FlexBasis);
8248
- flex-shrink: 0;
8249
- order: var(--pf-v6-c-sidebar__panel--Order);
8250
- padding-block-start: var(--pf-v6-c-sidebar__panel--PaddingBlockStart);
8251
- padding-block-end: var(--pf-v6-c-sidebar__panel--PaddingBlockEnd);
8252
- padding-inline-start: var(--pf-v6-c-sidebar__panel--PaddingInlineStart);
8253
- padding-inline-end: var(--pf-v6-c-sidebar__panel--PaddingInlineEnd);
8254
- background-color: var(--pf-v6-c-sidebar__panel--BackgroundColor);
8255
- box-shadow: var(--pf-v6-c-sidebar__panel--BoxShadow);
8262
+ .pf-v6-c-jump-links.pf-m-vertical, .pf-v6-c-jump-links.pf-m-expandable {
8263
+ --pf-v6-c-jump-links__list--PaddingBlockStart: var(--pf-v6-c-jump-links--m-vertical__list--PaddingBlockStart);
8264
+ --pf-v6-c-jump-links__list--PaddingInlineEnd: var(--pf-v6-c-jump-links--m-vertical__list--PaddingInlineEnd);
8265
+ --pf-v6-c-jump-links__list--PaddingBlockEnd: var(--pf-v6-c-jump-links--m-vertical__list--PaddingBlockEnd);
8266
+ --pf-v6-c-jump-links__list--PaddingInlineStart: var(--pf-v6-c-jump-links--m-vertical__list--PaddingInlineStart);
8267
+ --pf-v6-c-jump-links__list--before--BorderBlockStartWidth: var(--pf-v6-c-jump-links--m-vertical__list--before--BorderBlockStartWidth);
8268
+ --pf-v6-c-jump-links__list--before--BorderInlineStartWidth: var(--pf-v6-c-jump-links--m-vertical__list--before--BorderInlineStartWidth);
8269
+ --pf-v6-c-jump-links__item--m-current__link--before--BorderBlockStartWidth: var(--pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderBlockStartWidth);
8270
+ --pf-v6-c-jump-links__item--m-current__link--before--BorderInlineStartWidth: var(--pf-v6-c-jump-links--m-vertical__item--m-current__link--before--BorderInlineStartWidth);
8271
+ --pf-v6-c-jump-links__list--FlexDirection: var(--pf-v6-c-jump-links--m-vertical__list--FlexDirection);
8272
+ flex-direction: column;
8256
8273
  }
8257
8274
 
8258
- .pf-v6-c-sidebar__panel.pf-m-padding {
8259
- --pf-v6-c-sidebar__panel--PaddingBlockStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart);
8260
- --pf-v6-c-sidebar__panel--PaddingInlineEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd);
8261
- --pf-v6-c-sidebar__panel--PaddingBlockEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd);
8262
- --pf-v6-c-sidebar__panel--PaddingInlineStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart);
8275
+ .pf-v6-c-jump-links.pf-m-expandable {
8276
+ --pf-v6-c-jump-links__list--Display: none;
8277
+ --pf-v6-c-jump-links__toggle--Display: block;
8278
+ --pf-v6-c-jump-links__label--Display: none;
8263
8279
  }
8264
8280
 
8265
- .pf-v6-c-sidebar__panel.pf-m-sticky {
8266
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--m-sticky--Position);
8267
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart);
8281
+ .pf-v6-c-jump-links.pf-m-non-expandable {
8282
+ --pf-v6-c-jump-links__list--Display: flex;
8283
+ --pf-v6-c-jump-links__toggle--Display: none;
8284
+ --pf-v6-c-jump-links__label--Display: block;
8268
8285
  }
8269
8286
 
8270
- .pf-v6-c-sidebar__panel.pf-m-static {
8271
- --pf-v6-c-sidebar__panel--Position: static;
8272
- --pf-v6-c-sidebar__panel--InsetBlockStart: auto;
8287
+ @media (min-width: 576px) {
8288
+ .pf-v6-c-jump-links.pf-m-expandable-on-sm {
8289
+ --pf-v6-c-jump-links__list--Display: none;
8290
+ --pf-v6-c-jump-links__toggle--Display: block;
8291
+ --pf-v6-c-jump-links__label--Display: none;
8292
+ }
8293
+ .pf-v6-c-jump-links.pf-m-non-expandable-on-sm {
8294
+ --pf-v6-c-jump-links__list--Display: flex;
8295
+ --pf-v6-c-jump-links__toggle--Display: none;
8296
+ --pf-v6-c-jump-links__label--Display: block;
8297
+ }
8298
+ }
8299
+ @media (min-width: 768px) {
8300
+ .pf-v6-c-jump-links.pf-m-expandable-on-md {
8301
+ --pf-v6-c-jump-links__list--Display: none;
8302
+ --pf-v6-c-jump-links__toggle--Display: block;
8303
+ --pf-v6-c-jump-links__label--Display: none;
8304
+ }
8305
+ .pf-v6-c-jump-links.pf-m-non-expandable-on-md {
8306
+ --pf-v6-c-jump-links__list--Display: flex;
8307
+ --pf-v6-c-jump-links__toggle--Display: none;
8308
+ --pf-v6-c-jump-links__label--Display: block;
8309
+ }
8310
+ }
8311
+ @media (min-width: 992px) {
8312
+ .pf-v6-c-jump-links.pf-m-expandable-on-lg {
8313
+ --pf-v6-c-jump-links__list--Display: none;
8314
+ --pf-v6-c-jump-links__toggle--Display: block;
8315
+ --pf-v6-c-jump-links__label--Display: none;
8316
+ }
8317
+ .pf-v6-c-jump-links.pf-m-non-expandable-on-lg {
8318
+ --pf-v6-c-jump-links__list--Display: flex;
8319
+ --pf-v6-c-jump-links__toggle--Display: none;
8320
+ --pf-v6-c-jump-links__label--Display: block;
8321
+ }
8322
+ }
8323
+ @media (min-width: 1200px) {
8324
+ .pf-v6-c-jump-links.pf-m-expandable-on-xl {
8325
+ --pf-v6-c-jump-links__list--Display: none;
8326
+ --pf-v6-c-jump-links__toggle--Display: block;
8327
+ --pf-v6-c-jump-links__label--Display: none;
8328
+ }
8329
+ .pf-v6-c-jump-links.pf-m-non-expandable-on-xl {
8330
+ --pf-v6-c-jump-links__list--Display: flex;
8331
+ --pf-v6-c-jump-links__toggle--Display: none;
8332
+ --pf-v6-c-jump-links__label--Display: block;
8333
+ }
8334
+ }
8335
+ @media (min-width: 1450px) {
8336
+ .pf-v6-c-jump-links.pf-m-expandable-on-2xl {
8337
+ --pf-v6-c-jump-links__list--Display: none;
8338
+ --pf-v6-c-jump-links__toggle--Display: block;
8339
+ --pf-v6-c-jump-links__label--Display: none;
8340
+ }
8341
+ .pf-v6-c-jump-links.pf-m-non-expandable-on-2xl {
8342
+ --pf-v6-c-jump-links__list--Display: flex;
8343
+ --pf-v6-c-jump-links__toggle--Display: none;
8344
+ --pf-v6-c-jump-links__label--Display: block;
8345
+ }
8346
+ }
8347
+ .pf-v6-c-jump-links.pf-m-expanded {
8348
+ --pf-v6-c-jump-links__list--Display: flex;
8349
+ --pf-v6-c-jump-links__toggle--MarginBlockEnd: var(--pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd);
8350
+ --pf-v6-c-jump-links__toggle-icon--Rotate: var(--pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate);
8351
+ --pf-v6-c-jump-links__toggle-icon--Color: var(--pf-v6-c-jump-links--m-expanded__toggle-icon--Color);
8273
8352
  }
8274
8353
 
8275
- .pf-v6-c-sidebar__panel.pf-m-secondary {
8276
- --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-v6-c-sidebar__panel--m-secondary--BackgroundColor);
8354
+ .pf-v6-c-jump-links__list {
8355
+ position: relative;
8356
+ display: var(--pf-v6-c-jump-links__list--Display);
8357
+ flex-direction: var(--pf-v6-c-jump-links__list--FlexDirection);
8358
+ padding-block-start: var(--pf-v6-c-jump-links__list--PaddingBlockStart);
8359
+ padding-block-end: var(--pf-v6-c-jump-links__list--PaddingBlockEnd);
8360
+ padding-inline-start: var(--pf-v6-c-jump-links__list--PaddingInlineStart);
8361
+ padding-inline-end: var(--pf-v6-c-jump-links__list--PaddingInlineEnd);
8277
8362
  }
8278
8363
 
8279
- .pf-v6-c-sidebar__content {
8280
- flex-grow: 1;
8281
- order: var(--pf-v6-c-sidebar__content--Order);
8282
- padding-block-start: var(--pf-v6-c-sidebar__content--PaddingBlockStart);
8283
- padding-block-end: var(--pf-v6-c-sidebar__content--PaddingBlockEnd);
8284
- padding-inline-start: var(--pf-v6-c-sidebar__content--PaddingInlineStart);
8285
- padding-inline-end: var(--pf-v6-c-sidebar__content--PaddingInlineEnd);
8286
- background-color: var(--pf-v6-c-sidebar__content--BackgroundColor);
8364
+ .pf-v6-c-jump-links__list::before {
8365
+ position: absolute;
8366
+ inset: 0;
8367
+ pointer-events: none;
8368
+ content: "";
8369
+ border: solid var(--pf-v6-c-jump-links__list--before--BorderColor);
8370
+ border-block-start-width: var(--pf-v6-c-jump-links__list--before--BorderBlockStartWidth);
8371
+ border-block-end-width: var(--pf-v6-c-jump-links__list--before--BorderBlockEndWidth);
8372
+ border-inline-start-width: var(--pf-v6-c-jump-links__list--before--BorderInlineStartWidth);
8373
+ border-inline-end-width: var(--pf-v6-c-jump-links__list--before--BorderInlineEndWidth);
8287
8374
  }
8288
8375
 
8289
- .pf-v6-c-sidebar__content.pf-m-padding {
8290
- --pf-v6-c-sidebar__content--PaddingBlockStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
8291
- --pf-v6-c-sidebar__content--PaddingInlineEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd);
8292
- --pf-v6-c-sidebar__content--PaddingBlockEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd);
8293
- --pf-v6-c-sidebar__content--PaddingInlineStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
8376
+ .pf-v6-c-jump-links__list .pf-v6-c-jump-links__list {
8377
+ --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
8378
+ --pf-v6-c-jump-links__list--PaddingBlockEnd: 0;
8379
+ --pf-v6-c-jump-links__link--PaddingBlockStart: var(--pf-v6-c-jump-links__list__list__link--PaddingBlockStart);
8380
+ --pf-v6-c-jump-links__link--PaddingBlockEnd: var(--pf-v6-c-jump-links__list__list__link--PaddingBlockEnd);
8381
+ --pf-v6-c-jump-links__link--PaddingInlineStart: var(--pf-v6-c-jump-links__list__list__link--PaddingInlineStart);
8382
+ margin-block-start: var(--pf-v6-c-jump-links__list__list--MarginBlockStart);
8294
8383
  }
8295
8384
 
8296
- .pf-v6-c-sidebar__content.pf-m-no-background {
8297
- --pf-v6-c-sidebar__content--BackgroundColor: transparent;
8385
+ .pf-v6-c-jump-links__link {
8386
+ position: relative;
8387
+ display: flex;
8388
+ flex: 1;
8389
+ padding-block-start: var(--pf-v6-c-jump-links__link--PaddingBlockStart);
8390
+ padding-block-end: var(--pf-v6-c-jump-links__link--PaddingBlockEnd);
8391
+ padding-inline-start: var(--pf-v6-c-jump-links__link--PaddingInlineStart);
8392
+ padding-inline-end: var(--pf-v6-c-jump-links__link--PaddingInlineEnd);
8393
+ text-decoration: none;
8394
+ outline-offset: var(--pf-v6-c-jump-links__link--OutlineOffset);
8298
8395
  }
8299
8396
 
8300
- .pf-v6-c-sidebar__content.pf-m-secondary {
8301
- --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-v6-c-sidebar__content--m-secondary--BackgroundColor);
8397
+ .pf-v6-c-jump-links__link:hover, .pf-v6-c-jump-links__link:focus {
8398
+ --pf-v6-c-jump-links__link-text--Color: var(--pf-v6-c-jump-links__link--hover__link-text--Color);
8302
8399
  }
8303
8400
 
8304
- .pf-v6-c-sidebar__content + .pf-v6-c-sidebar__panel {
8305
- --pf-v6-c-sidebar__panel--Order: 1;
8401
+ .pf-v6-c-jump-links__link::before {
8402
+ position: absolute;
8403
+ inset: 0;
8404
+ pointer-events: none;
8405
+ content: "";
8406
+ border-color: var(--pf-v6-c-jump-links__link--before--BorderColor);
8407
+ border-style: solid;
8408
+ border-block-start-width: var(--pf-v6-c-jump-links__link--before--BorderBlockStartWidth);
8409
+ border-block-end-width: var(--pf-v6-c-jump-links__link--before--BorderBlockEndWidth);
8410
+ border-inline-start-width: var(--pf-v6-c-jump-links__link--before--BorderInlineStartWidth);
8411
+ border-inline-end-width: var(--pf-v6-c-jump-links__link--before--BorderInlineEndWidth);
8306
8412
  }
8307
8413
 
8308
- :where(.pf-v6-c-sidebar__content:first-child) {
8309
- --pf-v6-c-sidebar__content--Order: -1;
8414
+ .pf-v6-c-jump-links__item {
8415
+ --pf-v6-c-jump-links__list--before--BorderColor: transparent;
8310
8416
  }
8311
8417
 
8312
- .pf-v6-c-sidebar.pf-m-no-background,
8313
- .pf-v6-c-sidebar__panel.pf-m-no-background,
8314
- .pf-v6-c-sidebar__content.pf-m-no-background {
8315
- background-color: transparent;
8418
+ .pf-v6-c-jump-links__item.pf-m-current > .pf-v6-c-jump-links__link {
8419
+ --pf-v6-c-jump-links__link--before--BorderBlockStartWidth: var(--pf-v6-c-jump-links__item--m-current__link--before--BorderBlockStartWidth);
8420
+ --pf-v6-c-jump-links__link--before--BorderInlineStartWidth: var(--pf-v6-c-jump-links__item--m-current__link--before--BorderInlineStartWidth);
8421
+ --pf-v6-c-jump-links__link--before--BorderColor: var(--pf-v6-c-jump-links__item--m-current__link--before--BorderColor);
8422
+ --pf-v6-c-jump-links__link-text--Color: var(--pf-v6-c-jump-links__item--m-current__link-text--Color);
8316
8423
  }
8317
8424
 
8318
- .pf-v6-c-sidebar__panel.pf-m-width-default {
8319
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8425
+ .pf-v6-c-jump-links__link-text {
8426
+ color: var(--pf-v6-c-jump-links__link-text--Color);
8320
8427
  }
8321
8428
 
8322
- .pf-v6-c-sidebar__panel.pf-m-width-25 {
8323
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8429
+ .pf-v6-c-jump-links__label {
8430
+ display: var(--pf-v6-c-jump-links__label--Display);
8431
+ margin-block-end: var(--pf-v6-c-jump-links__label--MarginBlockEnd);
8324
8432
  }
8325
8433
 
8326
- .pf-v6-c-sidebar__panel.pf-m-width-33 {
8327
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8434
+ .pf-v6-c-jump-links__main {
8435
+ display: flex;
8436
+ flex-direction: column;
8328
8437
  }
8329
8438
 
8330
- .pf-v6-c-sidebar__panel.pf-m-width-50 {
8331
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8439
+ .pf-v6-c-jump-links__toggle {
8440
+ display: var(--pf-v6-c-jump-links__toggle--Display);
8441
+ margin-block-end: var(--pf-v6-c-jump-links__toggle--MarginBlockEnd);
8332
8442
  }
8333
8443
 
8334
- .pf-v6-c-sidebar__panel.pf-m-width-66 {
8335
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8444
+ .pf-v6-c-jump-links__toggle-icon {
8445
+ display: inline-block;
8446
+ color: var(--pf-v6-c-jump-links__toggle-icon--Color);
8447
+ transition: var(--pf-v6-c-jump-links__toggle-icon--Transition);
8448
+ transform: rotate(var(--pf-v6-c-jump-links__toggle-icon--Rotate));
8336
8449
  }
8337
8450
 
8338
- .pf-v6-c-sidebar__panel.pf-m-width-75 {
8339
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8451
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-jump-links__toggle-icon {
8452
+ scale: -1 1;
8340
8453
  }
8341
8454
 
8342
- .pf-v6-c-sidebar__panel.pf-m-width-100 {
8343
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8455
+ .pf-v6-c-jump-links__toggle-text {
8456
+ margin-inline-start: var(--pf-v6-c-jump-links__toggle-text--MarginInlineStart);
8457
+ color: var(--pf-v6-c-jump-links__toggle-text--Color);
8344
8458
  }
8345
8459
 
8346
- @media (min-width: 576px) {
8347
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-sm {
8348
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8349
- }
8350
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-sm {
8351
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8352
- }
8353
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-sm {
8354
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8355
- }
8356
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-sm {
8357
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8358
- }
8359
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-sm {
8360
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8361
- }
8362
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-sm {
8363
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8364
- }
8365
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-sm {
8366
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8367
- }
8368
- }
8369
- @media (min-width: 768px) {
8370
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-md {
8371
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8372
- }
8373
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-md {
8374
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8375
- }
8376
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-md {
8377
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8378
- }
8379
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-md {
8380
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8381
- }
8382
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-md {
8383
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8384
- }
8385
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-md {
8386
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8387
- }
8388
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-md {
8389
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8390
- }
8391
- }
8392
- @media (min-width: 992px) {
8393
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-lg {
8394
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8395
- }
8396
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-lg {
8397
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8398
- }
8399
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-lg {
8400
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8401
- }
8402
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-lg {
8403
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8404
- }
8405
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-lg {
8406
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8407
- }
8408
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-lg {
8409
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8410
- }
8411
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-lg {
8412
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8413
- }
8414
- }
8415
- @media (min-width: 1200px) {
8416
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-xl {
8417
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8418
- }
8419
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-xl {
8420
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8421
- }
8422
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-xl {
8423
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8424
- }
8425
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-xl {
8426
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8427
- }
8428
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-xl {
8429
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8430
- }
8431
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-xl {
8432
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8433
- }
8434
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-xl {
8435
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8436
- }
8437
- }
8438
- @media (min-width: 1450px) {
8439
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-2xl {
8440
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8441
- }
8442
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-2xl {
8443
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8444
- }
8445
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-2xl {
8446
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8447
- }
8448
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-2xl {
8449
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8450
- }
8451
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-2xl {
8452
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8453
- }
8454
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-2xl {
8455
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8456
- }
8457
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-2xl {
8458
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8459
- }
8460
- }
8461
8460
  :where(:root, .pf-v6-c-label) {
8462
8461
  --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8463
8462
  --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
@@ -11197,6 +11196,7 @@ ul.pf-v6-c-list {
11197
11196
  line-height: var(--pf-v6-c-nav__link--LineHeight, inherit);
11198
11197
  color: var(--pf-v6-c-nav__link--Color);
11199
11198
  text-align: start;
11199
+ text-decoration: none;
11200
11200
  background-color: var(--pf-v6-c-nav__link--BackgroundColor);
11201
11201
  border: none;
11202
11202
  border-radius: var(--pf-v6-c-nav__link--BorderRadius);
@@ -11698,11 +11698,11 @@ ul.pf-v6-c-list {
11698
11698
  --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--large);
11699
11699
  --pf-v6-c-page__main-container--BorderWidth: var(--pf-t--global--spacer--sm);
11700
11700
  --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
11701
- --pf-v6-c-page__main-section--MarginBlockStart: var(--pf-t--global--spacer--md);
11702
- --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--lg);
11703
- --pf-v6-c-page__main-section--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
11704
- --pf-v6-c-page__main-section--PaddingBlockEnd: 0;
11705
- --pf-v6-c-page__main-section--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
11701
+ --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
11702
+ --pf-v6-c-page__main-section--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
11703
+ --pf-v6-c-page__main-section--PaddingBlockEnd: var(--pf-t--global--spacer--md);
11704
+ --pf-v6-c-page__main-section--PaddingInlineStart: var(--pf-t--global--spacer--lg);
11705
+ --pf-v6-c-page__main-section--RowGap: var(--pf-t--global--spacer--lg);
11706
11706
  --pf-v6-c-page__main-breadcrumb--main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
11707
11707
  --pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
11708
11708
  --pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -11737,6 +11737,7 @@ ul.pf-v6-c-list {
11737
11737
  --pf-v6-c-page__main-tabs--PaddingBlockStart: 0;
11738
11738
  --pf-v6-c-page__main-tabs--PaddingInlineEnd: 0;
11739
11739
  --pf-v6-c-page__main-tabs--PaddingBlockEnd: 0;
11740
+ --pf-v6-c-page__main-tabs--PaddingInlineStart: 0;
11740
11741
  --pf-v6-c-page__main-tabs--BackgroundColor: var(--pf-t--global--background--color--primary--default);
11741
11742
  --pf-v6-c-page__main-wizard--BackgroundColor: var(--pf-t--global--background--color--primary--default);
11742
11743
  --pf-v6-c-page__main-wizard--BorderBlockStartColor: var(--pf-t--global--border--color--default);
@@ -11855,22 +11856,11 @@ ul.pf-v6-c-list {
11855
11856
  flex-grow: 0;
11856
11857
  }
11857
11858
 
11858
- .pf-v6-c-page__main-nav.pf-m-limit-width,
11859
- .pf-v6-c-page__main-breadcrumb.pf-m-limit-width,
11860
- .pf-v6-c-page__main-tabs.pf-m-limit-width,
11861
- .pf-v6-c-page__main-section.pf-m-limit-width,
11862
- .pf-v6-c-page__main-wizard.pf-m-limit-width {
11863
- display: flex;
11864
- flex-direction: column;
11865
- padding: 0;
11866
- }
11867
-
11868
11859
  .pf-v6-c-page__main-nav.pf-m-limit-width > .pf-v6-c-page__main-body,
11869
11860
  .pf-v6-c-page__main-breadcrumb.pf-m-limit-width > .pf-v6-c-page__main-body,
11870
11861
  .pf-v6-c-page__main-tabs.pf-m-limit-width > .pf-v6-c-page__main-body,
11871
11862
  .pf-v6-c-page__main-section.pf-m-limit-width > .pf-v6-c-page__main-body,
11872
11863
  .pf-v6-c-page__main-wizard.pf-m-limit-width > .pf-v6-c-page__main-body {
11873
- flex: 1;
11874
11864
  max-width: var(--pf-v6-c-page--section--m-limit-width--MaxWidth);
11875
11865
  }
11876
11866
 
@@ -11897,6 +11887,8 @@ ul.pf-v6-c-list {
11897
11887
  .pf-v6-c-page__main-wizard,
11898
11888
  .pf-v6-c-page__main-group,
11899
11889
  .pf-v6-c-page__main-subnav {
11890
+ display: flex;
11891
+ flex-direction: column;
11900
11892
  flex-shrink: 0;
11901
11893
  }
11902
11894
 
@@ -12123,6 +12115,7 @@ ul.pf-v6-c-list {
12123
12115
  .pf-v6-c-page__main-list {
12124
12116
  display: flex;
12125
12117
  flex-direction: column;
12118
+ flex-grow: 1;
12126
12119
  }
12127
12120
 
12128
12121
  .pf-v6-c-page__main-nav {
@@ -12243,10 +12236,11 @@ ul.pf-v6-c-list {
12243
12236
  }
12244
12237
 
12245
12238
  .pf-v6-c-page__main-section {
12239
+ gap: var(--pf-v6-c-page__main-section--RowGap);
12246
12240
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12247
12241
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12248
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12249
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12242
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12243
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12250
12244
  background-color: var(--pf-v6-c-page__main-section--BackgroundColor);
12251
12245
  }
12252
12246
 
@@ -12257,8 +12251,8 @@ ul.pf-v6-c-list {
12257
12251
  .pf-v6-c-page__main-section.pf-m-padding {
12258
12252
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12259
12253
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12260
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12261
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12254
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12255
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12262
12256
  }
12263
12257
 
12264
12258
  .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width {
@@ -12268,8 +12262,8 @@ ul.pf-v6-c-list {
12268
12262
  .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width .pf-v6-c-page__main-body {
12269
12263
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12270
12264
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12271
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12272
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12265
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12266
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12273
12267
  }
12274
12268
 
12275
12269
  .pf-v6-c-page__main-section.pf-m-no-padding, .pf-v6-c-page__main-section.pf-m-no-padding.pf-m-limit-width .pf-v6-c-page__main-body {
@@ -12280,8 +12274,8 @@ ul.pf-v6-c-list {
12280
12274
  .pf-v6-c-page__main-section.pf-m-padding-on-sm {
12281
12275
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12282
12276
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12283
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12284
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12277
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12278
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12285
12279
  }
12286
12280
  .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width {
12287
12281
  padding: 0;
@@ -12289,8 +12283,8 @@ ul.pf-v6-c-list {
12289
12283
  .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
12290
12284
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12291
12285
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12292
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12293
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12286
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12287
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12294
12288
  }
12295
12289
  .pf-v6-c-page__main-section.pf-m-no-padding-on-sm, .pf-v6-c-page__main-section.pf-m-no-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
12296
12290
  padding: 0;
@@ -12300,8 +12294,8 @@ ul.pf-v6-c-list {
12300
12294
  .pf-v6-c-page__main-section.pf-m-padding-on-md {
12301
12295
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12302
12296
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12303
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12304
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12297
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12298
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12305
12299
  }
12306
12300
  .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width {
12307
12301
  padding: 0;
@@ -12309,8 +12303,8 @@ ul.pf-v6-c-list {
12309
12303
  .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
12310
12304
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12311
12305
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12312
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12313
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12306
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12307
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12314
12308
  }
12315
12309
  .pf-v6-c-page__main-section.pf-m-no-padding-on-md, .pf-v6-c-page__main-section.pf-m-no-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
12316
12310
  padding: 0;
@@ -12320,8 +12314,8 @@ ul.pf-v6-c-list {
12320
12314
  .pf-v6-c-page__main-section.pf-m-padding-on-lg {
12321
12315
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12322
12316
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12323
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12324
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12317
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12318
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12325
12319
  }
12326
12320
  .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width {
12327
12321
  padding: 0;
@@ -12329,8 +12323,8 @@ ul.pf-v6-c-list {
12329
12323
  .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
12330
12324
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12331
12325
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12332
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12333
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12326
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12327
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12334
12328
  }
12335
12329
  .pf-v6-c-page__main-section.pf-m-no-padding-on-lg, .pf-v6-c-page__main-section.pf-m-no-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
12336
12330
  padding: 0;
@@ -12340,8 +12334,8 @@ ul.pf-v6-c-list {
12340
12334
  .pf-v6-c-page__main-section.pf-m-padding-on-xl {
12341
12335
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12342
12336
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12343
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12344
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12337
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12338
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12345
12339
  }
12346
12340
  .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width {
12347
12341
  padding: 0;
@@ -12349,8 +12343,8 @@ ul.pf-v6-c-list {
12349
12343
  .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
12350
12344
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12351
12345
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12352
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12353
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12346
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12347
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12354
12348
  }
12355
12349
  .pf-v6-c-page__main-section.pf-m-no-padding-on-xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
12356
12350
  padding: 0;
@@ -12360,8 +12354,8 @@ ul.pf-v6-c-list {
12360
12354
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl {
12361
12355
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12362
12356
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12363
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12364
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12357
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12358
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12365
12359
  }
12366
12360
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width {
12367
12361
  padding: 0;
@@ -12369,8 +12363,8 @@ ul.pf-v6-c-list {
12369
12363
  .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
12370
12364
  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12371
12365
  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12372
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12373
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12366
+ padding-inline-start: calc(var(--pf-v6-c-page__main-section--PaddingInlineStart) - var(--pf-v6-c-page__main-container--BorderWidth));
12367
+ padding-inline-end: calc(var(--pf-v6-c-page__main-section--PaddingInlineEnd) - var(--pf-v6-c-page__main-container--BorderWidth));
12374
12368
  }
12375
12369
  .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
12376
12370
  padding: 0;
@@ -12396,28 +12390,16 @@ ul.pf-v6-c-list {
12396
12390
  }
12397
12391
 
12398
12392
  .pf-v6-c-page__main-nav .pf-v6-c-page__main-body {
12399
- padding-block-start: var(--pf-v6-c-page__main-nav--PaddingBlockStart);
12400
12393
  padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
12401
12394
  padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
12402
12395
  }
12403
-
12404
- .pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
12405
- padding-block-start: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockStart);
12406
- padding-block-end: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockEnd);
12407
- padding-inline-start: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineStart);
12408
- padding-inline-end: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineEnd);
12409
- }
12410
-
12411
- .pf-v6-c-page__main-section .pf-v6-c-page__main-body {
12412
- padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
12413
- padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
12414
- padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
12415
- padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
12396
+
12397
+ .pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
12398
+ padding-inline-start: 0;
12399
+ padding-inline-end: 0;
12416
12400
  }
12417
12401
 
12418
12402
  .pf-v6-c-page__main-tabs .pf-v6-c-page__main-body {
12419
- padding-block-start: var(--pf-v6-c-page__main-tabs--PaddingBlockStart);
12420
- padding-block-end: var(--pf-v6-c-page__main-tabs--PaddingBlockEnd);
12421
12403
  padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingInlineStart);
12422
12404
  padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
12423
12405
  }
@@ -15785,6 +15767,123 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15785
15767
  --pf-v6-c-tab-content__body--PaddingInlineStart: var(--pf-v6-c-tab-content__body--m-padding--PaddingInlineStart);
15786
15768
  }
15787
15769
 
15770
+ :where(:root, .pf-v6-c-title) {
15771
+ --pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
15772
+ --pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15773
+ --pf-v6-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
15774
+ --pf-v6-c-title--m-4xl--FontWeight: var(--pf-t--global--font--weight--heading);
15775
+ --pf-v6-c-title--m-3xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15776
+ --pf-v6-c-title--m-3xl--FontSize: var(--pf-t--global--font--size--heading--xl);
15777
+ --pf-v6-c-title--m-3xl--FontWeight: var(--pf-t--global--font--weight--heading);
15778
+ --pf-v6-c-title--m-2xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15779
+ --pf-v6-c-title--m-2xl--FontSize: var(--pf-t--global--font--size--heading--lg);
15780
+ --pf-v6-c-title--m-2xl--FontWeight: var(--pf-t--global--font--weight--heading);
15781
+ --pf-v6-c-title--m-xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15782
+ --pf-v6-c-title--m-xl--FontSize: var(--pf-t--global--font--size--heading--md);
15783
+ --pf-v6-c-title--m-xl--FontWeight: var(--pf-t--global--font--weight--heading);
15784
+ --pf-v6-c-title--m-lg--LineHeight: var(--pf-t--global--font--line-height--heading);
15785
+ --pf-v6-c-title--m-lg--FontSize: var(--pf-t--global--font--size--heading--sm);
15786
+ --pf-v6-c-title--m-lg--FontWeight: var(--pf-t--global--font--weight--heading);
15787
+ --pf-v6-c-title--m-md--LineHeight: var(--pf-t--global--font--line-height--heading);
15788
+ --pf-v6-c-title--m-md--FontSize: var(--pf-t--global--font--size--heading--xs);
15789
+ --pf-v6-c-title--m-md--FontWeight: var(--pf-t--global--font--weight--heading);
15790
+ --pf-v6-c-title--m-h1--LineHeight: var(--pf-t--global--font--line-height--heading);
15791
+ --pf-v6-c-title--m-h1--FontSize: var(--pf-t--global--font--size--heading--h1);
15792
+ --pf-v6-c-title--m-h1--FontWeight: var(--pf-t--global--font--weight--heading);
15793
+ --pf-v6-c-title--m-h2--LineHeight: var(--pf-t--global--font--line-height--heading);
15794
+ --pf-v6-c-title--m-h2--FontSize: var(--pf-t--global--font--size--heading--h2);
15795
+ --pf-v6-c-title--m-h2--FontWeight: var(--pf-t--global--font--weight--heading);
15796
+ --pf-v6-c-title--m-h3--LineHeight: var(--pf-t--global--font--line-height--heading);
15797
+ --pf-v6-c-title--m-h3--FontSize: var(--pf-t--global--font--size--heading--h3);
15798
+ --pf-v6-c-title--m-h3--FontWeight: var(--pf-t--global--font--weight--heading);
15799
+ --pf-v6-c-title--m-h4--LineHeight: var(--pf-t--global--font--line-height--heading);
15800
+ --pf-v6-c-title--m-h4--FontSize: var(--pf-t--global--font--size--heading--h4);
15801
+ --pf-v6-c-title--m-h4--FontWeight: var(--pf-t--global--font--weight--heading);
15802
+ --pf-v6-c-title--m-h5--LineHeight: var(--pf-t--global--font--line-height--heading);
15803
+ --pf-v6-c-title--m-h5--FontSize: var(--pf-t--global--font--size--heading--h5);
15804
+ --pf-v6-c-title--m-h5--FontWeight: var(--pf-t--global--font--weight--heading);
15805
+ --pf-v6-c-title--m-h6--LineHeight: var(--pf-t--global--font--line-height--heading);
15806
+ --pf-v6-c-title--m-h6--FontSize: var(--pf-t--global--font--size--heading--h6);
15807
+ --pf-v6-c-title--m-h6--FontWeight: var(--pf-t--global--font--weight--heading);
15808
+ }
15809
+
15810
+ .pf-v6-c-title {
15811
+ font-family: var(--pf-v6-c-title--FontFamily);
15812
+ word-break: break-word;
15813
+ }
15814
+
15815
+ .pf-v6-c-title.pf-m-4xl {
15816
+ font-size: var(--pf-v6-c-title--m-4xl--FontSize);
15817
+ font-weight: var(--pf-v6-c-title--m-4xl--FontWeight);
15818
+ line-height: var(--pf-v6-c-title--m-4xl--LineHeight);
15819
+ }
15820
+
15821
+ .pf-v6-c-title.pf-m-3xl {
15822
+ font-size: var(--pf-v6-c-title--m-3xl--FontSize);
15823
+ font-weight: var(--pf-v6-c-title--m-3xl--FontWeight);
15824
+ line-height: var(--pf-v6-c-title--m-3xl--LineHeight);
15825
+ }
15826
+
15827
+ .pf-v6-c-title.pf-m-2xl {
15828
+ font-size: var(--pf-v6-c-title--m-2xl--FontSize);
15829
+ font-weight: var(--pf-v6-c-title--m-2xl--FontWeight);
15830
+ line-height: var(--pf-v6-c-title--m-2xl--LineHeight);
15831
+ }
15832
+
15833
+ .pf-v6-c-title.pf-m-xl {
15834
+ font-size: var(--pf-v6-c-title--m-xl--FontSize);
15835
+ font-weight: var(--pf-v6-c-title--m-xl--FontWeight);
15836
+ line-height: var(--pf-v6-c-title--m-xl--LineHeight);
15837
+ }
15838
+
15839
+ .pf-v6-c-title.pf-m-lg {
15840
+ font-size: var(--pf-v6-c-title--m-lg--FontSize);
15841
+ font-weight: var(--pf-v6-c-title--m-lg--FontWeight);
15842
+ line-height: var(--pf-v6-c-title--m-lg--LineHeight);
15843
+ }
15844
+
15845
+ .pf-v6-c-title.pf-m-md {
15846
+ font-size: var(--pf-v6-c-title--m-md--FontSize);
15847
+ font-weight: var(--pf-v6-c-title--m-md--FontWeight);
15848
+ line-height: var(--pf-v6-c-title--m-md--LineHeight);
15849
+ }
15850
+
15851
+ .pf-v6-c-title.pf-m-h1 {
15852
+ font-size: var(--pf-v6-c-title--m-h1--FontSize);
15853
+ font-weight: var(--pf-v6-c-title--m-h1--FontWeight);
15854
+ line-height: var(--pf-v6-c-title--m-h1--LineHeight);
15855
+ }
15856
+
15857
+ .pf-v6-c-title.pf-m-h2 {
15858
+ font-size: var(--pf-v6-c-title--m-h2--FontSize);
15859
+ font-weight: var(--pf-v6-c-title--m-h2--FontWeight);
15860
+ line-height: var(--pf-v6-c-title--m-h2--LineHeight);
15861
+ }
15862
+
15863
+ .pf-v6-c-title.pf-m-h3 {
15864
+ font-size: var(--pf-v6-c-title--m-h3--FontSize);
15865
+ font-weight: var(--pf-v6-c-title--m-h3--FontWeight);
15866
+ line-height: var(--pf-v6-c-title--m-h3--LineHeight);
15867
+ }
15868
+
15869
+ .pf-v6-c-title.pf-m-h4 {
15870
+ font-size: var(--pf-v6-c-title--m-h4--FontSize);
15871
+ font-weight: var(--pf-v6-c-title--m-h4--FontWeight);
15872
+ line-height: var(--pf-v6-c-title--m-h4--LineHeight);
15873
+ }
15874
+
15875
+ .pf-v6-c-title.pf-m-h5 {
15876
+ font-size: var(--pf-v6-c-title--m-h5--FontSize);
15877
+ font-weight: var(--pf-v6-c-title--m-h5--FontWeight);
15878
+ line-height: var(--pf-v6-c-title--m-h5--LineHeight);
15879
+ }
15880
+
15881
+ .pf-v6-c-title.pf-m-h6 {
15882
+ font-size: var(--pf-v6-c-title--m-h6--FontSize);
15883
+ font-weight: var(--pf-v6-c-title--m-h6--FontWeight);
15884
+ line-height: var(--pf-v6-c-title--m-h6--LineHeight);
15885
+ }
15886
+
15788
15887
  :where(:root, .pf-v6-c-tile) {
15789
15888
  --pf-v6-c-tile--PaddingBlockStart: var(--pf-t--global--spacer--lg);
15790
15889
  --pf-v6-c-tile--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -15849,209 +15948,92 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15849
15948
  --pf-v6-c-tile--before--BorderWidth: var(--pf-v6-c-tile--m-selected--before--BorderWidth);
15850
15949
  }
15851
15950
 
15852
- .pf-v6-c-tile.pf-m-disabled {
15853
- --pf-v6-c-tile--BackgroundColor: var(--pf-v6-c-tile--m-disabled--BackgroundColor);
15854
- --pf-v6-c-tile__title--Color: var(--pf-v6-c-tile--m-disabled__title--Color);
15855
- --pf-v6-c-tile__icon--Color: var(--pf-v6-c-tile--m-disabled__icon--Color);
15856
- --pf-v6-c-tile__body--Color: var(--pf-v6-c-tile--m-disabled__body--Color);
15857
- --pf-v6-c-tile--before--BorderWidth: 0;
15858
- pointer-events: none;
15859
- }
15860
-
15861
- .pf-v6-c-tile.pf-m-display-lg .pf-v6-c-tile__header.pf-m-stacked {
15862
- --pf-v6-c-tile__icon--FontSize: var(--pf-v6-c-tile--m-display-lg__header--m-stacked__icon--FontSize);
15863
- }
15864
-
15865
- .pf-v6-c-tile__header {
15866
- display: flex;
15867
- align-items: center;
15868
- }
15869
-
15870
- .pf-v6-c-tile__header.pf-m-stacked {
15871
- --pf-v6-c-tile__icon--MarginInlineEnd: 0;
15872
- --pf-v6-c-tile__icon--FontSize: var(--pf-v6-c-tile__header--m-stacked__icon--FontSize);
15873
- flex-direction: column;
15874
- align-items: flex-start;
15875
- }
15876
-
15877
- .pf-v6-c-tile__header.pf-m-stacked .pf-v6-c-tile__icon {
15878
- display: flex;
15879
- align-items: center;
15880
- margin-block-end: var(--pf-v6-c-tile__header--m-stacked__icon--MarginBlockEnd);
15881
- }
15882
-
15883
- .pf-v6-c-tile__title {
15884
- font-weight: var(--pf-v6-c-tile__title--FontWeight);
15885
- color: var(--pf-v6-c-tile__title--Color);
15886
- }
15887
-
15888
- .pf-v6-c-tile__body {
15889
- font-size: var(--pf-v6-c-tile__body--FontSize);
15890
- color: var(--pf-v6-c-tile__body--Color);
15891
- }
15892
-
15893
- .pf-v6-c-tile__icon {
15894
- margin-inline-end: var(--pf-v6-c-tile__icon--MarginInlineEnd);
15895
- font-size: var(--pf-v6-c-tile__icon--FontSize);
15896
- color: var(--pf-v6-c-tile__icon--Color);
15897
- }
15898
-
15899
- :where(:root, .pf-v6-c-timestamp) {
15900
- --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
15901
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
15902
- --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
15903
- --pf-v6-c-timestamp--m-help-text--TextDecorationLine: underline;
15904
- --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: dashed;
15905
- --pf-v6-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-t--global--border--width--regular);
15906
- --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
15907
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-t--global--border--color--default);
15908
- --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
15909
- --pf-v6-c-timestamp--m-help-text--focus--Color: var(--pf-t--global--text--color--regular);
15910
- --pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-t--global--text--color--regular);
15911
- --pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-t--global--text--color--regular);
15912
- }
15913
-
15914
- .pf-v6-c-timestamp {
15915
- display: inline-block;
15916
- font-size: var(--pf-v6-c-timestamp--FontSize);
15917
- color: var(--pf-v6-c-timestamp--Color);
15918
- outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
15919
- }
15920
-
15921
- .pf-v6-c-timestamp.pf-m-help-text {
15922
- text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
15923
- text-decoration-thickness: var(--pf-v6-c-timestamp--m-help-text--TextDecorationThickness);
15924
- text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
15925
- text-decoration-color: var(--pf-v6-c-timestamp--m-help-text--TextDecorationColor);
15926
- text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
15927
- cursor: pointer;
15928
- }
15929
-
15930
- .pf-v6-c-timestamp.pf-m-help-text:hover {
15931
- --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--hover--Color);
15932
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor);
15933
- }
15934
-
15935
- .pf-v6-c-timestamp.pf-m-help-text:focus {
15936
- --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--focus--Color);
15937
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor);
15938
- }
15939
-
15940
- :where(:root, .pf-v6-c-title) {
15941
- --pf-v6-c-title--FontFamily: var(--pf-t--global--font--family--heading);
15942
- --pf-v6-c-title--m-4xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15943
- --pf-v6-c-title--m-4xl--FontSize: var(--pf-t--global--font--size--heading--2xl);
15944
- --pf-v6-c-title--m-4xl--FontWeight: var(--pf-t--global--font--weight--heading);
15945
- --pf-v6-c-title--m-3xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15946
- --pf-v6-c-title--m-3xl--FontSize: var(--pf-t--global--font--size--heading--xl);
15947
- --pf-v6-c-title--m-3xl--FontWeight: var(--pf-t--global--font--weight--heading);
15948
- --pf-v6-c-title--m-2xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15949
- --pf-v6-c-title--m-2xl--FontSize: var(--pf-t--global--font--size--heading--lg);
15950
- --pf-v6-c-title--m-2xl--FontWeight: var(--pf-t--global--font--weight--heading);
15951
- --pf-v6-c-title--m-xl--LineHeight: var(--pf-t--global--font--line-height--heading);
15952
- --pf-v6-c-title--m-xl--FontSize: var(--pf-t--global--font--size--heading--md);
15953
- --pf-v6-c-title--m-xl--FontWeight: var(--pf-t--global--font--weight--heading);
15954
- --pf-v6-c-title--m-lg--LineHeight: var(--pf-t--global--font--line-height--heading);
15955
- --pf-v6-c-title--m-lg--FontSize: var(--pf-t--global--font--size--heading--sm);
15956
- --pf-v6-c-title--m-lg--FontWeight: var(--pf-t--global--font--weight--heading);
15957
- --pf-v6-c-title--m-md--LineHeight: var(--pf-t--global--font--line-height--heading);
15958
- --pf-v6-c-title--m-md--FontSize: var(--pf-t--global--font--size--heading--xs);
15959
- --pf-v6-c-title--m-md--FontWeight: var(--pf-t--global--font--weight--heading);
15960
- --pf-v6-c-title--m-h1--LineHeight: var(--pf-t--global--font--line-height--heading);
15961
- --pf-v6-c-title--m-h1--FontSize: var(--pf-t--global--font--size--heading--h1);
15962
- --pf-v6-c-title--m-h1--FontWeight: var(--pf-t--global--font--weight--heading);
15963
- --pf-v6-c-title--m-h2--LineHeight: var(--pf-t--global--font--line-height--heading);
15964
- --pf-v6-c-title--m-h2--FontSize: var(--pf-t--global--font--size--heading--h2);
15965
- --pf-v6-c-title--m-h2--FontWeight: var(--pf-t--global--font--weight--heading);
15966
- --pf-v6-c-title--m-h3--LineHeight: var(--pf-t--global--font--line-height--heading);
15967
- --pf-v6-c-title--m-h3--FontSize: var(--pf-t--global--font--size--heading--h3);
15968
- --pf-v6-c-title--m-h3--FontWeight: var(--pf-t--global--font--weight--heading);
15969
- --pf-v6-c-title--m-h4--LineHeight: var(--pf-t--global--font--line-height--heading);
15970
- --pf-v6-c-title--m-h4--FontSize: var(--pf-t--global--font--size--heading--h4);
15971
- --pf-v6-c-title--m-h4--FontWeight: var(--pf-t--global--font--weight--heading);
15972
- --pf-v6-c-title--m-h5--LineHeight: var(--pf-t--global--font--line-height--heading);
15973
- --pf-v6-c-title--m-h5--FontSize: var(--pf-t--global--font--size--heading--h5);
15974
- --pf-v6-c-title--m-h5--FontWeight: var(--pf-t--global--font--weight--heading);
15975
- --pf-v6-c-title--m-h6--LineHeight: var(--pf-t--global--font--line-height--heading);
15976
- --pf-v6-c-title--m-h6--FontSize: var(--pf-t--global--font--size--heading--h6);
15977
- --pf-v6-c-title--m-h6--FontWeight: var(--pf-t--global--font--weight--heading);
15978
- }
15979
-
15980
- .pf-v6-c-title {
15981
- font-family: var(--pf-v6-c-title--FontFamily);
15982
- word-break: break-word;
15983
- }
15984
-
15985
- .pf-v6-c-title.pf-m-4xl {
15986
- font-size: var(--pf-v6-c-title--m-4xl--FontSize);
15987
- font-weight: var(--pf-v6-c-title--m-4xl--FontWeight);
15988
- line-height: var(--pf-v6-c-title--m-4xl--LineHeight);
15951
+ .pf-v6-c-tile.pf-m-disabled {
15952
+ --pf-v6-c-tile--BackgroundColor: var(--pf-v6-c-tile--m-disabled--BackgroundColor);
15953
+ --pf-v6-c-tile__title--Color: var(--pf-v6-c-tile--m-disabled__title--Color);
15954
+ --pf-v6-c-tile__icon--Color: var(--pf-v6-c-tile--m-disabled__icon--Color);
15955
+ --pf-v6-c-tile__body--Color: var(--pf-v6-c-tile--m-disabled__body--Color);
15956
+ --pf-v6-c-tile--before--BorderWidth: 0;
15957
+ pointer-events: none;
15989
15958
  }
15990
15959
 
15991
- .pf-v6-c-title.pf-m-3xl {
15992
- font-size: var(--pf-v6-c-title--m-3xl--FontSize);
15993
- font-weight: var(--pf-v6-c-title--m-3xl--FontWeight);
15994
- line-height: var(--pf-v6-c-title--m-3xl--LineHeight);
15960
+ .pf-v6-c-tile.pf-m-display-lg .pf-v6-c-tile__header.pf-m-stacked {
15961
+ --pf-v6-c-tile__icon--FontSize: var(--pf-v6-c-tile--m-display-lg__header--m-stacked__icon--FontSize);
15995
15962
  }
15996
15963
 
15997
- .pf-v6-c-title.pf-m-2xl {
15998
- font-size: var(--pf-v6-c-title--m-2xl--FontSize);
15999
- font-weight: var(--pf-v6-c-title--m-2xl--FontWeight);
16000
- line-height: var(--pf-v6-c-title--m-2xl--LineHeight);
15964
+ .pf-v6-c-tile__header {
15965
+ display: flex;
15966
+ align-items: center;
16001
15967
  }
16002
15968
 
16003
- .pf-v6-c-title.pf-m-xl {
16004
- font-size: var(--pf-v6-c-title--m-xl--FontSize);
16005
- font-weight: var(--pf-v6-c-title--m-xl--FontWeight);
16006
- line-height: var(--pf-v6-c-title--m-xl--LineHeight);
15969
+ .pf-v6-c-tile__header.pf-m-stacked {
15970
+ --pf-v6-c-tile__icon--MarginInlineEnd: 0;
15971
+ --pf-v6-c-tile__icon--FontSize: var(--pf-v6-c-tile__header--m-stacked__icon--FontSize);
15972
+ flex-direction: column;
15973
+ align-items: flex-start;
16007
15974
  }
16008
15975
 
16009
- .pf-v6-c-title.pf-m-lg {
16010
- font-size: var(--pf-v6-c-title--m-lg--FontSize);
16011
- font-weight: var(--pf-v6-c-title--m-lg--FontWeight);
16012
- line-height: var(--pf-v6-c-title--m-lg--LineHeight);
15976
+ .pf-v6-c-tile__header.pf-m-stacked .pf-v6-c-tile__icon {
15977
+ display: flex;
15978
+ align-items: center;
15979
+ margin-block-end: var(--pf-v6-c-tile__header--m-stacked__icon--MarginBlockEnd);
16013
15980
  }
16014
15981
 
16015
- .pf-v6-c-title.pf-m-md {
16016
- font-size: var(--pf-v6-c-title--m-md--FontSize);
16017
- font-weight: var(--pf-v6-c-title--m-md--FontWeight);
16018
- line-height: var(--pf-v6-c-title--m-md--LineHeight);
15982
+ .pf-v6-c-tile__title {
15983
+ font-weight: var(--pf-v6-c-tile__title--FontWeight);
15984
+ color: var(--pf-v6-c-tile__title--Color);
16019
15985
  }
16020
15986
 
16021
- .pf-v6-c-title.pf-m-h1 {
16022
- font-size: var(--pf-v6-c-title--m-h1--FontSize);
16023
- font-weight: var(--pf-v6-c-title--m-h1--FontWeight);
16024
- line-height: var(--pf-v6-c-title--m-h1--LineHeight);
15987
+ .pf-v6-c-tile__body {
15988
+ font-size: var(--pf-v6-c-tile__body--FontSize);
15989
+ color: var(--pf-v6-c-tile__body--Color);
16025
15990
  }
16026
15991
 
16027
- .pf-v6-c-title.pf-m-h2 {
16028
- font-size: var(--pf-v6-c-title--m-h2--FontSize);
16029
- font-weight: var(--pf-v6-c-title--m-h2--FontWeight);
16030
- line-height: var(--pf-v6-c-title--m-h2--LineHeight);
15992
+ .pf-v6-c-tile__icon {
15993
+ margin-inline-end: var(--pf-v6-c-tile__icon--MarginInlineEnd);
15994
+ font-size: var(--pf-v6-c-tile__icon--FontSize);
15995
+ color: var(--pf-v6-c-tile__icon--Color);
16031
15996
  }
16032
15997
 
16033
- .pf-v6-c-title.pf-m-h3 {
16034
- font-size: var(--pf-v6-c-title--m-h3--FontSize);
16035
- font-weight: var(--pf-v6-c-title--m-h3--FontWeight);
16036
- line-height: var(--pf-v6-c-title--m-h3--LineHeight);
15998
+ :where(:root, .pf-v6-c-timestamp) {
15999
+ --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
16000
+ --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
16001
+ --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
16002
+ --pf-v6-c-timestamp--m-help-text--TextDecorationLine: underline;
16003
+ --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: dashed;
16004
+ --pf-v6-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-t--global--border--width--regular);
16005
+ --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
16006
+ --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-t--global--border--color--default);
16007
+ --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
16008
+ --pf-v6-c-timestamp--m-help-text--focus--Color: var(--pf-t--global--text--color--regular);
16009
+ --pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-t--global--text--color--regular);
16010
+ --pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-t--global--text--color--regular);
16037
16011
  }
16038
16012
 
16039
- .pf-v6-c-title.pf-m-h4 {
16040
- font-size: var(--pf-v6-c-title--m-h4--FontSize);
16041
- font-weight: var(--pf-v6-c-title--m-h4--FontWeight);
16042
- line-height: var(--pf-v6-c-title--m-h4--LineHeight);
16013
+ .pf-v6-c-timestamp {
16014
+ display: inline-block;
16015
+ font-size: var(--pf-v6-c-timestamp--FontSize);
16016
+ color: var(--pf-v6-c-timestamp--Color);
16017
+ outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
16043
16018
  }
16044
16019
 
16045
- .pf-v6-c-title.pf-m-h5 {
16046
- font-size: var(--pf-v6-c-title--m-h5--FontSize);
16047
- font-weight: var(--pf-v6-c-title--m-h5--FontWeight);
16048
- line-height: var(--pf-v6-c-title--m-h5--LineHeight);
16020
+ .pf-v6-c-timestamp.pf-m-help-text {
16021
+ text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
16022
+ text-decoration-thickness: var(--pf-v6-c-timestamp--m-help-text--TextDecorationThickness);
16023
+ text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
16024
+ text-decoration-color: var(--pf-v6-c-timestamp--m-help-text--TextDecorationColor);
16025
+ text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
16026
+ cursor: pointer;
16049
16027
  }
16050
16028
 
16051
- .pf-v6-c-title.pf-m-h6 {
16052
- font-size: var(--pf-v6-c-title--m-h6--FontSize);
16053
- font-weight: var(--pf-v6-c-title--m-h6--FontWeight);
16054
- line-height: var(--pf-v6-c-title--m-h6--LineHeight);
16029
+ .pf-v6-c-timestamp.pf-m-help-text:hover {
16030
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--hover--Color);
16031
+ --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor);
16032
+ }
16033
+
16034
+ .pf-v6-c-timestamp.pf-m-help-text:focus {
16035
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--focus--Color);
16036
+ --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor);
16055
16037
  }
16056
16038
 
16057
16039
  :where(:root, .pf-v6-c-toggle-group) {
@@ -16203,6 +16185,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
16203
16185
  --pf-v6-c-toolbar__content--RowGap: var(--pf-t--global--spacer--sm);
16204
16186
  --pf-v6-c-toolbar__content--PaddingBlock: var(--pf-t--global--spacer--md);
16205
16187
  --pf-v6-c-toolbar__content--PaddingInline: var(--pf-v6-c-toolbar--PaddingInline);
16188
+ --pf-v6-c-toolbar__content--PaddingBlockStart: 0;
16206
16189
  --pf-v6-c-toolbar__expandable-content--ZIndex: var(--pf-t--global--z-index--sm);
16207
16190
  --pf-v6-c-toolbar__expandable-content--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
16208
16191
  --pf-v6-c-toolbar__expandable-content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
@@ -20440,43 +20423,44 @@ label.pf-v6-c-tree-view__node-text {
20440
20423
  --pf-v6-c-panel--Width: auto;
20441
20424
  --pf-v6-c-panel--MinWidth: auto;
20442
20425
  --pf-v6-c-panel--MaxWidth: none;
20443
- --pf-v6-c-panel--ZIndex: auto;
20444
20426
  --pf-v6-c-panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
20445
20427
  --pf-v6-c-panel--BoxShadow: none;
20428
+ --pf-v6-c-panel--BorderRadius: var(--pf-t--global--border--radius--small);
20446
20429
  --pf-v6-c-panel--before--BorderWidth: 0;
20447
20430
  --pf-v6-c-panel--before--BorderColor: var(--pf-t--global--border--color--default);
20448
20431
  --pf-v6-c-panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
20449
- --pf-v6-c-panel--m-bordered--before--BorderWidth: var(--pf-t--global--border--width--regular);
20432
+ --pf-v6-c-panel--m-bordered--before--BorderWidth: var(--pf-t--global--border--width--box--default);
20450
20433
  --pf-v6-c-panel--m-raised--BoxShadow: var(--pf-t--global--box-shadow--md);
20451
- --pf-v6-c-panel--m-raised--ZIndex: var(--pf-t--global--z-index--sm);
20452
20434
  --pf-v6-c-panel--m-raised--BackgroundColor: var(--pf-t--global--background--color--floating--default);
20453
20435
  --pf-v6-c-panel__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
20454
- --pf-v6-c-panel__header--PaddingInlineEnd: var(--pf-t--global--spacer--md);
20436
+ --pf-v6-c-panel__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
20455
20437
  --pf-v6-c-panel__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
20456
- --pf-v6-c-panel__header--PaddingInlineStart: var(--pf-t--global--spacer--md);
20438
+ --pf-v6-c-panel__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
20457
20439
  --pf-v6-c-panel__main--MaxHeight: none;
20458
20440
  --pf-v6-c-panel__main--Overflow: visible;
20459
20441
  --pf-v6-c-panel__main-body--PaddingBlockStart: var(--pf-t--global--spacer--md);
20460
- --pf-v6-c-panel__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--md);
20442
+ --pf-v6-c-panel__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
20461
20443
  --pf-v6-c-panel__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
20462
- --pf-v6-c-panel__main-body--PaddingInlineStart: var(--pf-t--global--spacer--md);
20463
- --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-t--global--spacer--md);
20464
- --pf-v6-c-panel__footer--PaddingInlineEnd: var(--pf-t--global--spacer--md);
20465
- --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-t--global--spacer--md);
20466
- --pf-v6-c-panel__footer--PaddingInlineStart: var(--pf-t--global--spacer--md);
20444
+ --pf-v6-c-panel__main-body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
20445
+ --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-t--global--spacer--sm);
20446
+ --pf-v6-c-panel__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
20447
+ --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
20448
+ --pf-v6-c-panel__footer--PaddingInlineStart: var(--pf-t--global--spacer--lg);
20467
20449
  --pf-v6-c-panel__footer--BoxShadow: none;
20468
20450
  --pf-v6-c-panel--m-scrollable__main--MaxHeight: 18.75rem;
20469
20451
  --pf-v6-c-panel--m-scrollable__main--Overflow: auto;
20470
- --pf-v6-c-panel--m-scrollable__footer--BoxShadow: 0 -0.3125rem 0.25rem -0.25rem rgba(0 0 0 / 16%);
20452
+ --pf-v6-c-panel--m-scrollable__footer--BoxShadow: var(--pf-t--global--box-shadow--md--top);
20453
+ --pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart: var(--pf-t--global--spacer--md);
20454
+ --pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd: var(--pf-t--global--spacer--md);
20471
20455
  }
20472
20456
 
20473
20457
  .pf-v6-c-panel {
20474
20458
  position: relative;
20475
- z-index: var(--pf-v6-c-panel--ZIndex);
20476
20459
  width: var(--pf-v6-c-panel--Width);
20477
20460
  min-width: var(--pf-v6-c-panel--MinWidth);
20478
20461
  max-width: var(--pf-v6-c-panel--MaxWidth);
20479
20462
  background-color: var(--pf-v6-c-panel--BackgroundColor);
20463
+ border-radius: var(--pf-v6-c-panel--BorderRadius);
20480
20464
  box-shadow: var(--pf-v6-c-panel--BoxShadow);
20481
20465
  }
20482
20466
 
@@ -20486,6 +20470,7 @@ label.pf-v6-c-tree-view__node-text {
20486
20470
  pointer-events: none;
20487
20471
  content: "";
20488
20472
  border: var(--pf-v6-c-panel--before--BorderWidth) solid var(--pf-v6-c-panel--before--BorderColor);
20473
+ border-radius: var(--pf-v6-c-panel--BorderRadius);
20489
20474
  }
20490
20475
 
20491
20476
  .pf-v6-c-panel.pf-m-bordered {
@@ -20499,13 +20484,14 @@ label.pf-v6-c-tree-view__node-text {
20499
20484
  .pf-v6-c-panel.pf-m-raised {
20500
20485
  --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-raised--BackgroundColor);
20501
20486
  --pf-v6-c-panel--BoxShadow: var(--pf-v6-c-panel--m-raised--BoxShadow);
20502
- --pf-v6-c-panel--ZIndex: var(--pf-v6-c-panel--m-raised--ZIndex);
20503
20487
  }
20504
20488
 
20505
20489
  .pf-v6-c-panel.pf-m-scrollable {
20506
20490
  --pf-v6-c-panel__main--MaxHeight: var(--pf-v6-c-panel--m-scrollable__main--MaxHeight);
20507
20491
  --pf-v6-c-panel__main--Overflow: var(--pf-v6-c-panel--m-scrollable__main--Overflow);
20508
20492
  --pf-v6-c-panel__footer--BoxShadow: var(--pf-v6-c-panel--m-scrollable__footer--BoxShadow);
20493
+ --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart);
20494
+ --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd);
20509
20495
  }
20510
20496
 
20511
20497
  .pf-v6-c-panel__header {
@@ -23092,78 +23078,6 @@ label.pf-v6-c-tree-view__node-text {
23092
23078
  --pf-v6-l-flex--spacer--column: 0;
23093
23079
  }
23094
23080
  }
23095
- :where(:root, .pf-v6-l-gallery) {
23096
- --pf-v6-l-gallery--m-gutter--GridGap: var(--pf-t--global--spacer--lg);
23097
- --pf-v6-l-gallery--GridTemplateColumns--min: 250px;
23098
- --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min);
23099
- --pf-v6-l-gallery--GridTemplateColumns--max: 1fr;
23100
- --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max);
23101
- --pf-v6-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-v6-l-gallery--GridTemplateColumns--minmax--min), var(--pf-v6-l-gallery--GridTemplateColumns--minmax--max)));
23102
- --pf-v6-l-gallery--GridTemplateRows: auto;
23103
- }
23104
-
23105
- .pf-v6-l-gallery {
23106
- display: grid;
23107
- grid-template-rows: var(--pf-v6-l-gallery--GridTemplateRows);
23108
- grid-template-columns: var(--pf-v6-l-gallery--GridTemplateColumns);
23109
- --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min);
23110
- --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max);
23111
- }
23112
-
23113
- .pf-v6-l-gallery.pf-m-gutter {
23114
- grid-gap: var(--pf-v6-l-gallery--m-gutter--GridGap);
23115
- }
23116
-
23117
- @media (min-width: 576px) {
23118
- .pf-v6-l-gallery {
23119
- --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min));
23120
- }
23121
- }
23122
- @media (min-width: 768px) {
23123
- .pf-v6-l-gallery {
23124
- --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min)));
23125
- }
23126
- }
23127
- @media (min-width: 992px) {
23128
- .pf-v6-l-gallery {
23129
- --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min))));
23130
- }
23131
- }
23132
- @media (min-width: 1200px) {
23133
- .pf-v6-l-gallery {
23134
- --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min)))));
23135
- }
23136
- }
23137
- @media (min-width: 1450px) {
23138
- .pf-v6-l-gallery {
23139
- --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min))))));
23140
- }
23141
- }
23142
- @media (min-width: 576px) {
23143
- .pf-v6-l-gallery {
23144
- --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max));
23145
- }
23146
- }
23147
- @media (min-width: 768px) {
23148
- .pf-v6-l-gallery {
23149
- --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max)));
23150
- }
23151
- }
23152
- @media (min-width: 992px) {
23153
- .pf-v6-l-gallery {
23154
- --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max))));
23155
- }
23156
- }
23157
- @media (min-width: 1200px) {
23158
- .pf-v6-l-gallery {
23159
- --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max)))));
23160
- }
23161
- }
23162
- @media (min-width: 1450px) {
23163
- .pf-v6-l-gallery {
23164
- --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max))))));
23165
- }
23166
- }
23167
23081
  :where(:root, .pf-v6-l-grid) {
23168
23082
  --pf-v6-l-grid--m-gutter--GridGap: var(--pf-t--global--spacer--lg);
23169
23083
  --pf-v6-l-grid__item--GridColumnStart: auto;
@@ -24151,6 +24065,78 @@ label.pf-v6-c-tree-view__node-text {
24151
24065
  grid-gap: var(--pf-v6-l-grid--m-gutter--GridGap);
24152
24066
  }
24153
24067
 
24068
+ :where(:root, .pf-v6-l-gallery) {
24069
+ --pf-v6-l-gallery--m-gutter--GridGap: var(--pf-t--global--spacer--lg);
24070
+ --pf-v6-l-gallery--GridTemplateColumns--min: 250px;
24071
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min);
24072
+ --pf-v6-l-gallery--GridTemplateColumns--max: 1fr;
24073
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max);
24074
+ --pf-v6-l-gallery--GridTemplateColumns: repeat(auto-fill, minmax(var(--pf-v6-l-gallery--GridTemplateColumns--minmax--min), var(--pf-v6-l-gallery--GridTemplateColumns--minmax--max)));
24075
+ --pf-v6-l-gallery--GridTemplateRows: auto;
24076
+ }
24077
+
24078
+ .pf-v6-l-gallery {
24079
+ display: grid;
24080
+ grid-template-rows: var(--pf-v6-l-gallery--GridTemplateRows);
24081
+ grid-template-columns: var(--pf-v6-l-gallery--GridTemplateColumns);
24082
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min);
24083
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max);
24084
+ }
24085
+
24086
+ .pf-v6-l-gallery.pf-m-gutter {
24087
+ grid-gap: var(--pf-v6-l-gallery--m-gutter--GridGap);
24088
+ }
24089
+
24090
+ @media (min-width: 576px) {
24091
+ .pf-v6-l-gallery {
24092
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min));
24093
+ }
24094
+ }
24095
+ @media (min-width: 768px) {
24096
+ .pf-v6-l-gallery {
24097
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min)));
24098
+ }
24099
+ }
24100
+ @media (min-width: 992px) {
24101
+ .pf-v6-l-gallery {
24102
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min))));
24103
+ }
24104
+ }
24105
+ @media (min-width: 1200px) {
24106
+ .pf-v6-l-gallery {
24107
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min)))));
24108
+ }
24109
+ }
24110
+ @media (min-width: 1450px) {
24111
+ .pf-v6-l-gallery {
24112
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--min: var(--pf-v6-l-gallery--GridTemplateColumns--min-on-2xl, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--min-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--min))))));
24113
+ }
24114
+ }
24115
+ @media (min-width: 576px) {
24116
+ .pf-v6-l-gallery {
24117
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max));
24118
+ }
24119
+ }
24120
+ @media (min-width: 768px) {
24121
+ .pf-v6-l-gallery {
24122
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max)));
24123
+ }
24124
+ }
24125
+ @media (min-width: 992px) {
24126
+ .pf-v6-l-gallery {
24127
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max))));
24128
+ }
24129
+ }
24130
+ @media (min-width: 1200px) {
24131
+ .pf-v6-l-gallery {
24132
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max)))));
24133
+ }
24134
+ }
24135
+ @media (min-width: 1450px) {
24136
+ .pf-v6-l-gallery {
24137
+ --pf-v6-l-gallery--GridTemplateColumns--minmax--max: var(--pf-v6-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-md, var(--pf-v6-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-v6-l-gallery--GridTemplateColumns--max))))));
24138
+ }
24139
+ }
24154
24140
  :where(:root, .pf-v6-l-level) {
24155
24141
  --pf-v6-l-level--m-gutter--Gap: var(--pf-t--global--spacer--lg);
24156
24142
  }