.o-ui {
    --o-ui-button-height-sm: var(--o-ui-global-scale-golf);
    --o-ui-button-height-md: var(--o-ui-global-scale-hotel);
    --o-ui-button-loading-spinner-background: rgba(256, 256, 256, 0.5);
}

/* SHARED */
.o-ui-button {
    padding: 0;
    line-height: var(--o-ui-global-line-height-1);
    cursor: pointer;
    outline: none;
    font-variation-settings: "wght" 500;
    transition: all var(--o-ui-easing-duration-2) var(--o-ui-easing-productive);
    border: none;
    position: relative;
    width: max-content;
}

/* STATES | FOCUS */
.o-ui-button:focus-visible,
.o-ui-button-focus {
    z-index: 2;
}

/* STATES | FOCUS | FOCUS RING */
.o-ui-button:after {
    opacity: 0;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    position: absolute;
    box-shadow: 0 0 0 var(--o-ui-focus-ring-thickness-md) var(--o-ui-focus-ring-color);
    border-radius: inherit;
    transition: var(--o-ui-focus-ring-transition);
}

/* TEXT */
.o-ui-button-text {
    flex-grow: 1;
}

/* ANCHOR */
a.o-ui-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-decoration: none;
}

/* SIZES */
.o-ui-button-sm {
    min-height: var(--o-ui-button-height-sm);
}

.o-ui-button-md {
    min-height: var(--o-ui-button-height-md);
}

/* SOLID */
.o-ui-button-solid {
    color: var(--o-ui-global-white);
    background-color: var(--o-ui-alias-background-5);
}

/* SOLID | STATE | HOVER */
.o-ui-button-solid:not([disabled]):hover,
.o-ui-button-solid:not([disabled]).o-ui-button-hover {
    background-color: var(--o-ui-alias-background-5-hover);
}

/* SOLID | STATE | FOCUS */
.o-ui-button-solid:focus-visible:after,
.o-ui-button-solid:not([disabled]).o-ui-button-focus:after {
    opacity: 1;
}

/* SOLID | STATE | ACTIVE */
.o-ui-button-solid:active,
.o-ui-button-solid:not([disabled]).o-ui-button-active {
    background-color: var(--o-ui-alias-background-5-active);
}

/* SOLID | PRIMARY */
.o-ui-button-solid.o-ui-button-primary {
    background-color: var(--o-ui-alias-background-primary-1);
}

/* SOLID | PRIMARY | HOVER */
.o-ui-button-solid:not([disabled]).o-ui-button-primary:hover,
.o-ui-button-solid:not([disabled]).o-ui-button-primary.o-ui-button-hover {
    background-color: var(--o-ui-alias-background-primary-1-hover);
}

/* SOLID | PRIMARY | FOCUS */
.o-ui-button-solid.o-ui-button-primary:focus-visible,
.o-ui-button-solid:not([disabled]).o-ui-button-primary.o-ui-button-focus {
    background-color: var(--o-ui-alias-background-primary-1);
}

/* SOLID | PRIMARY | HOVER | FOCUS */
.o-ui-button-solid.o-ui-button-primary:hover:focus-visible,
.o-ui-button-solid.o-ui-button-primary.o-ui-button-hover.o-ui-button-focus {
    background-color: var(--o-ui-alias-background-primary-1-hover);
}

/* SOLID | PRIMARY | ACTIVE | FOCUS */
.o-ui-button-solid.o-ui-button-primary:active:focus-visible,
.o-ui-button-solid:not([disabled]).o-ui-button-primary.o-ui-button-active.o-ui-button-focus {
    background-color: var(--o-ui-alias-background-primary-1-active);
}

/* SOLID | PRIMARY | ACTIVE */
.o-ui-button-solid.o-ui-button-primary:active,
.o-ui-button-solid:not([disabled]).o-ui-button-primary.o-ui-button-active {
    background-color: var(--o-ui-alias-background-primary-1-active);
}

/* SOLID | SECONDARY */
.o-ui-button-solid.o-ui-button-secondary {
    background-color: var(--o-ui-alias-background-2);
    color: var(--o-ui-alias-text-1);
}

/* SOLID | SECONDARY | HOVER */
.o-ui-button-solid:not([disabled]).o-ui-button-secondary:hover,
.o-ui-button-solid:not([disabled]).o-ui-button-secondary.o-ui-button-hover {
    background-color: var(--o-ui-alias-background-2-hover);
}

