@itwin/itwinui-css 0.55.0 → 0.56.0

package/css/all.css

@@ -4239,8 +4239,8 @@ div.iui-input-container.iui-inline-label{
   transition:background 0s;
 }
 .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable svg{
-  fill:rgba(0, 0, 0, 0.4);
-  fill:var(--iui-icons-color);
+  fill:rgba(0, 0, 0, 0.8);
+  fill:var(--iui-icons-color-actionable);
   transition:transform 0.2s ease-out;
 }
 .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable.iui-open svg{
@@ -4840,8 +4840,8 @@ label.iui-input-label.iui-disabled{
   transition:background 0s;
 }
 .iui-end-icon.iui-actionable svg{
-  fill:rgba(0, 0, 0, 0.4);
-  fill:var(--iui-icons-color);
+  fill:rgba(0, 0, 0, 0.8);
+  fill:var(--iui-icons-color-actionable);
   transition:transform 0.2s ease-out;
 }
 .iui-end-icon.iui-actionable.iui-open svg{
@@ -4981,6 +4981,12 @@ label.iui-input-label.iui-disabled{
     outline-offset:-1px;
   }
 }
+.iui-checkbox:disabled{
+  --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
+  --_iui-checkbox-border-color:var(--iui-color-background-border);
+  --_iui-checkbox-background-color:var(--iui-color-background-disabled);
+  cursor:not-allowed;
+}
 .iui-checkbox.iui-checkbox-visibility{
   --_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>');
   --_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 +5001,9 @@ label.iui-input-label.iui-disabled{
   --_iui-checkbox-border-color:transparent;
   --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
 }
-.iui-checkbox:disabled{
+.iui-checkbox.iui-checkbox-visibility:where(:disabled){
   --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
-  --_iui-checkbox-border-color:var(--iui-color-background-disabled);
   --_iui-checkbox-background-color:var(--iui-color-background-disabled);
-  cursor:not-allowed;
 }
 .iui-checkbox.iui-loading{
   --_iui-checkbox-border-color:transparent;
@@ -5136,6 +5140,12 @@ label.iui-input-label.iui-disabled{
     outline-offset:-1px;
   }
 }
+.iui-radio:disabled{
+  --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
+  --_iui-checkbox-border-color:var(--iui-color-background-border);
+  --_iui-checkbox-background-color:var(--iui-color-background-disabled);
+  cursor:not-allowed;
+}
 .iui-radio.iui-checkbox-visibility{
   --_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>');
   --_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 +5160,9 @@ label.iui-input-label.iui-disabled{
   --_iui-checkbox-border-color:transparent;
   --_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
 }
-.iui-radio:disabled{
+.iui-radio.iui-checkbox-visibility:where(:disabled){
   --_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
-  --_iui-checkbox-border-color:var(--iui-color-background-disabled);
   --_iui-checkbox-background-color:var(--iui-color-background-disabled);
-  cursor:not-allowed;
 }
 .iui-radio.iui-loading{
   --_iui-checkbox-border-color:transparent;
@@ -5170,164 +5178,6 @@ label.iui-input-label.iui-disabled{
   --_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg);
 }
 
-.iui-radio-tile-container{
-  display:inline-flex;
-  flex-wrap:wrap;
-  width:-webkit-fit-content;
-  width:-moz-fit-content;
-  width:fit-content;
-  -webkit-user-select:none;
-     -moz-user-select:none;
-      -ms-user-select:none;
-          user-select:none;
-  position:relative;
-  z-index:0;
-}
-.iui-radio-tile-container > label{
-  cursor:pointer;
-}
-.iui-radio-tile-container > label > input{
-  width:0;
-  height:0;
-  -webkit-appearance:none;
-     -moz-appearance:none;
-          appearance:none;
-  opacity:0;
-  position:absolute;
-}
-.iui-radio-tile-container > label > .iui-radio-tile{
-  width:160px;
-  height:100%;
-  box-sizing:border-box;
-  padding:8px;
-  position:relative;
-  z-index:1;
-  border:1px solid rgba(0, 0, 0, 0.4);
-  background-color:white;
-  border:1px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
-  background-color:var(--iui-color-background-1);
-}
-@media (prefers-reduced-motion: no-preference){
-  .iui-radio-tile-container > label > .iui-radio-tile{
-    transition:border-color 0.2s ease-out;
-  }
-}
-.iui-radio-tile-container > label > .iui-radio-tile > .iui-icon{
-  width:32px;
-  height:32px;
-  display:block;
-  margin:0 auto;
-  margin-top:6px;
-  margin-bottom:11px;
-  fill:rgba(0, 0, 0, 0.4);
-  fill:var(--iui-icons-color);
-}
-@media (prefers-reduced-motion: no-preference){
-  .iui-radio-tile-container > label > .iui-radio-tile > .iui-icon{
-    transition:fill 0.2s ease-out;
-  }
-}
-.iui-radio-tile-container > label > .iui-radio-tile > .iui-checkmark{
-  display:none;
-  width:16px;
-  height:16px;
-  position:absolute;
-  right:8px;
-  fill:#008ae0;
-  fill:var(--iui-icons-color-primary);
-}
-.iui-radio-tile-container > label > .iui-radio-tile > .iui-label{
-  font-size:14px;
-  font-weight:600;
-  line-height:22px;
-  text-align:center;
-  color:rgba(0, 0, 0, 0.8);
-  color:var(--iui-text-color);
-}
-.iui-radio-tile-container > label > .iui-radio-tile > .iui-description{
-  font-size:12px;
-  line-height:15px;
-  text-align:center;
-  color:rgba(0, 0, 0, 0.4);
-  color:var(--iui-text-color-muted);
-}
-.iui-radio-tile-container > label:first-child > .iui-radio-tile{
-  border-radius:3px 0 0 3px;
-}
-.iui-radio-tile-container > label:last-child > .iui-radio-tile{
-  border-radius:0 3px 3px 0;
-}
-.iui-radio-tile-container > label:not(:first-child) > .iui-radio-tile{
-  margin-left:-1px;
-}
-.iui-radio-tile-container > label input:enabled:focus ~ .iui-radio-tile{
-  outline:2px solid #008ae0;
-  outline-offset:-4px;
-  outline:2px solid var(--iui-color-foreground-primary);
-  outline-offset:-4px;
-}
-.iui-radio-tile-container > label input:enabled:focus:not(:focus-visible) ~ .iui-radio-tile{
-  outline:none;
-}
-.iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile{
-  z-index:2;
-  border-color:rgba(0, 0, 0, 0.8);
-  border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
-}
-@media (prefers-reduced-motion: no-preference){
-  .iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile{
-    transition:border-color 0.2s ease-out;
-  }
-}
-.iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile > .iui-icon{
-  fill:rgba(0, 0, 0, 0.8);
-  fill:var(--iui-icons-color-actionable);
-}
-@media (prefers-reduced-motion: no-preference){
-  .iui-radio-tile-container > label:hover > input:enabled:not(:checked) ~ .iui-radio-tile > .iui-icon{
-    transition:fill 0.2s ease-out;
-  }
-}
-.iui-radio-tile-container > label input:checked ~ .iui-radio-tile{
-  padding:7px;
-  z-index:3;
-  border:2px solid #008ae0;
-  border:2px solid var(--iui-color-foreground-primary);
-}
-.iui-radio-tile-container > label input:checked ~ .iui-radio-tile > .iui-icon{
-  fill:#008ae0;
-  fill:var(--iui-icons-color-primary);
-}
-.iui-radio-tile-container > label input:checked ~ .iui-radio-tile > .iui-checkmark{
-  display:inline-block;
-}
-.iui-radio-tile-container > label input:disabled ~ .iui-radio-tile{
-  cursor:not-allowed;
-  z-index:0;
-  border-color:#edeff2;
-  background-color:#edeff2;
-  border-color:var(--iui-color-background-disabled);
-  background-color:var(--iui-color-background-disabled);
-}
-.iui-radio-tile-container > label input:disabled ~ .iui-radio-tile > .iui-checkmark{
-  fill:rgba(0, 0, 0, 0.2);
-  fill:var(--iui-icons-color-actionable-disabled);
-}
-.iui-radio-tile-container > label input:disabled ~ .iui-radio-tile > .iui-icon{
-  fill:rgba(0, 0, 0, 0.2);
-  fill:var(--iui-icons-color-actionable-disabled);
-  filter:grayscale(100%);
-}
-.iui-radio-tile-container > label input:disabled ~ .iui-radio-tile > .iui-label{
-  color:rgba(0, 0, 0, 0.4);
-  color:var(--iui-text-color-muted);
-}
-.iui-radio-tile-container > label input:disabled:checked ~ .iui-radio-tile{
-  z-index:3;
-  border:2px solid rgba(0, 0, 0, 0.4);
-  border:2px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
-}
-
 .iui-keyboard{
   margin:0;
   padding:0;
@@ -6504,31 +6354,249 @@ label.iui-input-label.iui-disabled{
 .iui-progress-indicator-overlay:focus, .iui-progress-indicator-overlay:focus-visible{
   outline:0;
 }
-.iui-progress-indicator-overlay .iui-progress-indicator-linear{
-  width:50%;
-  max-width:33vw;
+.iui-progress-indicator-overlay .iui-progress-indicator-linear{
+  width:50%;
+  max-width:33vw;
+}
+@-webkit-keyframes closeAnimation{
+  from{
+    opacity:1;
+    opacity:var(--iui-opacity-1);
+  }
+  to{
+    opacity:0;
+  }
+}
+@keyframes closeAnimation{
+  from{
+    opacity:1;
+    opacity:var(--iui-opacity-1);
+  }
+  to{
+    opacity:0;
+  }
+}
+.iui-progress-indicator-overlay .iui-overlay-exiting{
+  -webkit-animation:closeAnimation 0.2s linear;
+          animation:closeAnimation 0.2s linear;
+}
+
+.iui-radio-tile{
+  cursor:pointer;
+  -webkit-tap-highlight-color:rgba(0, 138, 224, 0.1);
+  -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6));
+}
+.iui-radio-tile:first-of-type > .iui-radio-tile-content{
+  border-radius:3px 0 0 3px;
+}
+.iui-radio-tile:last-of-type > .iui-radio-tile-content{
+  border-radius:0 3px 3px 0;
+}
+.iui-radio-tile:not(:first-of-type) > .iui-radio-tile-content{
+  margin-left:-1px;
+}
+
+.iui-radio-tile-content{
+  width:160px;
+  height:100%;
+  box-sizing:border-box;
+  padding:8px;
+  position:relative;
+  z-index:1;
+  border:1px solid rgba(0, 0, 0, 0.4);
+  background-color:white;
+  border:1px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
+  background-color:var(--iui-color-background-1);
+}
+@media (prefers-reduced-motion: no-preference){
+  .iui-radio-tile-content{
+    transition:border-color 0.2s ease-out;
+  }
+}
+.iui-radio-tile-content:hover{
+  z-index:2;
+  border-color:rgba(0, 0, 0, 0.8);
+  border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
+}
+.iui-radio-tile-content:hover svg{
+  fill:rgba(0, 0, 0, 0.8);
+  fill:var(--iui-icons-color-actionable);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-content:hover svg{
+    fill:CanvasText;
+  }
+}
+
+.iui-radio-tile-container{
+  display:inline-flex;
+  flex-wrap:wrap;
+  -webkit-user-select:none;
+     -moz-user-select:none;
+      -ms-user-select:none;
+          user-select:none;
+  position:relative;
+  z-index:0;
+}
+
+.iui-radio-tile-input{
+  width:0;
+  height:0;
+  -webkit-appearance:none;
+     -moz-appearance:none;
+          appearance:none;
+  opacity:0;
+  position:absolute;
+}
+.iui-radio-tile-input:focus-visible + *{
+  outline-offset:-4px;
+  outline:2px solid #008ae0;
+  outline:2px solid var(--iui-color-foreground-primary);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:focus-visible + *{
+    outline-color:Highlight;
+  }
+}
+@supports not selector(*:focus-visible){
+  .iui-radio-tile-input:focus + *{
+    outline-offset:-4px;
+    outline:2px solid #008ae0;
+    outline:2px solid var(--iui-color-foreground-primary);
+  }
+  @media (forced-colors: active){
+    .iui-radio-tile-input:focus + *{
+      outline-color:Highlight;
+    }
+  }
+}
+.iui-radio-tile-input:checked + *{
+  padding:7px;
+  z-index:3;
+  border:2px solid #008ae0;
+  border:2px solid var(--iui-color-foreground-primary);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:checked + *{
+    border-color:Highlight;
+  }
+}
+.iui-radio-tile-input:checked + * svg{
+  fill:#008ae0;
+  fill:var(--iui-icons-color-primary);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:checked + * svg{
+    fill:Highlight;
+  }
+}
+.iui-radio-tile-input:checked + *::after{
+  content:"";
+  width:16px;
+  height:16px;
+  position:absolute;
+  top:8px;
+  right:8px;
+  -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>');
+          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>');
+  background-color:#008ae0;
+  background-color:var(--iui-color-foreground-primary);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:checked + *::after{
+    background-color:Highlight;
+  }
+}
+.iui-radio-tile-input:disabled + *{
+  cursor:not-allowed;
+  z-index:0;
+  border-color:#edeff2;
+  background-color:#edeff2;
+  border-color:var(--iui-color-background-disabled);
+  background-color:var(--iui-color-background-disabled);
+}
+.iui-radio-tile-input:disabled + *::after{
+  background-color:rgba(0, 0, 0, 0.2);
+  background-color:var(--iui-icons-color-actionable-disabled);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:disabled + *::after{
+    background-color:GrayText;
+  }
+}
+.iui-radio-tile-input:disabled + * svg{
+  fill:rgba(0, 0, 0, 0.2);
+  fill:var(--iui-icons-color-actionable-disabled);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:disabled + * svg{
+    fill:GrayText;
+  }
+}
+.iui-radio-tile-input:disabled + * .iui-radio-tile-icon{
+  filter:grayscale(100%);
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:disabled + * .iui-radio-tile-label,
+.iui-radio-tile-input:disabled + * .iui-radio-tile-sublabel{
+    color:GrayText;
+  }
+}
+.iui-radio-tile-input:disabled + * .iui-radio-tile-label{
+  color:rgba(0, 0, 0, 0.4);
+  color:var(--iui-text-color-muted);
+}
+.iui-radio-tile-input:disabled:checked + *{
+  z-index:3;
+  border:2px solid rgba(0, 0, 0, 0.4);
+  border:2px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
+}
+@media (forced-colors: active){
+  .iui-radio-tile-input:disabled:checked + *{
+    border-color:GrayText;
+  }
+}
+
+.iui-radio-tile-icon{
+  width:32px;
+  height:32px;
+  display:block;
+  margin:0 auto;
+  padding-top:6px;
+  padding-bottom:11px;
+}
+.iui-radio-tile-icon svg{
+  fill:rgba(0, 0, 0, 0.4);
+  fill:var(--iui-icons-color);
 }
-@-webkit-keyframes closeAnimation{
-  from{
-    opacity:1;
-    opacity:var(--iui-opacity-1);
-  }
-  to{
-    opacity:0;
+@media (prefers-reduced-motion: no-preference){
+  .iui-radio-tile-icon svg{
+    transition:fill 0.2s ease-out;
   }
 }
-@keyframes closeAnimation{
-  from{
-    opacity:1;
-    opacity:var(--iui-opacity-1);
-  }
-  to{
-    opacity:0;
+@media (forced-colors: active){
+  .iui-radio-tile-icon svg{
+    fill:CanvasText;
   }
 }
-.iui-progress-indicator-overlay .iui-overlay-exiting{
-  -webkit-animation:closeAnimation 0.2s linear;
-          animation:closeAnimation 0.2s linear;
+
+.iui-radio-tile-label{
+  font-size:14px;
+  font-weight:600;
+  line-height:22px;
+  text-align:center;
+  word-break:break-word;
+  color:rgba(0, 0, 0, 0.8);
+  color:var(--iui-text-color);
+}
+
+.iui-radio-tile-sublabel{
+  font-size:12px;
+  line-height:15px;
+  text-align:center;
+  word-break:break-word;
+  color:rgba(0, 0, 0, 0.4);
+  color:var(--iui-text-color-muted);
 }
 
 .iui-side-navigation{
@@ -6749,6 +6817,71 @@ label.iui-input-label.iui-disabled{
   height:100%;
 }
 
+.iui-skip-to-content-link{
+  background-color:rgba(0, 0, 0, 0.8);
+  background-color:rgba(0, 0, 0, var(--iui-opacity-2));
+  color:white;
+  color:var(--iui-color-foreground-accessory);
+  border-radius:9999px;
+  text-decoration:none;
+  -webkit-user-select:none;
+     -moz-user-select:none;
+      -ms-user-select:none;
+          user-select:none;
+  padding:8.25px 16px;
+  position:fixed;
+  text-align:center;
+  left:50%;
+  top:22px;
+  opacity:0;
+  z-index:99;
+  transform:translateX(-50%) translateY(-170%);
+  transition:background-color 0.2s ease-in-out;
+}
+@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
+  .iui-skip-to-content-link{
+    background-color:rgba(0, 0, 0, var(--iui-opacity-3));
+    -webkit-backdrop-filter:blur(5px);
+            backdrop-filter:blur(5px);
+  }
+}
+.iui-skip-to-content-link:focus-visible{
+  outline:2px solid var(--iui-color-foreground-primary);
+  outline-offset:2px;
+}
+@supports not selector(*:focus-visible){
+  .iui-skip-to-content-link:focus{
+    outline:2px solid var(--iui-color-foreground-primary);
+    outline-offset:2px;
+  }
+}
+@media (prefers-reduced-motion: no-preference){
+  .iui-skip-to-content-link{
+    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;
+  }
+}
+.iui-skip-to-content-link:hover{
+  background-color:black;
+  background-color:rgba(0, 0, 0, var(--iui-opacity-1));
+}
+@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
+  .iui-skip-to-content-link:hover{
+    background-color:rgba(0, 0, 0, var(--iui-opacity-2));
+    -webkit-backdrop-filter:blur(5px);
+            backdrop-filter:blur(5px);
+  }
+}
+.iui-skip-to-content-link:focus{
+  opacity:1;
+  transform:translateX(-50%) translateY(0);
+  box-shadow:0 6px 30px rgba(0, 0, 0, 0.25);
+}
+@media (prefers-reduced-motion: no-preference){
+  .iui-skip-to-content-link:focus{
+    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;
+  }
+}
+
 .iui-slider-component-container{
   display:flex;
   min-height:22px;
@@ -6909,6 +7042,22 @@ label.iui-input-label.iui-disabled{
   background-color:var(--iui-color-foreground-primary);
 }
 
+.iui-surface{
+  --iui-surface-background-color:var(--iui-color-background-1);
+  --iui-surface-border-radius:0;
+  --iui-surface-elevation:0 1px 5px rgba(0, 0, 0, 0.25);
+  background-color:var(--iui-surface-background-color);
+  border-radius:var(--iui-surface-border-radius);
+  box-shadow:var(--iui-surface-elevation);
+  box-sizing:border-box;
+  color:var(--iui-text-color);
+}
+@media (forced-colors: active){
+  .iui-surface{
+    border:1px solid transparent;
+  }
+}
+
 .iui-table{
   margin:0;
   padding:0;
@@ -7666,6 +7815,10 @@ label.iui-input-label.iui-disabled{
   fill:#008ae0;
   fill:var(--iui-icons-color-primary);
 }
+.iui-tabs .iui-tab.iui-active .iui-tab-description{
+  opacity:1;
+  opacity:var(--iui-opacity-1);
+}
 .iui-tabs .iui-tab[disabled]{
   cursor:not-allowed;
   color:rgba(0, 0, 0, 0.4);
@@ -8189,11 +8342,17 @@ a.iui-tag-basic:focus-visible{
           user-select:none;
   color:transparent;
   border-radius:3px;
-  background:linear-gradient(270deg, #edeff2, #edeff2, #f9f9fb, #edeff2, #edeff2);
-  background-size:200% 100%;
-  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));
+  cursor:progress;
+  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));
+  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));
   background-size:200% 100%;
 }
+@media (forced-colors: active){
+  .iui-skeleton{
+    forced-color-adjust:none;
+    background:linear-gradient(292deg, CanvasText, CanvasText, Canvas, CanvasText, CanvasText);
+  }
+}
 @media (prefers-reduced-motion: no-preference){
   .iui-skeleton{
     -webkit-animation:skeleton-shimmer 0.8s linear infinite;
@@ -8865,7 +9024,7 @@ div.iui-tile-thumbnail-picture{
   align-items:center;
   flex-direction:column;
   justify-content:center;
-  z-index:1070;
+  z-index:99999;
 }
 @media screen and (max-width: 400px){
   .iui-toast-wrapper{
@@ -9219,6 +9378,11 @@ div.iui-tile-thumbnail-picture{
   color:rgba(0, 0, 0, 0.4);
   color:var(--iui-text-color-muted);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch-wrapper.iui-disabled{
+    color:GrayText;
+  }
+}
 .iui-toggle-switch-wrapper.iui-label-on-left{
       grid-template-areas:"label toggle";
 }
@@ -9282,13 +9446,29 @@ div.iui-tile-thumbnail-picture{
     transition:transform 0.2s ease-out, background-color 0.2s ease-out, opacity 0.2s ease-out;
   }
 }
+@media (forced-colors: active){
+  .iui-toggle-switch{
+    border-color:CanvasText;
+  }
+}
 .iui-toggle-switch::after{
   background-color:var(--iui-color-foreground-body);
   opacity:var(--iui-opacity-2);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch::after{
+    background-color:CanvasText;
+    opacity:1;
+  }
+}
 .iui-toggle-switch:hover{
   border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
 }
+@media (forced-colors: active){
+  .iui-toggle-switch:hover{
+    border-color:CanvasText;
+  }
+}
 .iui-toggle-switch:focus-visible{
   border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
 }
@@ -9301,11 +9481,23 @@ div.iui-tile-thumbnail-picture{
   background-color:var(--iui-color-background-primary);
   border-color:var(--iui-color-background-primary);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch:checked{
+    background-color:Highlight;
+    border-color:Highlight;
+  }
+}
 .iui-toggle-switch:checked::after{
   transform:translateX(19px);
   background-color:var(--iui-color-foreground-accessory);
   opacity:var(--iui-opacity-2);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch:checked::after{
+    background-color:HighlightText;
+    opacity:1;
+  }
+}
 .iui-toggle-switch:checked ~ .iui-toggle-switch-icon{
   opacity:var(--iui-opacity-1);
 }
@@ -9325,17 +9517,44 @@ div.iui-tile-thumbnail-picture{
   background-color:var(--iui-color-background-disabled);
   border-color:var(--iui-color-background-disabled);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch:disabled{
+    border-color:GrayText;
+  }
+}
 .iui-toggle-switch:disabled::after{
   background-color:var(--iui-color-foreground-body);
   opacity:var(--iui-opacity-5);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch:disabled::after{
+    background-color:GrayText;
+    opacity:0.75;
+  }
+}
 .iui-toggle-switch:disabled ~ .iui-toggle-switch-icon{
   opacity:0;
   fill:var(--iui-icons-color-actionable);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch:disabled:checked{
+    background-color:GrayText;
+  }
+}
+@media (forced-colors: active){
+  .iui-toggle-switch:disabled:checked::after{
+    background-color:Canvas;
+  }
+}
 .iui-toggle-switch:disabled:checked ~ .iui-toggle-switch-icon{
   opacity:var(--iui-opacity-5);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch:disabled:checked ~ .iui-toggle-switch-icon{
+    fill:Canvas;
+    opacity:0.75;
+  }
+}
 .iui-toggle-switch-icon{
   opacity:0;
   grid-area:toggle;
@@ -9349,6 +9568,11 @@ div.iui-tile-thumbnail-picture{
   pointer-events:none;
   fill:var(--iui-color-foreground-accessory);
 }
+@media (forced-colors: active){
+  .iui-toggle-switch-icon{
+    fill:HighlightText;
+  }
+}
 
 .iui-tooltip-container{
   width:-webkit-fit-content;
@@ -9978,85 +10202,4 @@ div.iui-tile-thumbnail-picture{
           user-select:all;
   color:#53a21a;
   color:var(--iui-color-foreground-positive);
-}
-
-.iui-skip-to-content-link{
-  background-color:rgba(0, 0, 0, 0.8);
-  background-color:rgba(0, 0, 0, var(--iui-opacity-2));
-  color:white;
-  color:var(--iui-color-foreground-accessory);
-  border-radius:9999px;
-  text-decoration:none;
-  -webkit-user-select:none;
-     -moz-user-select:none;
-      -ms-user-select:none;
-          user-select:none;
-  padding:8.25px 16px;
-  position:fixed;
-  text-align:center;
-  left:50%;
-  top:22px;
-  opacity:0;
-  z-index:99;
-  transform:translateX(-50%) translateY(-170%);
-  transition:background-color 0.2s ease-in-out;
-}
-@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
-  .iui-skip-to-content-link{
-    background-color:rgba(0, 0, 0, var(--iui-opacity-3));
-    -webkit-backdrop-filter:blur(5px);
-            backdrop-filter:blur(5px);
-  }
-}
-.iui-skip-to-content-link:focus-visible{
-  outline:2px solid var(--iui-color-foreground-primary);
-  outline-offset:2px;
-}
-@supports not selector(*:focus-visible){
-  .iui-skip-to-content-link:focus{
-    outline:2px solid var(--iui-color-foreground-primary);
-    outline-offset:2px;
-  }
-}
-@media (prefers-reduced-motion: no-preference){
-  .iui-skip-to-content-link{
-    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;
-  }
-}
-.iui-skip-to-content-link:hover{
-  background-color:black;
-  background-color:rgba(0, 0, 0, var(--iui-opacity-1));
-}
-@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
-  .iui-skip-to-content-link:hover{
-    background-color:rgba(0, 0, 0, var(--iui-opacity-2));
-    -webkit-backdrop-filter:blur(5px);
-            backdrop-filter:blur(5px);
-  }
-}
-.iui-skip-to-content-link:focus{
-  opacity:1;
-  transform:translateX(-50%) translateY(0);
-  box-shadow:0 6px 30px rgba(0, 0, 0, 0.25);
-}
-@media (prefers-reduced-motion: no-preference){
-  .iui-skip-to-content-link:focus{
-    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;
-  }
-}
-
-.iui-surface{
-  --iui-surface-background-color:var(--iui-color-background-1);
-  --iui-surface-border-radius:0;
-  --iui-surface-elevation:0 1px 5px rgba(0, 0, 0, 0.25);
-  background-color:var(--iui-surface-background-color);
-  border-radius:var(--iui-surface-border-radius);
-  box-shadow:var(--iui-surface-elevation);
-  box-sizing:border-box;
-  color:var(--iui-text-color);
-}
-@media (forced-colors: active){
-  .iui-surface{
-    border:1px solid transparent;
-  }
 }