nv-button {
  text-decoration: none;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-style: normal;
  font-weight: var(--font-weight-medium-emphasis);
  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;
  transition: background-color 150ms ease-out;
  user-select: none;
  cursor: pointer;
  height: fit-content;
  width: fit-content;
}
nv-button[size=xs] {
  padding: var(--button-xs-padding-y) var(--button-xs-padding-x);
  gap: var(--button-xs-gap);
  border-radius: var(--button-xs-border-radius);
  line-height: var(--button-xs-line-height);
  height: var(--button-xs-height);
  font-size: var(--button-xs-font-size);
}
nv-button[size=xs] nv-icon > svg {
  width: var(--spacing-3);
  height: var(--spacing-3);
  stroke-width: 1.2px;
}
nv-button[size=sm] {
  padding: var(--button-sm-padding-y) var(--button-sm-padding-x);
  gap: var(--button-sm-gap);
  border-radius: var(--button-sm-border-radius);
  line-height: var(--button-sm-line-height);
  height: var(--button-sm-height);
  font-size: var(--button-sm-font-size);
}
nv-button[size=sm] nv-icon > svg {
  width: var(--spacing-4);
  height: var(--spacing-4);
  stroke-width: 1.5px;
}
nv-button[size=md] {
  padding: var(--button-md-padding-y) var(--button-md-padding-x);
  gap: var(--button-md-gap);
  border-radius: var(--button-md-border-radius);
  line-height: var(--button-md-line-height);
  height: var(--button-md-height);
  font-size: var(--button-md-font-size);
}
nv-button[size=md] nv-icon > svg {
  width: var(--spacing-5);
  height: var(--spacing-5);
  stroke-width: 1.6px;
}
nv-button[size=lg] {
  padding: var(--button-lg-padding-y) var(--button-lg-padding-x);
  gap: var(--button-lg-gap);
  border-radius: var(--button-lg-border-radius);
  line-height: var(--button-lg-line-height);
  height: var(--button-lg-height);
  font-size: var(--button-lg-font-size);
}
nv-button[size=lg] nv-icon > svg {
  width: var(--spacing-6);
  height: var(--spacing-6);
  stroke-width: 1.8px;
}
nv-button[emphasis=high] {
  background: var(--components-button-high-background);
  border: 1px solid var(--components-button-high-border);
  color: var(--components-button-high-text);
}
nv-button[emphasis=high]:hover {
  background: var(--components-button-high-background-hover);
  border: 1px solid var(--components-button-high-border);
  color: var(--components-button-high-text-hover);
}
nv-button[emphasis=high]:active {
  background: var(--components-button-high-background-active);
  border: 1px solid var(--components-button-high-border-active);
  color: var(--components-button-high-text-active);
}
nv-button[emphasis=high]:focus, nv-button[emphasis=high]:focus-within {
  outline: none;
}
nv-button[emphasis=high]:focus-visible, nv-button[emphasis=high]:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[emphasis=high]:disabled:not([disabled=false]) {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
nv-button[emphasis=high][active]:not([active=false]) {
  background: var(--components-button-high-background-active);
  border: 1px solid var(--components-button-high-border-active);
  color: var(--components-button-high-text-active);
}
nv-button[emphasis=high][danger]:not([danger=false]) {
  background: var(--components-button-destructive-high-background);
  border: 1px solid transparent;
  color: var(--components-button-destructive-high-text);
}
nv-button[emphasis=high][danger]:not([danger=false]):hover {
  background: var(--components-button-destructive-high-background-hover);
  border: 1px solid transparent;
  color: var(--components-button-destructive-high-text-hover);
}
nv-button[emphasis=high][danger]:not([danger=false]):focus, nv-button[emphasis=high][danger]:not([danger=false]):focus-within {
  outline: none;
}
nv-button[emphasis=high][danger]:not([danger=false]):focus-visible, nv-button[emphasis=high][danger]:not([danger=false]):has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[emphasis=medium] {
  background: var(--components-button-medium-background);
  border: 1px solid var(--components-button-medium-border);
  color: var(--components-button-medium-text);
}
nv-button[emphasis=medium]:hover {
  background: var(--components-button-medium-background-hover);
  border: 1px solid var(--components-button-medium-border);
  color: var(--components-button-medium-text-hover);
}
nv-button[emphasis=medium]:active {
  background: var(--components-button-medium-background-active);
  border: 1px solid var(--components-button-medium-border-active);
  color: var(--components-button-medium-text-active);
}
nv-button[emphasis=medium]:focus, nv-button[emphasis=medium]:focus-within {
  outline: none;
}
nv-button[emphasis=medium]:focus-visible, nv-button[emphasis=medium]:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[emphasis=medium]:disabled:not([disabled=false]) {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
nv-button[emphasis=medium][active]:not([active=false]) {
  background: var(--components-button-medium-background-active);
  border: 1px solid var(--components-button-medium-border-active);
  color: var(--components-button-medium-text-active);
}
nv-button[emphasis=medium][danger]:not([danger=false]) {
  background: var(--components-button-destructive-medium-background);
  border: 1px solid var(--components-button-destructive-medium-border);
  color: var(--components-button-destructive-medium-text);
}
nv-button[emphasis=medium][danger]:not([danger=false]):hover {
  background: var(--components-button-destructive-medium-background-hover);
  border: 1px solid var(--components-button-destructive-medium-border);
  color: var(--components-button-destructive-medium-text-hover);
}
nv-button[emphasis=medium][danger]:not([danger=false]):focus, nv-button[emphasis=medium][danger]:not([danger=false]):focus-within {
  outline: none;
}
nv-button[emphasis=medium][danger]:not([danger=false]):focus-visible, nv-button[emphasis=medium][danger]:not([danger=false]):has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[emphasis=low] {
  background: var(--components-button-low-background);
  border: 1px solid var(--components-button-low-border);
  color: var(--components-button-low-text);
}
nv-button[emphasis=low]:hover {
  background: var(--components-button-low-background-hover);
  border: 1px solid var(--components-button-low-border);
  color: var(--components-button-low-text-hover);
}
nv-button[emphasis=low]:active {
  background: var(--components-button-low-background-active);
  border: 1px solid var(--components-button-low-border-active);
  color: var(--components-button-low-text-active);
}
nv-button[emphasis=low]:focus, nv-button[emphasis=low]:focus-within {
  outline: none;
}
nv-button[emphasis=low]:focus-visible, nv-button[emphasis=low]:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[emphasis=low]:disabled:not([disabled=false]) {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
nv-button[emphasis=low][active]:not([active=false]) {
  background: var(--components-button-low-background-active);
  border: 1px solid var(--components-button-low-border-active);
  color: var(--components-button-low-text-active);
}
nv-button[emphasis=low][danger]:not([danger=false]) {
  background: var(--components-button-destructive-low-background);
  border: 1px solid var(--components-button-destructive-low-border);
  color: var(--components-button-destructive-low-text);
}
nv-button[emphasis=low][danger]:not([danger=false]):hover {
  background: var(--components-button-destructive-low-background-hover);
  border: 1px solid var(--components-button-destructive-low-border);
  color: var(--components-button-destructive-low-text-hover);
}
nv-button[emphasis=low][danger]:not([danger=false]):focus, nv-button[emphasis=low][danger]:not([danger=false]):focus-within {
  outline: none;
}
nv-button[emphasis=low][danger]:not([danger=false]):focus-visible, nv-button[emphasis=low][danger]:not([danger=false]):has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[emphasis=lower] {
  background: var(--components-button-lower-background);
  border: 1px solid var(--components-button-lower-border);
  color: var(--components-button-lower-text);
}
nv-button[emphasis=lower]:hover {
  background: var(--components-button-lower-background-hover);
  border: 1px solid var(--components-button-lower-border);
  color: var(--components-button-lower-text-hover);
}
nv-button[emphasis=lower]:active {
  background: var(--components-button-lower-background-active);
  border: 1px solid var(--components-button-lower-border-active);
  color: var(--components-button-lower-text-active);
}
nv-button[emphasis=lower]:focus, nv-button[emphasis=lower]:focus-within {
  outline: none;
}
nv-button[emphasis=lower]:focus-visible, nv-button[emphasis=lower]:has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[emphasis=lower]:disabled:not([disabled=false]) {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}
nv-button[emphasis=lower][active]:not([active=false]) {
  background: var(--components-button-lower-background-active);
  border: 1px solid var(--components-button-lower-border-active);
  color: var(--components-button-lower-text-active);
}
nv-button[emphasis=lower][danger]:not([danger=false]) {
  background: var(--components-button-destructive-lower-background);
  border: 1px solid var(--components-button-destructive-lower-border);
  color: var(--components-button-destructive-lower-text);
}
nv-button[emphasis=lower][danger]:not([danger=false]):hover {
  background: var(--components-button-destructive-lower-background-hover);
  border: 1px solid var(--components-button-destructive-lower-border);
  color: var(--components-button-destructive-lower-text-hover);
}
nv-button[emphasis=lower][danger]:not([danger=false]):focus, nv-button[emphasis=lower][danger]:not([danger=false]):focus-within {
  outline: none;
}
nv-button[emphasis=lower][danger]:not([danger=false]):focus-visible, nv-button[emphasis=lower][danger]:not([danger=false]):has(:focus-visible) {
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
  outline-offset: calc(var(--focus-outline-offset) * 1);
}
nv-button[fluid]:not([fluid=false]) {
  width: 100%;
}
nv-button[loading]:not([loading=false]) [slot=leading-icon] {
  display: none;
}