/* ===== CSTF 360 Front (FULLSCREEN FINAL) ===== */

.cstf360-front{
  border-radius:12px;
  overflow:hidden;
  background:#000;
  position:relative;
  width:100%;
}
 
/* Toolbar */
.cstf360-front-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  background:rgba(0,0,0,.85);
  color:#fff;
  position:absolute;
  top:0; left:0; right:0;
  z-index:10;
}

.cstf360-front-toolbar,
.cstf360-front-toolbar *{
  touch-action:manipulation;
}

.cstf360-btn{
  background:#baac6d;
  border:0;
  color:#fff;
  padding:5px 10px;
  font-size:14px;
  line-height:1;
  border-radius:8px;
  cursor:pointer;
  white-space:nowrap;
}

/* Canvas wrapper */
.cstf360-canvas{
  width:100%;
  height:500px;
  position:relative;
  touch-action:none !important;
  background:#000;
}

/* A-Frame scene/canvas occupy full wrapper */
.cstf360-canvas a-scene,
.cstf360-canvas .a-canvas,
.cstf360-canvas canvas{
  width:100% !important;
  height:100% !important;
  display:block !important;
  touch-action:none !important;
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none !important;
}

/* Mobile tweaks */
@media (max-width:768px){
  .cstf360-front-toolbar{ padding:8px 10px; gap:10px; }
  .cstf360-btn{ padding:4px 8px; font-size:13px; }
  /* .cstf360-canvas{ height:420px; } */
}

/* ===== Native Fullscreen (Desktop/Android) ===== */
.cstf360-front:fullscreen,
.cstf360-front:-webkit-full-screen{
  width:100vw !important;
  height:100vh !important;
  border-radius:0 !important;
  margin:0 !important;
  background:#000 !important;
}

.cstf360-front:fullscreen .cstf360-canvas,
.cstf360-front:-webkit-full-screen .cstf360-canvas{
  height:100vh !important;
}

/* ===== iOS pseudo-fullscreen ===== */
.cstf360-front.is-iosfs{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100svh !important;
  height:100dvh !important;
  height:-webkit-fill-available !important;
  z-index:2147483647 !important;
  border-radius:0 !important;
  margin:0 !important;
  background:#000 !important;
  overflow:hidden !important;
  padding-top:env(safe-area-inset-top);
  padding-bottom:env(safe-area-inset-bottom);
}

.cstf360-front.is-iosfs .cstf360-front-toolbar{
  top:env(safe-area-inset-top) !important;
}

.cstf360-front.is-iosfs .cstf360-canvas{
  height:100% !important;
}

/* Page scroll lock */
html.cstf360-lock,
body.cstf360-lock{
  overflow:hidden !important;
  position:fixed !important;
  width:100% !important;
  height:100% !important;
}