/* Yolori - penyesuaian tampilan di dalam ruang */

/* label nama peserta jangan tertimpa bilah tombol bawah */
#videoMediaContainer p.username {
    background: rgba(14, 42, 82, 0.72);
    border-radius: 8px;
    padding: 2px 10px;
}

@media (max-width: 900px) {
    #videoMediaContainer p.username {
        transform: translateY(-72px);
    }
}

/* penggeser volume mengikuti warna Yolori */
input[type='range'],
.videoMenuBar input[type='range'],
.navbar-dropdown-control input[type='range'],
#bottomButtons input[type='range'] {
    accent-color: #1b67b2;
}

/* bilah tombol bawah + bilah video: sudut 8px, navy Yolori */
#bottomButtons {
    gap: 8px;
}

#bottomButtons button,
#bottomButtons .split-btn,
#bottomButtons .split-btn > button,
.videoMenuBar button {
    border-radius: 8px;
}

#bottomButtons button,
#bottomButtons .split-btn {
    background: #0e2a52;
}

#bottomButtons button:hover {
    background: #12508f;
}

/* menu titik tiga */
.navbar-dropdown-content {
    background: #0e2a52;
    border: 1px solid #12508f;
    border-radius: 8px;
}

.navbar-dropdown-item:hover {
    background: #12508f;
}

/* tombol-belah (mik + panah, kamera + panah): sudut 8px per pojok */
#bottomButtons .split-btn > button:not(.device-dropdown-toggle) {
    border-radius: 8px 0 0 8px;
}

#bottomButtons .split-btn .device-dropdown-toggle {
    border-radius: 0 8px 8px 0;
}
