/* Fresh Video Implementation - Tailwind Style Classes */

/* New video container with Tailwind-style naming */
.video-container-new {
    @apply relative w-full bg-black rounded-lg overflow-hidden shadow-lg;
    /* Ensure no dimming effects */
    opacity: 1 !important;
    filter: none !important;
}

/* New video wrapper */
.video-wrapper-new {
    @apply relative w-full bg-black rounded-lg overflow-hidden;
    /* Ensure no dimming effects */
    opacity: 1 !important;
    filter: none !important;
}

/* Tailwind-style video player */
.tailwind-video-player {
    @apply block w-full h-[500px] border-0 bg-black rounded-lg;
    /* iOS compatibility */
    -webkit-playsinline: true;
    playsinline: true;
    -webkit-presentation-mode: inline;
    /* Ensure proper video rendering */
    object-fit: contain;
    /* CRITICAL: Force 100% brightness - no dimming */
    filter: none !important;
    opacity: 1 !important;
    -webkit-filter: none !important;
    -webkit-opacity: 1 !important;
    brightness: 100% !important;
    -webkit-brightness: 100% !important;
    contrast: 100% !important;
    -webkit-contrast: 100% !important;
    grayscale: 0% !important;
    -webkit-grayscale: 0% !important;
    saturate: 100% !important;
    -webkit-saturate: 100% !important;
    /* Force visibility */
    visibility: visible !important;
    /* Remove any transforms */
    transform: none !important;
    -webkit-transform: none !important;
    /* Ensure no background dimming */
    background: transparent !important;
    /* Remove any potential dimming overlays */
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

/* YouTube iframe specific styling */
.video-wrapper-new iframe.tailwind-video-player {
    /* Additional YouTube-specific overrides */
    pointer-events: auto;
    /* Ensure no fullscreen takeover */
    -webkit-presentation-mode: inline !important;
}

/* iOS-specific handling for new video elements */
@supports (-webkit-touch-callout: none) {
    .video-container-new {
        @apply relative overflow-hidden;
        /* Prevent iOS fullscreen takeover */
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
    }
    
    .video-wrapper-new {
        @apply relative overflow-hidden;
        /* Prevent iOS fullscreen takeover */
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
    }
    
    .tailwind-video-player {
        /* Prevent iOS from taking over fullscreen */
        pointer-events: auto;
        /* Force inline playback */
        -webkit-playsinline: true;
        playsinline: true;
        /* Disable fullscreen on iOS */
        -webkit-presentation-mode: inline;
    }
    
    /* Hide video when tab is not active to prevent iOS issues */
    .playbook-tab-content:not(.active) .video-container-new {
        pointer-events: none;
        opacity: 0;
        visibility: hidden;
    }
    
    /* Show video when tab becomes active */
    .playbook-tab-content.active .video-container-new {
        pointer-events: auto;
        opacity: 1;
        visibility: visible;
        transition: opacity 0.3s ease;
    }
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .tailwind-video-player {
        @apply h-[300px];
    }
}

@media (max-width: 480px) {
    .tailwind-video-player {
        @apply h-[250px];
    }
}

/* Global video brightness override - highest precedence */
video,
.video-container-new video,
.video-wrapper-new video,
.tailwind-video-player,
.playbook-tab-content video,
.playbook-tab-content .video-container-new video,
.playbook-tab-content .video-wrapper-new video,
.playbook-tab-content:not(.active) .video-container-new video,
.playbook-tab-content:not(.active) .video-wrapper-new video,
.playbook-tab-content.active .video-container-new video,
.playbook-tab-content.active .video-wrapper-new video {
    /* ULTIMATE BRIGHTNESS OVERRIDE */
    filter: none !important;
    opacity: 1 !important;
    -webkit-filter: none !important;
    -webkit-opacity: 1 !important;
    brightness: 100% !important;
    -webkit-brightness: 100% !important;
    contrast: 100% !important;
    -webkit-contrast: 100% !important;
    grayscale: 0% !important;
    -webkit-grayscale: 0% !important;
    saturate: 100% !important;
    -webkit-saturate: 100% !important;
    visibility: visible !important;
    transform: none !important;
    -webkit-transform: none !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

/* Remove any potential overlays from old CSS */
.video-wrapper-new::before,
.video-wrapper-new::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* Ensure no hover effects dim the video */
.video-container-new:hover,
.video-wrapper-new:hover,
.tailwind-video-player:hover {
    filter: none !important;
    opacity: 1 !important;
    -webkit-filter: none !important;
    -webkit-opacity: 1 !important;
    brightness: 100% !important;
    -webkit-brightness: 100% !important;
}