/* OVM LIVE VIEW v0.2.2 — GUI hotfix
   Strict state-driven visibility; no overlap with the existing still-image controls. */

.ovm-cam-frame{isolation:isolate}

/* Always respect semantic hidden, even against author display rules. */
.ovm-live-controls[hidden],
.ovm-live-button[hidden],
.ovm-live-surface[hidden],
.ovm-live-starting[hidden]{display:none!important}

.ovm-live-controls{
  position:absolute;
  z-index:8;
  display:flex;
  align-items:center;
  gap:7px;
  pointer-events:auto
}

/* STILL / IDLE: one member-only LIVE VIEW button, away from LIVE IMAGE and FULL RESOLUTION. */
.ovm-live-controls.ovm-live-controls-idle{
  top:10px;
  right:10px;
  left:auto;
  bottom:auto
}

/* TRUE LIVE: old still-image controls are hidden, so use the lower edge cleanly. */
.ovm-live-controls.ovm-live-controls-active{
  left:10px;
  right:10px;
  top:auto;
  bottom:10px
}

.ovm-live-button{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:7px 10px;
  border:1px solid rgba(95,157,197,.62);
  border-radius:7px;
  background:rgba(3,13,22,.86);
  color:#dcebf5;
  font:inherit;
  font-size:.62rem;
  font-weight:750;
  letter-spacing:.055em;
  cursor:pointer;
  backdrop-filter:blur(6px);
  box-shadow:0 8px 24px rgba(0,0,0,.20);
  transition:border-color .15s ease,background .15s ease,transform .15s ease
}
.ovm-live-button:hover,.ovm-live-button:focus-visible{
  border-color:var(--blue);
  background:rgba(7,29,45,.96);
  color:#fff;
  outline:none;
  transform:translateY(-1px)
}
.ovm-live-button:disabled{cursor:default;opacity:.60;transform:none}
.ovm-live-button.stop{
  border-color:rgba(123,164,190,.62);
  background:rgba(5,17,28,.92)
}
.ovm-live-controls-active .ovm-live-button.fullscreen{margin-left:auto}
.ovm-live-button .ovm-live-button-icon{font-size:.82rem;line-height:1}

.ovm-live-surface{
  position:absolute;
  inset:0;
  z-index:5;
  display:none;
  align-items:center;
  justify-content:center;
  background:#010307
}
.ovm-live-surface video{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:4/3;
  object-fit:contain;
  background:#010307;
  border-radius:0
}
.ovm-cam-frame.ovm-live-active .ovm-live-surface{display:flex}
.ovm-cam-frame.ovm-live-active>#ovmCamImage,
.ovm-cam-frame.ovm-live-active>#cameraImageTag,
.ovm-cam-frame.ovm-live-active>#cameraExpand{visibility:hidden}

.ovm-live-badge{
  position:absolute;
  left:10px;
  top:10px;
  z-index:7;
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px 9px;
  border:1px solid rgba(72,209,63,.40);
  border-radius:7px;
  background:rgba(3,18,14,.86);
  color:#c8f3c4;
  font-size:.60rem;
  font-weight:760;
  letter-spacing:.055em;
  backdrop-filter:blur(6px);
  pointer-events:none
}
.ovm-live-badge i{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 10px rgba(72,209,63,.80)
}
.ovm-live-badge span+span:before{content:"·";margin-right:7px;color:#6f9f82}

.ovm-live-starting{
  position:absolute;
  inset:0;
  z-index:7;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:11px;
  background:rgba(1,6,11,.58);
  color:#e4f2fb;
  text-align:center;
  font-size:.70rem;
  font-weight:720;
  letter-spacing:.075em;
  backdrop-filter:blur(2px);
  pointer-events:none
}
.ovm-live-spinner{
  width:27px;
  height:27px;
  border-radius:50%;
  border:2px solid rgba(105,167,204,.25);
  border-top-color:#64bded;
  animation:ovm-live-spin .9s linear infinite
}
@keyframes ovm-live-spin{to{transform:rotate(360deg)}}

/* Transient/status message deliberately uses the TOP CENTRE, never the existing bottom captions. */
.ovm-live-message{
  position:absolute;
  left:50%;
  top:10px;
  right:auto;
  transform:translateX(-50%);
  z-index:9;
  display:none;
  justify-content:center;
  width:max-content;
  max-width:calc(100% - 190px);
  pointer-events:none
}
.ovm-live-message.show{display:flex}
.ovm-live-message span{
  max-width:min(520px,92vw);
  padding:7px 10px;
  border:1px solid rgba(255,211,41,.34);
  border-radius:7px;
  background:rgba(26,22,7,.90);
  color:#ffe47e;
  font-size:.61rem;
  font-weight:700;
  letter-spacing:.04em;
  text-align:center;
  white-space:nowrap;
  backdrop-filter:blur(6px)
}
.ovm-live-message.availability span{
  border-color:rgba(117,150,170,.35);
  background:rgba(5,15,24,.88);
  color:#9db2c0
}

.ovm-cam-initial-loading{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#6f8798;
  background:#020407;
  font-size:.62rem;
  font-weight:650;
  letter-spacing:.07em;
  pointer-events:none
}
.ovm-cam-initial-loading.loaded{display:none}

.ovm-live-meta{
  display:none;
  margin-top:8px;
  color:#80a8bf;
  font-size:.66rem;
  line-height:1.4
}
.ovm-live-meta.visible{display:block}
.ovm-live-meta strong{color:#c7dce8;font-weight:650}

@media(max-width:800px){
  .ovm-live-controls.ovm-live-controls-idle{top:8px;right:8px}
  .ovm-live-controls.ovm-live-controls-active{left:8px;right:8px;bottom:8px}
  .ovm-live-button{min-height:36px;padding:8px 10px;font-size:.60rem}
  .ovm-live-badge{left:8px;top:8px;font-size:.56rem}
  .ovm-live-starting{font-size:.64rem}
  .ovm-live-message{top:8px;max-width:calc(100% - 120px)}
  .ovm-live-message span{font-size:.56rem;white-space:normal}
}
