/* Public website button contract. Opt in per page; sizes are minimum heights. */
.ut-button{box-sizing:border-box;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;max-width:100%;padding:10px 24px;border:1px solid transparent;border-radius:var(--ut-radius-control);background:var(--ut-action);color:var(--ut-action-text);font:500 14px/1.4 var(--ut-font);text-align:center;text-decoration:none;white-space:normal;cursor:pointer;transition:background-color var(--ut-motion),border-color var(--ut-motion),color var(--ut-motion)}
.ut-button:hover{background:var(--ut-action-hover)}
.ut-button:active{background:var(--ut-action-active)}
.ut-button--secondary,.ut-button--icon,.ut-button--destructive{background:transparent;border-color:var(--ut-border);color:var(--ut-ink)}
.ut-button--ghost{background:transparent;color:var(--ut-ink)}
.ut-button:is(.ut-button--secondary,.ut-button--ghost,.ut-button--icon):hover{background:var(--ut-hover)}
.ut-button:is(.ut-button--secondary,.ut-button--ghost,.ut-button--icon):active{background:var(--ut-pressed)}
.ut-button--destructive:hover{background:var(--ut-danger-surface);border-color:var(--ut-danger);color:var(--ut-danger)}
.ut-button--destructive:active{background:var(--ut-danger-active);color:var(--ut-danger)}
.ut-button:focus-visible{outline:2px solid var(--ut-focus);outline-offset:2px}
.ut-button--large{min-height:52px;padding:13px 24px;font-size:16px}
.ut-button--small{min-height:36px;padding:7px 24px;font-size:13px}
.ut-button--icon{width:44px;padding:10px;flex-shrink:0}
.ut-button:disabled,.ut-button[aria-disabled="true"]{background:var(--ut-disabled);border-color:transparent;color:var(--ut-muted);cursor:not-allowed;box-shadow:none}
.ut-button[aria-busy="true"]{cursor:progress}
.ut-button[aria-busy="true"]::before{content:"";position:absolute;inset-inline-start:6px;top:calc(50% - 7px);width:14px;height:14px;box-sizing:border-box;border:1.5px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:ut-button-spin .8s linear infinite}
@keyframes ut-button-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.ut-button{transition:none}.ut-button[aria-busy="true"]::before{animation:none;border-style:dotted}}
@media(forced-colors:active){.ut-button{border:1px solid ButtonText}.ut-button:disabled{color:GrayText}.ut-button:focus-visible{outline-color:Highlight}}

.ut-button--icon[aria-busy="true"]{color:transparent}.ut-button--icon[aria-busy="true"]::before{inset-inline-start:calc(50% - 7px);color:var(--ut-muted)}.ut-button--icon[aria-busy="true"] svg{visibility:hidden}

@media(pointer:coarse){.ut-button--small{min-height:44px}}