/**
    Hotspot trigger animations
*/


/* Animations */

    @-webkit-keyframes wdt-soft-beat {
        from { -webkit-transform: scale(1); transform: scale(1); }
        to { -webkit-transform: scale(1.1); transform: scale(1.1); }
    }

    @keyframes wdt-soft-beat {
        from { -webkit-transform: scale(1); transform: scale(1); }
        to { -webkit-transform: scale(1.1); transform: scale(1.1); }
    }

    @-webkit-keyframes wdt-expand {
        0% { -webkit-transform: scale(.5); transform: scale(.5); opacity: 1; }
        to { -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; }
    }

    @keyframes wdt-expand {
        0% { -webkit-transform: scale(.5); transform: scale(.5); opacity: 1; }
        to { -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; }
    }

    @keyframes ripple {
        0% { transform: scale(1); opacity: .8; }
        45% { transform: scale(1.75); opacity: 0; border-width: 10; }
    }

/* Soft Beat */

    .wdt-hotspot-soft-beat { -webkit-animation: wdt-soft-beat .7s infinite alternate; animation: wdt-soft-beat .7s infinite alternate; 
        -webkit-animation-timing-function: ease; animation-timing-function: ease; }

/* Expand */

    .wdt-hotspot-expand:before { -webkit-animation: wdt-expand 2s infinite; animation: wdt-expand 2s infinite; }
    .wdt-hotspot-expand:before { position: absolute; z-index: -1; width: 100%; height: 100%; 
        content: ''; opacity: 0; border-radius: inherit; background-color: inherit; }

/* Overlay */

    .wdt-hotspot-overlay { -webkit-transition: opacity .2s; -o-transition: opacity .2s; transition: opacity .2s; opacity: .7; }
    .wdt-hotspot-item-active .wdt-hotspot-overlay { opacity: 1; }

/* Ripple */

    .wdt-hotspot-ripple:before { -webkit-animation: ripple 3s ease-out infinite; animation: ripple 3s ease-out infinite; }
    .wdt-hotspot-ripple:before { position: absolute; z-index: -1; width: 100%; height: 100%; 
        content: ''; opacity: 0; border-width: 2px; border-style: solid; border-color: inherit; border-radius: inherit; }

    .wdt-hotspot-item-active .wdt-hotspot-item-trigger.wdt-hotspot-ripple:before { -webkit-animation-play-state: paused; animation-play-state: paused; }

/**
    Tooltip animations
*/

/* Scale */

    .tippy-box[data-animation=scale][data-placement*=top] { transform-origin: bottom; }
    .tippy-box[data-animation=scale][data-placement*=bottom] { transform-origin: top; }
    .tippy-box[data-animation=scale][data-placement*=left] { transform-origin: right; }
    .tippy-box[data-animation=scale][data-placement*=right] { transform-origin: left; }
    .tippy-box[data-animation=scale][data-state=hidden] { transform: scale(.5); opacity: 0; }

/* Perspective */

    .tippy-box[data-animation=perspective][data-placement^=top] { transform-origin: bottom; }
    .tippy-box[data-animation=perspective][data-placement^=top][data-state=visible] { transform: perspective(700px); }
    .tippy-box[data-animation=perspective][data-placement^=top][data-state=hidden] { transform: perspective(700px) translateY(8px) rotateX(60deg); }

    .tippy-box[data-animation=perspective][data-placement^=bottom] { transform-origin: top; }
    .tippy-box[data-animation=perspective][data-placement^=bottom][data-state=visible] { transform: perspective(700px); }
    .tippy-box[data-animation=perspective][data-placement^=bottom][data-state=hidden] { transform: perspective(700px) translateY(-8px) rotateX(-60deg); }

    .tippy-box[data-animation=perspective][data-placement^=left] { transform-origin: right; }
    .tippy-box[data-animation=perspective][data-placement^=left][data-state=visible] { transform: perspective(700px); }
    .tippy-box[data-animation=perspective][data-placement^=left][data-state=hidden] { transform: perspective(700px) translateX(8px) rotateY(-60deg); }

    .tippy-box[data-animation=perspective][data-placement^=right] { transform-origin: left; }
    .tippy-box[data-animation=perspective][data-placement^=right][data-state=visible] { transform: perspective(700px); }
    .tippy-box[data-animation=perspective][data-placement^=right][data-state=hidden] { transform: perspective(700px) translateX(-8px) rotateY(60deg); }

    .tippy-box[data-animation=perspective][data-state=hidden] { opacity: 0; }

