/*Style the midi-player using Pico CSS variables for light/dark mode support*/

midi-player::part(control-panel) {
    background-color: var(--pico-form-element-background-color);
    border: var(--pico-border-width) solid var(--pico-form-element-border-color);
    color: var(--pico-color);
    border-radius: var(--pico-border-radius);
    transition: background-color var(--pico-transition), border-color var(--pico-transition), box-shadow var(--pico-transition);
}

midi-player::part(play-button) {
    color: var(--pico-primary);
    background-color: transparent;
    transition: background-color var(--pico-transition), color var(--pico-transition);
}

midi-player::part(play-button):hover {
    background-color: var(--pico-primary-hover);
    color: var(--pico-primary-inverse);
}

midi-player::part(current-time),
midi-player::part(total-time) {
    color: var(--pico-muted-color);
    font-size: 0.875rem;
}

/*Seek bar styling to match Pico's range input*/
midi-player::part(seek-bar) {
    --pico-range-thumb-color: var(--pico-primary);
    accent-color: var(--pico-primary);
}