/* videoplayer.css */

/* Styling for the video player section */
.video-player-section {
    padding: 20px;
    margin-top: 200px; /* Increased margin from the input field */
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 1;
}

.video-container {
    width: 100%;
    max-width: 1080px; /* Max-width for larger displays */
    aspect-ratio: 16 / 9; /* Maintain 16:9 aspect ratio */
    border-radius: 15px; /* Rounded corners */
    overflow: hidden; /* Ensure the corners are actually rounded */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Slight shadow for depth */
    background-color: #0c031f; /* Same background color as the page */
}

.video-container iframe {
    width: 100%;
    height: 100%; /* Match height to container */
    border: none; /* Remove border around the iframe */
}


/* Responsive styles */
@media (max-width: 767px) {
    .video-player-section {
        margin-top: 100px; /* Adjust margin for smaller screens */
    }

    .video-container {
        max-width: 100%; /* Full width for mobile */
        aspect-ratio: 16 / 9; /* Maintain 16:9 aspect ratio */
    }

    .video-container iframe {
        height: 100%; /* Maintain full height in responsive mode */
    }
}