@itwin/itwinui-css 0.55.0 → 0.58.0

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 (48) hide show
  1. package/css/all.css +1116 -689
  2. package/css/anchor.css +21 -17
  3. package/css/breadcrumbs.css +312 -57
  4. package/css/button.css +9 -12
  5. package/css/dialog.css +201 -0
  6. package/css/footer.css +1 -17
  7. package/css/global.css +1 -17
  8. package/css/inputs.css +18 -168
  9. package/css/radio-tile.css +217 -0
  10. package/css/table.css +25 -14
  11. package/css/tabs.css +4 -0
  12. package/css/tag.css +1 -17
  13. package/css/text.css +9 -3
  14. package/css/toast-notification.css +1 -1
  15. package/css/toggle-switch.css +65 -0
  16. package/package.json +1 -1
  17. package/scss/anchor/classes.scss +4 -0
  18. package/scss/breadcrumbs/breadcrumbs.scss +77 -18
  19. package/scss/breadcrumbs/classes.scss +12 -0
  20. package/scss/button/button.scss +17 -16
  21. package/scss/button/classes.scss +4 -0
  22. package/scss/button/cta.scss +3 -1
  23. package/scss/button/default.scss +0 -2
  24. package/scss/button/high-visibility.scss +3 -1
  25. package/scss/classes.scss +4 -3
  26. package/scss/dialog/classes.scss +47 -0
  27. package/scss/dialog/dialog.scss +213 -0
  28. package/scss/{modal → dialog}/index.scss +1 -1
  29. package/scss/index.scss +4 -3
  30. package/scss/inputs/checkbox.scss +11 -6
  31. package/scss/inputs/classes.scss +0 -4
  32. package/scss/inputs/index.scss +0 -1
  33. package/scss/inputs/labeled-inputs.scss +1 -1
  34. package/scss/radio-tile/classes.scss +31 -0
  35. package/scss/radio-tile/index.scss +3 -0
  36. package/scss/radio-tile/radio-tile.scss +209 -0
  37. package/scss/style/anchor.scss +19 -16
  38. package/scss/table/classes.scss +4 -0
  39. package/scss/table/paginator.scss +4 -0
  40. package/scss/table/table.scss +9 -2
  41. package/scss/tabs/tabs.scss +6 -0
  42. package/scss/text/skeleton.scss +13 -7
  43. package/scss/toast-notification/classes.scss +1 -1
  44. package/scss/toggle-switch/toggle-switch.scss +50 -2
  45. package/css/modal.css +0 -132
  46. package/scss/inputs/radio-tile.scss +0 -200
  47. package/scss/modal/classes.scss +0 -15
  48. package/scss/modal/modal.scss +0 -155
package/css/all.css CHANGED
@@ -584,12 +584,12 @@ html.iui-theme-dark-hc{
584
584
  }
585
585
 
586
586
  .iui-anchor{
587
- --_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>");
588
587
  color:#008ae0;
589
588
  -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
590
589
  color:var(--iui-color-foreground-primary);
591
590
  -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
592
591
  border-radius:3px;
592
+ box-sizing:border-box;
593
593
  cursor:pointer;
594
594
  text-decoration:none;
595
595
  }
@@ -607,22 +607,6 @@ html.iui-theme-dark-hc{
607
607
  color:#006bad;
608
608
  color:var(--iui-color-foreground-primary-overlay);
609
609
  }
610
- .iui-anchor-external::after{
611
- content:"";
612
- display:inline-block;
613
- width:1.5ch;
614
- height:1.5ch;
615
- margin-left:0.5ch;
616
- vertical-align:-0.1ch;
617
- background-color:currentColor;
618
- -webkit-mask:var(--_iui-anchor-external-svg);
619
- mask:var(--_iui-anchor-external-svg);
620
- }
621
- @media (forced-colors: active){
622
- .iui-anchor-external::after{
623
- background-color:LinkText;
624
- }
625
- }
626
610
  .iui-anchor:hover{
627
611
  text-decoration:underline;
628
612
  }
@@ -967,12 +951,12 @@ html.iui-theme-dark-hc{
967
951
  }
968
952
 
969
953
  .iui-anchor{
970
- --_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>");
971
954
  color:#008ae0;
972
955
  -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
973
956
  color:var(--iui-color-foreground-primary);
974
957
  -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
975
958
  border-radius:3px;
959
+ box-sizing:border-box;
976
960
  cursor:pointer;
977
961
  text-decoration:none;
978
962
  }
@@ -990,22 +974,6 @@ html.iui-theme-dark-hc{
990
974
  color:#006bad;
991
975
  color:var(--iui-color-foreground-primary-overlay);
992
976
  }
993
- .iui-anchor-external::after{
994
- content:"";
995
- display:inline-block;
996
- width:1.5ch;
997
- height:1.5ch;
998
- margin-left:0.5ch;
999
- vertical-align:-0.1ch;
1000
- background-color:currentColor;
1001
- -webkit-mask:var(--_iui-anchor-external-svg);
1002
- mask:var(--_iui-anchor-external-svg);
1003
- }
1004
- @media (forced-colors: active){
1005
- .iui-anchor-external::after{
1006
- background-color:LinkText;
1007
- }
1008
- }
1009
977
  .iui-anchor:hover{
1010
978
  text-decoration:underline;
1011
979
  }
@@ -1031,6 +999,26 @@ html.iui-theme-dark-hc{
1031
999
  text-decoration:none;
1032
1000
  }
1033
1001
 
