/* DEFAULT */

body [class*="pxl-button-style-"] .elementor-button {
    line-height: 1.2 !important;
    font-weight: 600 !important;
    position:relative;
    z-index:1;
}

/* STYLES */

body .pxl-button-style-style1 .elementor-button {
    color: #fff;
    background-color: var( --e-global-color-accent );
    border-color: var( --e-global-color-accent );
}
body .pxl-button-style-style1 .elementor-button:hover {
    color: #fff;
    background-color: var( --e-global-color-fc86739 );
    border-color: var( --e-global-color-fc86739 );
}

body .pxl-button-style-style2 .elementor-button {
    color: var( --e-global-color-text );
    background-color: var( --e-global-color-secondary );
    border-color: var( --e-global-color-secondary );
}
body .pxl-button-style-style2 .elementor-button:hover {
    color: var( --e-global-color-text );
    background-color: var( --e-global-color-fc86739 );
    border-color: var( --e-global-color-fc86739 );
}
body .pxl-button-style-style3 .elementor-button {
    color: #fff;
    background-color: var( --e-global-color-84244b7 );
    border-color: var( --e-global-color-84244b7 );
}
body .pxl-button-style-style3 .elementor-button:hover {
    color: #fff;
    background-color: var( --e-global-color-accent );
    border-color: var( --e-global-color-accent );
}
body .pxl-button-style-white .elementor-button {
    color: #000;
    background-color: #fff;
    border-color: #000;
}
body .pxl-button-style-white .elementor-button:hover {
    color: #fff;
    background-color: var( --e-global-color-text );
    border-color: var( --e-global-color-text );
}
body .pxl-button-style-link .elementor-button {
    padding:0 !important;
    border-radius:0 !important;
    color: var( --e-global-color-primary );
    background-color: transparent !important;
    border-color: transparent !important;
    text-transform: none !important;
    font-weight:500 !important;
    text-decoration:underline;
}
body .pxl-button-style-link .elementor-button:hover {
    color: var( --e-global-color-primary );
    text-decoration:none;
}


.pxl-highlight-word {
    position: relative;
    display: inline-block;
    padding: 0 4px;
    z-index: 0;
}
.pxl-highlight-word::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0.1em;
    height: 1.1em;
    width: 100%;
    background-color: var(--pxl-highlight-color, #F8A12E);
    transform-origin: left center;
    transform: scaleX(0);
    z-index: -1;
    transition: transform 0.6s ease-out 1.2s;
}
body.pxl-anim-ready .pxl-highlight-word::before {
    transform: scaleX(1);
}

