.button,.btn{--button-background: var(--jh-color-brand);--button-text-color: var(--jh-color-text-on-brand);--button-outline-color: var(--jh-color-brand);border-radius:var(--jh-radius-button);font-family:var(--jh-type-button-md-family);font-weight:var(--jh-type-button-md-weight);font-size:var(--jh-type-button-md-size);line-height:var(--jh-type-button-md-leading);letter-spacing:var(--jh-type-button-md-tracking);padding-block:calc((var(--jh-size-control-md) - var(--jh-type-button-md-leading)) / 2);padding-inline:var(--jh-space-lg)}.button .text-with-icon{gap:var(--jh-space-xs)}.button .text-with-icon>.jh-icon{margin-block:calc((1lh - var(--jh-icon-size, var(--jh-size-icon-md))) / 2)}.button--sm{font-size:var(--jh-type-button-sm-size);line-height:var(--jh-type-button-sm-leading);padding-block:calc((var(--jh-size-control-sm) - var(--jh-type-button-sm-leading)) / 2);padding-inline:var(--jh-space-md)}.button--lg{font-size:var(--jh-type-button-lg-size);line-height:var(--jh-type-button-lg-leading);padding-block:calc((var(--jh-size-control-lg) - var(--jh-type-button-lg-leading)) / 2);padding-inline:var(--jh-space-xl)}.button--xl{font-size:var(--jh-type-button-xl-size);line-height:var(--jh-type-button-xl-leading);padding-block:calc((var(--jh-size-control-xl) - var(--jh-type-button-xl-leading)) / 2);padding-inline:var(--jh-space-2xl)}.button--secondary{--button-text-color: var(--jh-color-brand);background-color:transparent;box-shadow:inset 0 0 0 var(--jh-border-md) rgb(var(--jh-color-brand))}.button--subdued{--button-text-color: var(--jh-color-text-muted) !important;background-color:transparent}@media screen and (pointer:fine){.button:not([disabled]):not(.button--outline):hover,.btn:not([disabled]):hover{background-color:rgb(var(--jh-color-brand-hover))!important;color:rgb(var(--jh-color-text-on-brand))!important;box-shadow:none!important}.button--secondary:not([disabled]):not(.button--outline):hover{background-color:rgb(var(--jh-color-surface))!important;color:rgb(var(--jh-color-brand))!important;box-shadow:inset 0 0 0 var(--jh-border-md) rgb(var(--jh-color-brand))!important}.button--subdued:not([disabled]):not(.button--outline):hover{background-color:rgb(var(--jh-color-surface))!important;color:rgb(var(--jh-color-brand))!important}}.button[disabled],.button[aria-disabled=true],.btn[disabled]{opacity:.4;cursor:not-allowed}[data-scheme=inverse] .button{--button-background: var(--jh-color-text-inverse);--button-text-color: var(--jh-color-text)}[data-scheme=inverse] .button--secondary{--button-text-color: var(--jh-color-text-inverse);background-color:transparent;box-shadow:inset 0 0 0 var(--jh-border-md) rgb(var(--jh-color-text-inverse))}@media screen and (pointer:fine){[data-scheme=inverse] .button:not([disabled]):not(.button--outline):hover{background-color:rgb(var(--jh-color-text-inverse-muted))!important;color:rgb(var(--jh-color-text-on-inverse-brand))!important;box-shadow:none!important}[data-scheme=inverse] .button--secondary:not([disabled]):not(.button--outline):hover{background-color:rgb(var(--jh-color-inverse-hover))!important;color:rgb(var(--jh-color-text-inverse))!important;box-shadow:inset 0 0 0 var(--jh-border-md) rgb(var(--jh-color-text-inverse))!important}}
/*# sourceMappingURL=/cdn/shop/t/140/assets/design-buttons.css.map */
