.ct-button, input[type="submit"], button[type="submit"], li[data-type="pill"] a, #cancel-comment-reply-link, .wp-block-file .wp-block-file__button, .hero-section[data-type="type-2"] .ct-meta-categories a, .button, .added_to_cart, .entry-tags a { display: var(--display, inline-flex); align-items: center; justify-content: center; position: relative; height: var(--height, 45px); padding: var(--padding, 0 25px) !important; font-size: var(--buttonFontSize, 15px); font-weight: var(--buttonFontWeight, 500); color: var(--buttonTextInitialColor, #fff); border: none; cursor: pointer; user-select: none; border-radius: var(--borderRadius, 3px); background-color: var(--buttonInitialColor); transition: color 0.2s ease, opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, !important; &:before { display: var(--buttonShadow, block); position: absolute; z-index: -1; content: ''; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; border-radius: inherit; // box-shadow: 0px 8px 30px 0px var(--buttonHoverColor); box-shadow: 0 8px 25px -8px var(--buttonHoverColor); transition: opacity 0.2s ease; } &:focus { outline: none; } &:disabled, &.disabled { opacity: .5; pointer-events: none; } &:hover { color: var(--buttonTextHoverColor, #fff); transform: var(--buttonTransform, translate3d(0, -3px, 0)); background-color: var(--buttonHoverColor); &:before { opacity: 0.8; } } }