/* Styles personnalisés pour les paragraphs vidéo */

/* Variante avec fond coloré */
.section-video.variant-colored {
  background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
}

/* Variante avec bordure */
.section-video.variant-bordered .video-player {
  border: 3px solid #008093;
  box-shadow: 0 15px 40px rgba(0, 128, 147, 0.2);
}

/* Variante compacte */
.section-video.variant-compact {
  padding: 40px 0;
}

.section-video.variant-compact .video-player {
  max-width: 600px;
  margin: 0 auto;
}

/* Animation de chargement personnalisée */
.video-player.loading .play-button::after {
  content: '';
  position: absolute;
  width: 40px;
  height: 40px;
  border: 3px solid rgba(255, 255, 255, 0.3);
  border-top: 3px solid #ffffff;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Styles pour les vidéos en mode sombre */
.section-video.theme-dark {
  background-color: #1a1a1a;
  color: #ffffff;
}

.section-video.theme-dark .section-title {
  color: #73BCBE;
}

.section-video.theme-dark .video-description {
  color: #cccccc;
}

/* Effet de survol avancé */
.video-player:hover .video-overlay {
  background: linear-gradient(45deg, rgba(0, 128, 147, 0.8), rgba(115, 188, 190, 0.8));
}

.video-player:hover .play-button {
  background-color: rgba(255, 255, 255, 0.95);
  transform: scale(1.15);
}

.video-player:hover .play-icon {
  color: #008093;
}

/* Responsive amélioré pour très petits écrans */
@media (max-width: 320px) {
  .section-video .video-player {
    border-radius: 0;
  }
  
  .section-video .play-button {
    width: 50px;
    height: 50px;
  }
  
  .section-video .play-icon {
    width: 20px;
    height: 20px;
  }
}

/* Styles pour l'impression */
@media print {
  .section-video .video-overlay,
  .section-video .video-actions {
    display: none;
  }
  
  .section-video .video-element {
    display: none;
  }
  
  .section-video .video-description::before {
    content: "[Vidéo: " attr(data-video-title) "]";
    font-style: italic;
    color: #666;
  }
}