:root{--hb-espresso: 47, 37, 33;--hb-espresso-hover: 69, 56, 50;--hb-sage: #cfdbb5;--hb-sage-light: #e9eedc;--hb-cream: #faf8f3;--hb-radius: 10px;--hb-duration: .2s;--hb-ease: cubic-bezier(.2, .8, .2, 1);--hb-shadow-hover: 0 8px 18px -8px rgba(var(--hb-espresso), .45);--hb-shadow-active: 0 3px 8px -4px rgba(var(--hb-espresso), .35)}.hb-button{display:inline-flex;align-items:center;justify-content:center;gap:0;padding:1.2rem 2.4rem;border:1px solid transparent;border-radius:var(--hb-radius);font-family:var(--font-body-family);font-size:1.6rem;font-weight:500;line-height:1.2;letter-spacing:.02em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color var(--hb-duration) var(--hb-ease),color var(--hb-duration) var(--hb-ease),border-color var(--hb-duration) var(--hb-ease),box-shadow var(--hb-duration) var(--hb-ease),transform var(--hb-duration) var(--hb-ease)}.hb-button:hover{transform:translateY(-2px);box-shadow:var(--hb-shadow-hover)}.hb-button:active{transform:translateY(0) scale(.98);box-shadow:var(--hb-shadow-active);transition-duration:80ms}.hb-button:focus-visible{outline:2px solid rgb(var(--hb-espresso));outline-offset:2px}.hb-button--primary{background-color:rgb(var(--hb-espresso));border-color:rgb(var(--hb-espresso));color:var(--hb-cream)}.hb-button--primary:hover{background-color:rgb(var(--hb-espresso-hover));border-color:rgb(var(--hb-espresso-hover));color:var(--hb-cream)}.hb-button--outline{background-color:transparent;border-color:rgb(var(--hb-espresso));color:rgb(var(--hb-espresso))}.hb-button--outline:hover{background-color:var(--hb-sage-light);color:rgb(var(--hb-espresso))}.hb-button--light{background-color:var(--hb-cream);border-color:var(--hb-cream);color:rgb(var(--hb-espresso))}.hb-button--light:hover{background-color:var(--hb-sage);border-color:var(--hb-sage);color:rgb(var(--hb-espresso))}.hb-button--light:focus-visible{outline-color:var(--hb-cream)}.hb-button--sm{padding:.8rem 1.6rem;font-size:1.4rem}.hb-button__arrow{display:inline-flex;align-items:center;max-width:0;overflow:hidden;opacity:0;transform:translate(-4px);transition:max-width var(--hb-duration) var(--hb-ease),margin-left var(--hb-duration) var(--hb-ease),opacity var(--hb-duration) var(--hb-ease),transform var(--hb-duration) var(--hb-ease)}.hb-button__arrow svg{width:1.4rem;height:auto;flex-shrink:0}:is(.hb-button,.button):hover .hb-button__arrow,:is(.hb-button,.button):focus-visible .hb-button__arrow{max-width:1.4rem;margin-left:.8rem;opacity:1;transform:translate(0)}.button[aria-disabled=true] .hb-button__arrow,.button[disabled] .hb-button__arrow,.button.loading .hb-button__arrow{display:none}.button:not(.button--tertiary),.shopify-payment-button__button--unbranded,.customer button{transition:background-color var(--hb-duration) var(--hb-ease),color var(--hb-duration) var(--hb-ease),box-shadow var(--hb-duration) var(--hb-ease),transform var(--hb-duration) var(--hb-ease)}.button:not(.button--tertiary):not([disabled]):not([aria-disabled=true]):hover,.shopify-payment-button__button--unbranded:hover,.customer button:not([disabled]):hover{transform:translateY(-2px);box-shadow:var(--hb-shadow-hover)}.button--primary:not([disabled]):not([aria-disabled=true]):hover{--color-button: var(--hb-espresso-hover)}.button--secondary:not([disabled]):not([aria-disabled=true]):hover{background-color:var(--hb-sage-light)}.button:not(.button--tertiary):not([disabled]):not([aria-disabled=true]):active,.shopify-payment-button__button--unbranded:active,.customer button:not([disabled]):active{transform:translateY(0) scale(.98);box-shadow:var(--hb-shadow-active);transition-duration:80ms}.button:not([disabled]):hover:after,.shopify-payment-button__button--unbranded:hover:after,.customer button:hover:after{--border-offset: .3px}@media(prefers-reduced-motion:reduce){.hb-button,.hb-button__arrow,.button,.shopify-payment-button__button--unbranded,.customer button{transition-property:background-color,color,border-color,opacity}.hb-button:hover,.hb-button:active,.button:hover,.button:active,.shopify-payment-button__button--unbranded:hover,.shopify-payment-button__button--unbranded:active,.customer button:hover,.customer button:active{transform:none!important}.hb-button__arrow{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/20/assets/hurble-buttons.css.map */