@cloudscape-design/components 3.0.108 → 3.0.110

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/app-layout/visual-refresh/app-bar.d.ts.map +1 -1
  2. package/app-layout/visual-refresh/app-bar.js +2 -1
  3. package/app-layout/visual-refresh/app-bar.js.map +1 -1
  4. package/app-layout/visual-refresh/background.d.ts.map +1 -1
  5. package/app-layout/visual-refresh/background.js +7 -4
  6. package/app-layout/visual-refresh/background.js.map +1 -1
  7. package/app-layout/visual-refresh/context.d.ts +2 -0
  8. package/app-layout/visual-refresh/context.d.ts.map +1 -1
  9. package/app-layout/visual-refresh/context.js +23 -18
  10. package/app-layout/visual-refresh/context.js.map +1 -1
  11. package/app-layout/visual-refresh/styles.css.js +60 -59
  12. package/app-layout/visual-refresh/styles.scoped.css +175 -152
  13. package/app-layout/visual-refresh/styles.selectors.js +60 -59
  14. package/cards/index.d.ts.map +1 -1
  15. package/cards/index.js +1 -1
  16. package/cards/index.js.map +1 -1
  17. package/container/internal.d.ts +2 -1
  18. package/container/internal.d.ts.map +1 -1
  19. package/container/internal.js +21 -6
  20. package/container/internal.js.map +1 -1
  21. package/container/styles.css.js +16 -16
  22. package/container/styles.scoped.css +36 -26
  23. package/container/styles.selectors.js +16 -16
  24. package/internal/environment.js +1 -1
  25. package/package.json +1 -1
  26. package/split-panel/icons/bottom-icon-refresh.d.ts.map +1 -1
  27. package/split-panel/icons/bottom-icon-refresh.js +6 -9
  28. package/split-panel/icons/bottom-icon-refresh.js.map +1 -1
  29. package/split-panel/icons/side-position-refresh.d.ts +1 -0
  30. package/split-panel/icons/side-position-refresh.d.ts.map +1 -1
  31. package/split-panel/icons/side-position-refresh.js +6 -9
  32. package/split-panel/icons/side-position-refresh.js.map +1 -1
  33. package/split-panel/styles.css.js +59 -58
  34. package/split-panel/styles.scoped.css +84 -81
  35. package/split-panel/styles.selectors.js +59 -58
  36. package/table/header-cell/index.d.ts +2 -1
  37. package/table/header-cell/index.d.ts.map +1 -1
  38. package/table/header-cell/index.js +2 -1
  39. package/table/header-cell/index.js.map +1 -1
  40. package/table/header-cell/styles.css.js +16 -15
  41. package/table/header-cell/styles.scoped.css +26 -26
  42. package/table/header-cell/styles.selectors.js +16 -15
  43. package/table/internal.d.ts.map +1 -1
  44. package/table/internal.js +7 -3
  45. package/table/internal.js.map +1 -1
  46. package/table/sticky-header.d.ts +1 -0
  47. package/table/sticky-header.d.ts.map +1 -1
  48. package/table/sticky-header.js +2 -1
  49. package/table/sticky-header.js.map +1 -1
  50. package/table/styles.css.js +34 -32
  51. package/table/styles.scoped.css +47 -39
  52. package/table/styles.selectors.js +34 -32
  53. package/table/thead.d.ts.map +1 -1
  54. package/table/thead.js +3 -3
  55. package/table/thead.js.map +1 -1
@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
90
90
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
91
91
  SPDX-License-Identifier: Apache-2.0
92
92
  */
