.dds-base-button{cursor:pointer}.dds-button{box-sizing:border-box;display:inline-flex;align-items:center;text-decoration:none;border-style:solid;height:var(--dimension-button-m);border-radius:var(--border-radius-button-default);font:var(--typography-button-m);padding:0 calc(var(--spacing-button-padding-x-m) - var(--border-width-button-default));border-width:var(--border-width-button-default);transition:var(--movement-transition-default);&:hover{cursor:pointer}&:focus,&:focus-visible{box-shadow:var(--drop-shadow-button-focus);outline:none}&:disabled,&:disabled:hover{pointer-events:none}&.dds-button--error{box-shadow:var(--drop-shadow-button-error)}}.dds-button--primary{background-color:var(--color-button-bg-primary-default);color:var(--color-button-text-primary-default);border-color:var(--color-button-border-primary-default);svg{fill:var(--color-button-text-primary-default)}&:hover{background:var(--color-button-bg-primary-hover);color:var(--color-button-text-primary-default)}&:active{background-color:var(--color-button-bg-primary-pressed);box-shadow:none}&:disabled,&:disabled:hover{background-color:var(--color-button-bg-primary-disabled);color:var(--color-button-text-primary-disabled);border-color:var(--color-button-border-primary-disabled)}&.dds-button--success{background:var(--color-button-bg-primary-success);color:var(--color-button-text-primary-success);border-color:var(--color-button-border-primary-success)}}.dds-button--secondary{background-color:var(--color-button-bg-secondary-default);color:var(--color-button-text-secondary-default);border-color:var(--color-button-border-secondary-default);svg{fill:var(--color-button-text-secondary-default)}&:hover{background-color:var(--color-button-bg-secondary-hover);color:var(--color-button-text-secondary-default)}&:active{background-color:var(--color-button-bg-secondary-pressed)}&:disabled,&:disabled:hover{background-color:var(--color-button-bg-secondary-disabled);color:var(--color-button-text-secondary-disabled);border-color:var(--color-button-text-secondary-disabled)}}.dds-button--tertiary{background-color:var(--color-button-bg-tertiary-default);color:var(--color-button-text-tertiary-default);border-color:var(--color-button-border-tertiary-default);svg{fill:var(--color-button-text-tertiary-default)}&:hover{background-color:var(--color-button-bg-tertiary-hover);color:var(--color-button-text-tertiary-default)}&:active,&:hover{border-color:var(--color-button-border-tertiary-default)}&:active{background-color:var(--color-button-bg-tertiary-pressed)}&:disabled,&:disabled:hover{background-color:var(--color-button-bg-tertiary-disabled);color:var(--color-button-text-tertiary-disabled);border-color:var(--color-button-border-tertiary-disabled)}}.dds-button--subtle{background-color:var(--color-button-bg-subtle-default);color:var(--color-button-text-subtle-default);border-color:var(--color-button-border-subtle-default);svg{fill:var(--color-button-text-subtle-default)}&:hover{background-color:var(--color-button-bg-subtle-hover);color:var(--color-button-text-subtle-default)}&:active,&:hover{border-color:var(--color-button-border-subtle-default)}&:active{background-color:var(--color-button-bg-subtle-pressed)}&:disabled,&:disabled:hover{background-color:var(--color-button-bg-subtle-disabled);color:var(--color-button-text-subtle-disabled);border-color:var(--color-button-border-subtle-disabled)}}.dds-button--control{background-color:var(--color-button-bg-control-default);color:var(--color-button-text-control-default);border-color:var(--color-button-border-control-default);border-radius:var(--border-radius-button-control);&:hover{background-color:var(--color-button-bg-control-hover);color:var(--color-button-text-control-default);border-color:var(--color-button-border-control-default)}&:active{background-color:var(--color-button-bg-control-pressed);border-width:var(--border-width-button-default)}&:disabled,&:disabled:hover{background-color:var(--color-button-bg-control-disabled);color:var(--color-button-text-control-disabled);border-color:var(--color-button-border-control-disabled)}&.dds-button--selected{pointer-events:none;background-color:var(--color-button-bg-control-selected);border-color:var(--color-button-border-control-selected)}}.dds-button__icon{width:var(--dimension-button-m);justify-content:center;padding:0;&.dds-button--extra-small{width:var(--dimension-button-xs);padding:0}&.dds-button--small{width:var(--dimension-button-s);padding:0}&.dds-button--large{width:var(--dimension-button-l);padding:0}}.dds-button__with-icon{width:auto;padding:0 calc(var(--spacing-button-padding-x-m) - var(--border-width-button-default));&.dds-button--extra-small,&.dds-button--large,&.dds-button--small{width:auto}&.dds-button--extra-small{padding:0 calc(var(--spacing-button-padding-x-xs) - var(--border-width-button-default))}&.dds-button--small{padding:0 calc(var(--spacing-button-padding-x-s) - var(--border-width-button-default))}&.dds-button--large{padding:0 calc(var(--spacing-button-padding-x-l) - var(--border-width-button-default))}}.dds-button--extra-small{height:var(--dimension-button-xs);padding:0 calc(var(--spacing-button-padding-x-xs) - var(--border-width-button-default));font:var(--typography-button-xs)}.dds-button--small{height:var(--dimension-button-s);padding:0 calc(var(--spacing-button-padding-x-s) - var(--border-width-button-default));font:var(--typography-button-s)}.dds-button--large{height:var(--dimension-button-l);padding:0 calc(var(--spacing-button-padding-x-l) - var(--border-width-button-default))}.dds-button__prefix,.dds-button__suffix{display:inline-flex}.dds-button__prefix{margin-right:var(--spacing-button-margin)}.dds-button__suffix{margin-left:var(--spacing-button-margin)}