/* Custom Video — honors editor Styles via CSS variables; wrapper spacing injected via HubL */
.cvideo { width: var(--cv-width, 100%); } /* no default margins; editor margins control layout */
.cvideo__inner { width: 100%; }

.cvideo__frame {
  position: relative;
  width: 100%;
  background: var(--cv-bg, #000);
  overflow: hidden;
  border-radius: var(--cv-radius, 12px);
  /* Border (width/style/color) comes from Styles tab via injected CSS rule in HubL */
}

/* Use fixed height if provided; otherwise aspect-ratio */
.cvideo[style*="--cv-height"] .cvideo__frame { height: var(--cv-height); }
.cvideo:not([style*="--cv-height"]) .cvideo__frame { aspect-ratio: var(--cv-aspect, 16/9); }

/* Fallback for old browsers */
@supports not (aspect-ratio: 1/1) {
  .cvideo:not([style*="--cv-height"]) .cvideo__frame::before {
    content:"";
    display:block;
    padding-top: calc(100% / (var(--cv-aspect)));
  }
  .cvideo:not([style*="--cv-height"]) .cvideo__frame > * { position:absolute; inset:0; }
}

.cvideo__embed-wrap,
.cvideo__thumb { position:absolute; inset:0; width:100%; height:100%; display:grid; place-items:center; border:0; }
.cvideo__thumb { cursor:pointer; padding:0; background:none; }
.cvideo__thumb-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border:0; }

/* Invisible, full-frame click overlay (no hover visuals) */
.cvideo__overlay{
  position:absolute;
  inset:0;
  border:0;
  background:transparent;
  cursor:pointer;
}
button.cvideo__overlay,
button.cvideo__overlay:hover,
button.cvideo__overlay:active {
  opacity:0;
  background-color:unset !important;
}

.cvideo__iframe {
  width:100%;
  height:100%;
  border:0;
  display:block;
  border-radius: var(--cv-radius, 12px);
}