/* SOLID | SECONDARY | ACTIVE */
.o-ui-button-solid.o-ui-button-secondary:active,
.o-ui-button-solid:not([disabled]).o-ui-button-secondary.o-ui-button-active {
    background-color: var(--o-ui-alias-background-2-active);
    color: var(--o-ui-global-white);
}

/* SOLID | DANGER */
.o-ui-button-solid.o-ui-button-danger {
    background-color: var(--o-ui-alias-background-negative-1);
}

/* SOLID | DANGER | HOVER */
.o-ui-button-solid.o-ui-button-danger:hover,
.o-ui-button-solid:not([disabled]).o-ui-button-danger.o-ui-button-hover {
    background-color: var(--o-ui-alias-background-negative-1-hover);
}

/* SOLID | DANGER | ACTIVE */
.o-ui-button-solid.o-ui-button-danger:active,
.o-ui-button-solid:not([disabled]).o-ui-button-danger.o-ui-button-active {
    background-color: var(--o-ui-alias-background-negative-1-active);
}

/* OUTLINE */
.o-ui-button-outline {
    border: none;
    background-color: var(--o-ui-global-transparent);
    color: var(--o-ui-alias-text-2);
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-4) inset;
}

/* OUTLINE | HOVER */
.o-ui-button-outline:not([disabled]):hover,
.o-ui-button-outline:not([disabled]).o-ui-button-hover {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-4-hover) inset;
    color: var(--o-ui-alias-text-2-hover);
}

/* OUTLINE | FOCUS */
.o-ui-button-outline:focus-visible:after,
.o-ui-button-outline:not([disabled]).o-ui-button-focus:after {
    opacity: 1;
}

/* OUTLINE | ACTIVE */
.o-ui-button-outline:active,
.o-ui-button-outline:not([disabled]).o-ui-button-active {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-4) inset;
    color: var(--o-ui-global-white);
    background-color: var(--o-ui-alias-background-5);
}

/* OUTLINE | PRIMARY */
.o-ui-button-outline.o-ui-button-primary {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-primary-1) inset;
    color: var(--o-ui-alias-text-primary-1);
}

/* OUTLINE | PRIMARY | HOVER */
.o-ui-button-outline:not([disabled]).o-ui-button-primary:hover,
.o-ui-button-outline:not([disabled]).o-ui-button-primary.o-ui-button-hover {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-primary-1-hover) inset;
    color: var(--o-ui-alias-text-primary-1-hover);
}

/* OUTLINE | PRIMARY | ACTIVE */
.o-ui-button-outline.o-ui-button-primary:active,
.o-ui-button-outline:not([disabled]).o-ui-button-primary.o-ui-button-active {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-primary-1) inset;
    color: var(--o-ui-global-white);
    background-color: var(--o-ui-alias-background-primary-1);
}

/* OUTLINE | PRIMARY | ACTIVE | FOCUS */
.o-ui-button-outline.o-ui-button-primary:active:focus,
.o-ui-button-outline:not([disabled]).o-ui-button-primary.o-ui-button-active.o-ui-button-focus {
    color: var(--o-ui-global-white);
}

/* OUTLINE | SECONDARY */
.o-ui-button-outline.o-ui-button-secondary {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-3) inset;
    color: var(--o-ui-alias-text-3);
}

/* OUTLINE | SECONDARY | HOVER */
.o-ui-button-outline:not([disabled]).o-ui-button-secondary:hover,
.o-ui-button-outline:not([disabled]).o-ui-button-secondary.o-ui-button-hover {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-1-hover) inset;
    color: var(--o-ui-alias-text-3);
}

/* OUTLINE | SECONDARY | ACTIVE */
.o-ui-button-outline.o-ui-button-secondary:active,
.o-ui-button-outline:not([disabled]).o-ui-button-secondary.o-ui-button-active {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-1-active) inset;
    background-color: var(--o-ui-alias-background-2-active);
    color: var(--o-ui-global-white);
}

/* OUTLINE | SECONDARY | ACTIVE | FOCUS */
.o-ui-button-outline.o-ui-button-secondary:active:focus,
.o-ui-button-outline:not([disabled]).o-ui-button-secondary.o-ui-button-active.o-ui-button-focus {
    color: var(--o-ui-global-white);
}