/* Shift-away */

    .tippy-box[data-animation=shift-away][data-state=hidden] { opacity: 0; }
    .tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=top] { transform: translateY(10px); }
    .tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=bottom] { transform: translateY(-10px); }
    .tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=left] { transform: translateX(10px); }
    .tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=right] { transform: translateX(-10px); }

/* Shift-toward */

    .tippy-box[data-animation=shift-toward][data-state=hidden] { opacity: 0; }
    .tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=top] { transform: translateY(-10px); }
    .tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=bottom] { transform: translateY(10px); }
    .tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=left] { transform: translateX(-10px); }
    .tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=right] { transform: translateX(10px); }

/** 
    Others 
*/

    .wdt-hotspot-holder { position: relative; }
    .wdt-hotspot-holder .wdt-hotspot-repeater-item { position: absolute; }

    .wdt-hotspot-item-trigger { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex;
        -webkit-box-align: center; align-items: center; -ms-flex-align: center; -ms-flex-flow: row nowrap; 
        flex-flow: row nowrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-box-pack: center; 
        -ms-flex-pack: center; justify-content: center; border-radius: var(--wdtRadius_Zero); padding: 10px; 
        -webkit-transition: var(--wdt-Ad-Transition); transition: var(--wdt-Ad-Transition); 
        -webkit-transform: translateZ(0); transform: translateZ(0); border-color: var(--wdt-elementor-color-primary); background-color: var(--wdt-elementor-color-primary); }

    .wdt-hotspot-item-active .wdt-hotspot-item-trigger { border-color: var(--wdtLinkHoverColor); background-color: var(--wdtLinkHoverColor); }

    .wdt-hotspot-item-trigger > *:not(:last-child) { margin: 0 10px 0 0; }

