@property --onyx-ripple-radius{syntax:"<percentage>";inherits:false;initial-value:0%}@layer onyx.component{.onyx-ripple{--onyx-ripple-color:var(--onyx-color-base-primary-600);border-radius:inherit;width:100%;height:100%;display:block;position:absolute;inset:0;overflow:hidden}.onyx-ripple__element{pointer-events:none;background:radial-gradient(circle at var(--onyx-ripple-left) var(--onyx-ripple-top), transparent var(--onyx-ripple-radius), var(--onyx-ripple-color) var(--onyx-ripple-radius));width:100%;height:100%;animation:onyx-ripple var(--onyx-duration-sm) cubic-bezier(0, 0, .2, 1) forwards;display:block;position:absolute}@media (prefers-reduced-motion){.onyx-ripple__element{animation:none}}@keyframes onyx-ripple{0%{--onyx-ripple-radius:0%}to{--onyx-ripple-radius:100%}}.onyx-button,.onyx-button-skeleton{--onyx-button-padding-vertical:var(--onyx-density-xs);--onyx-button-padding-inline:var(--onyx-density-sm);--onyx-button-border-radius:var(--onyx-radius-component-button)}.onyx-button{--onyx-button-background-color:transparent;--onyx-button-background-color-hover:transparent;--onyx-button-background-color-disabled:transparent;--onyx-button-text-color:transparent;--onyx-button-text-color-hover:var(--onyx-button-text-color);--onyx-button-text-color-disabled:transparent;--onyx-button-border-color:transparent;--onyx-button-border-color-hover:var(--onyx-button-border-color);--onyx-button-border-color-disabled:transparent;--onyx-button-outline-color:var(--onyx-color-component-focus-primary);--onyx-button-border-width:var(--onyx-1px-in-rem)}.onyx-button--primary.onyx-button--default{--onyx-button-background-color:var(--onyx-color-component-cta-default);--onyx-button-background-color-hover:var(--onyx-color-component-cta-default-hover);--onyx-button-background-color-disabled:var(--onyx-color-base-primary-200);--onyx-button-text-color:var(--onyx-color-text-icons-neutral-button);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-neutral-inverted);--onyx-button-border-color:var(--onyx-button-background-color);--onyx-button-border-color-hover:var(--onyx-button-background-color-hover);--onyx-button-border-color-disabled:var(--onyx-button-background-color-disabled)}.onyx-button--primary.onyx-button--outline{--onyx-button-background-color-hover:var(--onyx-color-base-primary-100);--onyx-button-text-color:var(--onyx-color-text-icons-primary-bold);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-primary-soft);--onyx-button-border-color:var(--onyx-color-base-primary-400);--onyx-button-border-color-disabled:var(--onyx-color-base-primary-200)}.onyx-button--primary.onyx-button--plain{--onyx-button-background-color-hover:var(--onyx-color-base-primary-100);--onyx-button-text-color:var(--onyx-color-text-icons-primary-bold);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-primary-soft)}.onyx-button--neutral{--onyx-button-outline-color:var(--onyx-color-component-focus-neutral)}.onyx-button--neutral.onyx-button--default{--onyx-button-background-color:var(--onyx-color-base-background-blank);--onyx-button-background-color-hover:var(--onyx-color-base-neutral-200);--onyx-button-background-color-disabled:var(--onyx-color-base-background-blank);--onyx-button-text-color:var(--onyx-color-text-icons-neutral-intense);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-neutral-soft);--onyx-button-border-color:var(--onyx-color-component-border-neutral);--onyx-button-border-color-disabled:var(--onyx-color-base-neutral-200)}.onyx-button--neutral.onyx-button--outline{--onyx-button-background-color-hover:var(--onyx-color-base-neutral-200);--onyx-button-text-color:var(--onyx-color-text-icons-neutral-bold);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-neutral-soft);--onyx-button-border-color:var(--onyx-color-component-border-neutral);--onyx-button-border-color-disabled:var(--onyx-color-base-neutral-200)}.onyx-button--neutral.onyx-button--plain{--onyx-button-background-color-hover:var(--onyx-color-base-neutral-200);--onyx-button-text-color:var(--onyx-color-text-icons-neutral-bold);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-neutral-soft)}.onyx-button--danger{--onyx-button-outline-color:var(--onyx-color-component-focus-danger)}.onyx-button--danger.onyx-button--default{--onyx-button-background-color:var(--onyx-color-base-danger-200);--onyx-button-background-color-hover:var(--onyx-color-base-danger-100);--onyx-button-background-color-disabled:var(--onyx-color-base-danger-100);--onyx-button-text-color:var(--onyx-color-text-icons-danger-bold);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-danger-medium);--onyx-button-border-color:var(--onyx-color-base-danger-500);--onyx-button-border-color-disabled:var(--onyx-color-base-danger-200)}.onyx-button--danger.onyx-button--outline{--onyx-button-background-color-hover:var(--onyx-color-base-danger-100);--onyx-button-text-color:var(--onyx-color-text-icons-danger-intense);--onyx-button-text-color-hover:var(--onyx-color-text-icons-danger-bold);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-danger-medium);--onyx-button-border-color:var(--onyx-color-base-danger-500);--onyx-button-border-color-disabled:var(--onyx-color-base-danger-200)}.onyx-button--danger.onyx-button--plain{--onyx-button-background-color-hover:var(--onyx-color-base-danger-100);--onyx-button-text-color:var(--onyx-color-text-icons-danger-bold);--onyx-button-text-color-disabled:var(--onyx-color-text-icons-danger-medium)}.onyx-button{width:max-content;max-width:100%;padding-inline:var(--onyx-button-padding-inline);padding-block:calc(var(--onyx-button-padding-vertical) - var(--onyx-button-border-width));justify-content:center;align-items:center;gap:var(--onyx-density-2xs);border-radius:var(--onyx-button-border-radius);cursor:pointer;font-family:var(--onyx-font-family-paragraph);background-color:var(--onyx-button-background-color);border:var(--onyx-button-border-width) solid var(--onyx-button-border-color);color:var(--onyx-button-text-color);display:inline-flex;position:relative}.onyx-button:focus-visible{outline:var(--onyx-outline-width) solid var(--onyx-button-outline-color)}.onyx-button:enabled:hover:not(:has(.onyx-ripple__element)){background-color:var(--onyx-button-background-color-hover);border-color:var(--onyx-button-border-color-hover);color:var(--onyx-button-text-color-hover)}.onyx-button:is(a):hover:not(:has(.onyx-ripple__element)){background-color:var(--onyx-button-background-color-hover);border-color:var(--onyx-button-border-color-hover);color:var(--onyx-button-text-color-hover)}.onyx-button:disabled{cursor:default}.onyx-button:disabled:not(.onyx-button--loading){background-color:var(--onyx-button-background-color-disabled);border-color:var(--onyx-button-border-color-disabled);color:var(--onyx-button-text-color-disabled)}.onyx-button__label{padding-inline:var(--onyx-density-2xs);font-size:var(--onyx-font-size-md);font-style:normal;font-weight:var(--onyx-font-weight-semibold);line-height:var(--onyx-font-line-height-md);position:relative}.onyx-button__icon{position:relative}.onyx-button--loading .onyx-button__label,.onyx-button--loading .onyx-button__icon{visibility:hidden}.onyx-button__loading{position:absolute}.onyx-button-skeleton{width:var(--onyx-density-4xl);height:calc(1.5rem + 2 * var(--onyx-button-padding-vertical));vertical-align:middle;border-radius:var(--onyx-button-border-radius);display:inline-block}.onyx-button .onyx-ripple{--onyx-ripple-color:var(--onyx-button-background-color-hover)}}