
.wdt-creative-button-wrapper { display: inline-flex; position: relative; -webkit-transition: var(--wdt-elementor-base-transition); 
    transition: var(--wdt-elementor-base-transition); }
.wdt-button { border: 1px solid transparent; display: inline-flex; align-items: stretch; 
    font-size: 18px; letter-spacing: 0; line-height: normal; margin: 0; overflow: visible; position: relative; z-index: 0; 
    text-decoration: none; text-transform: none; -webkit-transition: var(--wdt-elementor-base-transition); transition: var(--wdt-elementor-base-transition); }

.wdt-button, .wdt-creative-button-wrapper .wdt-button { justify-content: center; text-align: center; border: none; overflow: hidden; text-transform: capitalize;
    background-color: var(--wdtPrimaryColor); color: var(--wdtAccentTxtColor); }
.wdt-dark-bg .wdt-button, .wdt-dark-bg .wdt-creative-button-wrapper .wdt-button { background-color: var(--wdtAccentTxtColor); color: var(--wdtPrimaryColor); }

.wdt-border-btn .wdt-creative-button-wrapper .wdt-button { box-shadow: 0 0 0 1px var(--wdtHeadAltColor) inset; -webkit-box-shadow: 0 0 0 1px var(--wdtHeadAltColor) inset; background-color: transparent; color: var(--wdtHeadAltColor); }
.wdt-border-btn .wdt-creative-button-wrapper .wdt-button:hover { color: var(--wdtAccentTxtColor); background-color: var(--wdtPrimaryColor); box-shadow: none; -webkit-box-shadow: none; }

.wdt-dark-bg.wdt-border-btn .wdt-creative-button-wrapper .wdt-button,
.wdt-dark-bg .wdt-border-btn .wdt-creative-button-wrapper .wdt-button { box-shadow: 0 0 0 1px var(--wdtAccentTxtColor) inset; -webkit-box-shadow: 0 0 0 1px var(--wdtAccentTxtColor) inset; background-color: transparent; color: var(--wdtAccentTxtColor); }
.wdt-dark-bg.wdt-border-btn .wdt-creative-button-wrapper .wdt-button:hover,
.wdt-dark-bg .wdt-border-btn .wdt-creative-button-wrapper .wdt-button:hover { color: var(--wdtHeadAltColor); background-color: var(--wdtAccentTxtColor); box-shadow: none; -webkit-box-shadow: none; }

.wdt-creative-button-wrapper .wdt-button:hover { background-color: var(--wdtPrimaryColor); }
.wdt-dark-bg .wdt-creative-button-wrapper .wdt-button:hover { background-color: var(--wdtAccentTxtColor); }

.wdt-button-filler { position: absolute; -webkit-pointer-events: none; pointer-events: none; -webkit-user-select: none; user-select: none;
    width: 105%; aspect-ratio: 1; -webkit-aspect-ratio: 1; -moz-aspect-ratio: 1; background: var(--wdtLinkHoverColor); -webkit-border-radius: var(--wdtRadius_Full); border-radius: var(--wdtRadius_Full); }

.wdt-dark-bg .wdt-button-filler { background: var(--wdtSecondaryColor); }

/* .wdt-button:focus, .wdt-creative-button-wrapper .wdt-button:focus,
.wdt-button:hover, .wdt-creative-button-wrapper .wdt-button:hover { background-color: transparent; color: var(--wdt-elementor-color-white); } */

.wdt-creative-button-wrapper .wdt-button .wdt-label-wrapper, 
.wdt-creative-button-wrapper .wdt-button .wdt-icon-wrapper { vertical-align: top; position: relative; }

.wdt-creative-button-wrapper .wdt-button .wdt-label-wrapper { display: inline-grid; align-content: center; z-index: 2; position: relative; }
.wdt-creative-button-wrapper .wdt-button .wdt-icon-wrapper { display: inline-flex; line-height: 0; z-index: 2; }
/* .wdt-button .wdt-button-icon span { display: inherit; align-items: center; position: relative; } */

.wdt-creative-button-wrapper.xsmall .wdt-button { font-size: 11px; padding: 0.8em 1.4em; }
.wdt-creative-button-wrapper.small .wdt-button { font-size: 14px; padding: 0.8em 1.5em;  }
.wdt-creative-button-wrapper.medium .wdt-button { font-size: var(--wdtFontSize_Ext); padding: var(--wdtPadding_Btn); font-family: var(--wdtFontTypo_Alt); font-weight: var(--wdtFontWeight_Base); line-height: 1;  }
.wdt-creative-button-wrapper.large .wdt-button { font-size: 18px; padding: 0.9em 2em; }
.wdt-creative-button-wrapper.xlarge .wdt-button { font-size: 20px; padding: 1em 2.25em; }

.elementor-align-justify .wdt-creative-button-wrapper, 
.elementor-align-justify .wdt-creative-button-wrapper .wdt-button { width: 100%; }

.wdt-creative-button-wrapper .wdt-button .wdt-icon-wrapper { margin-right: 8px; margin-left: 0px; }
.wdt-creative-button-wrapper .wdt-button .wdt-label-wrapper ~ .wdt-icon-wrapper { margin-left: 8px; margin-right: 0px; }


/* Styles */


/*Creative Button - Text Move Animation*/

.wdt-creative-button-wrapper.wdt-creative-button-effect-text-move a.wdt-button { margin: 0; border: none;
    display: inline-flex; min-height: 1px; text-transform: uppercase; overflow: hidden; position: relative; }

.wdt-creative-button-wrapper.wdt-creative-button-effect-text-move a.wdt-button .wdt-label-wrapper > span:after { 
    content: attr(data-text); display: inline-block; position: absolute; white-space: nowrap; top: 50%; opacity: 0; left: 50%; 
    transform: translate(-50%, 100%); transition: opacity .5s,transform .8s; transition-timing-function: cubic-bezier(.15,.85,.31,1); }
.wdt-creative-button-wrapper.wdt-creative-button-effect-text-move a.wdt-button:hover  .wdt-label-wrapper > span:after { 
    transform: translate(-50%,150%); opacity: 1; }

.wdt-creative-button-wrapper.wdt-creative-button-effect-text-move a.wdt-button .wdt-label-wrapper { 
    transform: translateY(0%); opacity: 1; transition: opacity .65s,transform .85s; transition-timing-function: cubic-bezier(.15,.85,.31,1); }
.wdt-creative-button-wrapper.wdt-creative-button-effect-text-move a.wdt-button:hover .wdt-label-wrapper { transform: translateY(-200%); }