/* OUTLINE | DANGER */
.o-ui-button-outline.o-ui-button-danger {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-negative-1) inset;
    color: var(--o-ui-alias-text-negative-1);
}

/* OUTLINE | DANGER | HOVER */
.o-ui-button-outline:not([disabled]).o-ui-button-danger:hover,
.o-ui-button-outline:not([disabled]).o-ui-button-danger.o-ui-button-hover {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-negative-1-hover) inset;
    color: var(--o-ui-alias-text-negative-1);
}

/* OUTLINE | DANGER | ACTIVE */
.o-ui-button-outline.o-ui-button-danger:active,
.o-ui-button-outline:not([disabled]).o-ui-button-danger.o-ui-button-active {
    box-shadow: 0 0 0 1px var(--o-ui-alias-border-negative-1) inset;
    color: var(--o-ui-global-white);
    background-color: var(--o-ui-alias-border-negative-1);
}

/* OUTLINE | DANGER | ACTIVE | FOCUS */
.o-ui-button-outline.o-ui-button-danger:active:focus,
.o-ui-button-outline:not([disabled]).o-ui-button-danger.o-ui-button-active.o-ui-button-focus {
    color: var(--o-ui-global-white);
}

/* GHOST */
.o-ui-button-ghost {
    background-color: var(--o-ui-global-transparent);
    border: none;
    color: var(--o-ui-alias-text-2);
}

/* GHOST | HOVER */
.o-ui-button-ghost:not([disabled]):hover,
.o-ui-button-ghost:not([disabled]).o-ui-button-hover {
    background-color: rgba(0, 0, 0, 0.04);
}

/* GHOST | HOVER | DARK MODE */
.o-ui-dark-color-scheme .o-ui-button-ghost:not([disabled]).:hover,
.o-ui-dark-color-scheme .o-ui-button-ghost:not([disabled])..o-ui-button-hover {
    background-color: rgba(256, 256, 256, 0.04);
}

/* GHOST | LOADING */
.o-ui-button-ghost.o-ui-button-loading {
    background-color: rgba(0, 0, 0, 0.04);
}

/* GHOST | LOADING | DARK MODE */
.o-ui-dark-color-scheme .o-ui-button-ghost.o-ui-button-loading {
    background-color: rgba(256, 256, 256, 0.04);
}

/* GHOST | FOCUS */
.o-ui-button-ghost:after {
    top: calc(var(--o-ui-focus-ring-outset-inner-offset));
    left: calc(var(--o-ui-focus-ring-outset-inner-offset));
    right: calc(var(--o-ui-focus-ring-outset-inner-offset));
    bottom: calc(var(--o-ui-focus-ring-outset-inner-offset));
}

.o-ui-button-ghost:focus-visible:after,
.o-ui-button-ghost:not([disabled]).o-ui-button-focus:after {
    opacity: 1;
}

/* GHOST | ACTIVE */
.o-ui-button-ghost:active,
.o-ui-button-ghost:not([disabled]).o-ui-button-active {
    color: var(--o-ui-alias-text-2-active);
}

/* GHOST | PRIMARY */
.o-ui-button-ghost.o-ui-button-primary {
    color: var(--o-ui-alias-text-primary-1);
}

/* GHOST | PRIMARY | ACTIVE */
.o-ui-button-ghost.o-ui-button-primary:active,
.o-ui-button-ghost:not([disabled]).o-ui-button-active.o-ui-button-primary {
    color: var(--o-ui-alias-text-primary-1-active);
}

/* GHOST | SECONDARY */
.o-ui-button-ghost.o-ui-button-secondary {
    color: var(--o-ui-alias-text-4);
}

/* GHOST | SECONDARY | ACTIVE */
.o-ui-button-ghost.o-ui-button-secondary:active,
.o-ui-button-ghost:not([disabled]).o-ui-button-active.o-ui-button-secondary {
    color: var(--o-ui-alias-text-4-active);
}

/* GHOST | DANGER */
.o-ui-button-ghost.o-ui-button-danger {
    color: var(--o-ui-alias-text-negative-1);
}

