/* NeonWave — styles bureau
   Onglet « Historique » de la bibliothèque : mêmes lignes que les autres onglets
   (.lib-row-item), langage verre sombre, coins 12 px. */

#libraryCollections .lib-history-block { display: flex; flex-direction: column; gap: 2px; }
#libraryCollections .lib-history-block[hidden] { display: none !important; }

#libraryCollections .lib-history-row { position: relative; border-radius: 12px; }
#libraryCollections .lib-history-row .lib-row-img {
    position: relative;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
#libraryCollections .lib-history-row .lib-row-img.fallback-img { color: rgba(255, 255, 255, 0.72); }
#libraryCollections .lib-history-row .lib-row-info { flex: 1; min-width: 0; }

/* Halo lecture au survol / focus clavier */
#libraryCollections .lib-history-play {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    color: #fff;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity 0.18s ease;
}
#libraryCollections .lib-history-play svg { width: 22px; height: 22px; }
#libraryCollections .lib-history-row:hover .lib-history-play,
#libraryCollections .lib-history-row:focus-visible .lib-history-play { opacity: 1; }
#libraryCollections .lib-history-row:focus-visible { outline: 2px solid rgba(255, 255, 255, 0.35); outline-offset: -2px; }

/* « il y a X min » : pastille discrète à droite */
#libraryCollections .lib-history-when {
    flex-shrink: 0;
    margin-left: auto;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    color: var(--text-subdued, #b3b3b3);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

#libraryCollections .lib-history-row.is-current .lib-row-title { color: var(--clr-primary, #5b9aff); }

/* Chargement */
#libraryCollections .lib-history-loading { display: flex; flex-direction: column; gap: 8px; padding: 4px 0; }
#libraryCollections .lib-history-skeleton {
    height: 64px;
    border-radius: 12px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.04));
    background-size: 200% 100%;
    animation: nw-history-shimmer 1.4s ease-in-out infinite;
}
@keyframes nw-history-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) {
    #libraryCollections .lib-history-skeleton { animation: none; }
    #libraryCollections .lib-history-play { transition: none; }
}

@media (max-width: 768px) {
    #libraryCollections .lib-history-when { padding: 3px 8px; font-size: 11px; }
    #libraryCollections .lib-history-skeleton { height: 56px; }
}

/* Pastilles de filtre de la bibliothèque (Playlists / Artistes / Téléchargé / Historique).
   style.css les masque en `display:none !important` (bloc « mobile interface ») alors que
   neon-lucid.css veut les afficher sur bureau : on tranche ici. `.hidden` (sous-vues) reste prioritaire. */
#libraryView .library-filters-mobile { display: flex !important; flex-wrap: wrap; gap: 8px; padding: 16px 16px 0; }
#libraryView .library-filters-mobile.hidden { display: none !important; }