.mejs-controls {
    display: flex !important;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
}

.mejs-container, .mejs-container .mejs-controls, .mejs-embed, .mejs-embed body {
    background: var(--hmt-primary-color) !important;
    border-radius: 10px;
    transition: all 0.3s;
}

.mejs-controls .mejs-time-rail .mejs-time-current {
    background: var(--hmt-primary-color) !important;
}

.mejs-container .mejs-controls:has(.mejs-pause) {
    background: var(--hmt-accent-color) !important;
}

.mejs-container:hover .mejs-controls {
    background: var(--hmt-accent-color) !important;
}