.wt-player {
	--plyr-color-main: var(--primary-color);
	--plyr-audio-control-color: var(--icon-color);
	--plyr-audio-control-color-hover: var(--icon-btn-hover-color);
	--plyr-audio-controls-background: var(--content-wrapper-color);
	--plyr-controls-icon-size: var(--icon-sm-size);
	--plyr-controls-icon-padding: var(--spacing-2xs);
	--plyr-audio-control-background-hover: transparent;
	--plyr-audio-progress-buffered-background: var(
		--dp-14-surface-color
	); /* loaded color */
	--wt-player-audio-progress-background: var(
		--wt-slider-background-color
	); /* not played color */
	--plyr-tooltip-background: var(--wt-tooltip-background-color);
	--plyr-tooltip-color: var(--wt-tooltip-text-color);
	/* --plyr-control-toggle-checked-background: var(--main-color); */
	--player-close-icon-transform-translate-x: var(--spacing-md);
	/* "-1 * var" for use the negative value of a variable */
	--player-close-icon-transform-translate-y: calc(-1 * var(--spacing-md));

	--wt-slider-border: 1px solid var(--secondary-color);
	--wt-slider-pointer-radius: 50%;
	--wt-slider-pointer-background-color: var(--dp-24-surface-color);
	--wt-slider-pointer-border-color: var(--dp-10-surface-color);
	--wt-slider-pointer-size: 16px;
}