/* GHOST | DANGER | ACTIVE */
.o-ui-button-ghost.o-ui-button-danger:active,
.o-ui-button-ghost:not([disabled]).o-ui-button-active.o-ui-button-danger {
    color: var(--o-ui-alias-text-negative-1-active);
}

/* FLUID */
.o-ui-button-fluid {
    width: 100%;
}

/* LOADING */
.o-ui-button-loading {
    position: relative;
}

.o-ui-button-loading:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50px;
    border: 2px solid var(--o-ui-global-marine-200);
    border-top-color: var(--o-ui-global-white);
    animation: o-ui-button-spinner 1s linear infinite;
    transform: translate(-50%, -50%) rotate(0deg);
}

@keyframes o-ui-button-spinner {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/* LOADING | ELEMENTS */
.o-ui-button-loading > * {
    visibility: hidden;
}

/* LOADING | SIZES */
.o-ui-button-loading.o-ui-button-sm:before {
    width: 1.25rem;
    height: 1.25rem;
}

.o-ui-button-loading.o-ui-button-md:before {
    width: 1.5rem;
    height: 1.5rem;
}

/* SOLID | LOADING | PRIMARY */
.o-ui-button-loading.o-ui-button-solid.o-ui-button-primary:before {
    border: 2px solid var(--o-ui-button-loading-spinner-background);
    border-top-color: var(--o-ui-global-white);
}

.o-ui-button-loading.o-ui-button-solid.o-ui-button-secondary:before {
    border: 2px solid var(--o-ui-global-cloud-500);
    border-top-color: var(--o-ui-alias-text-1);
}

.o-ui-button-loading.o-ui-button-solid.o-ui-button-danger:before {
    border: 2px solid var(--o-ui-button-loading-spinner-background);
    border-top-color: var(--o-ui-global-white);
}

/* OUTLINE | LOADING | PRIMARY */
.o-ui-button-loading.o-ui-button-outline:before {
    border: 2px solid var(--o-ui-global-marine-100);
    border-top-color: var(--o-ui-global-marine-300);
}

/* OUTLINE | LOADING | PRIMARY */
.o-ui-button-loading.o-ui-button-outline.o-ui-button-primary:before {
    border: 2px solid var(--o-ui-alias-primary-100);
    border-top-color: var(--o-ui-alias-border-primary-1);
}

/* OUTLINE | LOADING | SECONDARY */
.o-ui-button-loading.o-ui-button-outline.o-ui-button-secondary:before {
    border: 2px solid var(--o-ui-alias-border-1);
    border-top-color: var(--o-ui-global-cloud-500);
}

/* OUTLINE | LOADING | DANGER */
.o-ui-button-loading.o-ui-button-outline.o-ui-button-danger:before {
    border: 2px solid var(--o-ui-global-beetle-100);
    border-top-color: var(--o-ui-alias-border-negative-1);
}

/* GHOST | LOADING | PRIMARY */
.o-ui-button-loading.o-ui-button-ghost:before {
    border: 2px solid var(--o-ui-global-marine-100);
    border-top-color: var(--o-ui-global-marine-300);
}

/* GHOST | LOADING | PRIMARY */
.o-ui-button-loading.o-ui-button-ghost.o-ui-button-primary:before {
    border: 2px solid var(--o-ui-alias-primary-100);
    border-top-color: var(--o-ui-alias-border-primary-1);
}

/* GHOST | LOADING | SECONDARY */
.o-ui-button-loading.o-ui-button-ghost.o-ui-button-secondary:before {
    border: 2px solid var(--o-ui-alias-border-1);
    border-top-color: var(--o-ui-global-cloud-500);
}

/* GHOST | LOADING | DANGER */
.o-ui-button-loading.o-ui-button-ghost.o-ui-button-danger:before {
    border: 2px solid var(--o-ui-global-beetle-100);
    border-top-color: var(--o-ui-alias-border-negative-1);
}

/* DISABLED */
.o-ui-button[disabled],
.o-ui-button-disabled {
    opacity: var(--o-ui-disabled-opacity);
    cursor: not-allowed;
}

/* PILL */
.o-ui-button-pill {
    border-radius: var(--o-ui-shape-pill);
}

/* CIRCULAR */
.o-ui-button-circular {
    border-radius: var(--o-ui-shape-circular);
}

/* CIRCULAR | SIZES */
.o-ui-button-circular.o-ui-button-sm {
    min-width: var(--o-ui-global-scale-golf);
    padding: 0 var(--o-ui-global-scale-alpha);
}

.o-ui-button-circular.o-ui-button-md {
    min-width: var(--o-ui-global-scale-hotel);
    padding: 0 var(--o-ui-global-scale-alpha);
}

/* ROUNDED */
.o-ui-button-rounded {
    border-radius: var(--o-ui-shape-rounded);
}

/* INHERIT */
/* INHERIT | GHOST */
.o-ui-button-inherit-color.o-ui-button-ghost {
    color: inherit;
}

.o-ui-button-inherit-color.o-ui-button-loading.o-ui-button-ghost::before {
    border-color: hsla(0, 0%, 0%, 0.25);
    border-top-color: currentColor;
}

/* GHOST | INHERIT | ACTIVE */
.o-ui-button-ghost.o-ui-button-inherit-color:active,
.o-ui-button-ghost:not([disabled]).o-ui-button-active.o-ui-button-inherit-color {
    color: inherit;
}

/* INHERIT | OUTLINE */
.o-ui-button-inherit-color.o-ui-button-outline {
    color: inherit;
    box-shadow: 0 0 0 1px currentColor inset;
}

.o-ui-button:hover.o-ui-button-inherit-color.o-ui-button-outline,
.o-ui-button-hover.o-ui-button-inherit-color.o-ui-button-outline {
    background-color: rgba(0, 0, 0, 0.04);
    color: inherit;
    box-shadow: 0 0 0 1px currentColor inset;
}

/* INHERIT | OUTLINE | ACTIVE */
.o-ui-button:active.o-ui-button-inherit-color.o-ui-button-outline,
.o-ui-button-active.o-ui-button-inherit-color.o-ui-button-outline {
    background-color: currentColor;
    color: inherit;
    box-shadow: 0 0 0 1px currentColor inset;
}

.o-ui-button:active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-text,
.o-ui-button-active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-text,
.o-ui-button:active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-end-icon,
.o-ui-button-active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-end-icon,
.o-ui-button:active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-start-icon,
.o-ui-button-active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-start-icon,
.o-ui-button-active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-counter,
.o-ui-button:active.o-ui-button-inherit-color.o-ui-button-outline .o-ui-button-counter {
    color: var(--o-ui-global-white);
}

/* INHERIT | OUTLINE | LOADING */
.o-ui-button-inherit-color.o-ui-button-loading.o-ui-button-outline::before {
    border-color: rgba(0, 0, 0, 0.25);
    border-top-color: currentColor;
}

/* INHERIT | SOLID */
.o-ui-button-inherit-color.o-ui-button-solid {
    color: inherit;
    background-color: currentColor;
}

.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-start-icon,
.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-end-icon {
    fill: var(--o-ui-global-white);
    opacity: .9;
}

.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-text {
    color: var(--o-ui-global-white);
    opacity: .9;
}

.o-ui-button:hover.o-ui-button-inherit-color.o-ui-button-solid,
.o-ui-button-hover:not([disabled]).o-ui-button-inherit-color.o-ui-button-solid {
    background-color: currentColor;
}

.o-ui-button:hover.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-text,
.o-ui-button-hover.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-text,
.o-ui-button:hover.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-start-icon,
.o-ui-button-hover.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-start-icon,
.o-ui-button:hover.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-end-icon,
.o-ui-button-hover.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-end-icon {
    opacity: 1;
}

.o-ui-button:active.o-ui-button-inherit-color.o-ui-button-solid,
.o-ui-button-active:not([disabled]).o-ui-button-inherit-color.o-ui-button-solid {
    background-color: currentColor;
}

.o-ui-button-inherit-color.o-ui-button-loading.o-ui-button-solid::before {
    border-color: rgba(255, 255, 255, 0.1);
    border-top-color: var(--o-ui-global-white);
}

/* INHERIT | SOLID | COUNTER */
.o-ui-button-inherit-color.o-ui-button-solid .o-ui-button-counter {
    color: var(--o-ui-global-white) !important;
    opacity: .9;
}

.o-ui-button:hover.o-ui-button-solid .o-ui-button-counter,
.o-ui-button-hover:not([disabled]).o-ui-button-solid .o-ui-button-counter {
    opacity: 1;
}