/* Floating 3D Button */

.threeview-floating-button{
position:absolute;
z-index:999;
border-radius:5px;
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
box-shadow:0 6px 20px rgba(0,0,0,0.25);
transition:all 0.25s ease;
}

.threeview-floating-button img{
width:50px !important;
height:50px !important;
pointer-events:none;
}

.threeview-floating-button:hover{
transform:scale(1.05);
}

/* Positions */

.threeview-pos-bottom-right{
bottom:10px;
right:10px;
}

.threeview-pos-bottom-left{
bottom:10px;
left:10px;
}

.threeview-pos-top-right{
top:10px;
right:10px;
}

.threeview-pos-top-left{
top:10px;
left:10px;
}

/* Animations */

.threeview-anim-pulse{
animation:threeviewPulse 1.6s infinite;
}

.threeview-anim-bounce{
animation:threeviewBounce 1.2s infinite;
}

.threeview-anim-rotate{
animation:threeviewRotate 4s linear infinite;
}

.threeview-anim-shake{
animation:threeviewShake 0.8s infinite;
}

/* Keyframes */

@keyframes threeviewPulse{
0%{transform:scale(1)}
50%{transform:scale(1.05)}
100%{transform:scale(1)}
}

@keyframes threeviewBounce{
0%,100%{transform:translateY(0)}
50%{transform:translateY(-5px)}
}

@keyframes threeviewRotate{
from{transform:rotate(0)}
to{transform:rotate(360deg)}
}

@keyframes threeviewShake{
0%{transform:translateX(0)}
25%{transform:translateX(-2px)}
50%{transform:translateX(2px)}
75%{transform:translateX(-2px)}
100%{transform:translateX(0)}
}

/* AR Infobox */

.threeview-ar-infobox{

display:flex;
align-items:center;
gap:20px;

padding:20px;

background:#f6f6f6;

border: 1px solid #e3e3e3;

margin-top:20px;

flex-wrap:nowrap;

}

/* Columns */

.threeview-ar-col{

display:flex;

align-items:center;

}

/* Image Column */

.threeview-ar-image{

flex:0 0 25%;

}

.threeview-ar-image img{

width:100%;

height:120px;

object-fit:cover;

border-radius:8px;

}

/* Info Column */

.threeview-ar-info{

flex:1;

flex-direction:column;

}

.threeview-ar-info h3{

margin:0 0 8px 0;
text-align: center;
font-size:18px;

}

.threeview-ar-info p{

margin:0;
text-align: center;
font-size:14px;

line-height:1.5;

color:#555;

}

.threeview-ar-icon{

width:18px !important;
height:18px !important;
margin-right:6px;

}

/* CTA Column */

.threeview-ar-cta{

flex:0 0 160px;

justify-content:center;

transition: all 0.25s ease;

}

.threeview-ar-cta:hover {
    transform: scale(1.08);
}

.threeview-ar-launch{

display:flex;

align-items:center;

gap:8px;

padding:10px 16px;

background:#000;

color:#fff;

border:none;

border-radius:6px;

cursor:pointer;

font-size:14px;

}

.threeview-ar-launch:hover{

background:#333;

}

/* Tablet Optimization */

@media (max-width:1200px){

.threeview-ar-infobox{
flex-direction:column;

align-items:center;
}

}

/* Mobile Optimization */

@media (max-width:768px){

.threeview-ar-infobox{

flex-direction:column;

align-items:center;

}

.threeview-ar-image{

display:none;

}

.threeview-ar-info {
    margin: auto;
        text-align: center;
        display: block;
}

.threeview-ar-icon{
    display:none;
}

.threeview-ar-cta{

width:100%;

justify-content: center;

flex: 1;

}

}

.threeview-ar-qr{

display:none;

flex-direction:column;
align-items:center;
gap:8px;

}

.threeview-ar-qr img{

width:140px;
height:140px;

}

.threeview-ar-qr span{

font-size:12px;
color:#666;
display: none;
text-align:center;

}