/*==================================================
        VIDEO PLAYER
==================================================*/

.video-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    overflow: hidden;
    border-radius: 12px;
}

.video-wrapper iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: none;
}

.video-navigation,
.course-navigation{

    display:flex;

    justify-content:center;

    gap:15px;

    margin-top:20px;

    flex-wrap:wrap;

}

.video-navigation button,
.course-navigation button{

    background:#f4b400;

    color:#000;

    border:none;

    padding:12px 24px;

    border-radius:8px;

    cursor:pointer;

    font-weight:bold;

    transition:.3s;

}

.video-navigation button:hover,
.course-navigation button:hover{

    background:#d89d00;

}

.playlist-item{

    cursor:pointer;

    padding:12px;

    margin-bottom:10px;

    border-radius:8px;

    transition:.3s;

}

.playlist-item:hover{

    background:#f5f5f5;

}

.playlist-item.active{

    background:#f4b400;

    color:#000;

    font-weight:bold;

}