/** 
    Hotspot Item Default 
*/

    .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"] { line-height: 1; display: inline-flex; align-items: center; 
        justify-content: center; -webkit-transition: var(--wdt-Ad-Transition); transition: var(--wdt-Ad-Transition); 
        color: var(--wdt-elementor-color-white); }

    .wdt-hotspot-item-active .wdt-hotspot-item-trigger .wdt-hotspot-item-default { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/** 
    Tool Tip 
*/

    .wdt-hotspot-item-tooltip { display: none; visibility: hidden; }

    .wdt-hotspot-holder .tippy-box { padding: 0; border-radius: var(--wdtRadius_Zero); background: transparent; }

    .wdt-hotspot-holder .tippy-box .tippy-content { padding: 10px; border-radius: var(--wdtRadius_Zero); background-color: var(--wdtBodyBGColor); }

    .wdt-hotspot-holder .tippy-box .tippy-content h5 { line-height: 1; margin: 0 0 15px; color: var(--wdtHeadAltColor);
        -webkit-transition: var(--wdt-Ad-Transition); transition: var(--wdt-Ad-Transition); }

    .wdt-hotspot-holder .tippy-box .tippy-content p { margin: 0; -webkit-transition: var(--wdt-Ad-Transition); 
        transition: var(--wdt-Ad-Transition); color: var(--wdtBodyTxtColor); }

    .wdt-hotspot-holder .tippy-box .tippy-arrow { color: var(--wdtBodyBGColor); }
    [data-tippy-root] .tippy-box { background-color: var(--wdtAccentTxtColor); color: var(--wdtSecondaryColor); border-radius: var(--wdtRadius_Zero); }
    [data-tippy-root] .tippy-box .tippy-content{ padding: 10px; display: grid ; max-width: 250px; box-shadow: var(--wdtBoxShadow);
        grid-template-columns: clamp(3.75rem, 3.0921rem + 2.6316vw, 6.25rem) auto; gap: 20px; align-items: center; }
    [data-tippy-root] .tippy-box .tippy-content h5{ font-size: clamp(1rem, 0.9342rem + 0.2632vw, 1.25rem); text-transform: capitalize; 
        margin-top: 0; font-family: var(--wdtFontTypo_Base); line-height: var(--wdtLineHeight_H1); font-weight: var(--wdtFontWeight_Ext); color: var(--wdtHeadAltColor); }
    [data-tippy-root] .tippy-box .tippy-content p{ margin-bottom: 0; font-size: clamp(1rem, 0.9342rem + 0.2632vw, 1.25rem); 
        font-family: var(--wdtFontTypo_Alt); font-weight: 700; letter-spacing: var(--wdtLetterSpacing_2X); }
    [data-tippy-root] .tippy-box .tippy-arrow{ color: var(--wdtBodyBGColor); }


/* Click */
.wdt-hotspot-holder.wdt-hotspot-trigger-click > img {
    border-radius: var(--wdtRadius_Zero);
}
.wdt-hotspot-holder.wdt-hotspot-trigger-click .wdt-hotspot-item-trigger{ cursor: pointer;
    -webkit-border-radius: var(--wdtRadius_Full); border-radius: var(--wdtRadius_Full); padding: 6px; background-color: rgba(var(--wdtAccentTxtColorRgb), .3); backdrop-filter: blur(var(--wdtGlassBg_Blur_2X)); }
.wdt-hotspot-holder.wdt-hotspot-trigger-click .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"],
.wdt-hotspot-holder.wdt-hotspot-trigger-click .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"] .wdt-content-icon-wrapper,
.wdt-hotspot-holder.wdt-hotspot-trigger-click .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"] .wdt-content-icon{ display: inline-flex; }
.wdt-hotspot-holder.wdt-hotspot-trigger-click .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"] .wdt-content-icon span { line-height: 1; font-size: 10px; display: inline-flex; }
.wdt-hotspot-holder.wdt-hotspot-trigger-click .tippy-box .tippy-content { align-items: center;
    display: flex; gap: 20px; -webkit-border-radius: var(--wdtRadius_Zero); border-radius: var(--wdtRadius_Zero); }
.wdt-hotspot-holder.wdt-hotspot-trigger-click .tippy-box .tippy-content h5 { font-size: var(--wdtFontSize_Base); margin-bottom: 8px;
    font-family: var(--wdtFontTypo_Base); line-height: var(--wdtLineHeight_H1); font-weight: var(--wdtFontWeight_Ext);  }

/* Manual */
.wdt-hotspot-holder.wdt-hotspot-trigger-manual > img { border-radius: var(--wdtRadius_Zero); }
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .wdt-hotspot-item-trigger{ -webkit-border-radius: var(--wdtRadius_Full); border-radius: var(--wdtRadius_Full); 
    width: clamp(1.5625rem, 1.3158rem + 0.9868vw, 2.5rem); /* Min-25 & Max-40 */ height: clamp(1.5625rem, 1.3158rem + 0.9868vw, 2.5rem); /* Min-25 & Max-40 */
    background-color: rgba(var(--wdtAccentTxtColorRgb), .3); backdrop-filter: blur(var(--wdtGlassBg_Blur_2X)); }
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"],
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"] .wdt-content-icon-wrapper,
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"] .wdt-content-icon{ display: inline-flex; }
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .wdt-hotspot-item-trigger div[class*="wdt-hotspot-item-"] .wdt-content-icon span { 
    line-height: 1; font-size: clamp(1.125rem, 1.0834rem + 0.1388vw, 1.25rem); /* Min-18 & Max-20 */ display: inline-flex; }
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .tippy-box .tippy-content { display: flex; gap: 20px; -webkit-border-radius: var(--wdtRadius_Part); padding: 10px 30px;
    border-radius: var(--wdtRadius_Part); border: 1px solid; background-color: rgba(var(--wdtAccentTxtColorRgb), .3); backdrop-filter: blur(var(--wdtGlassBg_Blur_2X)); overflow: hidden; }
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .tippy-box .tippy-content h5 { font-size: var(--wdtFontSize_Base); 
    font-family: var(--wdtFontTypo_Base); line-height: var(--wdtLineHeight_H1); font-weight: var(--wdtFontWeight_Ext);  }
.wdt-hotspot-holder.wdt-hotspot-trigger-manual .tippy-box .tippy-content p { font-size: var(--wdtFontSize_Base); font-weight: var(--wdtFontWeight_Ext); }