/**
 * Single Post Video Player Styles
 * Full-width sizing to match featured images
 * ONLY affects single post pages - multimedia cards unchanged
 * 
 * @package Capital FM
 * @version 1.2
 */

/* ============================================================================
   SINGLE POST VIDEO PLAYER ONLY
   Full width to match featured images on single posts
   ============================================================================ */

   .single-post .post-featured-image,
   .single .post-featured-image {
       width: 100%;
       max-width: 100%;
       margin: 0 0 2rem 0;
       padding: 0;
   }
   
   .single-post .post-featured-image .single-post-video-player,
   .single .post-featured-image .single-post-video-player {
       position: relative;
       width: 100%;
       max-width: 100%;
       padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
       height: 0;
       overflow: hidden;
       background: #000;
       border-radius: 8px;
       margin: 0;
   }
   
   .single-post .post-featured-image .single-post-video-player iframe,
   .single .post-featured-image .single-post-video-player iframe {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       border: 0;
   }
   
   /* Regular featured images on single posts (for comparison) */
   .single-post .post-featured-image img,
   .single .post-featured-image img {
       width: 100%;
       max-width: 100%;
       height: auto;
       display: block;
       border-radius: 8px;
   }
   
   /* ============================================================================
      STORY CONTAINER OVERRIDE (Single Posts Only)
      Ensure video doesn't get constrained by parent containers
      ============================================================================ */
   
   .single-post .story-container .post-featured-image,
   .single .story-container .post-featured-image {
       width: 100% !important;
       max-width: 100% !important;
       margin-left: 0 !important;
       margin-right: 0 !important;
   }
   
   .single-post .story-container .post-featured-image .single-post-video-player,
   .single .story-container .post-featured-image .single-post-video-player {
       /* width: 100% !important; */
       max-width: 100% !important;
   }
   
   /* ============================================================================
      LIGHTBOX VIDEO PLAYER (Multimedia Page)
      Keep existing lightbox styling - DO NOT CHANGE
      ============================================================================ */
   
   #video-lightbox .video-container {
       position: relative;
       padding-bottom: 56.25%;
       height: 0;
       overflow: hidden;
       max-width: 1400px;
       width: 90%;
       margin: 0 auto;
       border-radius: 12px;
       background: #000;
       box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
   }
   
   #video-lightbox .video-container iframe {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       height: 100%;
       border: 0;
   }
   
   /* ============================================================================
      RESPONSIVE ADJUSTMENTS (Single Posts Only)
      ============================================================================ */
   
   /* Desktop - Large screens */
   @media (min-width: 1200px) {
       .single-post .post-featured-image .single-post-video-player,
       .single .post-featured-image .single-post-video-player {
           border-radius: 12px;
       }
       
       #video-lightbox .video-container {
           width: 85%;
           max-width: 1600px;
       }
   }
   
   /* Tablet */
   @media (max-width: 768px) {
       .single-post .post-featured-image .single-post-video-player,
       .single .post-featured-image .single-post-video-player {
           border-radius: 6px;
       }
       
       .single-post .post-featured-image,
       .single .post-featured-image {
           margin-bottom: 1.5rem;
       }
       
       #video-lightbox .video-container {
           width: 95%;
       }
   }
   
   /* Mobile */
   @media (max-width: 480px) {
       .single-post .post-featured-image .single-post-video-player,
       .single .post-featured-image .single-post-video-player {
           border-radius: 4px;
       }
       
       .single-post .post-featured-image,
       .single .post-featured-image {
           margin-bottom: 1rem;
       }
       
       #video-lightbox .video-container {
           width: 100%;
           border-radius: 0;
       }
   }
   
   .single-post-video-player{
    width: 720px !important;
   }
   /* ============================================================================
      LOADING STATE (Single Posts Only)
      ============================================================================ */
   
   .single-post .single-post-video-player:not(:has(iframe[src])):before,
   .single .single-post-video-player:not(:has(iframe[src])):before {
       content: '';
       position: absolute;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);
       width: 40px;
       height: 40px;
       border: 3px solid rgba(255, 255, 255, 0.3);
       border-top-color: #fff;
       border-radius: 50%;
       animation: video-spinner 0.8s linear infinite;
       z-index: 1;
       pointer-events: none;
   }
   
   @keyframes video-spinner {
       to {
           transform: translate(-50%, -50%) rotate(360deg);
       }
   }
   
   /* ============================================================================
      VIDEO THUMBNAIL ASPECT RATIO (Single Posts Only)
      For YouTube thumbnails auto-fetched
      ============================================================================ */
   
   .single-post .post-featured-image img[src*="youtube.com"],
   .single-post .post-featured-image img[src*="ytimg.com"],
   .single-post .post-featured-image img[src*="img.youtube.com"],
   .single .post-featured-image img[src*="youtube.com"],
   .single .post-featured-image img[src*="ytimg.com"],
   .single .post-featured-image img[src*="img.youtube.com"] {
       width: 100%;
       max-width: 100%;
       aspect-ratio: 16 / 9;
       object-fit: cover;
   }
   
   /* ============================================================================
      PREVENT SHRINKING (Single Posts Only)
      Important overrides to ensure full width
      ============================================================================ */
   
   .single-post article.post-container .post-featured-image,
   .single-post article.post-container .post-featured-image .single-post-video-player,
   .single article.post-container .post-featured-image,
   .single article.post-container .post-featured-image .single-post-video-player {
       min-width: 100% !important;
   }