/**
    Hotspot trigger animations
*/


/* Animations */

    @-webkit-keyframes wdt-soft-beat {
        0% { transform: scale(0.6); opacity: 0; }
        50% { transform: scale(1.08); opacity: 1; }
        75% { transform: scale(0.97); }
        100% { transform: scale(1); }
    }

    @keyframes wdt-soft-beat {
        0% { transform: scale(0.6); opacity: 0; }
        50% { transform: scale(1.08); opacity: 1; }
        75% { transform: scale(0.97); }
        100% { transform: scale(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: flex; align-items: center; flex-flow: row nowrap; -webkit-box-orient: horizontal; 
        -webkit-box-direction: normal; justify-content: center; border-radius: var(--wdtRadius_Full); padding: clamp(0.1875rem, 0.0212rem + 0.3469vw, 0.4375rem);/* 3 - 7 */
        -webkit-transition: var(--wdt-Ad-Transition); transition: var(--wdt-Ad-Transition); 
        cursor: pointer; -webkit-transform: translateZ(0); transform: translateZ(0); 
        border-color: var(--wdt-elementor-color-primary); background-color: rgb(var(--wdtAccentTxtColorRgb),0.1);backdrop-filter: blur(7px);border: 1px solid rgb(var(--wdtAccentTxtColorRgb),0.1); }
    .wdt-hotspot-item-trigger span{height: clamp(1.25rem, 0.7514rem + 1.6655vw, 2.75rem);/* 20 - 44 */ width: clamp(1.25rem, 0.7514rem + 1.6655vw, 2.75rem);/* 20 - 44 */ padding: 3px; background-color: var(--wdtAccentTxtColor); border: 1px solid var(--wdtBorderColor); display: flex; align-items: center; justify-content: center; border-radius: var(--wdtRadius_Full);}

    .wdt-hotspot-item-trigger > .wdt-hotspot-item-default:only-child { width: 25px; height: 25px; }

    .wdt-hotspot-item-trigger > .wdt-hotspot-item-label { color: var(--wdtAccentTxtColor); margin: 0; }

    .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: clamp(0.625rem, 0.4172rem + 0.694vw, 1.25rem);/* 10 - 20 */ background-color: var(--wdtBodyBGColor); border-radius: var(--wdtRadius_Zero); width: 280px; }

    .wdt-hotspot-holder .tippy-box .tippy-content > .wdt-hotspot-image:not(:only-child) { 
        display: inline-flex; margin-bottom: 20px; width: 100%; }
    .wdt-hotspot-holder .tippy-box .tippy-content > .wdt-hotspot-image div{width: 100%; height: 100%;}
    .wdt-hotspot-holder .tippy-box .tippy-content > .wdt-hotspot-image span{display: flex; height: 130px;}
    .wdt-hotspot-holder .tippy-box .tippy-content > .wdt-hotspot-image span img{height: 100%; width: 100%; object-fit: cover; object-position: center;}

    .wdt-hotspot-holder .tippy-box .tippy-content h5 { 
        color: var(--wdt-elementor-color-primary); -webkit-transition: var(--wdt-Ad-Transition); font-weight: var(--wdtFontWeight_Ext);
        transition: var(--wdt-Ad-Transition); margin: 0 0 clamp(0.625rem, 0.4172rem + 0.694vw, 1.25rem);/* 10 - 20 */ font-size: clamp(1.125rem, 1.0971rem + 0.1274vw, 1.25rem); /* Min-18 & Max-20 */ }

    .wdt-hotspot-holder .tippy-box .tippy-content p { margin: 0; -webkit-transition: var(--wdt-Ad-Transition); 
        transition: var(--wdt-Ad-Transition); }

    .wdt-hotspot-holder .tippy-box .tippy-arrow { color: var(--wdtBodyBGColor); }

    .wdt-hotspot-holder .wdt-tooltip-icons .wdt-tooltip-icon-item{display: flex; gap: 10px; align-items: center; }
    .wdt-hotspot-holder .wdt-tooltip-icons {display: flex; flex-wrap: wrap; align-items: start;gap: 20px; flex-direction:column; padding-bottom:20px;}
    .wdt-hotspot-holder .wdt-tooltip-icons .wdt-tooltip-icon-item .wdt-icon,
    .wdt-hotspot-holder .wdt-tooltip-icons .wdt-tooltip-icon-item .wdt-icon-text{color: var(--wdtPrimaryColor); line-height: 1; }
    .wdt-hotspot-holder .wdt-tooltip-icons .wdt-tooltip-icon-item .wdt-icon{font-size: var(--wdtFontSize_Base);}
    .wdt-hotspot-holder .wdt-tooltip-icons .wdt-tooltip-icon-item .wdt-icon-text a{ font-weight: var(--wdtFontWeight_Base);}
    .wdt-hotspot-holder .wdt-tooltip-icons .wdt-tooltip-icon-item .wdt-icon-text a:hover{color: rgb(var(--wdtPrimaryColorRgb),0.7);}
    .wdt-hotspot-holder .tippy-content .wdt-hotspot-link-2{ 
        padding: 0; font-size: inherit; line-height: 1; color:var(--wdtPrimaryColor); border: 0; position: relative; width: fit-content; display: inline; text-decoration: none; box-shadow: none; font-weight: var(--wdtFontWeight_Ext);
        background-image: linear-gradient(90deg, currentColor 50%, currentColor 50%); background-position: left calc(100% - 3px); background-size: 100% 1px; background-repeat: no-repeat; transition: background-size 0.3s ease-in-out, color 0.3s ease-in-out; background-color: transparent;
    }
    .wdt-hotspot-holder  .tippy-content .wdt-hotspot-link-2:hover{
        color: var(--wdtLinkHoverColor); background-color: transparent; background-size: 0 1px; background-position: right calc(100% - 3px);
        background-image: linear-gradient(90deg, currentColor 50%, currentColor 50%); background-repeat: no-repeat; transition: background-size 0.3s ease-in-out, color 0.3s ease-in-out;
    }

    

    @media(max-width:1024px){
        .wdt-hotspot-holder .wdt-tooltip-icons{flex-direction: column; gap: 15px;}
        .wdt-hotspot-holder .tippy-box .tippy-content{width: 300px;}
    }
    @media(max-width:767px){
        .wdt-hotspot-item-trigger span{height: 10px; width: 10px; padding: 0;}
        .wdt-hotspot-item-trigger span img{display: none;}
        .wdt-hotspot-holder .tippy-box .tippy-content{max-width: 300px; width: 100%;}
        .wdt-hotspot-holder .tippy-box .tippy-content > .wdt-hotspot-image span{height: 100%;}
        .wdt-hotspot-holder .tippy-box .tippy-content h5{grid-area: 1/2/1/3;}
        .wdt-hotspot-holder .tippy-box .wdt-tooltip-icons{grid-area: 2/2/2/3;}
        .wdt-hotspot-holder .tippy-box .tippy-content > .wdt-hotspot-image{margin: 0 !important; grid-area: 1/1/3/2;}
        .wdt-hotspot-holder .tippy-box .tippy-content > .wdt-hotspot-image:not(:only-child){display:none;}
    }