body {
  margin: 0;
  padding: 0;
}

.cc-content-video {
  position: relative;
  width: 100%;
  background: #000;
}

/* Il contenitore resta nel flusso (altezza congelata via JS) come segnaposto;
   diventa fixed solo il player interno. */
.cc-content-video-floating .cc-mini-target {
  position: fixed !important;
  left: 16px !important;
  right: auto !important;
  bottom: 16px !important;
  top: auto !important;
  width: min(380px, 45vw) !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  z-index: 9990; /* sotto al banner Iubenda, che resta sempre in primo piano */
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32);
  border-radius: 14px;
  overflow: hidden;
  cursor: pointer; /* click -> torna in cima al player */
  animation: ccMiniIn 0.25s ease;
}

.cc-content-video-floating .cc-mini-target video {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
}

/* In modalita' mini nascondi l'HUD (barra controlli + big play) del contenuto live.
   Torna visibile da solo quando il player riprende le dimensioni piene. */
.cc-content-video-floating .cc-mini-target .vjs-control-bar,
.cc-content-video-floating .cc-mini-target .vjs-big-play-button {
  display: none !important;
}

/* Scudo trasparente sopra il mini: cattura il click (niente play/pausa sul video)
   e serve solo a tornare in cima. */
.cc-mini-click-shield {
  position: absolute;
  inset: 0;
  z-index: 10;
  cursor: pointer;
}

@keyframes ccMiniIn {
  from {
    opacity: 0.4;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.theoplayer-container {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  max-width: 100%;
  overflow: hidden;
  background: #000;
}
.theoplayer-container video {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Restore THEOplayer icon font after the site's global font reset. */
.theoplayer-skin .vjs-button,
.theoplayer-skin .vjs-button:before,
.theoplayer-skin .vjs-icon-play,
.theoplayer-skin .vjs-play-control,
.theoplayer-skin .vjs-play-control:before,
.theoplayer-skin .vjs-big-play-button,
.theoplayer-skin .vjs-big-play-button:before,
.theoplayer-skin .vjs-mute-control,
.theoplayer-skin .vjs-mute-control:before,
.theoplayer-skin .vjs-volume-menu-button,
.theoplayer-skin .vjs-volume-menu-button:before,
.theoplayer-skin .vjs-fullscreen-control,
.theoplayer-skin .vjs-fullscreen-control:before,
.theoplayer-skin .theo-settings-button,
.theoplayer-skin .theo-settings-button:before,
.theoplayer-skin .vjs-live-control,
.theoplayer-skin .vjs-live-control:before,
.theoplayer-skin .vjs-live-display,
.theoplayer-skin .vjs-live-display:before,
.theoplayer-skin .theo-live-control,
.theoplayer-skin .theo-live-control:before {
  font-family: THEOplayer !important;
}

.theoplayer-skin .vjs-control-bar,
.theoplayer-skin .vjs-big-play-button,
.theoplayer-skin .vjs-button:before {
  color: #fff;
}

.theoplayer-skin .theo-menu .theo-menu-item.vjs-selected,
.theoplayer-skin .theo-menu .theo-menu-item.vjs-selected:focus,
.theoplayer-skin .theo-menu .theo-menu-item.vjs-selected:hover {
  color: #fff;
}

.theo-primary-color,
.theo-multi-view-menu-layout-select button.vjs-selected,
.theo-switch-audio-button,
.theo-disable-button,
.theo-resize-button,
.theo-layout-menu-item,
.theo-upnext-panel .theo-upnext-panel-content .theo-upnext-panel-autoplay,
.theoplayer-skin .theo-settings-control-menu-item-hd-label,
.theoplayer-skin .theo-settings-control-menu-item-value,
.theoplayer-skin .vjs-volume-level,
.theoplayer-skin .vjs-play-progress,
.theoplayer-skin .vjs-slider-bar,
.theoplayer-skin .vjs-big-play-button {
  color: #fff;
}

.theo-primary-background,
.theo-social .theo-social-container .theo-social-label,
.theoplayer-skin .theo-menu-header,
.theoplayer-skin .theo-settings-control-label-hd {
  background-color: #fff;
}

.theoplayer-skin .theo-context-menu {
  display: none;
}

.theoplayer-skin:hover .vjs-big-play-button,
.theoplayer-skin .vjs-big-play-button:focus {
  background: none;
}

.theoplayer-skin .vjs-big-play-button {
  display: flex;
  align-items: center;
  justify-content: center;
}

.theoplayer-skin .vjs-control-bar {
  display: flex;
}

.theoplayer-skin.vjs-has-started .vjs-big-play-button,
.theoplayer-skin.vjs-playing .vjs-big-play-button {
  display: none;
}
.theoplayer-skin .theo-live-control-indicator,
.theoplayer-skin .theo-live-control-indicator:before {
  font-family: THEOplayer !important;
  font-weight: normal !important;
  font-style: normal !important;
}

.theoplayer-skin .theo-live-control-indicator:before {
  content: "\f111" !important;
  color: #ff2b2b;
}

/* MOBILE: resta in basso a destra, solo piu piccolo (NON full-width) */
@media (max-width: 767px) {
  .cc-content-video-floating .cc-mini-target {
    left: 12px !important;
    right: auto !important;
    bottom: 12px !important;
    width: 200px !important;
    max-width: 60vw !important;
    border-radius: 10px;
  }
}