93
- section.awsui_appbar_hyvsj_1al7x_93:not(#\9) {
93
+ section.awsui_appbar_hyvsj_8eynx_93:not(#\9) {
94
94
  align-items: center;
95
95
  box-sizing: border-box;
96
96
  display: grid;
@@ -114,20 +114,20 @@ section.awsui_appbar_hyvsj_1al7x_93:not(#\9) {
114
114
  span the entire column definition of the Layout grid.
115
115
  */
116
116
  }
117
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-nav_hyvsj_1al7x_117:not(#\9) {
117
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-nav_hyvsj_8eynx_117:not(#\9) {
118
118
  grid-column: 1;
119
119
  margin-right: var(--space-m-17eucw, 16px);
120
120
  }
121
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121:not(#\9) {
121
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9) {
122
122
  grid-column: 2;
123
123
  background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
124
124
  }
125
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-tools_hyvsj_1al7x_125:not(#\9) {
125
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-tools_hyvsj_8eynx_125:not(#\9) {
126
126
  grid-column: 3;
127
127
  margin-left: var(--space-m-17eucw, 16px);
128
128
  }
129
129
  @media (min-width: 689px) {
130
- section.awsui_appbar_hyvsj_1al7x_93:not(#\9) {
130
+ section.awsui_appbar_hyvsj_8eynx_93:not(#\9) {
131
131
  /*
132
132
  If Breadcrumbs do not exist then the AppBar should be suppressed
133
133
  because in large viewports the triggers are rendered
@@ -152,36 +152,44 @@ section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-tools_hyvsj_1al7x_125:not(#\
152
152
  of the dark header.
153
153
  */
154
154
  /*
155
- If the content type supports a dark sticky header then
156
- minimal bottom padding should be on the breadcrumbs to
155
+ Table and cards content types implement a custom dark header.
156
+ Minimal bottom padding should be on the breadcrumbs to
157
157
  reduce the the vertical distance from the main content.
158
158
  */
159
+ /*
160
+ If a child component tells the AppLayout to have a sticky
161
+ background (typically because of a stickyHeader with a
162
+ full-page variant) the z-index of the breadcrumbs needs to
163
+ be lifted so it doesn't render behind the background element.
164
+ */
159
165
  }
160
- section.awsui_appbar_hyvsj_1al7x_93:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1al7x_160) {
166
+ section.awsui_appbar_hyvsj_8eynx_93:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166) {
161
167
  display: none;
162
168
  }
163
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-nav_hyvsj_1al7x_117:not(#\9),
164
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-tools_hyvsj_1al7x_125:not(#\9) {
169
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-nav_hyvsj_8eynx_117:not(#\9),
170
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-tools_hyvsj_8eynx_125:not(#\9) {
165
171
  display: none;
166
172
  }
167
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121:not(#\9):not(.awsui_has-notifications-content_hyvsj_1al7x_167) {
173
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173) {
168
174
  padding-top: var(--space-scaled-m-pv0fmt, 16px);
169
175
  }
170
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121.awsui_has-notifications-content_hyvsj_1al7x_167:not(#\9) {
176
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_has-notifications-content_hyvsj_8eynx_173:not(#\9) {
171
177
  padding-top: var(--space-scaled-2x-s-9svxjy, 12px);
172
178
  }
173
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121:not(#\9):not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173),
174
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121:not(#\9):not(.awsui_has-header_hyvsj_1al7x_173).awsui_content-type-wizard_hyvsj_1al7x_174 {
179
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179),
180
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9):not(.awsui_has-header_hyvsj_8eynx_179).awsui_content-type-wizard_hyvsj_8eynx_180 {
175
181
  padding-bottom: var(--space-m-17eucw, 16px);
176
182
  }
177
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121.awsui_content-type-cards_hyvsj_1al7x_177:not(#\9),
178
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121.awsui_content-type-table_hyvsj_1al7x_178:not(#\9) {
183
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_content-type-cards_hyvsj_8eynx_183:not(#\9),
184
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_content-type-table_hyvsj_8eynx_184:not(#\9) {
179
185
  padding-bottom: var(--space-xxs-ynfts5, 4px);
186
+ }
187
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121.awsui_has-sticky-background_hyvsj_8eynx_187:not(#\9) {
180
188
  z-index: 799;
181
189
  }
182
190
  }
183
191
  @media (max-width: 688px) {
184
- section.awsui_appbar_hyvsj_1al7x_93:not(#\9) {
192
+ section.awsui_appbar_hyvsj_8eynx_93:not(#\9) {
185
193
  background-color: var(--color-background-home-header-mpq08f, #000716);
186
194
  border-bottom: 1px solid var(--color-border-divider-default-7s2wjw, #e9ebed);
187
195
  box-shadow: var(--shadow-panel-toggle-3fk0ch, 0px 6px 12px 1px rgba(0, 7, 22, 0.12));
@@ -197,11 +205,11 @@ section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121.awsui_c
197
205
  they are now sticky positioned in the viewport with the AppBar.
198
206
  */
199
207
  }
200
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-nav_hyvsj_1al7x_117:not(#\9),
201
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-tools_hyvsj_1al7x_125:not(#\9) {
208
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-nav_hyvsj_8eynx_117:not(#\9),
209
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_appbar-tools_hyvsj_8eynx_125:not(#\9) {
202
210
  display: block;
203
211
  }
204
- section.awsui_appbar_hyvsj_1al7x_93 > .awsui_breadcrumbs_hyvsj_1al7x_121:not(#\9) {
212
+ section.awsui_appbar_hyvsj_8eynx_93 > .awsui_breadcrumbs_hyvsj_8eynx_121:not(#\9) {
205
213
  padding: 0;
206
214
  }
207
215
  }
@@ -210,10 +218,10 @@ section.awsui_appbar_hyvsj_1al7x_93 > .awsui_appbar-tools_hyvsj_1al7x_125:not(#\
210
218
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
211
219
  SPDX-License-Identifier: Apache-2.0
212
220
  */
213
- div.awsui_background_hyvsj_1al7x_213:not(#\9) {
221
+ div.awsui_background_hyvsj_8eynx_221:not(#\9) {
214
222
  display: contents;
215
223
  }
216
- div.awsui_background_hyvsj_1al7x_213 > .awsui_notifications-appbar-header_hyvsj_1al7x_216:not(#\9) {
224
+ div.awsui_background_hyvsj_8eynx_221 > .awsui_notifications-appbar-header_hyvsj_8eynx_224:not(#\9) {
217
225
  background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
218
226
  grid-column: 1/span 5;
219
227
  grid-row: 1/span 3;
@@ -225,26 +233,25 @@ div.awsui_background_hyvsj_1al7x_213 > .awsui_notifications-appbar-header_hyvsj_
225
233
  */
226
234
  }
227
235
  @media (min-width: 689px) {
228
- div.awsui_background_hyvsj_1al7x_213 > .awsui_notifications-appbar-header_hyvsj_1al7x_216.awsui_content-type-cards_hyvsj_1al7x_177.awsui_has-notifications-content_hyvsj_1al7x_167.awsui_sticky-notifications_hyvsj_1al7x_228:not(#\9), div.awsui_background_hyvsj_1al7x_213 > .awsui_notifications-appbar-header_hyvsj_1al7x_216.awsui_content-type-table_hyvsj_1al7x_178.awsui_has-notifications-content_hyvsj_1al7x_167.awsui_sticky-notifications_hyvsj_1al7x_228:not(#\9) {
236
+ div.awsui_background_hyvsj_8eynx_221 > .awsui_notifications-appbar-header_hyvsj_8eynx_224.awsui_has-sticky-background_hyvsj_8eynx_187.awsui_has-notifications-content_hyvsj_8eynx_173.awsui_sticky-notifications_hyvsj_8eynx_236:not(#\9) {
229
237
  position: sticky;
230
238
  top: var(--awsui-offset-top-f9jj7p);
231
239
  z-index: 799;
232
240
  }
233
241
  }
234
- div.awsui_background_hyvsj_1al7x_213 > .awsui_overlap_hyvsj_1al7x_234:not(#\9) {
242
+ div.awsui_background_hyvsj_8eynx_221 > .awsui_overlap_hyvsj_8eynx_242:not(#\9) {
235
243
  background-color: var(--color-background-layout-main-sfhm4y, #ffffff);
236
244
  grid-column: 1/span 5;
237
245
  grid-row: 4;
238
246
  /*
239
- The cards and table content types have sticky header content that
240
- will retain position on viewport scroll. They are setting the
241
- dynamicOverlapHeight property in the AppLayout context with a container query
242
- that observes the content height. The background needs to be sticky in
243
- desktop viewports without overlapping notification content if it exists.
247
+ The cards and table content types can have sticky header content that
248
+ will retain position on viewport scroll. The overlap background needs to
249
+ be sticky in desktop viewports to prevent light background gutters with
250
+ the high contrast header background only in the content area.
244
251
  */
245
252
  }
246
253
  @media (min-width: 689px) {
247
- div.awsui_background_hyvsj_1al7x_213 > .awsui_overlap_hyvsj_1al7x_234.awsui_content-type-cards_hyvsj_1al7x_177:not(#\9), div.awsui_background_hyvsj_1al7x_213 > .awsui_overlap_hyvsj_1al7x_234.awsui_content-type-table_hyvsj_1al7x_178:not(#\9) {
254
+ div.awsui_background_hyvsj_8eynx_221 > .awsui_overlap_hyvsj_8eynx_242.awsui_has-sticky-background_hyvsj_8eynx_187:not(#\9) {
248
255
  position: sticky;
249
256
  top: var(--awsui-offset-top-with-notifications-f9jj7p);
250
257
  z-index: 799;
@@ -255,13 +262,13 @@ div.awsui_background_hyvsj_1al7x_213 > .awsui_overlap_hyvsj_1al7x_234:not(#\9) {
255
262
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
256
263
  SPDX-License-Identifier: Apache-2.0
257
264
  */
258
- header.awsui_content_hyvsj_1al7x_174:not(#\9) {
265
+ header.awsui_content_hyvsj_8eynx_180:not(#\9) {
259
266
  grid-column: 3;
260
267
  grid-row: 3;
261
268
  padding-bottom: var(--space-content-header-padding-bottom-nvqytg, 24px);
262
269
  }
263
270
  @media (min-width: 689px) {
264
- header.awsui_content_hyvsj_1al7x_174:not(#\9) {
271
+ header.awsui_content_hyvsj_8eynx_180:not(#\9) {
265
272
  /*
266
273
  If Notifications exist and Breadcrumbs do not then Notifications
267
274
  is the previous adjacent sibling to the Header. Add minimal top padding
@@ -279,25 +286,25 @@ header.awsui_content_hyvsj_1al7x_174:not(#\9) {
279
286
  circular buttons.
280
287
  */
281
288
  }
282
- header.awsui_content_hyvsj_1al7x_174.awsui_has-notifications-content_hyvsj_1al7x_167:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_1al7x_160) {
289
+ header.awsui_content_hyvsj_8eynx_180.awsui_has-notifications-content_hyvsj_8eynx_173:not(#\9):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166) {
283
290
  padding-top: var(--space-scaled-xs-6859qs, 8px);
284
291
  }
285
- header.awsui_content_hyvsj_1al7x_174.awsui_has-breadcrumbs_hyvsj_1al7x_160:not(#\9) {
292
+ header.awsui_content_hyvsj_8eynx_180.awsui_has-breadcrumbs_hyvsj_8eynx_166:not(#\9) {
286
293
  padding-top: var(--space-xxs-ynfts5, 4px);
287
294
  }
288
- header.awsui_content_hyvsj_1al7x_174:not(#\9):not(.awsui_has-notifications-content_hyvsj_1al7x_167):not(.awsui_has-breadcrumbs_hyvsj_1al7x_160) {
295
+ header.awsui_content_hyvsj_8eynx_180:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166) {
289
296
  padding-top: var(--space-scaled-xs-6859qs, 8px);
290
297
  }
291
298
  }
292
299
  @media (max-width: 688px) {
293
- header.awsui_content_hyvsj_1al7x_174:not(#\9) {
300
+ header.awsui_content_hyvsj_8eynx_180:not(#\9) {
294
301
  padding: var(--space-m-17eucw, 16px) 0 var(--space-content-header-padding-bottom-nvqytg, 24px);
295
302
  /*
296
303
  Breadcrumbs has moved to first position and sticky so Notifications
297
304
  are now the previous adjacent sibling if they exist.
298
305
  */
299
306
  }
300
- header.awsui_content_hyvsj_1al7x_174.awsui_has-notifications-content_hyvsj_1al7x_167:not(#\9) {
307
+ header.awsui_content_hyvsj_8eynx_180.awsui_has-notifications-content_hyvsj_8eynx_173:not(#\9) {
301
308
  padding-top: var(--space-scaled-xs-6859qs, 8px);
302
309
  }
303
310
  }
@@ -319,7 +326,7 @@ header.awsui_content_hyvsj_1al7x_174:not(#\9) {
319
326
  circumstances regardless of whether the minContentWidth property is
320
327
  explicitly set in script.
321
328
  */
322
- .awsui_layout_hyvsj_1al7x_322:not(#\9) {
329
+ .awsui_layout_hyvsj_8eynx_329:not(#\9) {
323
330
  --awsui-content-gap-left-f9jj7p: 0px;
324
331
  --awsui-content-gap-right-f9jj7p: 0px;
325
332
  --awsui-content-height-f9jj7p: calc(100vh - var(--awsui-header-height-f9jj7p) - var(--awsui-footer-height-f9jj7p));
@@ -401,75 +408,75 @@ header.awsui_content_hyvsj_1al7x_174:not(#\9) {
401
408
  */
402
409
  }
403
410
  @media (min-width: 1401px) {
404
- .awsui_layout_hyvsj_1al7x_322:not(#\9):not(.awsui_has-max-content-width_hyvsj_1al7x_404) {
411
+ .awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_has-max-content-width_hyvsj_8eynx_411) {
405
412
  --awsui-default-max-content-width-f9jj7p: 1280px;
406
413
  }
407
414
  }
408
415
  @media (min-width: 1921px) {
409
- .awsui_layout_hyvsj_1al7x_322:not(#\9):not(.awsui_has-max-content-width_hyvsj_1al7x_404) {
416
+ .awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_has-max-content-width_hyvsj_8eynx_411) {
410
417
  --awsui-default-max-content-width-f9jj7p: 1440px;
411
418
  }
412
419
  }
413
420
  @media (min-width: 2541px) {
414
- .awsui_layout_hyvsj_1al7x_322:not(#\9):not(.awsui_has-max-content-width_hyvsj_1al7x_404) {
421
+ .awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_has-max-content-width_hyvsj_8eynx_411) {
415
422
  --awsui-default-max-content-width-f9jj7p: 1620px;
416
423
  }
417
424
  }
418
- .awsui_layout_hyvsj_1al7x_322.awsui_has-max-content-width_hyvsj_1al7x_404:not(#\9) {
425
+ .awsui_layout_hyvsj_8eynx_329.awsui_has-max-content-width_hyvsj_8eynx_411:not(#\9) {
419
426
  --awsui-default-max-content-width-f9jj7p: var(--awsui-max-content-width-f9jj7p);
420
427
  }
421
428
  @media (min-width: 993px) {
422
- .awsui_layout_hyvsj_1al7x_322:not(#\9) {
429
+ .awsui_layout_hyvsj_8eynx_329:not(#\9) {
423
430
  --awsui-default-min-content-width-f9jj7p: var(--awsui-min-content-width-f9jj7p, 280px);
424
431
  }
425
432
  }
426
433
  @media (max-width: 992px) {
427
- .awsui_layout_hyvsj_1al7x_322:not(#\9) {
434
+ .awsui_layout_hyvsj_8eynx_329:not(#\9) {
428
435
  --awsui-default-min-content-width-f9jj7p: 0px;
429
436
  }
430
437
  }
431
- .awsui_layout_hyvsj_1al7x_322.awsui_is-overlap-disabled_hyvsj_1al7x_431:not(#\9) {
438
+ .awsui_layout_hyvsj_8eynx_329.awsui_is-overlap-disabled_hyvsj_8eynx_438:not(#\9) {
432
439
  --awsui-overlap-height-f9jj7p: 0;
433
440
  }
434
- .awsui_layout_hyvsj_1al7x_322:not(#\9):not(.awsui_disable-body-scroll_hyvsj_1al7x_434) {
441
+ .awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_disable-body-scroll_hyvsj_8eynx_441) {
435
442
  --awsui-offset-top-f9jj7p: var(--awsui-header-height-f9jj7p);
436
443
  min-height: var(--awsui-content-height-f9jj7p);
437
444
  }
438
- .awsui_layout_hyvsj_1al7x_322:not(#\9):not(.awsui_disable-body-scroll_hyvsj_1al7x_434):not(.awsui_has-sticky-notifications_hyvsj_1al7x_438) {
445
+ .awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_disable-body-scroll_hyvsj_8eynx_441):not(.awsui_has-sticky-notifications_hyvsj_8eynx_445) {
439
446
  --awsui-offset-top-with-notifications-f9jj7p: var(--awsui-header-height-f9jj7p);
440
447
  }
441
- .awsui_layout_hyvsj_1al7x_322:not(#\9):not(.awsui_disable-body-scroll_hyvsj_1al7x_434).awsui_has-sticky-notifications_hyvsj_1al7x_438 {
448
+ .awsui_layout_hyvsj_8eynx_329:not(#\9):not(.awsui_disable-body-scroll_hyvsj_8eynx_441).awsui_has-sticky-notifications_hyvsj_8eynx_445 {
442
449
  --awsui-offset-top-with-notifications-f9jj7p: calc(
443
450
  var(--awsui-header-height-f9jj7p) + var(--awsui-notifications-height-f9jj7p) + var(--space-xs-rsr2qu, 8px) + var(--space-xxxs-k2w98v, 2px)
444
451
  );
445
452
  }
446
- .awsui_layout_hyvsj_1al7x_322.awsui_disable-body-scroll_hyvsj_1al7x_434:not(#\9) {
453
+ .awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441:not(#\9) {
447
454
  --awsui-offset-top-f9jj7p: 0px;
448
455
  grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-f9jj7p) 1fr auto;
449
456
  height: var(--awsui-content-height-f9jj7p);
450
457
  overflow-y: scroll;
451
458
  }
452
- .awsui_layout_hyvsj_1al7x_322.awsui_disable-body-scroll_hyvsj_1al7x_434.awsui_has-split-panel_hyvsj_1al7x_452.awsui_split-panel-position-bottom_hyvsj_1al7x_452:not(#\9) {
459
+ .awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441.awsui_has-split-panel_hyvsj_8eynx_459.awsui_split-panel-position-bottom_hyvsj_8eynx_459:not(#\9) {
453
460
  grid-template-rows: repeat(3, auto) var(--awsui-overlap-height-f9jj7p) repeat(2, auto);
454
461
  }
455
- .awsui_layout_hyvsj_1al7x_322.awsui_disable-body-scroll_hyvsj_1al7x_434:not(#\9):not(.awsui_has-sticky-notifications_hyvsj_1al7x_438) {
462
+ .awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441:not(#\9):not(.awsui_has-sticky-notifications_hyvsj_8eynx_445) {
456
463
  --awsui-offset-top-with-notifications-f9jj7p: 0px;
457
464
  }
458
- .awsui_layout_hyvsj_1al7x_322.awsui_disable-body-scroll_hyvsj_1al7x_434.awsui_has-sticky-notifications_hyvsj_1al7x_438:not(#\9) {
465
+ .awsui_layout_hyvsj_8eynx_329.awsui_disable-body-scroll_hyvsj_8eynx_441.awsui_has-sticky-notifications_hyvsj_8eynx_445:not(#\9) {
459
466
  --awsui-offset-top-with-notifications-f9jj7p: calc(
460
467
  var(--awsui-notifications-height-f9jj7p) + var(--space-xs-rsr2qu, 8px) + var(--space-xxs-ynfts5, 4px)
461
468
  );
462
469
  }
463
470
  @media (min-width: 689px) {
464
- .awsui_layout_hyvsj_1al7x_322.awsui_has-content-gap-left_hyvsj_1al7x_464:not(#\9) {
471
+ .awsui_layout_hyvsj_8eynx_329.awsui_has-content-gap-left_hyvsj_8eynx_471:not(#\9) {
465
472
  --awsui-content-gap-left-f9jj7p: var(--space-scaled-2x-xxxl-lbp35j, 40px);
466
473
  }
467
- .awsui_layout_hyvsj_1al7x_322.awsui_has-content-gap-right_hyvsj_1al7x_467:not(#\9) {
474
+ .awsui_layout_hyvsj_8eynx_329.awsui_has-content-gap-right_hyvsj_8eynx_474:not(#\9) {
468
475
  --awsui-content-gap-right-f9jj7p: var(--space-scaled-2x-xxxl-lbp35j, 40px);
469
476
  }
470
477
  }
471
478
  @media (max-width: 688px) {
472
- .awsui_layout_hyvsj_1al7x_322:not(#\9) {
479
+ .awsui_layout_hyvsj_8eynx_329:not(#\9) {
473
480
  --awsui-content-gap-left-f9jj7p: var(--space-l-4vl6xu, 20px);
474
481
  --awsui-content-gap-right-f9jj7p: var(--space-l-4vl6xu, 20px);
475
482
  }
@@ -479,7 +486,7 @@ header.awsui_content_hyvsj_1al7x_174:not(#\9) {
479
486
  This CSS class is applied to the document body to prevent overflow scrolling
480
487
  when the navigation or tools drawers are open in responsive viewports.
481
488
  */
482
- .awsui_block-body-scroll_hyvsj_1al7x_482:not(#\9) {
489
+ .awsui_block-body-scroll_hyvsj_8eynx_489:not(#\9) {
483
490
  overflow: hidden;
484
491
  }
485
492
 
@@ -487,7 +494,7 @@ when the navigation or tools drawers are open in responsive viewports.
487
494
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
488
495
  SPDX-License-Identifier: Apache-2.0
489
496
  */
490
- .awsui_container_hyvsj_1al7x_490:not(#\9) {
497
+ .awsui_container_hyvsj_8eynx_497:not(#\9) {
491
498
  grid-column: 3;
492
499
  grid-row: 4/span 2;
493
500
  padding-bottom: var(--space-layout-content-bottom-kg9l42, 40px);
@@ -504,20 +511,20 @@ when the navigation or tools drawers are open in responsive viewports.
504
511
  under various circumstances.
505
512
  */
506
513
  }
507
- .awsui_container_hyvsj_1al7x_490.awsui_disable-content-paddings_hyvsj_1al7x_507:not(#\9) {
514
+ .awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514:not(#\9) {
508
515
  grid-column: 1/6;
509
516
  padding: 0;
510
517
  }
511
518
  @media (min-width: 689px) {
512
- .awsui_container_hyvsj_1al7x_490.awsui_disable-content-paddings_hyvsj_1al7x_507.awsui_is-navigation-open_hyvsj_1al7x_512:not(#\9) {
519
+ .awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514.awsui_is-navigation-open_hyvsj_8eynx_519:not(#\9) {
513
520
  grid-column-start: 2;
514
521
  }
515
- .awsui_container_hyvsj_1al7x_490.awsui_disable-content-paddings_hyvsj_1al7x_507.awsui_is-tools-open_hyvsj_1al7x_515:not(#\9), .awsui_container_hyvsj_1al7x_490.awsui_disable-content-paddings_hyvsj_1al7x_507.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_split-panel-position-side_hyvsj_1al7x_515:not(#\9) {
522
+ .awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514.awsui_is-tools-open_hyvsj_8eynx_522:not(#\9), .awsui_container_hyvsj_8eynx_497.awsui_disable-content-paddings_hyvsj_8eynx_514.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_split-panel-position-side_hyvsj_8eynx_522:not(#\9) {
516
523
  grid-column-end: 5;
517
524
  }
518
525
  }
519
526
  @media (min-width: 689px) {
520
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507) {
527
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514) {
521
528
  /*
522
529
  Notifications is the previous adjacent sibling to the Main in
523
530
  desktop viewports if there are no Breadcrumbs or Header. Use additional
@@ -532,18 +539,18 @@ when the navigation or tools drawers are open in responsive viewports.
532
539
  sibling to the Main which requires no top padding.
533
540
  */
534
541
  }
535
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-default_hyvsj_1al7x_535.awsui_has-notifications-content_hyvsj_1al7x_167:not(.awsui_has-breadcrumbs_hyvsj_1al7x_160):not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173), .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-form_hyvsj_1al7x_535.awsui_has-notifications-content_hyvsj_1al7x_167:not(.awsui_has-breadcrumbs_hyvsj_1al7x_160):not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173) {
542
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
536
543
  padding-top: var(--space-scaled-m-pv0fmt, 16px);
537
544
  }
538
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-default_hyvsj_1al7x_535:not(.awsui_has-notifications-content_hyvsj_1al7x_167):not(.awsui_has-breadcrumbs_hyvsj_1al7x_160):not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173), .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-form_hyvsj_1al7x_535:not(.awsui_has-notifications-content_hyvsj_1al7x_167):not(.awsui_has-breadcrumbs_hyvsj_1al7x_160):not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173) {
545
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-breadcrumbs_hyvsj_8eynx_166):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
539
546
  padding-top: var(--space-scaled-xs-6859qs, 8px);
540
547
  }
541
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_has-header_hyvsj_1al7x_173, .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_has-dynamic-overlap-height_hyvsj_1al7x_173 {
548
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-header_hyvsj_8eynx_179, .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-dynamic-overlap-height_hyvsj_8eynx_179 {
542
549
  padding-top: 0;
543
550
  }
544
551
  }
545
552
  @media (max-width: 688px) {
546
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507) {
553
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514) {
547
554
  /*
548
555
  If the Notifications exist but the Header does not then the
549
556
  Notifications is the previous adjacent sibling to the Main
@@ -558,22 +565,22 @@ when the navigation or tools drawers are open in responsive viewports.
558
565
  sibling to the Main which requires no top padding.
559
566
  */
560
567
  }
561
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-default_hyvsj_1al7x_535.awsui_has-notifications-content_hyvsj_1al7x_167:not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173), .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-form_hyvsj_1al7x_535.awsui_has-notifications-content_hyvsj_1al7x_167:not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173) {
568
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542.awsui_has-notifications-content_hyvsj_8eynx_173:not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
562
569
  padding-top: var(--space-scaled-m-pv0fmt, 16px);
563
570
  }
564
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-default_hyvsj_1al7x_535:not(.awsui_has-notifications-content_hyvsj_1al7x_167):not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173), .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_content-type-form_hyvsj_1al7x_535:not(.awsui_has-notifications-content_hyvsj_1al7x_167):not(.awsui_has-header_hyvsj_1al7x_173):not(.awsui_has-dynamic-overlap-height_hyvsj_1al7x_173) {
571
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-default_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179), .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_content-type-form_hyvsj_8eynx_542:not(.awsui_has-notifications-content_hyvsj_8eynx_173):not(.awsui_has-header_hyvsj_8eynx_179):not(.awsui_has-dynamic-overlap-height_hyvsj_8eynx_179) {
565
572
  padding-top: var(--space-scaled-m-pv0fmt, 16px);
566
573
  }
567
- .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_has-header_hyvsj_1al7x_173, .awsui_container_hyvsj_1al7x_490:not(#\9):not(.awsui_disable-content-paddings_hyvsj_1al7x_507).awsui_has-dynamic-overlap-height_hyvsj_1al7x_173 {
574
+ .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-header_hyvsj_8eynx_179, .awsui_container_hyvsj_8eynx_497:not(#\9):not(.awsui_disable-content-paddings_hyvsj_8eynx_514).awsui_has-dynamic-overlap-height_hyvsj_8eynx_179 {
568
575
  padding-top: 0;
569
576
  }
570
577
  }
571
- .awsui_container_hyvsj_1al7x_490.awsui_content-type-cards_hyvsj_1al7x_177:not(#\9), .awsui_container_hyvsj_1al7x_490.awsui_content-type-table_hyvsj_1al7x_178:not(#\9), .awsui_container_hyvsj_1al7x_490.awsui_content-type-wizard_hyvsj_1al7x_174:not(#\9) {
578
+ .awsui_container_hyvsj_8eynx_497.awsui_content-type-cards_hyvsj_8eynx_183:not(#\9), .awsui_container_hyvsj_8eynx_497.awsui_content-type-table_hyvsj_8eynx_184:not(#\9), .awsui_container_hyvsj_8eynx_497.awsui_content-type-wizard_hyvsj_8eynx_180:not(#\9) {
572
579
  padding-top: 0;
573
580
  }
574
581
 
575
582
  /* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
576
- .awsui_unfocusable_hyvsj_1al7x_576 *:not(#\9) {
583
+ .awsui_unfocusable_hyvsj_8eynx_583 *:not(#\9) {
577
584
  visibility: hidden !important;
578
585
  }
579
586
 
@@ -581,7 +588,7 @@ when the navigation or tools drawers are open in responsive viewports.
581
588
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
582
589
  SPDX-License-Identifier: Apache-2.0
583
590
  */
584
- .awsui_navigation-container_hyvsj_1al7x_584:not(#\9) {
591
+ .awsui_navigation-container_hyvsj_8eynx_591:not(#\9) {
585
592
  --awsui-navigation-width-f9jj7p: 280px;
586
593
  display: flex;
587
594
  grid-column: 1;
@@ -590,14 +597,25 @@ when the navigation or tools drawers are open in responsive viewports.
590
597
  position: sticky;
591
598
  top: var(--awsui-offset-top-f9jj7p);
592
599
  z-index: 850;
600
+ /*
601
+ The navigation and tools containers (that contain the toggle buttons)
602
+ stretch the full height of the app layout. Normally, this wouldn't be an
603
+ issue because they sit above the app layout's content padding.
604
+
605
+ But if disableContentPaddings is set to true and there are buttons on the
606
+ left/right edges of the screen, they will be covered by the containers. So
607
+ we need to disable pointer events in the container and re-enable them in
608
+ the panels and toggle buttons.
609
+ */
610
+ pointer-events: none;
593
611
  }
594
612
  @media (min-width: 2541px) {
595
- .awsui_navigation-container_hyvsj_1al7x_584:not(#\9) {
613
+ .awsui_navigation-container_hyvsj_8eynx_591:not(#\9) {
596
614
  --awsui-navigation-width-f9jj7p: 320px;
597
615
  }
598
616
  }
599
617
  @media (max-width: 688px) {
600
- .awsui_navigation-container_hyvsj_1al7x_584:not(#\9) {
618
+ .awsui_navigation-container_hyvsj_8eynx_591:not(#\9) {
601
619
  left: 0;
602
620
  position: fixed;
603
621
  top: var(--awsui-offset-top-f9jj7p);
@@ -605,14 +623,14 @@ when the navigation or tools drawers are open in responsive viewports.
605
623
  }
606
624
  }
607
625
 
608
- nav.awsui_show-navigation_hyvsj_1al7x_608:not(#\9) {
626
+ nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9) {
609
627
  padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-layout-toggle-padding-axl9jr, 20px);
610
628
  /*
611
629
  Apply the animation only in desktop viewports because the AppBar will
612
630
  take control in responsive viewports.
613
631
  */
614
632
  }
615
- @keyframes awsui_showButtons_hyvsj_1al7x_1 {
633
+ @keyframes awsui_showButtons_hyvsj_8eynx_1 {
616
634
  0% {
617
635
  opacity: 0;
618
636
  }
@@ -620,31 +638,31 @@ nav.awsui_show-navigation_hyvsj_1al7x_608:not(#\9) {
620
638
  opacity: 1;
621
639
  }
622
640
  }
623
- nav.awsui_show-navigation_hyvsj_1al7x_608.awsui_is-navigation-open_hyvsj_1al7x_512:not(#\9) {
641
+ nav.awsui_show-navigation_hyvsj_8eynx_626.awsui_is-navigation-open_hyvsj_8eynx_519:not(#\9) {
624
642
  display: none;
625
643
  }
626
644
  @media (min-width: 689px) {
627
- nav.awsui_show-navigation_hyvsj_1al7x_608:not(#\9):not(.awsui_is-navigation-open_hyvsj_1al7x_512) {
645
+ nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519) {
628
646
  display: block;
629
647
  }
630
- nav.awsui_show-navigation_hyvsj_1al7x_608:not(#\9):not(.awsui_is-navigation-open_hyvsj_1al7x_512).awsui_animating_hyvsj_1al7x_630 {
631
- animation: awsui_showButtons_hyvsj_1al7x_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
648
+ nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648 {
649
+ animation: awsui_showButtons_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
632
650
  }
633
651
  }
634
652
  @media (min-width: 689px) and (prefers-reduced-motion: reduce) {
635
- nav.awsui_show-navigation_hyvsj_1al7x_608:not(#\9):not(.awsui_is-navigation-open_hyvsj_1al7x_512).awsui_animating_hyvsj_1al7x_630 {
653
+ nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648 {
636
654
  animation: none;
637
655
  transition: none;
638
656
  }
639
657
  }
640
658
  @media (min-width: 689px) {
641
- .awsui-motion-disabled nav.awsui_show-navigation_hyvsj_1al7x_608:not(#\9):not(.awsui_is-navigation-open_hyvsj_1al7x_512).awsui_animating_hyvsj_1al7x_630, .awsui-mode-entering nav.awsui_show-navigation_hyvsj_1al7x_608:not(#\9):not(.awsui_is-navigation-open_hyvsj_1al7x_512).awsui_animating_hyvsj_1al7x_630 {
659
+ .awsui-motion-disabled nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648, .awsui-mode-entering nav.awsui_show-navigation_hyvsj_8eynx_626:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519).awsui_animating_hyvsj_8eynx_648 {
642
660
  animation: none;
643
661
  transition: none;
644
662
  }
645
663
  }
646
664
 
647
- nav.awsui_navigation_hyvsj_1al7x_584:not(#\9) {
665
+ nav.awsui_navigation_hyvsj_8eynx_591:not(#\9) {
648
666
  background-color: var(--color-background-container-content-i8i4a0, #ffffff);
649
667
  box-shadow: var(--shadow-panel-gp3bf2, 0px 1px 1px 1px #e9ebed, 0px 6px 36px rgba(0, 7, 22, 0.1));
650
668
  bottom: 0;
@@ -654,13 +672,14 @@ nav.awsui_navigation_hyvsj_1al7x_584:not(#\9) {
654
672
  overscroll-behavior-y: contain;
655
673
  position: relative;
656
674
  word-wrap: break-word;
675
+ pointer-events: auto;
657
676
  /*
658
677
  A non-semantic node is added with a fixed width equal to the final Navigation
659
678
  width. This will create the visual appearance of horizontal movement and
660
679
  prevent unwanted text wrapping.
661
680
  */
662
681
  }
663
- @keyframes awsui_openNavigation_hyvsj_1al7x_1 {
682
+ @keyframes awsui_openNavigation_hyvsj_8eynx_1 {
664
683
  from {
665
684
  opacity: 0;
666
685
  width: calc(var(--space-layout-toggle-padding-axl9jr, 20px) * 2 + var(--space-layout-toggle-diameter-hzvqtj, 40px));
@@ -670,33 +689,33 @@ nav.awsui_navigation_hyvsj_1al7x_584:not(#\9) {
670
689
  width: var(--awsui-navigation-width-f9jj7p);
671
690
  }
672
691
  }
673
- nav.awsui_navigation_hyvsj_1al7x_584:not(#\9):not(.awsui_is-navigation-open_hyvsj_1al7x_512) {
692
+ nav.awsui_navigation_hyvsj_8eynx_591:not(#\9):not(.awsui_is-navigation-open_hyvsj_8eynx_519) {
674
693
  width: 0;
675
694
  display: none;
676
695
  }
677
- nav.awsui_navigation_hyvsj_1al7x_584.awsui_is-navigation-open_hyvsj_1al7x_512.awsui_animating_hyvsj_1al7x_630:not(#\9) {
678
- animation: awsui_openNavigation_hyvsj_1al7x_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
696
+ nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9) {
697
+ animation: awsui_openNavigation_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
679
698
  }
680
699
  @media (prefers-reduced-motion: reduce) {
681
- nav.awsui_navigation_hyvsj_1al7x_584.awsui_is-navigation-open_hyvsj_1al7x_512.awsui_animating_hyvsj_1al7x_630:not(#\9) {
700
+ nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9) {
682
701
  animation: none;
683
702
  transition: none;
684
703
  }
685
704
  }
686
- .awsui-motion-disabled nav.awsui_navigation_hyvsj_1al7x_584.awsui_is-navigation-open_hyvsj_1al7x_512.awsui_animating_hyvsj_1al7x_630:not(#\9), .awsui-mode-entering nav.awsui_navigation_hyvsj_1al7x_584.awsui_is-navigation-open_hyvsj_1al7x_512.awsui_animating_hyvsj_1al7x_630:not(#\9) {
705
+ .awsui-motion-disabled nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering nav.awsui_navigation_hyvsj_8eynx_591.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_animating_hyvsj_8eynx_648:not(#\9) {
687
706
  animation: none;
688
707
  transition: none;
689
708
  }
690
- nav.awsui_navigation_hyvsj_1al7x_584 > .awsui_animated-content_hyvsj_1al7x_690:not(#\9) {
709
+ nav.awsui_navigation_hyvsj_8eynx_591 > .awsui_animated-content_hyvsj_8eynx_709:not(#\9) {
691
710
  width: var(--awsui-navigation-width-f9jj7p);
692
711
  }
693
712
  @media (max-width: 688px) {
694
- nav.awsui_navigation_hyvsj_1al7x_584:not(#\9) {
713
+ nav.awsui_navigation_hyvsj_8eynx_591:not(#\9) {
695
714
  --awsui-navigation-width-f9jj7p: 100vw;
696
715
  }
697
716
  }
698
717
 
699
- .awsui_hide-navigation_hyvsj_1al7x_699:not(#\9) {
718
+ .awsui_hide-navigation_hyvsj_8eynx_718:not(#\9) {
700
719
  position: absolute;
701
720
  right: var(--space-m-17eucw, 16px);
702
721
  top: var(--size-vertical-panel-icon-offset-ti40n4, 15px);
@@ -706,7 +725,7 @@ nav.awsui_navigation_hyvsj_1al7x_584 > .awsui_animated-content_hyvsj_1al7x_690:n
706
725
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
707
726
  SPDX-License-Identifier: Apache-2.0
708
727
  */
709
- .awsui_notifications_hyvsj_1al7x_216:not(#\9) {
728
+ .awsui_notifications_hyvsj_8eynx_224:not(#\9) {
710
729
  grid-column: 3;
711
730
  grid-row: 1;
712
731
  z-index: 825;
@@ -723,30 +742,30 @@ nav.awsui_navigation_hyvsj_1al7x_584 > .awsui_animated-content_hyvsj_1al7x_690:n
723
742
  */
724
743
  }
725
744
  @media (min-width: 689px) {
726
- .awsui_notifications_hyvsj_1al7x_216:not(#\9) {
745
+ .awsui_notifications_hyvsj_8eynx_224:not(#\9) {
727
746
  margin: var(--space-xs-rsr2qu, 8px) 0;
728
747
  /*
729
748
  var(--space-xs-rsr2qu, 8px) token needs to align with the $offsetTopWithNotifications
730
749
  calculation in the layout CSS.
731
750
  */
732
751
  }
733
- .awsui_notifications_hyvsj_1al7x_216.awsui_sticky-notifications_hyvsj_1al7x_228:not(#\9) {
752
+ .awsui_notifications_hyvsj_8eynx_224.awsui_sticky-notifications_hyvsj_8eynx_236:not(#\9) {
734
753
  position: sticky;
735
754
  top: calc(var(--awsui-offset-top-f9jj7p) + var(--space-xs-rsr2qu, 8px));
736
755
  }
737
- .awsui_notifications_hyvsj_1al7x_216:not(#\9):not(.awsui_has-notifications-content_hyvsj_1al7x_167) {
756
+ .awsui_notifications_hyvsj_8eynx_224:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173) {
738
757
  margin: 0;
739
758
  }
740
759
  }
741
760
  @media (max-width: 688px) {
742
- .awsui_notifications_hyvsj_1al7x_216:not(#\9) {
761
+ .awsui_notifications_hyvsj_8eynx_224:not(#\9) {
743
762
  grid-row: 2;
744
763
  margin: var(--space-scaled-s-cu1hzn, 12px) 0;
745
764
  }
746
- .awsui_notifications_hyvsj_1al7x_216.awsui_sticky-notifications_hyvsj_1al7x_228:not(#\9) {
765
+ .awsui_notifications_hyvsj_8eynx_224.awsui_sticky-notifications_hyvsj_8eynx_236:not(#\9) {
747
766
  position: static;
748
767
  }
749
- .awsui_notifications_hyvsj_1al7x_216:not(#\9):not(.awsui_has-notifications-content_hyvsj_1al7x_167) {
768
+ .awsui_notifications_hyvsj_8eynx_224:not(#\9):not(.awsui_has-notifications-content_hyvsj_8eynx_173) {
750
769
  margin: 0;
751
770
  }
752
771
  }
@@ -763,7 +782,7 @@ within. In the bottom position, the Split Panel is simply a direct child
763
782
  of the Tools component flex container and should consume 100% of the
764
783
  parent height.
765
784
  */
766
- section.awsui_split-panel-bottom_hyvsj_1al7x_766:not(#\9) {
785
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785:not(#\9) {
767
786
  bottom: var(--awsui-footer-height-f9jj7p);
768
787
  display: none;
769
788
  grid-column: 1/6;
@@ -787,7 +806,7 @@ section.awsui_split-panel-bottom_hyvsj_1al7x_766:not(#\9) {
787
806
  apply the animation to the height property.
788
807
  */
789
808
  }
790
- @keyframes awsui_openSplitPanelBottom_hyvsj_1al7x_1 {
809
+ @keyframes awsui_openSplitPanelBottom_hyvsj_8eynx_1 {
791
810
  from {
792
811
  height: var(--awsui-split-panel-reported-header-size-f9jj7p, 0);
793
812
  }
@@ -795,41 +814,42 @@ section.awsui_split-panel-bottom_hyvsj_1al7x_766:not(#\9) {
795
814
  height: var(--awsui-split-panel-reported-size-f9jj7p);
796
815
  }
797
816
  }
798
- section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_disable-body-scroll_hyvsj_1al7x_434:not(#\9) {
817
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_disable-body-scroll_hyvsj_8eynx_441:not(#\9) {
799
818
  bottom: 0;
800
819
  }
801
- section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_is-navigation-open_hyvsj_1al7x_512.awsui_position-bottom_hyvsj_1al7x_801:not(#\9) {
820
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-navigation-open_hyvsj_8eynx_519.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
802
821
  grid-column-start: 2;
803
822
  }
804
- section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_is-tools-open_hyvsj_1al7x_515.awsui_position-bottom_hyvsj_1al7x_801:not(#\9) {
823
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-tools-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
805
824
  grid-column-end: 5;
806
825
  }
807
- section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_position-bottom_hyvsj_1al7x_801:not(#\9) {
826
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
808
827
  display: block;
809
828
  }
810
- section.awsui_split-panel-bottom_hyvsj_1al7x_766:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1al7x_515).awsui_position-bottom_hyvsj_1al7x_801 {
829
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785:not(#\9):not(.awsui_is-split-panel-open_hyvsj_8eynx_522).awsui_position-bottom_hyvsj_8eynx_820 {
811
830
  box-shadow: rgba(0, 7, 22, 0.1) 0px -32px 32px -24px;
812
831
  }
813
- section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-bottom_hyvsj_1al7x_801:not(#\9) {
832
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
814
833
  box-shadow: var(--shadow-split-bottom-otfetg, 0px -36px 36px -36px rgba(0, 7, 22, 0.1));
815
834
  }
816
- section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-bottom_hyvsj_1al7x_801.awsui_animating_hyvsj_1al7x_630:not(#\9) {
817
- animation: awsui_openSplitPanelBottom_hyvsj_1al7x_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
835
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9) {
836
+ animation: awsui_openSplitPanelBottom_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
818
837
  }
819
838
  @media (prefers-reduced-motion: reduce) {
820
- section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-bottom_hyvsj_1al7x_801.awsui_animating_hyvsj_1al7x_630:not(#\9) {
839
+ section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9) {
821
840
  animation: none;
822
841
  transition: none;
823
842
  }
824
843
  }
825
- .awsui-motion-disabled section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-bottom_hyvsj_1al7x_801.awsui_animating_hyvsj_1al7x_630:not(#\9), .awsui-mode-entering section.awsui_split-panel-bottom_hyvsj_1al7x_766.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-bottom_hyvsj_1al7x_801.awsui_animating_hyvsj_1al7x_630:not(#\9) {
844
+ .awsui-motion-disabled section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering section.awsui_split-panel-bottom_hyvsj_8eynx_785.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-bottom_hyvsj_8eynx_820.awsui_animating_hyvsj_8eynx_648:not(#\9) {
826
845
  animation: none;
827
846
  transition: none;
828
847
  }
829
848
 
830
- section.awsui_split-panel-side_hyvsj_1al7x_830:not(#\9) {
849
+ section.awsui_split-panel-side_hyvsj_8eynx_849:not(#\9) {
831
850
  height: 100%;
832
851
  overflow-x: hidden;
852
+ pointer-events: auto;
833
853
  /*
834
854
  The min and max widths are applied when the Split Panel is opened otherwise
835
855
  it would not be possible to animate the width and the box shadow would
@@ -841,7 +861,7 @@ section.awsui_split-panel-side_hyvsj_1al7x_830:not(#\9) {
841
861
  prevent unwanted text wrapping.
842
862
  */
843
863
  }
844
- @keyframes awsui_openSplitPanelSide_hyvsj_1al7x_1 {
864
+ @keyframes awsui_openSplitPanelSide_hyvsj_8eynx_1 {
845
865
  from {
846
866
  opacity: 0;
847
867
  width: var(--awsui-split-panel-min-width-f9jj7p, 280px);
@@ -851,28 +871,28 @@ section.awsui_split-panel-side_hyvsj_1al7x_830:not(#\9) {
851
871
  width: var(--awsui-split-panel-reported-size-f9jj7p);
852
872
  }
853
873
  }
854
- section.awsui_split-panel-side_hyvsj_1al7x_830:not(#\9):not(.awsui_is-split-panel-open_hyvsj_1al7x_515), section.awsui_split-panel-side_hyvsj_1al7x_830.awsui_position-bottom_hyvsj_1al7x_801:not(#\9) {
874
+ section.awsui_split-panel-side_hyvsj_8eynx_849:not(#\9):not(.awsui_is-split-panel-open_hyvsj_8eynx_522), section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_position-bottom_hyvsj_8eynx_820:not(#\9) {
855
875
  width: 0;
856
876
  }
857
- section.awsui_split-panel-side_hyvsj_1al7x_830.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-side_hyvsj_1al7x_857:not(#\9) {
877
+ section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877:not(#\9) {
858
878
  box-shadow: var(--shadow-panel-gp3bf2, 0px 1px 1px 1px #e9ebed, 0px 6px 36px rgba(0, 7, 22, 0.1));
859
879
  max-width: var(--awsui-split-panel-max-width-f9jj7p, 280px);
860
880
  min-width: var(--awsui-split-panel-min-width-f9jj7p, 280px);
861
881
  }
862
- section.awsui_split-panel-side_hyvsj_1al7x_830.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-side_hyvsj_1al7x_857.awsui_animating_hyvsj_1al7x_630:not(#\9) {
863
- animation: awsui_openSplitPanelSide_hyvsj_1al7x_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
882
+ section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9) {
883
+ animation: awsui_openSplitPanelSide_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
864
884
  }
865
885
  @media (prefers-reduced-motion: reduce) {
866
- section.awsui_split-panel-side_hyvsj_1al7x_830.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-side_hyvsj_1al7x_857.awsui_animating_hyvsj_1al7x_630:not(#\9) {
886
+ section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9) {
867
887
  animation: none;
868
888
  transition: none;
869
889
  }
870
890
  }
871
- .awsui-motion-disabled section.awsui_split-panel-side_hyvsj_1al7x_830.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-side_hyvsj_1al7x_857.awsui_animating_hyvsj_1al7x_630:not(#\9), .awsui-mode-entering section.awsui_split-panel-side_hyvsj_1al7x_830.awsui_is-split-panel-open_hyvsj_1al7x_515.awsui_position-side_hyvsj_1al7x_857.awsui_animating_hyvsj_1al7x_630:not(#\9) {
891
+ .awsui-motion-disabled section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering section.awsui_split-panel-side_hyvsj_8eynx_849.awsui_is-split-panel-open_hyvsj_8eynx_522.awsui_position-side_hyvsj_8eynx_877.awsui_animating_hyvsj_8eynx_648:not(#\9) {
872
892
  animation: none;
873
893
  transition: none;
874
894
  }
875
- section.awsui_split-panel-side_hyvsj_1al7x_830 > .awsui_animated-content_hyvsj_1al7x_690:not(#\9) {
895
+ section.awsui_split-panel-side_hyvsj_8eynx_849 > .awsui_animated-content_hyvsj_8eynx_709:not(#\9) {
876
896
  height: 100%;
877
897
  max-width: inherit;
878
898
  width: var(--awsui-split-panel-reported-size-f9jj7p);
@@ -891,7 +911,7 @@ content width has a default value that can be set directly with the minContentWi
891
911
  property. The content gap right is computed in the Layout styles based on the
892
912
  viewport size and state of the Tools drawer.
893
913
  */
894
- .awsui_tools-container_hyvsj_1al7x_894:not(#\9) {
914
+ .awsui_tools-container_hyvsj_8eynx_914:not(#\9) {
895
915
  /* stylelint-disable scss/operator-no-newline-after */
896
916
  --awsui-tools-max-width-f9jj7p: calc(var(--awsui-layout-width-f9jj7p) - var(--awsui-main-offset-left-f9jj7p) - var(--awsui-default-min-content-width-f9jj7p) - var(--awsui-content-gap-right-f9jj7p));
897
917
  /* stylelint-enable scss/operator-no-newline-after */
@@ -904,14 +924,15 @@ viewport size and state of the Tools drawer.
904
924
  position: sticky;
905
925
  top: var(--awsui-offset-top-f9jj7p);
906
926
  z-index: 850;
927
+ pointer-events: none;
907
928
  }
908
929
  @media (min-width: 2541px) {
909
- .awsui_tools-container_hyvsj_1al7x_894:not(#\9) {
930
+ .awsui_tools-container_hyvsj_8eynx_914:not(#\9) {
910
931
  --awsui-tools-width-f9jj7p: 360px;
911
932
  }
912
933
  }
913
934
  @media (max-width: 688px) {
914
- .awsui_tools-container_hyvsj_1al7x_894:not(#\9) {
935
+ .awsui_tools-container_hyvsj_8eynx_914:not(#\9) {
915
936
  --awsui-tools-max-width-f9jj7p: none;
916
937
  --awsui-tools-width-f9jj7p: auto;
917
938
  position: fixed;
@@ -921,7 +942,7 @@ viewport size and state of the Tools drawer.
921
942
  }
922
943
  }
923
944
 
924
- .awsui_tools_hyvsj_1al7x_894:not(#\9) {
945
+ .awsui_tools_hyvsj_8eynx_914:not(#\9) {
925
946
  background-color: var(--color-background-container-content-i8i4a0, #ffffff);
926
947
  box-shadow: var(--shadow-panel-gp3bf2, 0px 1px 1px 1px #e9ebed, 0px 6px 36px rgba(0, 7, 22, 0.1));
927
948
  flex-shrink: 0;
@@ -931,6 +952,7 @@ viewport size and state of the Tools drawer.
931
952
  overscroll-behavior-y: contain;
932
953
  position: relative;
933
954
  word-wrap: break-word;
955
+ pointer-events: auto;
934
956
  /*
935
957
  A non-semantic node is added with a fixed width equal to the final Tools
936
958
  width. This will create the visual appearance of horizontal movement and
@@ -943,7 +965,7 @@ viewport size and state of the Tools drawer.
943
965
  in the side position.
944
966
  */
945
967
  }
946
- @keyframes awsui_openTools_hyvsj_1al7x_1 {
968
+ @keyframes awsui_openTools_hyvsj_8eynx_1 {
947
969
  from {
948
970
  opacity: var(--awsui-tools-animation-starting-opacity-f9jj7p, 0);
949
971
  width: calc(var(--space-layout-toggle-padding-axl9jr, 20px) * 2 + var(--space-layout-toggle-diameter-hzvqtj, 40px));
@@ -953,38 +975,38 @@ viewport size and state of the Tools drawer.
953
975
  width: var(--awsui-tools-width-f9jj7p);
954
976
  }
955
977
  }
956
- .awsui_tools_hyvsj_1al7x_894:not(#\9):not(.awsui_is-tools-open_hyvsj_1al7x_515) {
978
+ .awsui_tools_hyvsj_8eynx_914:not(#\9):not(.awsui_is-tools-open_hyvsj_8eynx_522) {
957
979
  width: 0;
958
980
  display: none;
959
981
  }
960
- .awsui_tools_hyvsj_1al7x_894.awsui_is-tools-open_hyvsj_1al7x_515.awsui_animating_hyvsj_1al7x_630:not(#\9) {
961
- animation: awsui_openTools_hyvsj_1al7x_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
982
+ .awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9) {
983
+ animation: awsui_openTools_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
962
984
  }
963
985
  @media (prefers-reduced-motion: reduce) {
964
- .awsui_tools_hyvsj_1al7x_894.awsui_is-tools-open_hyvsj_1al7x_515.awsui_animating_hyvsj_1al7x_630:not(#\9) {
986
+ .awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9) {
965
987
  animation: none;
966
988
  transition: none;
967
989
  }
968
990
  }
969
- .awsui-motion-disabled .awsui_tools_hyvsj_1al7x_894.awsui_is-tools-open_hyvsj_1al7x_515.awsui_animating_hyvsj_1al7x_630:not(#\9), .awsui-mode-entering .awsui_tools_hyvsj_1al7x_894.awsui_is-tools-open_hyvsj_1al7x_515.awsui_animating_hyvsj_1al7x_630:not(#\9) {
991
+ .awsui-motion-disabled .awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering .awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_animating_hyvsj_8eynx_648:not(#\9) {
970
992
  animation: none;
971
993
  transition: none;
972
994
  }
973
- .awsui_tools_hyvsj_1al7x_894 > .awsui_animated-content_hyvsj_1al7x_690:not(#\9) {
995
+ .awsui_tools_hyvsj_8eynx_914 > .awsui_animated-content_hyvsj_8eynx_709:not(#\9) {
974
996
  width: var(--awsui-tools-width-f9jj7p);
975
997
  }
976
998
  @media (min-width: 689px) {
977
- .awsui_tools_hyvsj_1al7x_894.awsui_is-tools-open_hyvsj_1al7x_515.awsui_has-tools-form-persistence_hyvsj_1al7x_977:not(#\9) {
999
+ .awsui_tools_hyvsj_8eynx_914.awsui_is-tools-open_hyvsj_8eynx_522.awsui_has-tools-form-persistence_hyvsj_8eynx_999:not(#\9) {
978
1000
  border-right: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
979
1001
  }
980
1002
  }
981
1003
  @media (max-width: 688px) {
982
- .awsui_tools_hyvsj_1al7x_894:not(#\9) {
1004
+ .awsui_tools_hyvsj_8eynx_914:not(#\9) {
983
1005
  --awsui-tools-width-f9jj7p: 100vw;
984
1006
  }
985
1007
  }
986
1008
 
987
- .awsui_hide-tools_hyvsj_1al7x_987:not(#\9) {
1009
+ .awsui_hide-tools_hyvsj_8eynx_1009:not(#\9) {
988
1010
  position: absolute;
989
1011
  right: var(--space-m-17eucw, 16px);
990
1012
  top: var(--size-vertical-panel-icon-offset-ti40n4, 15px);
@@ -996,7 +1018,7 @@ Warning! If these design tokens for padding change it will adversely impact
996
1018
  the calculation used to determine the Split Panel maximum width in the
997
1019
  handleSplitPanelMaxWidth function in the context.
998
1020
  */
999
- .awsui_show-tools_hyvsj_1al7x_999:not(#\9) {
1021
+ .awsui_show-tools_hyvsj_8eynx_1021:not(#\9) {
1000
1022
  box-sizing: border-box;
1001
1023
  padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-layout-toggle-padding-axl9jr, 20px);
1002
1024
  /*
@@ -1004,7 +1026,7 @@ handleSplitPanelMaxWidth function in the context.
1004
1026
  take control in responsive viewports.
1005
1027
  */
1006
1028
  }
1007
- @keyframes awsui_showButtons_hyvsj_1al7x_1 {
1029
+ @keyframes awsui_showButtons_hyvsj_8eynx_1 {
1008
1030
  0% {
1009
1031
  opacity: 0;
1010
1032
  }
@@ -1012,33 +1034,33 @@ handleSplitPanelMaxWidth function in the context.
1012
1034
  opacity: 1;
1013
1035
  }
1014
1036
  }
1015
- .awsui_show-tools_hyvsj_1al7x_999:not(#\9):not(.awsui_has-tools-form_hyvsj_1al7x_977) {
1037
+ .awsui_show-tools_hyvsj_8eynx_1021:not(#\9):not(.awsui_has-tools-form_hyvsj_8eynx_999) {
1016
1038
  display: none;
1017
1039
  }
1018
1040
  @media (min-width: 689px) {
1019
- .awsui_show-tools_hyvsj_1al7x_999.awsui_has-tools-form_hyvsj_1al7x_977:not(#\9) {
1041
+ .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999:not(#\9) {
1020
1042
  display: flex;
1021
1043
  flex-direction: column;
1022
1044
  gap: var(--space-xs-rsr2qu, 8px);
1023
1045
  }
1024
- .awsui_show-tools_hyvsj_1al7x_999.awsui_has-tools-form_hyvsj_1al7x_977.awsui_animating_hyvsj_1al7x_630:not(#\9) {
1025
- animation: awsui_showButtons_hyvsj_1al7x_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
1046
+ .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9) {
1047
+ animation: awsui_showButtons_hyvsj_8eynx_1 var(--motion-duration-refresh-only-fast-addxjd, 115ms);
1026
1048
  }
1027
1049
  }
1028
1050
  @media (min-width: 689px) and (prefers-reduced-motion: reduce) {
1029
- .awsui_show-tools_hyvsj_1al7x_999.awsui_has-tools-form_hyvsj_1al7x_977.awsui_animating_hyvsj_1al7x_630:not(#\9) {
1051
+ .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9) {
1030
1052
  animation: none;
1031
1053
  transition: none;
1032
1054
  }
1033
1055
  }
1034
1056
  @media (min-width: 689px) {
1035
- .awsui-motion-disabled .awsui_show-tools_hyvsj_1al7x_999.awsui_has-tools-form_hyvsj_1al7x_977.awsui_animating_hyvsj_1al7x_630:not(#\9), .awsui-mode-entering .awsui_show-tools_hyvsj_1al7x_999.awsui_has-tools-form_hyvsj_1al7x_977.awsui_animating_hyvsj_1al7x_630:not(#\9) {
1057
+ .awsui-motion-disabled .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9), .awsui-mode-entering .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form_hyvsj_8eynx_999.awsui_animating_hyvsj_8eynx_648:not(#\9) {
1036
1058
  animation: none;
1037
1059
  transition: none;
1038
1060
  }
1039
1061
  }
1040
1062
  @media (min-width: 689px) {
1041
- .awsui_show-tools_hyvsj_1al7x_999.awsui_has-tools-form-persistence_hyvsj_1al7x_977:not(#\9) {
1063
+ .awsui_show-tools_hyvsj_8eynx_1021.awsui_has-tools-form-persistence_hyvsj_8eynx_999:not(#\9) {
1042
1064
  background-color: var(--color-background-container-content-i8i4a0, #ffffff);
1043
1065
  z-index: 1;
1044
1066
  }
@@ -1053,7 +1075,7 @@ Warning! If these design tokens for width change it will adversely impact
1053
1075
  the calculation used to determine the Split Panel maximum width in the
1054
1076
  handleSplitPanelMaxWidth function in the context.
1055
1077
  */
1056
- .awsui_trigger_hyvsj_1al7x_1056:not(#\9) {
1078
+ .awsui_trigger_hyvsj_8eynx_1078:not(#\9) {
1057
1079
  background: var(--color-background-layout-toggle-default-f9hnkv, #192534);
1058
1080
  border: none;
1059
1081
  border-radius: 50%;
@@ -1063,15 +1085,16 @@ handleSplitPanelMaxWidth function in the context.
1063
1085
  height: var(--space-layout-toggle-diameter-hzvqtj, 40px);
1064
1086
  padding: 0 var(--space-s-hv8c1d, 12px);
1065
1087
  width: var(--space-layout-toggle-diameter-hzvqtj, 40px);
1088
+ pointer-events: auto;
1066
1089
  }
1067
- .awsui_trigger_hyvsj_1al7x_1056[data-awsui-focus-visible=true]:not(#\9):focus {
1090
+ .awsui_trigger_hyvsj_8eynx_1078[data-awsui-focus-visible=true]:not(#\9):focus {
1068
1091
  position: relative;
1069
1092
  }
1070
- .awsui_trigger_hyvsj_1al7x_1056[data-awsui-focus-visible=true]:not(#\9):focus {
1093
+ .awsui_trigger_hyvsj_8eynx_1078[data-awsui-focus-visible=true]:not(#\9):focus {
1071
1094
  outline: 2px dotted transparent;
1072
1095
  outline-offset: calc(3px - 1px);
1073
1096
  }
1074
- .awsui_trigger_hyvsj_1al7x_1056[data-awsui-focus-visible=true]:not(#\9):focus::before {
1097
+ .awsui_trigger_hyvsj_8eynx_1078[data-awsui-focus-visible=true]:not(#\9):focus::before {
1075
1098
  content: " ";
1076
1099
  display: block;
1077
1100
  position: absolute;
@@ -1082,23 +1105,23 @@ handleSplitPanelMaxWidth function in the context.
1082
1105
  border-radius: var(--border-radius-control-default-focus-ring-7661kz, 4px);
1083
1106
  box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
1084
1107
  }
1085
- .awsui_trigger_hyvsj_1al7x_1056:not(#\9):focus {
1108
+ .awsui_trigger_hyvsj_8eynx_1078:not(#\9):focus {
1086
1109
  outline: none;
1087
1110
  }
1088
- .awsui_trigger_hyvsj_1al7x_1056:not(#\9):hover {
1111
+ .awsui_trigger_hyvsj_8eynx_1078:not(#\9):hover {
1089
1112
  background: var(--color-background-layout-toggle-hover-gi0e0b, #354150);
1090
1113
  }
1091
- .awsui_trigger_hyvsj_1al7x_1056:not(#\9):active {
1114
+ .awsui_trigger_hyvsj_8eynx_1078:not(#\9):active {
1092
1115
  background: var(--color-background-layout-toggle-active-d15dki, #354150);
1093
1116
  }
1094
- .awsui_trigger_hyvsj_1al7x_1056.awsui_selected_hyvsj_1al7x_1094:not(#\9) {
1117
+ .awsui_trigger_hyvsj_8eynx_1078.awsui_selected_hyvsj_8eynx_1117:not(#\9) {
1095
1118
  background: var(--color-background-layout-toggle-selected-default-e1giv3, #0972d3);
1096
1119
  color: var(--color-text-layout-toggle-selected-tzwifo, #ffffff);
1097
1120
  }
1098
- .awsui_trigger_hyvsj_1al7x_1056.awsui_selected_hyvsj_1al7x_1094:not(#\9):hover {
1121
+ .awsui_trigger_hyvsj_8eynx_1078.awsui_selected_hyvsj_8eynx_1117:not(#\9):hover {
1099
1122
  background: var(--color-background-layout-toggle-selected-hover-mes33s, #065299);
1100
1123
  }
1101
- .awsui_trigger_hyvsj_1al7x_1056.awsui_selected_hyvsj_1al7x_1094:not(#\9):active {
1124
+ .awsui_trigger_hyvsj_8eynx_1078.awsui_selected_hyvsj_8eynx_1117:not(#\9):active {
1102
1125
  background: var(--color-background-layout-toggle-selected-active-9w7pk3, #0972d3);
1103
1126
  }
1104
1127