1002
+ .iui-anchor-external{
1003
+ --_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>");
1004
+ }
1005
+ .iui-anchor-external::after{
1006
+ content:"";
1007
+ display:inline-block;
1008
+ width:1.5ch;
1009
+ height:1.5ch;
1010
+ margin-left:0.5ch;
1011
+ vertical-align:-0.1ch;
1012
+ background-color:currentColor;
1013
+ -webkit-mask:var(--_iui-anchor-external-svg);
1014
+ mask:var(--_iui-anchor-external-svg);
1015
+ }
1016
+ @media (forced-colors: active){
1017
+ .iui-anchor-external::after{
1018
+ background-color:LinkText;
1019
+ }
1020
+ }
1021
+
1034
1022
  .iui-badge{
1035
1023
  --iui-badge-background-color:#c7ccd1;
1036
1024
  --_iui-badge-text-color:rgba(0, 0, 0, 0.6);
@@ -1108,102 +1096,198 @@ html.iui-theme-dark-hc{
1108
1096
 
1109
1097
  .iui-breadcrumbs-item{
1110
1098
  display:flex;
1099
+ align-items:center;
1111
1100
  line-height:38px;
1112
1101
  height:38px;
1113
- max-width:192px;
1114
- margin:0 12px;
1115
1102
  }
1116
- .iui-breadcrumbs-item a{
1117
- --_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>");
1103
+ .iui-breadcrumbs-item > *{
1104
+ max-width:26ch;
1105
+ }
1106
+
1107
+ .iui-breadcrumbs-item-overrides > *{
1108
+ padding:0 8px;
1109
+ overflow:hidden;
1110
+ white-space:nowrap;
1111
+ text-overflow:ellipsis;
1112
+ }
1113
+ .iui-breadcrumbs-item-overrides > *:not(.iui-button){
1114
+ color:rgba(0, 0, 0, 0.8);
1115
+ color:var(--iui-text-color);
1116
+ }
1117
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link{
1118
+ color:#008ae0;
1119
+ -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
1120
+ color:var(--iui-color-foreground-primary);
1121
+ -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
1122
+ border-radius:3px;
1123
+ box-sizing:border-box;
1124
+ cursor:pointer;
1125
+ text-decoration:none;
1126
+ }
1127
+ .iui-breadcrumbs-item-overrides > :-moz-any-link{
1128
+ color:#008ae0;
1129
+ -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
1130
+ color:var(--iui-color-foreground-primary);
1131
+ -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
1132
+ border-radius:3px;
1133
+ box-sizing:border-box;
1134
+ cursor:pointer;
1135
+ text-decoration:none;
1136
+ }
1137
+ .iui-breadcrumbs-item-overrides > :any-link{
1118
1138
  color:#008ae0;
1119
1139
  -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
1120
1140
  color:var(--iui-color-foreground-primary);
1121
1141
  -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
1122
1142
  border-radius:3px;
1143
+ box-sizing:border-box;
1123
1144
  cursor:pointer;
1124
1145
  text-decoration:none;
1125
1146
  }
1126
- .iui-breadcrumbs-item a:focus-visible{
1147
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link:focus-visible{
1148
+ outline:1px solid var(--iui-color-foreground-primary);
1149
+ outline-offset:1px;
1150
+ }
1151
+ .iui-breadcrumbs-item-overrides > :-moz-any-link:focus-visible{
1152
+ outline:1px solid var(--iui-color-foreground-primary);
1153
+ outline-offset:1px;
1154
+ }
1155
+ .iui-breadcrumbs-item-overrides > :any-link:focus-visible{
1127
1156
  outline:1px solid var(--iui-color-foreground-primary);
1128
1157
  outline-offset:1px;
1129
1158
  }
1130
1159
  @supports not selector(*:focus-visible){
1131
- .iui-breadcrumbs-item a:focus{
1160
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link:focus{
1161
+ outline:1px solid var(--iui-color-foreground-primary);
1162
+ outline-offset:1px;
1163
+ }
1164
+ .iui-breadcrumbs-item-overrides > :-moz-any-link:focus{
1165
+ outline:1px solid var(--iui-color-foreground-primary);
1166
+ outline-offset:1px;
1167
+ }
1168
+ .iui-breadcrumbs-item-overrides > :any-link:focus{
1132
1169
  outline:1px solid var(--iui-color-foreground-primary);
1133
1170
  outline-offset:1px;
1134
1171
  }
1135
1172
  }
1136
- .iui-breadcrumbs-item a:hover{
1173
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link:hover{
1137
1174
  color:#006bad;
1138
1175
  color:var(--iui-color-foreground-primary-overlay);
1139
1176
  }
1140
- .iui-breadcrumbs-item a-external::after{
1141
- content:"";
1142
- display:inline-block;
1143
- width:1.5ch;
1144
- height:1.5ch;
1145
- margin-left:0.5ch;
1146
- vertical-align:-0.1ch;
1147
- background-color:currentColor;
1148
- -webkit-mask:var(--_iui-anchor-external-svg);
1149
- mask:var(--_iui-anchor-external-svg);
1177
+ .iui-breadcrumbs-item-overrides > :-moz-any-link:hover{
1178
+ color:#006bad;
1179
+ color:var(--iui-color-foreground-primary-overlay);
1150
1180
  }
1151
- @media (forced-colors: active){
1152
- .iui-breadcrumbs-item a-external::after{
1153
- background-color:LinkText;
1154
- }
1181
+ .iui-breadcrumbs-item-overrides > :any-link:hover{
1182
+ color:#006bad;
1183
+ color:var(--iui-color-foreground-primary-overlay);
1184
+ }
1185
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link:hover{
1186
+ text-decoration:underline;
1155
1187
  }
1156
- .iui-breadcrumbs-item a:hover{
1188
+ .iui-breadcrumbs-item-overrides > :-moz-any-link:hover{
1189
+ text-decoration:underline;
1190
+ }
1191
+ .iui-breadcrumbs-item-overrides > :any-link:hover{
1157
1192
  text-decoration:underline;
1158
1193
  }
1159
1194
  @media (prefers-contrast: more){
1160
- .iui-breadcrumbs-item a{
1195
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link{
1196
+ text-decoration:underline;
1197
+ }
1198
+ .iui-breadcrumbs-item-overrides > :-moz-any-link{
1161
1199
  text-decoration:underline;
1162
1200
  }
1163
- .iui-breadcrumbs-item a:hover{
1201
+ .iui-breadcrumbs-item-overrides > :any-link{
1202
+ text-decoration:underline;
1203
+ }
1204
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link:hover{
1205
+ text-decoration:none;
1206
+ }
1207
+ .iui-breadcrumbs-item-overrides > :-moz-any-link:hover{
1164
1208
  text-decoration:none;
1165
1209
  }
1210
+ .iui-breadcrumbs-item-overrides > :any-link:hover{
1211
+ text-decoration:none;
1212
+ }
1213
+ }
1214
+ .iui-theme-light .iui-breadcrumbs-item-overrides > :-webkit-any-link, .iui-theme-dark .iui-breadcrumbs-item-overrides > :-webkit-any-link{
1215
+ text-decoration:none;
1166
1216
  }
1167
- .iui-theme-light .iui-breadcrumbs-item a, .iui-theme-dark .iui-breadcrumbs-item a{
1217
+ .iui-theme-light .iui-breadcrumbs-item-overrides > :-moz-any-link, .iui-theme-dark .iui-breadcrumbs-item-overrides > :-moz-any-link{
1168
1218
  text-decoration:none;
1169
1219
  }
1170
- .iui-theme-light .iui-breadcrumbs-item a:hover, .iui-theme-dark .iui-breadcrumbs-item a:hover{
1220
+ .iui-theme-light .iui-breadcrumbs-item-overrides > :any-link, .iui-theme-dark .iui-breadcrumbs-item-overrides > :any-link{
1221
+ text-decoration:none;
1222
+ }
1223
+ .iui-theme-light .iui-breadcrumbs-item-overrides > :-webkit-any-link:hover, .iui-theme-dark .iui-breadcrumbs-item-overrides > :-webkit-any-link:hover{
1224
+ text-decoration:underline;
1225
+ }
1226
+ .iui-theme-light .iui-breadcrumbs-item-overrides > :-moz-any-link:hover, .iui-theme-dark .iui-breadcrumbs-item-overrides > :-moz-any-link:hover{
1227
+ text-decoration:underline;
1228
+ }
1229
+ .iui-theme-light .iui-breadcrumbs-item-overrides > :any-link:hover, .iui-theme-dark .iui-breadcrumbs-item-overrides > :any-link:hover{
1230
+ text-decoration:underline;
1231
+ }
1232
+
1233
+ .iui-theme-light-hc .iui-breadcrumbs-item-overrides > :-webkit-any-link, .iui-theme-dark-hc .iui-breadcrumbs-item-overrides > :-webkit-any-link{
1234
+ text-decoration:underline;
1235
+ }
1236
+
1237
+ .iui-theme-light-hc .iui-breadcrumbs-item-overrides > :-moz-any-link, .iui-theme-dark-hc .iui-breadcrumbs-item-overrides > :-moz-any-link{
1171
1238
  text-decoration:underline;
1172
1239
  }
1173
1240
 
1174
- .iui-theme-light-hc .iui-breadcrumbs-item a, .iui-theme-dark-hc .iui-breadcrumbs-item a{
1241
+ .iui-theme-light-hc .iui-breadcrumbs-item-overrides > :any-link, .iui-theme-dark-hc .iui-breadcrumbs-item-overrides > :any-link{
1175
1242
  text-decoration:underline;
1176
1243
  }
1177
- .iui-theme-light-hc .iui-breadcrumbs-item a:hover, .iui-theme-dark-hc .iui-breadcrumbs-item a:hover{
1244
+ .iui-theme-light-hc .iui-breadcrumbs-item-overrides > :-webkit-any-link:hover, .iui-theme-dark-hc .iui-breadcrumbs-item-overrides > :-webkit-any-link:hover{
1245
+ text-decoration:none;
1246
+ }
1247
+ .iui-theme-light-hc .iui-breadcrumbs-item-overrides > :-moz-any-link:hover, .iui-theme-dark-hc .iui-breadcrumbs-item-overrides > :-moz-any-link:hover{
1248
+ text-decoration:none;
1249
+ }
1250
+ .iui-theme-light-hc .iui-breadcrumbs-item-overrides > :any-link:hover, .iui-theme-dark-hc .iui-breadcrumbs-item-overrides > :any-link:hover{
1178
1251
  text-decoration:none;
1179
1252
  }
1180
1253
 
1181
- .iui-breadcrumbs-item .iui-button{
1254
+ .iui-breadcrumbs-item-overrides > :-webkit-any-link:focus{
1255
+ outline-offset:-1px;
1256
+ }
1257
+
1258
+ .iui-breadcrumbs-item-overrides > :-moz-any-link:focus{
1259
+ outline-offset:-1px;
1260
+ }
1261
+
1262
+ .iui-breadcrumbs-item-overrides > :any-link:focus{
1263
+ outline-offset:-1px;
1264
+ }
1265
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button{
1182
1266
  border-color:transparent;
1183
1267
  background-color:transparent;
1184
1268
  padding:0 8px;
1185
1269
  height:38px;
1186
1270
  gap:8px;
1187
- margin:0 -9px;
1271
+ border:none;
1188
1272
  }
1189
- .iui-breadcrumbs-item .iui-button > .iui-button-icon:only-child{
1273
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button > .iui-button-icon:only-child{
1190
1274
  margin-left:3px;
1191
1275
  margin-right:3px;
1192
1276
  }
1193
- .iui-breadcrumbs-item .iui-button:hover{
1277
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button:hover{
1194
1278
  background-color:rgba(0, 0, 0, 0.1);
1195
1279
  border-color:transparent;
1196
1280
  background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
1197
1281
  border-color:transparent;
1198
1282
  }
1199
- .iui-breadcrumbs-item .iui-button.iui-active{
1283
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button.iui-active{
1200
1284
  background-color:rgba(0, 138, 224, 0.1);
1201
1285
  color:#008ae0;
1202
1286
  background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6));
1203
1287
  color:var(--iui-color-foreground-primary);
1204
1288
  border-color:transparent;
1205
1289
  }
1206
- .iui-breadcrumbs-item .iui-button[disabled], .iui-breadcrumbs-item .iui-button:disabled{
1290
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button[disabled], .iui-breadcrumbs-item-overrides .iui-button.iui-button:disabled{
1207
1291
  cursor:not-allowed;
1208
1292
  background:#edeff2;
1209
1293
  border-color:#edeff2;
@@ -1216,55 +1300,91 @@ html.iui-theme-dark-hc{
1216
1300
  background-color:transparent;
1217
1301
  border-color:transparent;
1218
1302
  }
1219
- .iui-breadcrumbs-item .iui-button[disabled].iui-active, .iui-breadcrumbs-item .iui-button:disabled.iui-active{
1303
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button[disabled].iui-active, .iui-breadcrumbs-item-overrides .iui-button.iui-button:disabled.iui-active{
1220
1304
  background-color:rgba(0, 0, 0, 0.05);
1221
1305
  background-color:rgba(var(--iui-color-foreground-body-rgb), 0.05);
1222
1306
  }
1223
- .iui-breadcrumbs-item > *,
1224
- .iui-breadcrumbs-item .iui-button-label{
1307
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button:focus-visible{
1308
+ outline:1px solid var(--iui-color-foreground-primary);
1309
+ outline-offset:-1px;
1310
+ }
1311
+ @supports not selector(*:focus-visible){
1312
+ .iui-breadcrumbs-item-overrides .iui-button.iui-button:focus{
1313
+ outline:1px solid var(--iui-color-foreground-primary);
1314
+ outline-offset:-1px;
1315
+ }
1316
+ }
1317
+ .iui-breadcrumbs-item-overrides .iui-button-label{
1318
+ overflow:hidden;
1319
+ white-space:nowrap;
1320
+ text-overflow:ellipsis;
1321
+ }
1322
+ .iui-breadcrumbs-item-overrides .iui-button:not([aria-current]), .iui-breadcrumbs-item-overrides .iui-button:not([aria-current]):hover, .iui-breadcrumbs-item-overrides .iui-button:not([aria-current]):active{
1323
+ --_iui-button-text-color:var(--iui-color-foreground-primary);
1324
+ }
1325
+
1326
+ .iui-breadcrumbs-text{
1327
+ padding:0 8px;
1225
1328
  overflow:hidden;
1226
1329
  white-space:nowrap;
1227
1330
  text-overflow:ellipsis;
1228
1331
  }
1229
- .iui-breadcrumbs-item:not(.iui-current) > .iui-button{
1332
+ a.iui-breadcrumbs-text{
1230
1333
  color:#008ae0;
1334
+ -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
1231
1335
  color:var(--iui-color-foreground-primary);
1336
+ -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
1337
+ border-radius:3px;
1338
+ box-sizing:border-box;
1339
+ cursor:pointer;
1340
+ text-decoration:none;
1341
+ }
1342
+ a.iui-breadcrumbs-text:focus-visible{
1343
+ outline:1px solid var(--iui-color-foreground-primary);
1344
+ outline-offset:1px;
1345
+ }
1346
+ @supports not selector(*:focus-visible){
1347
+ a.iui-breadcrumbs-text:focus{
1348
+ outline:1px solid var(--iui-color-foreground-primary);
1349
+ outline-offset:1px;
1350
+ }
1232
1351
  }
1233
- .iui-breadcrumbs-item:not(.iui-current) > .iui-button:hover{
1352
+ a.iui-breadcrumbs-text:hover{
1234
1353
  color:#006bad;
1235
1354
  color:var(--iui-color-foreground-primary-overlay);
1236
1355
  }
1237
-
1238
- .iui-breadcrumbs-separator{
1239
- display:flex;
1356
+ a.iui-breadcrumbs-text:hover{
1357
+ text-decoration:underline;
1240
1358
  }
1241
- .iui-breadcrumbs-separator svg{
1242
- fill:rgba(0, 0, 0, 0.4);
1243
- fill:var(--iui-icons-color);
1244
- display:inline-flex;
1245
- width:12px;
1246
- height:12px;
1247
- display:flex;
1359
+ @media (prefers-contrast: more){
1360
+ a.iui-breadcrumbs-text{
1361
+ text-decoration:underline;
1362
+ }
1363
+ a.iui-breadcrumbs-text:hover{
1364
+ text-decoration:none;
1365
+ }
1248
1366
  }
1249
- .iui-breadcrumbs-separator svg.iui-informational{
1250
- fill:#008ae0;
1251
- fill:var(--iui-icons-color-primary);
1367
+ .iui-theme-light a.iui-breadcrumbs-text, .iui-theme-dark a.iui-breadcrumbs-text{
1368
+ text-decoration:none;
1252
1369
  }
1253
- .iui-breadcrumbs-separator svg.iui-positive{
1254
- fill:#53a21a;
1255
- fill:var(--iui-icons-color-positive);
1370
+ .iui-theme-light a.iui-breadcrumbs-text:hover, .iui-theme-dark a.iui-breadcrumbs-text:hover{
1371
+ text-decoration:underline;
1256
1372
  }
1257
- .iui-breadcrumbs-separator svg.iui-warning{
1258
- fill:#f18d13;
1259
- fill:var(--iui-icons-color-warning);
1373
+
1374
+ .iui-theme-light-hc a.iui-breadcrumbs-text, .iui-theme-dark-hc a.iui-breadcrumbs-text{
1375
+ text-decoration:underline;
1260
1376
  }
1261
- .iui-breadcrumbs-separator svg.iui-negative{
1262
- fill:#d10a0a;
1263
- fill:var(--iui-icons-color-negative);
1377
+ .iui-theme-light-hc a.iui-breadcrumbs-text:hover, .iui-theme-dark-hc a.iui-breadcrumbs-text:hover{
1378
+ text-decoration:none;
1264
1379
  }
1265
1380
 
1266
- .iui-button{
1381
+ a.iui-breadcrumbs-text:focus{
1382
+ outline-offset:-1px;
1383
+ }
1384
+
1385
+ .iui-breadcrumbs-button{
1267
1386
  --_iui-button-active-stripe-inset:initial;
1387
+ --_iui-button-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
1268
1388
  margin:0;
1269
1389
  padding:0;
1270
1390
  border:none;
@@ -1291,34 +1411,37 @@ html.iui-theme-dark-hc{
1291
1411
  border:1px solid transparent;
1292
1412
  color:rgba(0, 0, 0, 0.8);
1293
1413
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
1294
- padding:0 16px;
1295
- height:38px;
1296
- gap:8px;
1297
- padding:0 16px;
1414
+ color:var(--_iui-button-text-color);
1415
+ border-color:transparent;
1416
+ background-color:transparent;
1417
+ padding:0 8px;
1298
1418
  height:38px;
1299
1419
  gap:8px;
1420
+ padding:0;
1421
+ border:none;
1422
+ color:#008ae0;
1423
+ color:var(--iui-color-foreground-primary);
1300
1424
  }
1301
1425
  @media (prefers-reduced-motion: no-preference){
1302
- .iui-button{
1426
+ .iui-breadcrumbs-button{
1303
1427
  transition:color 0.2s ease-out, background-color 0.2s ease-out, border-color 0.2s ease-out;
1304
1428
  }
1305
1429
  }
1306
- .iui-button:hover{
1430
+ .iui-breadcrumbs-button:hover{
1431
+ --_iui-button-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
1307
1432
  text-decoration:none;
1308
- color:black;
1309
- color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
1310
1433
  }
1311
- .iui-button:focus-visible{
1434
+ .iui-breadcrumbs-button:focus-visible{
1312
1435
  outline:1px solid var(--iui-color-foreground-primary);
1313
1436
  outline-offset:-1px;
1314
1437
  }
1315
1438
  @supports not selector(*:focus-visible){
1316
- .iui-button:focus{
1439
+ .iui-breadcrumbs-button:focus{
1317
1440
  outline:1px solid var(--iui-color-foreground-primary);
1318
1441
  outline-offset:-1px;
1319
1442
  }
1320
1443
  }
1321
- .iui-button[disabled], .iui-button:disabled{
1444
+ .iui-breadcrumbs-button[disabled], .iui-breadcrumbs-button:disabled{
1322
1445
  cursor:not-allowed;
1323
1446
  background:#edeff2;
1324
1447
  border-color:#edeff2;
@@ -1327,26 +1450,145 @@ html.iui-theme-dark-hc{
1327
1450
  border-color:var(--iui-color-background-disabled);
1328
1451
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1329
1452
  }
1330
- .iui-button.iui-active::after{
1331
- content:"";
1332
- position:absolute;
1333
- inset:var(--_iui-button-active-stripe-inset);
1334
- background-color:var(--iui-color-foreground-primary);
1335
- }
1336
- .iui-button.iui-active[disabled]::after, .iui-button.iui-active:disabled::after{
1337
- background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1453
+ .iui-breadcrumbs-button > .iui-button-icon:only-child{
1454
+ margin-left:3px;
1455
+ margin-right:3px;
1338
1456
  }
1339
- .iui-button.iui-default{
1340
- background-color:white;
1341
- border-color:rgba(0, 0, 0, 0.4);
1342
- color:rgba(0, 0, 0, 0.8);
1343
- background-color:var(--iui-color-background-1);
1344
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
1345
- color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
1457
+ .iui-breadcrumbs-button:hover{
1458
+ background-color:rgba(0, 0, 0, 0.1);
1459
+ border-color:transparent;
1460
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
1461
+ border-color:transparent;
1346
1462
  }
1347
- .iui-button.iui-default:focus-visible{
1348
- outline:2px solid var(--iui-color-foreground-primary);
1349
- outline-offset:-2px;
1463
+ .iui-breadcrumbs-button.iui-active{
1464
+ background-color:rgba(0, 138, 224, 0.1);
1465
+ color:#008ae0;
1466
+ background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6));
1467
+ color:var(--iui-color-foreground-primary);
1468
+ border-color:transparent;
1469
+ }
1470
+ .iui-breadcrumbs-button[disabled], .iui-breadcrumbs-button:disabled{
1471
+ cursor:not-allowed;
1472
+ background:#edeff2;
1473
+ border-color:#edeff2;
1474
+ color:rgba(0, 0, 0, 0.2);
1475
+ background:var(--iui-color-background-disabled);
1476
+ border-color:var(--iui-color-background-disabled);
1477
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1478
+ background-color:transparent;
1479
+ border-color:transparent;
1480
+ background-color:transparent;
1481
+ border-color:transparent;
1482
+ }
1483
+ .iui-breadcrumbs-button[disabled].iui-active, .iui-breadcrumbs-button:disabled.iui-active{
1484
+ background-color:rgba(0, 0, 0, 0.05);
1485
+ background-color:rgba(var(--iui-color-foreground-body-rgb), 0.05);
1486
+ }
1487
+ .iui-breadcrumbs-button[aria-current]{
1488
+ color:rgba(0, 0, 0, 0.8);
1489
+ color:var(--iui-text-color);
1490
+ }
1491
+
1492
+ .iui-breadcrumbs-separator{
1493
+ display:flex;
1494
+ margin:0 2px;
1495
+ }
1496
+ .iui-breadcrumbs-separator svg{
1497
+ width:12px;
1498
+ height:12px;
1499
+ display:flex;
1500
+ fill:rgba(0, 0, 0, 0.4);
1501
+ fill:var(--iui-icons-color);
1502
+ }
1503
+ @media (forced-colors: active){
1504
+ .iui-breadcrumbs-separator svg{
1505
+ fill:CanvasText;
1506
+ }
1507
+ }
1508
+
1509
+ .iui-button{
1510
+ --_iui-button-active-stripe-inset:initial;
1511
+ --_iui-button-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
1512
+ margin:0;
1513
+ padding:0;
1514
+ border:none;
1515
+ vertical-align:baseline;
1516
+ font-family:inherit;
1517
+ display:inline-flex;
1518
+ align-items:center;
1519
+ vertical-align:middle;
1520
+ justify-content:center;
1521
+ position:relative;
1522
+ box-sizing:border-box;
1523
+ border-radius:3px;
1524
+ line-height:22px;
1525
+ box-shadow:none;
1526
+ font-size:14px;
1527
+ font-weight:400;
1528
+ text-decoration:none;
1529
+ -webkit-user-select:none;
1530
+ -moz-user-select:none;
1531
+ -ms-user-select:none;
1532
+ user-select:none;
1533
+ cursor:pointer;
1534
+ white-space:nowrap;
1535
+ border:1px solid transparent;
1536
+ color:rgba(0, 0, 0, 0.8);
1537
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
1538
+ color:var(--_iui-button-text-color);
1539
+ padding:0 16px;
1540
+ height:38px;
1541
+ gap:8px;
1542
+ padding:0 16px;
1543
+ height:38px;
1544
+ gap:8px;
1545
+ }
1546
+ @media (prefers-reduced-motion: no-preference){
1547
+ .iui-button{
1548
+ transition:color 0.2s ease-out, background-color 0.2s ease-out, border-color 0.2s ease-out;
1549
+ }
1550
+ }
1551
+ .iui-button:hover{
1552
+ --_iui-button-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
1553
+ text-decoration:none;
1554
+ }
1555
+ .iui-button:focus-visible{
1556
+ outline:1px solid var(--iui-color-foreground-primary);
1557
+ outline-offset:-1px;
1558
+ }
1559
+ @supports not selector(*:focus-visible){
1560
+ .iui-button:focus{
1561
+ outline:1px solid var(--iui-color-foreground-primary);
1562
+ outline-offset:-1px;
1563
+ }
1564
+ }
1565
+ .iui-button[disabled], .iui-button:disabled{
1566
+ cursor:not-allowed;
1567
+ background:#edeff2;
1568
+ border-color:#edeff2;
1569
+ color:rgba(0, 0, 0, 0.2);
1570
+ background:var(--iui-color-background-disabled);
1571
+ border-color:var(--iui-color-background-disabled);
1572
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1573
+ }
1574
+ .iui-button.iui-active::after{
1575
+ content:"";
1576
+ position:absolute;
1577
+ inset:var(--_iui-button-active-stripe-inset);
1578
+ background-color:var(--iui-color-foreground-primary);
1579
+ }
1580
+ .iui-button.iui-active[disabled]::after, .iui-button.iui-active:disabled::after{
1581
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1582
+ }
1583
+ .iui-button.iui-default{
1584
+ background-color:white;
1585
+ border-color:rgba(0, 0, 0, 0.4);
1586
+ background-color:var(--iui-color-background-1);
1587
+ border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
1588
+ }
1589
+ .iui-button.iui-default:focus-visible{
1590
+ outline:2px solid var(--iui-color-foreground-primary);
1591
+ outline-offset:-2px;
1350
1592
  }
1351
1593
  @supports not selector(*:focus-visible){
1352
1594
  .iui-button.iui-default:focus{
@@ -1357,10 +1599,8 @@ html.iui-theme-dark-hc{
1357
1599
  .iui-button.iui-default:hover, .iui-button.iui-default:active{
1358
1600
  background-color:#f2f2f2;
1359
1601
  border-color:black;
1360
- color:black;
1361
1602
  background-color:var(--iui-color-background-1-overlay);
1362
1603
  border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
1363
- color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
1364
1604
  }
1365
1605
  .iui-button.iui-default:hover .iui-notification-primary::before,
1366
1606
  .iui-button.iui-default:hover .iui-notification-positive::before,
@@ -1403,12 +1643,14 @@ html.iui-theme-dark-hc{
1403
1643
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1404
1644
  }
1405
1645
  .iui-button.iui-high-visibility{
1646
+ --_iui-button-text-color:var(--iui-color-foreground-accessory);
1406
1647
  background-color:#008ae0;
1407
1648
  border-color:#008ae0;
1408
1649
  color:white;
1409
1650
  background-color:var(--iui-color-background-primary);
1410
1651
  border-color:var(--iui-color-background-primary);
1411
1652
  color:var(--iui-color-foreground-accessory);
1653
+ color:var(--_iui-button-text-color);
1412
1654
  }
1413
1655
  .iui-button.iui-high-visibility:focus-visible{
1414
1656
  outline:1px solid var(--iui-color-foreground-accessory);
@@ -1423,10 +1665,8 @@ html.iui-theme-dark-hc{
1423
1665
  .iui-button.iui-high-visibility:hover, .iui-button.iui-high-visibility:active{
1424
1666
  background-color:#006bad;
1425
1667
  border-color:#006bad;
1426
- color:white;
1427
1668
  background-color:var(--iui-color-background-primary-overlay);
1428
1669
  border-color:var(--iui-color-background-primary-overlay);
1429
- color:var(--iui-color-foreground-accessory);
1430
1670
  }
1431
1671
  .iui-button.iui-high-visibility[disabled], .iui-button.iui-high-visibility:disabled{
1432
1672
  cursor:not-allowed;
@@ -1438,12 +1678,14 @@ html.iui-theme-dark-hc{
1438
1678
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1439
1679
  }
1440
1680
  .iui-button.iui-cta{
1681
+ --_iui-button-text-color:var(--iui-color-foreground-accessory);
1441
1682
  background-color:#53a21a;
1442
1683
  border-color:#53a21a;
1443
1684
  color:white;
1444
1685
  background-color:var(--iui-color-background-positive);
1445
1686
  border-color:var(--iui-color-background-positive);
1446
1687
  color:var(--iui-color-foreground-accessory);
1688
+ color:var(--_iui-button-text-color);
1447
1689
  }
1448
1690
  .iui-button.iui-cta:focus-visible{
1449
1691
  outline:1px solid var(--iui-color-foreground-accessory);
@@ -1458,10 +1700,8 @@ html.iui-theme-dark-hc{
1458
1700
  .iui-button.iui-cta:hover, .iui-button.iui-cta:active{
1459
1701
  background-color:#3d7613;
1460
1702
  border-color:#3d7613;
1461
- color:white;
1462
1703
  background-color:var(--iui-color-background-positive-overlay);
1463
1704
  border-color:var(--iui-color-background-positive-overlay);
1464
- color:var(--iui-color-foreground-accessory);
1465
1705
  }
1466
1706
  .iui-button.iui-cta[disabled], .iui-button.iui-cta:disabled{
1467
1707
  cursor:not-allowed;
@@ -1473,12 +1713,14 @@ html.iui-theme-dark-hc{
1473
1713
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
1474
1714
  }
1475
1715
  .iui-button.iui-idea{
1716
+ --_iui-button-text-color:var(--iui-color-foreground-accessory);
1476
1717
  background-color:#008ae0;
1477
1718
  border-color:#008ae0;
1478
1719
  color:white;
1479
1720
  background-color:var(--iui-color-background-primary);
1480
1721
  border-color:var(--iui-color-background-primary);
1481
1722
  color:var(--iui-color-foreground-accessory);
1723
+ color:var(--_iui-button-text-color);
1482
1724
  border-radius:22px;
1483
1725
  box-shadow:0 9px 46px rgba(0, 0, 0, 0.25);
1484
1726
  position:fixed;
@@ -1498,10 +1740,8 @@ html.iui-theme-dark-hc{
1498
1740
  .iui-button.iui-idea:hover, .iui-button.iui-idea:active{
1499
1741
  background-color:#006bad;
1500
1742
  border-color:#006bad;
1501
- color:white;
1502
1743
  background-color:var(--iui-color-background-primary-overlay);
1503
1744
  border-color:var(--iui-color-background-primary-overlay);
1504
- color:var(--iui-color-foreground-accessory);
1505
1745
  }
1506
1746
  .iui-button.iui-idea[disabled], .iui-button.iui-idea:disabled{
1507
1747
  cursor:not-allowed;
@@ -2709,97 +2949,295 @@ html.iui-theme-dark-hc{
2709
2949
  border-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-4));
2710
2950
  }
2711
2951
 
2712
- .iui-expandable-block{
2952
+ .iui-dialog-backdrop{
2713
2953
  margin:0;
2714
2954
  padding:0;
2715
2955
  border:none;
2716
2956
  vertical-align:baseline;
2717
- display:flex;
2718
- flex-direction:column;
2719
- box-sizing:border-box;
2957
+ z-index:999;
2958
+ isolation:isolate;
2959
+ position:fixed;
2960
+ top:0;
2961
+ left:0;
2720
2962
  width:100%;
2963
+ height:100%;
2964
+ background-color:rgba(0, 0, 0, 0.4);
2965
+ background-color:rgba(0, 0, 0, var(--iui-opacity-4));
2966
+ visibility:hidden;
2967
+ opacity:0;
2968
+ transition:visibility 0s linear 0.2s, opacity 0.2s ease-out;
2969
+ }
2970
+ .iui-dialog-backdrop.iui-dialog-visible{
2971
+ visibility:visible;
2972
+ opacity:1;
2973
+ transition-delay:0s;
2974
+ }
2975
+ .iui-dialog-backdrop.iui-dialog-backdrop-relative{
2976
+ position:relative;
2977
+ overflow:hidden;
2978
+ }
2979
+
2980
+ .iui-dialog{
2981
+ border-radius:3px;
2982
+ box-shadow:0 9px 46px rgba(0, 0, 0, 0.25);
2983
+ box-sizing:border-box;
2984
+ position:absolute;
2985
+ padding:11px 16px;
2986
+ box-sizing:border-box;
2987
+ padding:11px 16px;
2988
+ overflow:hidden;
2721
2989
  background-color:white;
2722
2990
  background-color:var(--iui-color-background-1);
2723
2991
  }
2724
- .iui-expandable-block > .iui-header{
2725
- display:flex;
2726
- align-items:center;
2727
- padding:11px 12px;
2728
- cursor:pointer;
2729
- box-sizing:border-box;
2730
- -webkit-user-select:none;
2731
- -moz-user-select:none;
2732
- -ms-user-select:none;
2733
- user-select:none;
2734
- border:1px solid #edeff2;
2735
- border-bottom-color:#dde1e4;
2736
- background-color:#edeff2;
2737
- border:1px solid var(--iui-color-background-3);
2738
- border-bottom-color:var(--iui-color-background-4);
2739
- background-color:var(--iui-color-background-3);
2992
+ @media (forced-colors: active){
2993
+ .iui-dialog{
2994
+ border:1px solid;
2995
+ }
2740
2996
  }
2741
- .iui-expandable-block > .iui-header:focus-visible{
2742
- outline:1px solid var(--iui-color-foreground-primary);
2743
- outline-offset:-1px;
2997
+
2998
+ .iui-dialog-default .iui-dialog{
2999
+ left:50%;
3000
+ top:33%;
3001
+ transform:translate(-50%, -33%);
3002
+ max-width:50%;
3003
+ min-width:380px;
3004
+ max-height:100vh;
2744
3005
  }
2745
- @supports not selector(*:focus-visible){
2746
- .iui-expandable-block > .iui-header:focus{
2747
- outline:1px solid var(--iui-color-foreground-primary);
2748
- outline-offset:-1px;
3006
+ @media screen and (max-width: 400px){
3007
+ .iui-dialog-default .iui-dialog{
3008
+ max-width:95%;
3009
+ width:95%;
3010
+ min-width:95%;
2749
3011
  }
2750
3012
  }
3013
+
2751
3014
  @media (prefers-reduced-motion: no-preference){
2752
- .iui-expandable-block > .iui-header{
2753
- transition:background-color 0.2s ease-out;
3015
+ .iui-dialog-full-page{
3016
+ transition:visibility 0s linear 0.8s, opacity 0.4s ease-out 0.2s;
2754
3017
  }
2755
3018
  }
2756
- .iui-expandable-block > .iui-header > .iui-icon,
2757
- .iui-expandable-block > .iui-header > .iui-status-icon{
2758
- display:inline-flex;
2759
- flex-shrink:0;
2760
- width:16px;
2761
- height:16px;
2762
- }
2763
- .iui-expandable-block > .iui-header > .iui-icon{
2764
- fill:rgba(0, 0, 0, 0.8);
2765
- fill:var(--iui-icons-color-actionable);
3019
+ .iui-dialog-full-page .iui-dialog{
3020
+ border-radius:0;
3021
+ height:100vh;
3022
+ width:100vw;
3023
+ top:0;
3024
+ left:0;
3025
+ max-width:initial;
3026
+ min-width:initial;
3027
+ display:flex;
3028
+ flex-direction:column;
3029
+ will-change:transform;
2766
3030
  }
2767
3031
  @media (prefers-reduced-motion: no-preference){
2768
- .iui-expandable-block > .iui-header > .iui-icon{
2769
- transition:transform 0.2s ease-out;
3032
+ .iui-dialog-full-page .iui-dialog{
3033
+ transform:translateY(100%);
3034
+ transition:visibility 0s linear 0.4s, opacity 0s linear 0.4s, transform 0.2s ease-in;
2770
3035
  }
2771
3036
  }
2772
- .iui-expandable-block > .iui-header > .iui-status-icon{
2773
- margin-left:12px;
2774
- fill:rgba(0, 0, 0, 0.4);
2775
- fill:var(--iui-icons-color);
2776
- }
2777
- .iui-expandable-block > .iui-header > .iui-status-icon.iui-informational{
2778
- fill:#008ae0;
2779
- fill:var(--iui-icons-color-primary);
2780
- }
2781
- .iui-expandable-block > .iui-header > .iui-status-icon.iui-positive{
2782
- fill:#53a21a;
2783
- fill:var(--iui-icons-color-positive);
3037
+ .iui-dialog-full-page.iui-dialog-visible .iui-dialog{
3038
+ transform:translateY(0);
2784
3039
  }
2785
- .iui-expandable-block > .iui-header > .iui-status-icon.iui-warning{
2786
- fill:#f18d13;
2787
- fill:var(--iui-icons-color-warning);
3040
+ @media (prefers-reduced-motion: no-preference){
3041
+ .iui-dialog-full-page.iui-dialog-visible .iui-dialog{
3042
+ transition:transform 0.4s ease-out;
3043
+ }
2788
3044
  }
2789
- .iui-expandable-block > .iui-header > .iui-status-icon.iui-negative{
2790
- fill:#d10a0a;
2791
- fill:var(--iui-icons-color-negative);
3045
+
3046
+ .iui-dialog-draggable{
3047
+ background-color:transparent;
3048
+ pointer-events:none;
3049
+ z-index:998;
2792
3050
  }
2793
- .iui-expandable-block > .iui-header .iui-expandable-block-label{
3051
+ .iui-dialog-draggable .iui-dialog{
3052
+ pointer-events:initial;
3053
+ max-width:100vw;
3054
+ max-height:100vh;
3055
+ min-width:380px;
3056
+ min-height:144px;
2794
3057
  display:flex;
2795
3058
  flex-direction:column;
2796
- flex:auto;
2797
- min-width:0;
2798
- margin-left:12px;
2799
- color:rgba(0, 0, 0, 0.8);
2800
- color:var(--iui-text-color);
3059
+ padding:0;
3060
+ border:1px solid #c7ccd1;
3061
+ border:1px solid var(--iui-color-background-border);
2801
3062
  }
2802
- @media (prefers-reduced-motion: no-preference){
3063
+
3064
+ .iui-dialog-title{
3065
+ font-size:inherit;
3066
+ white-space:nowrap;
3067
+ overflow:hidden;
3068
+ text-overflow:ellipsis;
3069
+ line-height:1.5;
3070
+ }
3071
+
3072
+ .iui-dialog-title-bar{
3073
+ display:flex;
3074
+ align-items:center;
3075
+ margin-bottom:11px;
3076
+ justify-content:space-between;
3077
+ box-sizing:border-box;
3078
+ font-size:18px;
3079
+ }
3080
+ .iui-dialog-draggable .iui-dialog-title-bar{
3081
+ -webkit-user-select:none;
3082
+ -moz-user-select:none;
3083
+ -ms-user-select:none;
3084
+ user-select:none;
3085
+ font-size:16px;
3086
+ padding:6px 16px;
3087
+ cursor:-webkit-grab;
3088
+ cursor:grab;
3089
+ background-color:#edeff2;
3090
+ border-bottom:1px solid #c7ccd1;
3091
+ background-color:var(--iui-color-background-3);
3092
+ border-bottom:1px solid var(--iui-color-background-border);
3093
+ }
3094
+ .iui-dialog-draggable .iui-dialog-title-bar:active{
3095
+ cursor:-webkit-grabbing;
3096
+ cursor:grabbing;
3097
+ }
3098
+
3099
+ .iui-dialog-content{
3100
+ flex-grow:2;
3101
+ margin:0 -16px;
3102
+ padding:0 16px;
3103
+ overflow-y:auto;
3104
+ overflow-y:overlay;
3105
+ }
3106
+ .iui-dialog-draggable .iui-dialog-content{
3107
+ margin:0;
3108
+ }
3109
+
3110
+ .iui-dialog-button-bar{
3111
+ margin-top:11px;
3112
+ display:flex;
3113
+ align-items:center;
3114
+ justify-content:flex-end;
3115
+ }
3116
+ .iui-dialog-draggable .iui-dialog-button-bar{
3117
+ padding:0 16px 11px 16px;
3118
+ }
3119
+
3120
+ .iui-dialog-button-bar > .iui-button:not(:last-child){
3121
+ margin-right:8px;
3122
+ }
3123
+ @supports ((-moz-column-gap: 8px) or (column-gap: 8px)){
3124
+ .iui-dialog-button-bar{
3125
+ -moz-column-gap:8px;
3126
+ column-gap:8px;
3127
+ }
3128
+ .iui-dialog-button-bar > .iui-button:not(:last-child){
3129
+ margin-right:0;
3130
+ }
3131
+ }
3132
+
3133
+ .iui-dialog-animation-enter .iui-dialog-full-page .iui-dialog{
3134
+ transform:translateY(100%);
3135
+ opacity:0;
3136
+ }
3137
+ .iui-dialog-animation-enter-active .iui-dialog-full-page .iui-dialog{
3138
+ transform:translateY(0);
3139
+ opacity:1;
3140
+ }
3141
+ .iui-dialog-animation-enter .iui-dialog-backdrop{
3142
+ visibility:hidden;
3143
+ opacity:0;
3144
+ }
3145
+ .iui-dialog-animation-enter-active .iui-dialog-backdrop{
3146
+ visibility:visible;
3147
+ opacity:1;
3148
+ }
3149
+
3150
+ .iui-expandable-block{
3151
+ margin:0;
3152
+ padding:0;
3153
+ border:none;
3154
+ vertical-align:baseline;
3155
+ display:flex;
3156
+ flex-direction:column;
3157
+ box-sizing:border-box;
3158
+ width:100%;
3159
+ background-color:white;
3160
+ background-color:var(--iui-color-background-1);
3161
+ }
3162
+ .iui-expandable-block > .iui-header{
3163
+ display:flex;
3164
+ align-items:center;
3165
+ padding:11px 12px;
3166
+ cursor:pointer;
3167
+ box-sizing:border-box;
3168
+ -webkit-user-select:none;
3169
+ -moz-user-select:none;
3170
+ -ms-user-select:none;
3171
+ user-select:none;
3172
+ border:1px solid #edeff2;
3173
+ border-bottom-color:#dde1e4;
3174
+ background-color:#edeff2;
3175
+ border:1px solid var(--iui-color-background-3);
3176
+ border-bottom-color:var(--iui-color-background-4);
3177
+ background-color:var(--iui-color-background-3);
3178
+ }
3179
+ .iui-expandable-block > .iui-header:focus-visible{
3180
+ outline:1px solid var(--iui-color-foreground-primary);
3181
+ outline-offset:-1px;
3182
+ }
3183
+ @supports not selector(*:focus-visible){
3184
+ .iui-expandable-block > .iui-header:focus{
3185
+ outline:1px solid var(--iui-color-foreground-primary);
3186
+ outline-offset:-1px;
3187
+ }
3188
+ }
3189
+ @media (prefers-reduced-motion: no-preference){
3190
+ .iui-expandable-block > .iui-header{
3191
+ transition:background-color 0.2s ease-out;
3192
+ }
3193
+ }
3194
+ .iui-expandable-block > .iui-header > .iui-icon,
3195
+ .iui-expandable-block > .iui-header > .iui-status-icon{
3196
+ display:inline-flex;
3197
+ flex-shrink:0;
3198
+ width:16px;
3199
+ height:16px;
3200
+ }
3201
+ .iui-expandable-block > .iui-header > .iui-icon{
3202
+ fill:rgba(0, 0, 0, 0.8);
3203
+ fill:var(--iui-icons-color-actionable);
3204
+ }
3205
+ @media (prefers-reduced-motion: no-preference){
3206
+ .iui-expandable-block > .iui-header > .iui-icon{
3207
+ transition:transform 0.2s ease-out;
3208
+ }
3209
+ }
3210
+ .iui-expandable-block > .iui-header > .iui-status-icon{
3211
+ margin-left:12px;
3212
+ fill:rgba(0, 0, 0, 0.4);
3213
+ fill:var(--iui-icons-color);
3214
+ }
3215
+ .iui-expandable-block > .iui-header > .iui-status-icon.iui-informational{
3216
+ fill:#008ae0;
3217
+ fill:var(--iui-icons-color-primary);
3218
+ }
3219
+ .iui-expandable-block > .iui-header > .iui-status-icon.iui-positive{
3220
+ fill:#53a21a;
3221
+ fill:var(--iui-icons-color-positive);
3222
+ }
3223
+ .iui-expandable-block > .iui-header > .iui-status-icon.iui-warning{
3224
+ fill:#f18d13;
3225
+ fill:var(--iui-icons-color-warning);
3226
+ }
3227
+ .iui-expandable-block > .iui-header > .iui-status-icon.iui-negative{
3228
+ fill:#d10a0a;
3229
+ fill:var(--iui-icons-color-negative);
3230
+ }
3231
+ .iui-expandable-block > .iui-header .iui-expandable-block-label{
3232
+ display:flex;
3233
+ flex-direction:column;
3234
+ flex:auto;
3235
+ min-width:0;
3236
+ margin-left:12px;
3237
+ color:rgba(0, 0, 0, 0.8);
3238
+ color:var(--iui-text-color);
3239
+ }
3240
+ @media (prefers-reduced-motion: no-preference){
2803
3241
  .iui-expandable-block > .iui-header .iui-expandable-block-label{
2804
3242
  transition:color 0.2s ease;
2805
3243
  }
@@ -3107,12 +3545,12 @@ html.iui-theme-dark-hc{
3107
3545
  background-color:var(--iui-text-color-muted);
3108
3546
  }
3109
3547
  .iui-legal-footer > ul > li > a{
3110
- --_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>");
3111
3548
  color:#008ae0;
3112
3549
  -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
3113
3550
  color:var(--iui-color-foreground-primary);
3114
3551
  -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
3115
3552
  border-radius:3px;
3553
+ box-sizing:border-box;
3116
3554
  cursor:pointer;
3117
3555
  text-decoration:none;
3118
3556
  }
@@ -3130,22 +3568,6 @@ html.iui-theme-dark-hc{
3130
3568
  color:#006bad;
3131
3569
  color:var(--iui-color-foreground-primary-overlay);
3132
3570
  }
3133
- .iui-legal-footer > ul > li > a-external::after{
3134
- content:"";
3135
- display:inline-block;
3136
- width:1.5ch;
3137
- height:1.5ch;
3138
- margin-left:0.5ch;
3139
- vertical-align:-0.1ch;
3140
- background-color:currentColor;
3141
- -webkit-mask:var(--_iui-anchor-external-svg);
3142
- mask:var(--_iui-anchor-external-svg);
3143
- }
3144
- @media (forced-colors: active){
3145
- .iui-legal-footer > ul > li > a-external::after{
3146
- background-color:LinkText;
3147
- }
3148
- }
3149
3571
  .iui-legal-footer > ul > li > a:hover{
3150
3572
  text-decoration:underline;
3151
3573
  }
@@ -4239,8 +4661,8 @@ div.iui-input-container.iui-inline-label{
4239
4661
  transition:background 0s;
4240
4662
  }
4241
4663
  .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable svg{
4242
- fill:rgba(0, 0, 0, 0.4);
4243
- fill:var(--iui-icons-color);
4664
+ fill:rgba(0, 0, 0, 0.8);
4665
+ fill:var(--iui-icons-color-actionable);
4244
4666
  transition:transform 0.2s ease-out;
4245
4667
  }
4246
4668
  .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable.iui-open svg{
@@ -4840,8 +5262,8 @@ label.iui-input-label.iui-disabled{
4840
5262
  transition:background 0s;
4841
5263
  }
4842
5264
  .iui-end-icon.iui-actionable svg{
4843
- fill:rgba(0, 0, 0, 0.4);
4844
- fill:var(--iui-icons-color);
5265
+ fill:rgba(0, 0, 0, 0.8);
5266
+ fill:var(--iui-icons-color-actionable);
4845
5267
  transition:transform 0.2s ease-out;
4846
5268
  }
4847
5269
  .iui-end-icon.iui-actionable.iui-open svg{
@@ -4981,6 +5403,12 @@ label.iui-input-label.iui-disabled{
4981
5403
  outline-offset:-1px;
4982
5404
  }
4983
5405
  }
5406
+ .iui-checkbox:disabled{
5407
+ --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
5408
+ --_iui-checkbox-border-color:var(--iui-color-background-border);
5409
+ --_iui-checkbox-background-color:var(--iui-color-background-disabled);
5410
+ cursor:not-allowed;
5411
+ }
4984
5412
  .iui-checkbox.iui-checkbox-visibility{
4985
5413
  --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
4986
5414
  --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
@@ -4995,11 +5423,9 @@ label.iui-input-label.iui-disabled{
4995
5423
  --_iui-checkbox-border-color:transparent;
4996
5424
  --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
4997
5425
  }
4998
- .iui-checkbox:disabled{
5426
+ .iui-checkbox.iui-checkbox-visibility:where(:disabled){
4999
5427
  --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
5000
- --_iui-checkbox-border-color:var(--iui-color-background-disabled);
5001
5428
  --_iui-checkbox-background-color:var(--iui-color-background-disabled);
5002
- cursor:not-allowed;
5003
5429
  }
5004
5430
  .iui-checkbox.iui-loading{
5005
5431
  --_iui-checkbox-border-color:transparent;
@@ -5136,6 +5562,12 @@ label.iui-input-label.iui-disabled{
5136
5562
  outline-offset:-1px;
5137
5563
  }
5138
5564
  }
5565
+ .iui-radio:disabled{
5566
+ --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
5567
+ --_iui-checkbox-border-color:var(--iui-color-background-border);
5568
+ --_iui-checkbox-background-color:var(--iui-color-background-disabled);
5569
+ cursor:not-allowed;
5570
+ }
5139
5571
  .iui-radio.iui-checkbox-visibility{
5140
5572
  --_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
5141
5573
  --_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
@@ -5150,11 +5582,9 @@ label.iui-input-label.iui-disabled{
5150
5582
  --_iui-checkbox-border-color:transparent;
5151
5583
  --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
5152
5584
  }
5153
- .iui-radio:disabled{
5585
+ .iui-radio.iui-checkbox-visibility:where(:disabled){
5154
5586
  --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
5155
- --_iui-checkbox-border-color:var(--iui-color-background-disabled);
5156
5587
  --_iui-checkbox-background-color:var(--iui-color-background-disabled);
5157
- cursor:not-allowed;
5158
5588
  }
5159
5589
  .iui-radio.iui-loading{
5160
5590
  --_iui-checkbox-border-color:transparent;
@@ -5170,164 +5600,6 @@ label.iui-input-label.iui-disabled{
5170
5600
  --_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg);
5171
5601
  }
5172
5602
 
5173
- .iui-radio-tile-container{
5174
- display:inline-flex;
5175
- flex-wrap:wrap;
5176
- width:-webkit-fit-content;
5177
- width:-moz-fit-content;
5178
- width:fit-content;
5179
- -webkit-user-select:none;
5180
- -moz-user-select:none;
5181
- -ms-user-select:none;
5182
- user-select:none;
5183
- position:relative;
5184
- z-index:0;
5185
- }
5186
- .iui-radio-tile-container > label{
5187
- cursor:pointer;
5188
- }
5189
- .iui-radio-tile-container > label > input{
5190
- width:0;
5191
- height:0;
5192
- -webkit-appearance:none;
5193
- -moz-appearance:none;
5194
- appearance:none;
5195
- opacity:0;
5196
- position:absolute;
5197
- }
5198
- .iui-radio-tile-container > label > .iui-radio-tile{
5199
- width:160px;
5200
- height:100%;
5201
- box-sizing:border-box;
5202
- padding:8px;
5203
- position:relative;
5204
- z-index:1;
5205
- border:1px solid rgba(0, 0, 0, 0.4);
5206
- background-color:white;
5207
- border:1px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
5208
- background-color:var(--iui-color-background-1);
5209
- }
5210
- @media (prefers-reduced-motion: no-preference){
5211
- .iui-radio-tile-container > label > .iui-radio-tile{
5212
- transition:border-color 0.2s ease-out;
5213
- }
5214
- }
5215
- .iui-radio-tile-container > label > .iui-radio-tile > .iui-icon{
5216
- width:32px;
5217
- height:32px;
5218
- display:block;
5219
- margin:0 auto;
5220
- margin-top:6px;
5221
- margin-bottom:11px;
5222
- fill:rgba(0, 0, 0, 0.4);
5223
- fill:var(--iui-icons-color);
5224
- }
5225
- @media (prefers-reduced-motion: no-preference){
5226
- .iui-radio-tile-container > label > .iui-radio-tile > .iui-icon{
5227
- transition:fill 0.2s ease-out;
5228
- }
5229
- }
5230
- .iui-radio-tile-container > label > .iui-radio-tile > .iui-checkmark{
5231
- display:none;
5232
- width:16px;
5233
- height:16px;
5234
- position:absolute;
5235
- right:8px;
5236
- fill:#008ae0;
5237
- fill:var(--iui-icons-color-primary);
5238
- }
5239
- .iui-radio-tile-container > label > .iui-radio-tile > .iui-label{
5240
- font-size:14px;
5241
- font-weight:600;
5242
- line-height:22px;
5243
- text-align:center;
5244
- color:rgba(0, 0, 0, 0.8);
5245
- color:var(--iui-text-color);
5246
- }
5247
- .iui-radio-tile-container > label > .iui-radio-tile > .iui-description{
5248
- font-size:12px;
5249
- line-height:15px;
5250
- text-align:center;
5251
- color:rgba(0, 0, 0, 0.4);
5252
- color:var(--iui-text-color-muted);
5253
- }
5254
- .iui-radio-tile-container > label:first-child > .iui-radio-tile{
5255
- border-radius:3px 0 0 3px;
5256
- }
5257
- .iui-radio-tile-container > label:last-child > .iui-radio-tile{
5258
- border-radius:0 3px 3px 0;
5259
- }
5260
- .iui-radio-tile-container > label:not(:first-child) > .iui-radio-tile{
5261
- margin-left:-1px;
5262
- }
5263
- .iui-radio-tile-container > label input:enabled:focus ~ .iui-radio-tile{
5264
- outline:2px solid #008ae0;
5265
- outline-offset:-4px;
5266
- outline:2px solid var(--iui-color-foreground-primary);
5267
- outline-offset:-4px;
5268
- }
5269
- .iui-radio-tile-container > label input:enabled:focus:not(:focus-visible) ~ .iui-radio-tile{
5270
- outline:none;
5271
- }
5272
- .iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile{
5273
- z-index:2;
5274
- border-color:rgba(0, 0, 0, 0.8);
5275
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
5276
- }
5277
- @media (prefers-reduced-motion: no-preference){
5278
- .iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile{
5279
- transition:border-color 0.2s ease-out;
5280
- }
5281
- }
5282
- .iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile > .iui-icon{
5283
- fill:rgba(0, 0, 0, 0.8);
5284
- fill:var(--iui-icons-color-actionable);
5285
- }
5286
- @media (prefers-reduced-motion: no-preference){
5287
- .iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile > .iui-icon{
5288
- transition:fill 0.2s ease-out;
5289
- }
5290
- }
5291
- .iui-radio-tile-container > label input:checked ~ .iui-radio-tile{
5292
- padding:7px;
5293
- z-index:3;
5294
- border:2px solid #008ae0;
5295
- border:2px solid var(--iui-color-foreground-primary);
5296
- }
5297
- .iui-radio-tile-container > label input:checked ~ .iui-radio-tile > .iui-icon{
5298
- fill:#008ae0;
5299
- fill:var(--iui-icons-color-primary);
5300
- }
5301
- .iui-radio-tile-container > label input:checked ~ .iui-radio-tile > .iui-checkmark{
5302
- display:inline-block;
5303
- }
5304
- .iui-radio-tile-container > label input:disabled ~ .iui-radio-tile{
5305
- cursor:not-allowed;
5306
- z-index:0;
5307
- border-color:#edeff2;
5308
- background-color:#edeff2;
5309
- border-color:var(--iui-color-background-disabled);
5310
- background-color:var(--iui-color-background-disabled);
5311
- }
5312
- .iui-radio-tile-container > label input:disabled ~ .iui-radio-tile > .iui-checkmark{
5313
- fill:rgba(0, 0, 0, 0.2);
5314
- fill:var(--iui-icons-color-actionable-disabled);
5315
- }
5316
- .iui-radio-tile-container > label input:disabled ~ .iui-radio-tile > .iui-icon{
5317
- fill:rgba(0, 0, 0, 0.2);
5318
- fill:var(--iui-icons-color-actionable-disabled);
5319
- filter:grayscale(100%);
5320
- }
5321
- .iui-radio-tile-container > label input:disabled ~ .iui-radio-tile > .iui-label{
5322
- color:rgba(0, 0, 0, 0.4);
5323
- color:var(--iui-text-color-muted);
5324
- }
5325
- .iui-radio-tile-container > label input:disabled:checked ~ .iui-radio-tile{
5326
- z-index:3;
5327
- border:2px solid rgba(0, 0, 0, 0.4);
5328
- border:2px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
5329
- }
5330
-
5331
5603
  .iui-keyboard{
5332
5604
  margin:0;
5333
5605
  padding:0;
@@ -5574,209 +5846,80 @@ label.iui-input-label.iui-disabled{
5574
5846
  outline:none;
5575
5847
  }
5576
5848
  .iui-menu-item.iui-large{
5577
- height:49px;
5578
- }
5579
- .iui-menu-item.iui-large .iui-menu-description{
5580
- display:block;
5581
- }
5582
- .iui-menu-item.iui-active, .iui-menu-item.iui-active:hover{
5583
- background-color:rgba(0, 138, 224, 0.1);
5584
- color:#008ae0;
5585
- outline:thin solid var(--iui-color-foreground-primary);
5586
- outline-offset:-1px;
5587
- background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6));
5588
- color:var(--iui-color-foreground-primary);
5589
- outline:thin solid var(--iui-color-foreground-primary);
5590
- outline-offset:-1px;
5591
- }
5592
- .iui-menu-item.iui-active .iui-menu-description{
5593
- opacity:1;
5594
- }
5595
- .iui-menu-item.iui-active > .iui-icon{
5596
- fill:#008ae0;
5597
- fill:var(--iui-icons-color-primary);
5598
- }
5599
- .iui-menu-item.iui-active:focus, .iui-menu-item.iui-active.iui-focused{
5600
- outline-width:2px;
5601
- outline-offset:-2px;
5602
- }
5603
- .iui-menu-item.iui-active:focus:not(:focus-visible){
5604
- outline:thin solid var(--iui-color-foreground-primary);
5605
- outline-offset:-1px;
5606
- }
5607
- .iui-menu-item.iui-disabled, .iui-menu-item.iui-disabled:hover{
5608
- cursor:not-allowed;
5609
- outline:none;
5610
- background-color:white;
5611
- color:rgba(0, 0, 0, 0.2);
5612
- background-color:var(--iui-color-background-1);
5613
- color:var(--iui-text-color-placeholder);
5614
- }
5615
- .iui-menu-item.iui-disabled > .iui-icon, .iui-menu-item.iui-disabled:hover > .iui-icon{
5616
- fill:rgba(0, 0, 0, 0.2);
5617
- fill:var(--iui-icons-color-actionable-disabled);
5618
- }
5619
- .iui-menu-item-skeleton{
5620
- --iui-menu-item-content-skeleton-max-width:30%;
5621
- cursor:auto;
5622
- }
5623
- .iui-menu-item-skeleton .iui-content{
5624
- max-width:var(--iui-menu-item-content-skeleton-max-width);
5625
- }
5626
- .iui-menu-item-skeleton .iui-menu-label{
5627
- width:100%;
5628
- height:14px;
5629
- vertical-align:middle;
5630
- }
5631
- .iui-menu-item-skeleton .iui-menu-description{
5632
- width:70%;
5633
- height:12px;
5634
- vertical-align:middle;
5635
- margin-top:4px;
5636
- }
5637
- .iui-menu-item-skeleton:hover{
5638
- background-color:unset;
5639
- }
5640
-
5641
- .iui-menu-content{
5642
- padding:11px 13px;
5643
- }
5644
-
5645
- .iui-menu-divider{
5646
- height:1px;
5647
- width:calc(100% - 24px);
5648
- margin:1px auto;
5649
- background-color:#c7ccd1;
5650
- background-color:var(--iui-color-background-border);
5651
- }
5652
-
5653
- .iui-modal{
5654
- margin:0;
5655
- padding:0;
5656
- border:none;
5657
- vertical-align:baseline;
5658
- z-index:999;
5659
- position:fixed;
5660
- top:0;
5661
- left:0;
5662
- width:100%;
5663
- height:100%;
5664
- background-color:rgba(0, 0, 0, 0.4);
5665
- background-color:rgba(0, 0, 0, var(--iui-opacity-4));
5666
- visibility:hidden;
5667
- opacity:0;
5668
- }
5669
- @media (prefers-reduced-motion: no-preference){
5670
- .iui-modal{
5671
- transition:visibility 0s linear 0.2s, opacity 0.2s ease-out;
5672
- }
5673
- }
5674
- .iui-modal.iui-modal-visible{
5675
- visibility:visible;
5676
- opacity:1;
5677
- transition-delay:0s;
5678
- }
5679
- .iui-modal > .iui-modal-dialog{
5680
- position:absolute;
5681
- left:50%;
5682
- top:33%;
5683
- transform:translate(-50%, -33%);
5684
- z-index:1000;
5685
- max-width:50%;
5686
- min-width:380px;
5687
- max-height:100vh;
5688
- border-radius:3px;
5689
- box-shadow:0 9px 46px rgba(0, 0, 0, 0.25);
5690
- padding:11px 16px;
5691
- box-sizing:border-box;
5692
- background-color:white;
5693
- background-color:var(--iui-color-background-1);
5694
- }
5695
- @media screen and (max-width: 400px){
5696
- .iui-modal > .iui-modal-dialog{
5697
- max-width:95%;
5698
- width:95%;
5699
- min-width:95%;
5700
- }
5701
- }
5702
- .iui-modal > .iui-modal-dialog .iui-title-bar{
5703
- display:flex;
5704
- align-items:center;
5705
- margin-bottom:11px;
5706
- justify-content:space-between;
5849
+ height:49px;
5707
5850
  }
5708
- .iui-modal > .iui-modal-dialog .iui-title-bar > .iui-title{
5709
- font-size:18px;
5710
- white-space:nowrap;
5711
- overflow:hidden;
5712
- text-overflow:ellipsis;
5713
- line-height:1.5;
5851
+ .iui-menu-item.iui-large .iui-menu-description{
5852
+ display:block;
5714
5853
  }
5715
- .iui-modal > .iui-modal-dialog .iui-button-bar{
5716
- margin-top:11px;
5717
- display:flex;
5718
- align-items:center;
5719
- justify-content:flex-end;
5854
+ .iui-menu-item.iui-active, .iui-menu-item.iui-active:hover{
5855
+ background-color:rgba(0, 138, 224, 0.1);
5856
+ color:#008ae0;
5857
+ outline:thin solid var(--iui-color-foreground-primary);
5858
+ outline-offset:-1px;
5859
+ background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6));
5860
+ color:var(--iui-color-foreground-primary);
5861
+ outline:thin solid var(--iui-color-foreground-primary);
5862
+ outline-offset:-1px;
5720
5863
  }
5721
- .iui-modal > .iui-modal-dialog .iui-button-bar > .iui-button:not(:last-child){
5722
- margin-right:8px;
5864
+ .iui-menu-item.iui-active .iui-menu-description{
5865
+ opacity:1;
5723
5866
  }
5724
- .iui-modal > .iui-modal-dialog .iui-modal-content{
5725
- flex-grow:2;
5726
- margin:0 -16px;
5727
- padding:0 16px;
5728
- overflow-y:auto;
5729
- overflow-y:overlay;
5867
+ .iui-menu-item.iui-active > .iui-icon{
5868
+ fill:#008ae0;
5869
+ fill:var(--iui-icons-color-primary);
5730
5870
  }
5731
- .iui-modal-full-page > .iui-modal-dialog{
5732
- display:flex;
5733
- flex-direction:column;
5734
- height:100vh;
5735
- width:100vw;
5736
- left:0;
5737
- top:0;
5738
- transform:none;
5739
- max-width:initial;
5740
- min-width:initial;
5741
- border-radius:0;
5742
- will-change:transform;
5871
+ .iui-menu-item.iui-active:focus, .iui-menu-item.iui-active.iui-focused{
5872
+ outline-width:2px;
5873
+ outline-offset:-2px;
5743
5874
  }
5744
- @media (prefers-reduced-motion: no-preference){
5745
- .iui-modal-full-page{
5746
- transition:visibility 0s linear 0.8s, opacity 0.4s ease-out 0.2s;
5747
- }
5875
+ .iui-menu-item.iui-active:focus:not(:focus-visible){
5876
+ outline:thin solid var(--iui-color-foreground-primary);
5877
+ outline-offset:-1px;
5748
5878
  }
5749
- .iui-modal-full-page > .iui-modal-dialog{
5750
- transform:translateY(100%);
5879
+ .iui-menu-item.iui-disabled, .iui-menu-item.iui-disabled:hover{
5880
+ cursor:not-allowed;
5881
+ outline:none;
5882
+ background-color:white;
5883
+ color:rgba(0, 0, 0, 0.2);
5884
+ background-color:var(--iui-color-background-1);
5885
+ color:var(--iui-text-color-placeholder);
5751
5886
  }
5752
- @media (prefers-reduced-motion: no-preference){
5753
- .iui-modal-full-page > .iui-modal-dialog{
5754
- transition:visibility 0s linear 0.4s, opacity 0s linear 0.4s, transform 0.25s ease-in;
5755
- }
5887
+ .iui-menu-item.iui-disabled > .iui-icon, .iui-menu-item.iui-disabled:hover > .iui-icon{
5888
+ fill:rgba(0, 0, 0, 0.2);
5889
+ fill:var(--iui-icons-color-actionable-disabled);
5756
5890
  }
5757
- .iui-modal-full-page.iui-modal-visible > .iui-modal-dialog{
5758
- transform:translateY(0);
5891
+ .iui-menu-item-skeleton{
5892
+ --iui-menu-item-content-skeleton-max-width:30%;
5893
+ cursor:auto;
5759
5894
  }
5760
- @media (prefers-reduced-motion: no-preference){
5761
- .iui-modal-full-page.iui-modal-visible > .iui-modal-dialog{
5762
- transition:transform 0.3s ease-out;
5763
- }
5895
+ .iui-menu-item-skeleton .iui-content{
5896
+ max-width:var(--iui-menu-item-content-skeleton-max-width);
5764
5897
  }
5765
- .iui-modal-animation-enter .iui-modal-full-page .iui-modal-dialog{
5766
- transform:translateY(100%);
5767
- opacity:0;
5898
+ .iui-menu-item-skeleton .iui-menu-label{
5899
+ width:100%;
5900
+ height:14px;
5901
+ vertical-align:middle;
5768
5902
  }
5769
- .iui-modal-animation-enter-active .iui-modal-full-page .iui-modal-dialog{
5770
- transform:translateY(0);
5771
- opacity:1;
5903
+ .iui-menu-item-skeleton .iui-menu-description{
5904
+ width:70%;
5905
+ height:12px;
5906
+ vertical-align:middle;
5907
+ margin-top:4px;
5772
5908
  }
5773
- .iui-modal-animation-enter .iui-modal{
5774
- visibility:hidden;
5775
- opacity:0;
5909
+ .iui-menu-item-skeleton:hover{
5910
+ background-color:unset;
5776
5911
  }
5777
- .iui-modal-animation-enter-active .iui-modal{
5778
- visibility:visible;
5779
- opacity:1;
5912
+
5913
+ .iui-menu-content{
5914
+ padding:11px 13px;
5915
+ }
5916
+
5917
+ .iui-menu-divider{
5918
+ height:1px;
5919
+ width:calc(100% - 24px);
5920
+ margin:1px auto;
5921
+ background-color:#c7ccd1;
5922
+ background-color:var(--iui-color-background-border);
5780
5923
  }
5781
5924
 
5782
5925
  .iui-non-ideal-state{
@@ -6531,6 +6674,220 @@ label.iui-input-label.iui-disabled{
6531
6674
  animation:closeAnimation 0.2s linear;
6532
6675
  }
6533
6676
 
6677
+ .iui-radio-tile{
6678
+ cursor:pointer;
6679
+ -webkit-tap-highlight-color:rgba(0, 138, 224, 0.1);
6680
+ -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6));
6681
+ }
6682
+ .iui-radio-tile:first-of-type > .iui-radio-tile-content{
6683
+ border-radius:3px 0 0 3px;
6684
+ }
6685
+ .iui-radio-tile:last-of-type > .iui-radio-tile-content{
6686
+ border-radius:0 3px 3px 0;
6687
+ }
6688
+ .iui-radio-tile:not(:first-of-type) > .iui-radio-tile-content{
6689
+ margin-left:-1px;
6690
+ }
6691
+
6692
+ .iui-radio-tile-content{
6693
+ width:160px;
6694
+ height:100%;
6695
+ box-sizing:border-box;
6696
+ padding:8px;
6697
+ position:relative;
6698
+ z-index:1;
6699
+ border:1px solid rgba(0, 0, 0, 0.4);
6700
+ background-color:white;
6701
+ border:1px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
6702
+ background-color:var(--iui-color-background-1);
6703
+ }
6704
+ @media (prefers-reduced-motion: no-preference){
6705
+ .iui-radio-tile-content{
6706
+ transition:border-color 0.2s ease-out;
6707
+ }
6708
+ }
6709
+ .iui-radio-tile-content:hover{
6710
+ z-index:2;
6711
+ border-color:rgba(0, 0, 0, 0.8);
6712
+ border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
6713
+ }
6714
+ .iui-radio-tile-content:hover .iui-radio-tile-icon{
6715
+ fill:rgba(0, 0, 0, 0.8);
6716
+ fill:var(--iui-icons-color-actionable);
6717
+ }
6718
+ @media (forced-colors: active){
6719
+ .iui-radio-tile-content:hover .iui-radio-tile-icon{
6720
+ fill:CanvasText;
6721
+ }
6722
+ }
6723
+
6724
+ .iui-radio-tile-container{
6725
+ display:inline-flex;
6726
+ flex-wrap:wrap;
6727
+ -webkit-user-select:none;
6728
+ -moz-user-select:none;
6729
+ -ms-user-select:none;
6730
+ user-select:none;
6731
+ position:relative;
6732
+ z-index:0;
6733
+ }
6734
+
6735
+ .iui-radio-tile-input{
6736
+ width:0;
6737
+ height:0;
6738
+ -webkit-appearance:none;
6739
+ -moz-appearance:none;
6740
+ appearance:none;
6741
+ opacity:0;
6742
+ position:absolute;
6743
+ }
6744
+ .iui-radio-tile-input:focus-visible + *{
6745
+ outline-offset:-4px;
6746
+ outline:2px solid #008ae0;
6747
+ outline:2px solid var(--iui-color-foreground-primary);
6748
+ }
6749
+ @media (forced-colors: active){
6750
+ .iui-radio-tile-input:focus-visible + *{
6751
+ outline-color:Highlight;
6752
+ }
6753
+ }
6754
+ @supports not selector(*:focus-visible){
6755
+ .iui-radio-tile-input:focus + *{
6756
+ outline-offset:-4px;
6757
+ outline:2px solid #008ae0;
6758
+ outline:2px solid var(--iui-color-foreground-primary);
6759
+ }
6760
+ @media (forced-colors: active){
6761
+ .iui-radio-tile-input:focus + *{
6762
+ outline-color:Highlight;
6763
+ }
6764
+ }
6765
+ }
6766
+ .iui-radio-tile-input:checked + *{
6767
+ padding:7px;
6768
+ z-index:3;
6769
+ border:2px solid #008ae0;
6770
+ border:2px solid var(--iui-color-foreground-primary);
6771
+ }
6772
+ @media (forced-colors: active){
6773
+ .iui-radio-tile-input:checked + *{
6774
+ border-color:Highlight;
6775
+ }
6776
+ }
6777
+ .iui-radio-tile-input:checked + * .iui-radio-tile-icon{
6778
+ fill:#008ae0;
6779
+ fill:var(--iui-icons-color-primary);
6780
+ }
6781
+ @media (forced-colors: active){
6782
+ .iui-radio-tile-input:checked + * .iui-radio-tile-icon{
6783
+ fill:Highlight;
6784
+ }
6785
+ }
6786
+ .iui-radio-tile-input:checked + *::after{
6787
+ content:"";
6788
+ width:16px;
6789
+ height:16px;
6790
+ position:absolute;
6791
+ top:8px;
6792
+ right:8px;
6793
+ -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M6,14L0,8l2-2l4,4l8-8l2,2L6,14z" /></svg>');
6794
+ mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M6,14L0,8l2-2l4,4l8-8l2,2L6,14z" /></svg>');
6795
+ background-color:#008ae0;
6796
+ background-color:var(--iui-color-foreground-primary);
6797
+ }
6798
+ @media (forced-colors: active){
6799
+ .iui-radio-tile-input:checked + *::after{
6800
+ background-color:Highlight;
6801
+ }
6802
+ }
6803
+ .iui-radio-tile-input:disabled + *{
6804
+ cursor:not-allowed;
6805
+ z-index:0;
6806
+ border-color:#edeff2;
6807
+ background-color:#edeff2;
6808
+ border-color:var(--iui-color-background-disabled);
6809
+ background-color:var(--iui-color-background-disabled);
6810
+ }
6811
+ .iui-radio-tile-input:disabled + *::after{
6812
+ background-color:rgba(0, 0, 0, 0.2);
6813
+ background-color:var(--iui-icons-color-actionable-disabled);
6814
+ }
6815
+ @media (forced-colors: active){
6816
+ .iui-radio-tile-input:disabled + *::after{
6817
+ background-color:GrayText;
6818
+ }
6819
+ }
6820
+ .iui-radio-tile-input:disabled + * .iui-radio-tile-icon{
6821
+ filter:grayscale(100%);
6822
+ fill:rgba(0, 0, 0, 0.2);
6823
+ fill:var(--iui-icons-color-actionable-disabled);
6824
+ }
6825
+ @media (forced-colors: active){
6826
+ .iui-radio-tile-input:disabled + * .iui-radio-tile-icon{
6827
+ fill:GrayText;
6828
+ }
6829
+ }
6830
+ @media (forced-colors: active){
6831
+ .iui-radio-tile-input:disabled + * .iui-radio-tile-label,
6832
+ .iui-radio-tile-input:disabled + * .iui-radio-tile-sublabel{
6833
+ color:GrayText;
6834
+ }
6835
+ }
6836
+ .iui-radio-tile-input:disabled + * .iui-radio-tile-label{
6837
+ color:rgba(0, 0, 0, 0.4);
6838
+ color:var(--iui-text-color-muted);
6839
+ }
6840
+ .iui-radio-tile-input:disabled:checked + *{
6841
+ z-index:3;
6842
+ border:2px solid rgba(0, 0, 0, 0.4);
6843
+ border:2px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
6844
+ }
6845
+ @media (forced-colors: active){
6846
+ .iui-radio-tile-input:disabled:checked + *{
6847
+ border-color:GrayText;
6848
+ }
6849
+ }
6850
+
6851
+ .iui-radio-tile-icon{
6852
+ width:32px;
6853
+ height:32px;
6854
+ display:block;
6855
+ margin:0 auto;
6856
+ padding-top:6px;
6857
+ padding-bottom:11px;
6858
+ fill:rgba(0, 0, 0, 0.4);
6859
+ fill:var(--iui-icons-color);
6860
+ }
6861
+ @media (prefers-reduced-motion: no-preference){
6862
+ .iui-radio-tile-icon{
6863
+ transition:fill 0.2s ease-out;
6864
+ }
6865
+ }
6866
+ @media (forced-colors: active){
6867
+ .iui-radio-tile-icon{
6868
+ fill:CanvasText;
6869
+ }
6870
+ }
6871
+
6872
+ .iui-radio-tile-label{
6873
+ font-size:14px;
6874
+ font-weight:600;
6875
+ line-height:22px;
6876
+ text-align:center;
6877
+ word-break:break-word;
6878
+ color:rgba(0, 0, 0, 0.8);
6879
+ color:var(--iui-text-color);
6880
+ }
6881
+
6882
+ .iui-radio-tile-sublabel{
6883
+ font-size:12px;
6884
+ line-height:15px;
6885
+ text-align:center;
6886
+ word-break:break-word;
6887
+ color:rgba(0, 0, 0, 0.4);
6888
+ color:var(--iui-text-color-muted);
6889
+ }
6890
+
6534
6891
  .iui-side-navigation{
6535
6892
  display:inline-flex;
6536
6893
  flex:0 0 auto;
@@ -6749,6 +7106,71 @@ label.iui-input-label.iui-disabled{
6749
7106
  height:100%;
6750
7107
  }
6751
7108
 
7109
+ .iui-skip-to-content-link{
7110
+ background-color:rgba(0, 0, 0, 0.8);
7111
+ background-color:rgba(0, 0, 0, var(--iui-opacity-2));
7112
+ color:white;
7113
+ color:var(--iui-color-foreground-accessory);
7114
+ border-radius:9999px;
7115
+ text-decoration:none;
7116
+ -webkit-user-select:none;
7117
+ -moz-user-select:none;
7118
+ -ms-user-select:none;
7119
+ user-select:none;
7120
+ padding:8.25px 16px;
7121
+ position:fixed;
7122
+ text-align:center;
7123
+ left:50%;
7124
+ top:22px;
7125
+ opacity:0;
7126
+ z-index:99;
7127
+ transform:translateX(-50%) translateY(-170%);
7128
+ transition:background-color 0.2s ease-in-out;
7129
+ }
7130
+ @supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
7131
+ .iui-skip-to-content-link{
7132
+ background-color:rgba(0, 0, 0, var(--iui-opacity-3));
7133
+ -webkit-backdrop-filter:blur(5px);
7134
+ backdrop-filter:blur(5px);
7135
+ }
7136
+ }
7137
+ .iui-skip-to-content-link:focus-visible{
7138
+ outline:2px solid var(--iui-color-foreground-primary);
7139
+ outline-offset:2px;
7140
+ }
7141
+ @supports not selector(*:focus-visible){
7142
+ .iui-skip-to-content-link:focus{
7143
+ outline:2px solid var(--iui-color-foreground-primary);
7144
+ outline-offset:2px;
7145
+ }
7146
+ }
7147
+ @media (prefers-reduced-motion: no-preference){
7148
+ .iui-skip-to-content-link{
7149
+ transition:opacity 0.8s ease-in-out, background-color 0.8s ease-in-out, transform 0.8s ease-in-out, box-shadow 0.8s ease-in-out;
7150
+ }
7151
+ }
7152
+ .iui-skip-to-content-link:hover{
7153
+ background-color:black;
7154
+ background-color:rgba(0, 0, 0, var(--iui-opacity-1));
7155
+ }
7156
+ @supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
7157
+ .iui-skip-to-content-link:hover{
7158
+ background-color:rgba(0, 0, 0, var(--iui-opacity-2));
7159
+ -webkit-backdrop-filter:blur(5px);
7160
+ backdrop-filter:blur(5px);
7161
+ }
7162
+ }
7163
+ .iui-skip-to-content-link:focus{
7164
+ opacity:1;
7165
+ transform:translateX(-50%) translateY(0);
7166
+ box-shadow:0 6px 30px rgba(0, 0, 0, 0.25);
7167
+ }
7168
+ @media (prefers-reduced-motion: no-preference){
7169
+ .iui-skip-to-content-link:focus{
7170
+ transition:opacity 0s ease-in-out, background-color 0.2s ease-in-out, transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
7171
+ }
7172
+ }
7173
+
6752
7174
  .iui-slider-component-container{
6753
7175
  display:flex;
6754
7176
  min-height:22px;
@@ -6909,6 +7331,22 @@ label.iui-input-label.iui-disabled{
6909
7331
  background-color:var(--iui-color-foreground-primary);
6910
7332
  }
6911
7333
 
7334
+ .iui-surface{
7335
+ --iui-surface-background-color:var(--iui-color-background-1);
7336
+ --iui-surface-border-radius:0;
7337
+ --iui-surface-elevation:0 1px 5px rgba(0, 0, 0, 0.25);
7338
+ background-color:var(--iui-surface-background-color);
7339
+ border-radius:var(--iui-surface-border-radius);
7340
+ box-shadow:var(--iui-surface-elevation);
7341
+ box-sizing:border-box;
7342
+ color:var(--iui-text-color);
7343
+ }
7344
+ @media (forced-colors: active){
7345
+ .iui-surface{
7346
+ border:1px solid transparent;
7347
+ }
7348
+ }
7349
+
6912
7350
  .iui-table{
6913
7351
  margin:0;
6914
7352
  padding:0;
@@ -6974,6 +7412,11 @@ label.iui-input-label.iui-disabled{
6974
7412
  border-left:solid 1px transparent;
6975
7413
  border-right:solid 1px transparent;
6976
7414
  }
7415
+ .iui-table-header .iui-cell:not(.iui-slot){
7416
+ flex-wrap:wrap;
7417
+ -moz-column-gap:4px;
7418
+ column-gap:4px;
7419
+ }
6977
7420
  .iui-table-header .iui-cell:not(.iui-slot):focus-visible{
6978
7421
  outline:1px solid var(--iui-color-foreground-primary);
6979
7422
  outline-offset:-1px;
@@ -6991,11 +7434,10 @@ label.iui-input-label.iui-disabled{
6991
7434
  cursor:-webkit-grabbing;
6992
7435
  cursor:grabbing;
6993
7436
  }
6994
- .iui-table-header .iui-cell:not(.iui-slot) > .iui-filter-button{
6995
- margin-left:4px;
7437
+ .iui-table-header .iui-cell:not(.iui-slot) .iui-filter-button{
6996
7438
  margin-right:8px;
6997
7439
  }
6998
- .iui-table-header .iui-cell:not(.iui-slot) > .iui-filter-button:not(.iui-active){
7440
+ .iui-table-header .iui-cell:not(.iui-slot) .iui-filter-button:not(.iui-active){
6999
7441
  visibility:hidden;
7000
7442
  }
7001
7443
  .iui-table-header .iui-cell:not(.iui-slot) > .iui-resizer{
@@ -7071,6 +7513,12 @@ label.iui-input-label.iui-disabled{
7071
7513
  fill:var(--iui-icons-color-actionable);
7072
7514
  }
7073
7515
 
7516
+ .iui-table-header-actions-container{
7517
+ display:flex;
7518
+ flex-grow:1;
7519
+ align-items:center;
7520
+ }
7521
+
7074
7522
  .iui-table-body{
7075
7523
  overflow-y:scroll;
7076
7524
  overflow:overlay;
@@ -7439,6 +7887,7 @@ label.iui-input-label.iui-disabled{
7439
7887
 
7440
7888
  .iui-paginator-page-button{
7441
7889
  --_iui-button-active-stripe-inset:initial;
7890
+ --_iui-button-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
7442
7891
  margin:0;
7443
7892
  padding:0;
7444
7893
  border:none;
@@ -7465,6 +7914,7 @@ label.iui-input-label.iui-disabled{
7465
7914
  border:1px solid transparent;
7466
7915
  color:rgba(0, 0, 0, 0.8);
7467
7916
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
7917
+ color:var(--_iui-button-text-color);
7468
7918
  border-color:transparent;
7469
7919
  background-color:transparent;
7470
7920
  padding:0 8px;
@@ -7479,9 +7929,8 @@ label.iui-input-label.iui-disabled{
7479
7929
  }
7480
7930
  }
7481
7931
  .iui-paginator-page-button:hover{
7932
+ --_iui-button-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
7482
7933
  text-decoration:none;
7483
- color:black;
7484
- color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
7485
7934
  }
7486
7935
  .iui-paginator-page-button:focus-visible{
7487
7936
  outline:1px solid var(--iui-color-foreground-primary);
@@ -7502,15 +7951,6 @@ label.iui-input-label.iui-disabled{
7502
7951
  border-color:var(--iui-color-background-disabled);
7503
7952
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
7504
7953
  }
7505
- .iui-paginator-page-button.iui-active::after{
7506
- content:"";
7507
- position:absolute;
7508
- inset:var(--_iui-button-active-stripe-inset);
7509
- background-color:var(--iui-color-foreground-primary);
7510
- }
7511
- .iui-paginator-page-button.iui-active[disabled]::after, .iui-paginator-page-button.iui-active:disabled::after{
7512
- background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
7513
- }
7514
7954
  .iui-paginator-page-button > .iui-button-icon:only-child{
7515
7955
  margin-left:3px;
7516
7956
  margin-right:3px;
@@ -7545,6 +7985,15 @@ label.iui-input-label.iui-disabled{
7545
7985
  background-color:rgba(0, 0, 0, 0.05);
7546
7986
  background-color:rgba(var(--iui-color-foreground-body-rgb), 0.05);
7547
7987
  }
7988
+ .iui-paginator-page-button.iui-active::after{
7989
+ content:"";
7990
+ position:absolute;
7991
+ inset:var(--_iui-button-active-stripe-inset);
7992
+ background-color:var(--iui-color-foreground-primary);
7993
+ }
7994
+ .iui-paginator-page-button.iui-active[disabled]::after, .iui-paginator-page-button.iui-active:disabled::after{
7995
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
7996
+ }
7548
7997
  .iui-paginator-page-button-small{
7549
7998
  padding:0 8px;
7550
7999
  height:27px;
@@ -7666,6 +8115,10 @@ label.iui-input-label.iui-disabled{
7666
8115
  fill:#008ae0;
7667
8116
  fill:var(--iui-icons-color-primary);
7668
8117
  }
8118
+ .iui-tabs .iui-tab.iui-active .iui-tab-description{
8119
+ opacity:1;
8120
+ opacity:var(--iui-opacity-1);
8121
+ }
7669
8122
  .iui-tabs .iui-tab[disabled]{
7670
8123
  cursor:not-allowed;
7671
8124
  color:rgba(0, 0, 0, 0.4);
@@ -8004,12 +8457,12 @@ label.iui-input-label.iui-disabled{
8004
8457
  }
8005
8458
 
8006
8459
  a.iui-tag-basic{
8007
- --_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>");
8008
8460
  color:#008ae0;
8009
8461
  -webkit-tap-highlight-color:rgba(0, 138, 224, 0.2);
8010
8462
  color:var(--iui-color-foreground-primary);
8011
8463
  -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
8012
8464
  border-radius:3px;
8465
+ box-sizing:border-box;
8013
8466
  cursor:pointer;
8014
8467
  text-decoration:none;
8015
8468
  }
@@ -8027,22 +8480,6 @@ a.iui-tag-basic:hover{
8027
8480
  color:#006bad;
8028
8481
  color:var(--iui-color-foreground-primary-overlay);
8029
8482
  }
8030
- a.iui-tag-basic-external::after{
8031
- content:"";
8032
- display:inline-block;
8033
- width:1.5ch;
8034
- height:1.5ch;
8035
- margin-left:0.5ch;
8036
- vertical-align:-0.1ch;
8037
- background-color:currentColor;
8038
- -webkit-mask:var(--_iui-anchor-external-svg);
8039
- mask:var(--_iui-anchor-external-svg);
8040
- }
8041
- @media (forced-colors: active){
8042
- a.iui-tag-basic-external::after{
8043
- background-color:LinkText;
8044
- }
8045
- }
8046
8483
  a.iui-tag-basic:hover{
8047
8484
  text-decoration:underline;
8048
8485
  }
@@ -8189,11 +8626,17 @@ a.iui-tag-basic:focus-visible{
8189
8626
  user-select:none;
8190
8627
  color:transparent;
8191
8628
  border-radius:3px;
8192
- background:linear-gradient(270deg, #edeff2, #edeff2, #f9f9fb, #edeff2, #edeff2);
8193
- background-size:200% 100%;
8194
- background:linear-gradient(270deg, var(--iui-color-background-3), var(--iui-color-background-3), var(--iui-color-background-2), var(--iui-color-background-3), var(--iui-color-background-3));
8629
+ cursor:progress;
8630
+ background:linear-gradient(292deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
8631
+ background:linear-gradient(292deg, var(--iui-text-color-muted), var(--iui-text-color-muted), var(--iui-text-color-placeholder), var(--iui-text-color-muted), var(--iui-text-color-muted));
8195
8632
  background-size:200% 100%;
8196
8633
  }
8634
+ @media (forced-colors: active){
8635
+ .iui-skeleton{
8636
+ forced-color-adjust:none;
8637
+ background:linear-gradient(292deg, CanvasText, CanvasText, Canvas, CanvasText, CanvasText);
8638
+ }
8639
+ }
8197
8640
  @media (prefers-reduced-motion: no-preference){
8198
8641
  .iui-skeleton{
8199
8642
  -webkit-animation:skeleton-shimmer 0.8s linear infinite;
@@ -8865,7 +9308,7 @@ div.iui-tile-thumbnail-picture{
8865
9308
  align-items:center;
8866
9309
  flex-direction:column;
8867
9310
  justify-content:center;
8868
- z-index:1070;
9311
+ z-index:99999;
8869
9312
  }
8870
9313
  @media screen and (max-width: 400px){
8871
9314
  .iui-toast-wrapper{
@@ -9219,6 +9662,11 @@ div.iui-tile-thumbnail-picture{
9219
9662
  color:rgba(0, 0, 0, 0.4);
9220
9663
  color:var(--iui-text-color-muted);
9221
9664
  }
9665
+ @media (forced-colors: active){
9666
+ .iui-toggle-switch-wrapper.iui-disabled{
9667
+ color:GrayText;
9668
+ }
9669
+ }
9222
9670
  .iui-toggle-switch-wrapper.iui-label-on-left{
9223
9671
  grid-template-areas:"label toggle";
9224
9672
  }
@@ -9282,13 +9730,29 @@ div.iui-tile-thumbnail-picture{
9282
9730
  transition:transform 0.2s ease-out, background-color 0.2s ease-out, opacity 0.2s ease-out;
9283
9731
  }
9284
9732
  }
9733
+ @media (forced-colors: active){
9734
+ .iui-toggle-switch{
9735
+ border-color:CanvasText;
9736
+ }
9737
+ }
9285
9738
  .iui-toggle-switch::after{
9286
9739
  background-color:var(--iui-color-foreground-body);
9287
9740
  opacity:var(--iui-opacity-2);
9288
9741
  }
9742
+ @media (forced-colors: active){
9743
+ .iui-toggle-switch::after{
9744
+ background-color:CanvasText;
9745
+ opacity:1;
9746
+ }
9747
+ }
9289
9748
  .iui-toggle-switch:hover{
9290
9749
  border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
9291
9750
  }
9751
+ @media (forced-colors: active){
9752
+ .iui-toggle-switch:hover{
9753
+ border-color:CanvasText;
9754
+ }
9755
+ }
9292
9756
  .iui-toggle-switch:focus-visible{
9293
9757
  border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
9294
9758
  }
@@ -9301,11 +9765,23 @@ div.iui-tile-thumbnail-picture{
9301
9765
  background-color:var(--iui-color-background-primary);
9302
9766
  border-color:var(--iui-color-background-primary);
9303
9767
  }
9768
+ @media (forced-colors: active){
9769
+ .iui-toggle-switch:checked{
9770
+ background-color:Highlight;
9771
+ border-color:Highlight;
9772
+ }
9773
+ }
9304
9774
  .iui-toggle-switch:checked::after{
9305
9775
  transform:translateX(19px);
9306
9776
  background-color:var(--iui-color-foreground-accessory);
9307
9777
  opacity:var(--iui-opacity-2);
9308
9778
  }
9779
+ @media (forced-colors: active){
9780
+ .iui-toggle-switch:checked::after{
9781
+ background-color:HighlightText;
9782
+ opacity:1;
9783
+ }
9784
+ }
9309
9785
  .iui-toggle-switch:checked ~ .iui-toggle-switch-icon{
9310
9786
  opacity:var(--iui-opacity-1);
9311
9787
  }
@@ -9325,17 +9801,44 @@ div.iui-tile-thumbnail-picture{
9325
9801
  background-color:var(--iui-color-background-disabled);
9326
9802
  border-color:var(--iui-color-background-disabled);
9327
9803
  }
9804
+ @media (forced-colors: active){
9805
+ .iui-toggle-switch:disabled{
9806
+ border-color:GrayText;
9807
+ }
9808
+ }
9328
9809
  .iui-toggle-switch:disabled::after{
9329
9810
  background-color:var(--iui-color-foreground-body);
9330
9811
  opacity:var(--iui-opacity-5);
9331
9812
  }
9813
+ @media (forced-colors: active){
9814
+ .iui-toggle-switch:disabled::after{
9815
+ background-color:GrayText;
9816
+ opacity:0.75;
9817
+ }
9818
+ }
9332
9819
  .iui-toggle-switch:disabled ~ .iui-toggle-switch-icon{
9333
9820
  opacity:0;
9334
9821
  fill:var(--iui-icons-color-actionable);
9335
9822
  }
9823
+ @media (forced-colors: active){
9824
+ .iui-toggle-switch:disabled:checked{
9825
+ background-color:GrayText;
9826
+ }
9827
+ }
9828
+ @media (forced-colors: active){
9829
+ .iui-toggle-switch:disabled:checked::after{
9830
+ background-color:Canvas;
9831
+ }
9832
+ }
9336
9833
  .iui-toggle-switch:disabled:checked ~ .iui-toggle-switch-icon{
9337
9834
  opacity:var(--iui-opacity-5);
9338
9835
  }
9836
+ @media (forced-colors: active){
9837
+ .iui-toggle-switch:disabled:checked ~ .iui-toggle-switch-icon{
9838
+ fill:Canvas;
9839
+ opacity:0.75;
9840
+ }
9841
+ }
9339
9842
  .iui-toggle-switch-icon{
9340
9843
  opacity:0;
9341
9844
  grid-area:toggle;
@@ -9349,6 +9852,11 @@ div.iui-tile-thumbnail-picture{
9349
9852
  pointer-events:none;
9350
9853
  fill:var(--iui-color-foreground-accessory);
9351
9854
  }
9855
+ @media (forced-colors: active){
9856
+ .iui-toggle-switch-icon{
9857
+ fill:HighlightText;
9858
+ }
9859
+ }
9352
9860
 
9353
9861
  .iui-tooltip-container{
9354
9862
  width:-webkit-fit-content;
@@ -9978,85 +10486,4 @@ div.iui-tile-thumbnail-picture{
9978
10486
  user-select:all;
9979
10487
  color:#53a21a;
9980
10488
  color:var(--iui-color-foreground-positive);
9981
- }
9982
-
9983
- .iui-skip-to-content-link{
9984
- background-color:rgba(0, 0, 0, 0.8);
9985
- background-color:rgba(0, 0, 0, var(--iui-opacity-2));
9986
- color:white;
9987
- color:var(--iui-color-foreground-accessory);
9988
- border-radius:9999px;
9989
- text-decoration:none;
9990
- -webkit-user-select:none;
9991
- -moz-user-select:none;
9992
- -ms-user-select:none;
9993
- user-select:none;
9994
- padding:8.25px 16px;
9995
- position:fixed;
9996
- text-align:center;
9997
- left:50%;
9998
- top:22px;
9999
- opacity:0;
10000
- z-index:99;
10001
- transform:translateX(-50%) translateY(-170%);
10002
- transition:background-color 0.2s ease-in-out;
10003
- }
10004
- @supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
10005
- .iui-skip-to-content-link{
10006
- background-color:rgba(0, 0, 0, var(--iui-opacity-3));
10007
- -webkit-backdrop-filter:blur(5px);
10008
- backdrop-filter:blur(5px);
10009
- }
10010
- }
10011
- .iui-skip-to-content-link:focus-visible{
10012
- outline:2px solid var(--iui-color-foreground-primary);
10013
- outline-offset:2px;
10014
- }
10015
- @supports not selector(*:focus-visible){
10016
- .iui-skip-to-content-link:focus{
10017
- outline:2px solid var(--iui-color-foreground-primary);
10018
- outline-offset:2px;
10019
- }
10020
- }
10021
- @media (prefers-reduced-motion: no-preference){
10022
- .iui-skip-to-content-link{
10023
- transition:opacity 0.8s ease-in-out, background-color 0.8s ease-in-out, transform 0.8s ease-in-out, box-shadow 0.8s ease-in-out;
10024
- }
10025
- }
10026
- .iui-skip-to-content-link:hover{
10027
- background-color:black;
10028
- background-color:rgba(0, 0, 0, var(--iui-opacity-1));
10029
- }
10030
- @supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
10031
- .iui-skip-to-content-link:hover{
10032
- background-color:rgba(0, 0, 0, var(--iui-opacity-2));
10033
- -webkit-backdrop-filter:blur(5px);
10034
- backdrop-filter:blur(5px);
10035
- }
10036
- }
10037
- .iui-skip-to-content-link:focus{
10038
- opacity:1;
10039
- transform:translateX(-50%) translateY(0);
10040
- box-shadow:0 6px 30px rgba(0, 0, 0, 0.25);
10041
- }
10042
- @media (prefers-reduced-motion: no-preference){
10043
- .iui-skip-to-content-link:focus{
10044
- transition:opacity 0s ease-in-out, background-color 0.2s ease-in-out, transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
10045
- }
10046
- }
10047
-
10048
- .iui-surface{
10049
- --iui-surface-background-color:var(--iui-color-background-1);
10050
- --iui-surface-border-radius:0;
10051
- --iui-surface-elevation:0 1px 5px rgba(0, 0, 0, 0.25);
10052
- background-color:var(--iui-surface-background-color);
10053
- border-radius:var(--iui-surface-border-radius);
10054
- box-shadow:var(--iui-surface-elevation);
10055
- box-sizing:border-box;
10056
- color:var(--iui-text-color);
10057
- }
10058
- @media (forced-colors: active){
10059
- .iui-surface{
10060
- border:1px solid transparent;
10061
- }
10062
10489
  }