/* Untitled UI Icons v39 — one visual language for every generic interface icon. */
.ui-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  background-color: currentColor;
  -webkit-mask-image: var(--ui-icon);
  mask-image: var(--ui-icon);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  vertical-align: middle;
  pointer-events: none;
}

.icon.ui-icon {
  width: 18px;
  height: 18px;
  fill: initial;
  stroke: initial;
}

/* Primary navigation keeps the current type-led composition. */
.nav-link > .ui-icon {
  display: none;
}

.user-menu > .ui-icon {
  width: 17px;
  height: 17px;
  color: #77777e;
}

.view-tab > .ui-icon {
  width: 19px;
  height: 19px;
}

.button > .ui-icon,
.dashboard-asset-link > .ui-icon {
  width: 17px;
  height: 17px;
}

.dashboard-asset-link > .ui-icon {
  width: 16px;
  height: 16px;
}

.dashboard-metrics .metric-icon > .ui-icon {
  width: 20px;
  height: 20px;
}

.search-wrap > .ui-icon {
  width: 20px;
  height: 20px;
  color: #686868;
}

.icon-button > .ui-icon,
.portal-dialog-close > .ui-icon,
.identity-dialog-close > .ui-icon {
  width: 16px;
  height: 16px;
}

.pill .ui-icon {
  width: 16px;
  height: 16px;
}

.favorite-btn .ui-icon,
.recent-icon .ui-icon {
  width: 18px;
  height: 18px;
}

.favorite-btn.active .ui-icon {
  color: #facc15;
}

.category-row-label .ui-icon {
  width: 24px;
  height: 24px;
}

.identity-option-state .ui-icon,
.agent-copy-status .ui-icon {
  width: 18px;
  height: 18px;
}

.mcp-saved-mark .ui-icon {
  width: 26px;
  height: 26px;
}

.play-button .ui-icon,
.terminal .ui-icon,
.wand .ui-icon,
.sheet-actions .ui-icon,
.reader-back .ui-icon,
.workflow-source-link .ui-icon,
.workflow-resource .ui-icon,
.markdown-video-play .ui-icon {
  width: 18px;
  height: 18px;
}

.workflow-checklist .ui-icon {
  width: 20px;
  height: 20px;
}

@media (max-width: 980px) {
  .user-menu > .ui-icon,
  .view-tab > .ui-icon {
    display: none;
  }

  .upload-button > .ui-icon {
    width: 13px;
    height: 13px;
  }
}

@media (max-width: 720px) {
  .upload-button > .ui-icon {
    width: 17px;
    height: 17px;
    color: var(--primary-foreground);
  }
}
