/* Accessibility layer for playlist, floating player and library UI. */

.dpp-a11y-only,
.dpp-a11y-live {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

:where(.dpp-playlist-container, .dpp-floating-player, .dpp-library-panel, .dpp-share-dialog)
:where(button, a, input, [role="slider"], [role="tab"], [tabindex]):focus-visible,
.dpp-resume-card :where(button, a):focus-visible,
.dpp-next-playlist-card :where(button, a):focus-visible {
    outline: 3px solid var(--dpp-primary, #6a4e9e) !important;
    outline-offset: 3px;
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--dpp-primary, #6a4e9e) 20%, transparent) !important;
}

.dpp-progress-bar[role="slider"] {
    min-height: 18px;
    cursor: pointer;
    position: relative;
}

.dpp-progress-bar[role="slider"]::after {
    content: "";
    position: absolute;
    inset: -5px 0;
}

.dpp-progress-bar[role="slider"]:focus-visible {
    border-radius: 999px;
}

.dpp-track-row[aria-current="true"] {
    border-inline-start: 4px solid var(--dpp-primary, #6a4e9e);
}

.dpp-track-actions button,
.dpp-player-controls button,
.dpp-library-item-actions button,
.dpp-library-close,
.dpp-floating-play-btn,
.dpp-current-track-btn {
    min-width: 34px;
    min-height: 34px;
}

.dpp-library-panel[role="dialog"]:focus {
    outline: none;
}

.dpp-library-tab[aria-selected="true"] {
    background: var(--dpp-primary-light, rgba(106, 78, 158, .14));
    border-color: var(--dpp-primary, #6a4e9e);
    color: var(--dpp-primary, #6a4e9e);
}

.dpp-library-item[draggable="true"] .dpp-library-drag {
    cursor: grab;
}

.dpp-library-item[draggable="true"]:active .dpp-library-drag {
    cursor: grabbing;
}

.dpp-floating-player button[aria-pressed="true"],
.dpp-playlist-filter[aria-pressed="true"] {
    border-color: var(--dpp-primary, #6a4e9e);
}

.dpp-notification {
    max-width: min(92vw, 480px);
}

@media (prefers-reduced-motion: reduce) {
    .dpp-floating-player,
    .dpp-library-panel,
    .dpp-share-overlay,
    .dpp-share-dialog,
    .dpp-resume-card,
    .dpp-next-playlist-card,
    .dpp-track-row,
    .dpp-notification,
    .dpp-shared-track {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }

    .dpp-shared-track {
        animation: none !important;
    }
}

@media (forced-colors: active) {
    :where(.dpp-playlist-container, .dpp-floating-player, .dpp-library-panel, .dpp-share-dialog)
    :where(button, a, input, [role="slider"], [role="tab"]):focus-visible {
        outline: 3px solid Highlight !important;
        box-shadow: none !important;
    }

    .dpp-track-row,
    .dpp-floating-player,
    .dpp-library-panel,
    .dpp-share-dialog,
    .dpp-resume-card {
        border: 1px solid CanvasText;
    }

    .dpp-track-row[aria-current="true"] {
        border-inline-start: 5px solid Highlight;
    }
}