/* ==========================================================================
   BeatLatin — Tablas unificadas (audio, video, DJ, single remix)
   Modo claro y oscuro · sin líneas de cuadrícula
   ========================================================================== */

:root,
[data-theme="dark"] {
    --bl-table-th: rgba(255, 255, 255, 0.48);
    --bl-table-td: rgba(255, 255, 255, 0.64);
    --bl-table-title: rgba(255, 255, 255, 0.92);
    --bl-table-artist: rgba(255, 255, 255, 0.64);
    --bl-table-version: #ffffff;
    --bl-table-divider: rgba(255, 255, 255, 0.07);
    --bl-table-hover: rgba(255, 255, 255, 0.04);
    --bl-table-active-bg: rgba(255, 255, 255, 0.05);
    --bl-table-active-bar: #d90c0c;
    --bl-table-head-bg: transparent;

    --bl-pag-text: rgba(255, 255, 255, 0.58);
    --bl-pag-bg: rgba(255, 255, 255, 0.05);
    --bl-pag-border: rgba(255, 255, 255, 0.12);
    --bl-pag-hover-text: #000000;
    --bl-pag-hover-bg: #ffffff;
    --bl-pag-hover-border: #ffffff;
    --bl-pag-active-text: #000000;
    --bl-pag-active-bg: #ffffff;
    --bl-pag-active-border: #ffffff;
}

[data-theme="light"] {
    --bl-table-th: rgba(29, 29, 31, 0.45);
    --bl-table-td: rgba(29, 29, 31, 0.64);
    --bl-table-title: rgba(29, 29, 31, 0.92);
    --bl-table-artist: rgba(29, 29, 31, 0.55);
    --bl-table-version: #1d1d1f;
    --bl-table-divider: rgba(0, 0, 0, 0.07);
    --bl-table-hover: rgba(0, 0, 0, 0.03);
    --bl-table-active-bg: rgba(0, 0, 0, 0.04);
    --bl-table-active-bar: #d90c0c;
    --bl-table-head-bg: transparent;

    --bl-pag-text: rgba(29, 29, 31, 0.62);
    --bl-pag-bg: rgba(255, 255, 255, 0.95);
    --bl-pag-border: rgba(0, 0, 0, 0.12);
    --bl-pag-hover-text: #ffffff;
    --bl-pag-hover-bg: #1d1d1f;
    --bl-pag-hover-border: #1d1d1f;
    --bl-pag-active-text: #ffffff;
    --bl-pag-active-bg: #1d1d1f;
    --bl-pag-active-border: #1d1d1f;
}

/* ---------- Reset bordes — solo línea horizontal por fila ---------- */

.remix-grid-wrapper .remix-table th,
.remix-grid-wrapper .remix-table td,
.dj-container #dj-remix-table th,
.dj-container #dj-remix-table td,
.Related-version-table #dj-remix-table th,
.Related-version-table #dj-remix-table td {
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    background: transparent !important;
}

.remix-grid-wrapper .remix-table tbody tr,
.dj-container #dj-remix-table tbody tr,
.Related-version-table #dj-remix-table tbody tr,
.Related-version-table #dj-remix-table tr {
    border: 0 !important;
    background: transparent !important;
}

.remix-grid-wrapper .remix-table thead th {
    color: var(--bl-table-th) !important;
    border-bottom: 1px solid var(--bl-table-divider) !important;
    background: var(--bl-table-head-bg) !important;
}

.remix-grid-wrapper .remix-table tbody td {
    color: var(--bl-table-td) !important;
    border-bottom: 1px solid var(--bl-table-divider) !important;
}

.remix-grid-wrapper .remix-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

.dj-container #dj-remix-table thead {
    background: var(--bl-table-head-bg) !important;
}

.dj-container #dj-remix-table th {
    color: var(--bl-table-th) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--bl-table-divider) !important;
}

.dj-container #dj-remix-table td {
    color: var(--bl-table-td) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--bl-table-divider) !important;
}

.dj-container #dj-remix-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

.Related-version-table #dj-remix-table th {
    color: var(--bl-table-th) !important;
    border-bottom: 1px solid var(--bl-table-divider) !important;
}

.Related-version-table #dj-remix-table td {
    color: var(--bl-table-td) !important;
    border-bottom: 1px solid var(--bl-table-divider) !important;
}

.Related-version-table #dj-remix-table tbody tr:last-child td,
.Related-version-table #dj-remix-table tr:last-child td {
    border-bottom: 0 !important;
}

/* ---------- Títulos y artistas ---------- */

.remix-grid-wrapper .remix-title-main,
.remix-grid-wrapper .remix-table td:nth-child(2),
.dj-container #dj-remix-table .remix-title-main,
.Related-version-table .remix-title-main,
.Related-version-table #dj-remix-table .remix-title-main {
    color: var(--bl-table-title) !important;
}

.remix-grid-wrapper .remix-title-artist,
.dj-container #dj-remix-table .remix-title-artist,
.Related-version-table .remix-title-artist,
.Related-version-table #dj-remix-table .remix-title-artist {
    color: var(--bl-table-artist) !important;
}

.remix-grid-wrapper .remix-title-link,
.dj-container #dj-remix-table .remix-title-link,
.Related-version-table .remix-title-link {
    color: var(--bl-table-title) !important;
}

/* Título de tablas: NO navega al single (usar ⋯ → Información, que va precargado).
   pointer-events:none deshabilita el clic sin romper la lectura que hace player.js
   del href/texto vía JS. NO aplica a la búsqueda (usa .bl-search-result__meta). */
.remix-title-link {
    pointer-events: none !important;
    cursor: default !important;
}

.remix-grid-wrapper .cell-version-highlight,
.dj-container #dj-remix-table .cell-version-highlight,
.Related-version-table .cell-version-highlight,
.single-remix-system .cell-version-highlight {
    color: var(--bl-table-version) !important;
    text-shadow: none !important;
}

.Related-version-table #dj-remix-table td,
.Related-version-table .remix-title-text,
.Related-version-table .remixer-link,
.single-remix-system #dj-remix-table td,
.single-remix-system .remix-title-text,
.single-remix-system .remixer-link {
    color: var(--bl-table-td) !important;
}

.Related-version-table .remix-title-main,
.single-remix-system .remix-title-main {
    color: var(--bl-table-title) !important;
}

/* ---------- Hover fila ---------- */

.remix-grid-wrapper .remix-row:hover,
.dj-container #dj-remix-table tbody tr.remix-row:hover,
.Related-version-table #dj-remix-table .remix-row:hover {
    background: var(--bl-table-hover) !important;
}

.dj-container #dj-remix-table tr:hover .remix-title-artist,
.dj-container #dj-remix-table .remix-row.now-playing .remix-title-artist,
.Related-version-table #dj-remix-table tr:hover .remix-title-artist {
    color: var(--bl-table-artist) !important;
}

/* ---------- Now playing ---------- */

.remix-grid-wrapper .remix-row.now-playing,
.dj-container #dj-remix-table .remix-row.now-playing,
.Related-version-table #dj-remix-table .remix-row.now-playing,
.single-remix-system .remix-row.now-playing {
    background: var(--bl-table-active-bg) !important;
    box-shadow: none !important;
}

.remix-grid-wrapper .remix-row.now-playing td:first-child,
.dj-container #dj-remix-table .remix-row.now-playing td:first-child,
.Related-version-table #dj-remix-table .remix-row.now-playing td:first-child,
.single-remix-system .remix-row.now-playing td:first-child {
    box-shadow: inset 3px 0 0 var(--bl-table-active-bar) !important;
}

/* Perfil DJ (tabla numerada Apple): sin barra roja lateral */
.bl-dj-catalog #dj-remix-table .remix-row.now-playing td:first-child,
.bl-dj-catalog.dj-container #dj-remix-table .remix-row.now-playing td:first-child,
.bl-dj-catalog .bl-mixes-row.now-playing td:first-child {
    box-shadow: none !important;
    border-left: 0 !important;
}

.remix-grid-wrapper .remix-row.now-playing td,
.remix-grid-wrapper .remix-row.now-playing .remix-title-main,
.remix-grid-wrapper .remix-row.now-playing .remix-title-artist,
.dj-container #dj-remix-table .remix-row.now-playing td,
.dj-container #dj-remix-table .remix-row.now-playing .remix-title-main,
.dj-container #dj-remix-table .remix-row.now-playing .remix-title-artist,
.Related-version-table #dj-remix-table .remix-row.now-playing td,
.Related-version-table #dj-remix-table .remix-row.now-playing .remix-title-text,
.Related-version-table .remix-row.now-playing .remix-title-main,
.Related-version-table .remix-row.now-playing .remix-title-artist,
.single-remix-system .remix-row.now-playing td,
.single-remix-system .remix-row.now-playing .remix-title-text {
    color: var(--bl-table-td) !important;
}

.remix-grid-wrapper .remix-row.now-playing .remix-title-main,
.dj-container #dj-remix-table .remix-row.now-playing .remix-title-main,
.Related-version-table .remix-row.now-playing .remix-title-main {
    color: var(--bl-table-title) !important;
}

[data-theme="light"] .cell-version-highlight,
[data-theme="light"] .remix-grid-wrapper .remix-row.now-playing .cell-version-highlight,
[data-theme="light"] .dj-container #dj-remix-table .remix-row.now-playing .cell-version-highlight,
[data-theme="light"] .Related-version-table .remix-row.now-playing .cell-version-highlight {
    color: var(--bl-table-title) !important;
}

/* ---------- Título sección ---------- */

.remix-grid-wrapper .remix-table-title,
.dj-container .remix-table-title {
    color: var(--bl-table-title) !important;
}

.remix-grid-wrapper .remix-table-title::after {
    background: var(--bl-table-th) !important;
}

/* ---------- Paginación ---------- */

.remix-grid-wrapper .page-num,
.remix-grid-wrapper .pagination-arrow,
.dj-container .pagination-wrapper .page-num,
.dj-container .pagination-wrapper .prev-arrow,
.dj-container .pagination-wrapper .next-arrow,
.Related-version-table .single-pag-btn {
    color: var(--bl-pag-text) !important;
    background: var(--bl-pag-bg) !important;
    border-color: var(--bl-pag-border) !important;
}

.remix-grid-wrapper .page-num:hover,
.remix-grid-wrapper .pagination-arrow:hover:not(:disabled),
.dj-container .pagination-wrapper .page-num:hover,
.dj-container .pagination-wrapper .prev-arrow:hover,
.dj-container .pagination-wrapper .next-arrow:hover,
.Related-version-table .single-pag-btn:hover:not(:disabled) {
    color: var(--bl-pag-hover-text) !important;
    background: var(--bl-pag-hover-bg) !important;
    border-color: var(--bl-pag-hover-border) !important;
}

.remix-grid-wrapper .page-num.active,
.dj-container .pagination-wrapper .page-num.active,
.Related-version-table .single-pag-btn.active {
    color: var(--bl-pag-active-text) !important;
    background: var(--bl-pag-active-bg) !important;
    border-color: var(--bl-pag-active-border) !important;
}

.dj-container .bl-control-info {
    color: var(--bl-table-th) !important;
}

.dj-container .dj-pagination {
    border-top-color: var(--bl-table-divider) !important;
}

.remix-grid-wrapper .no-results {
    color: var(--bl-table-td) !important;
}

/* ---------- Filtros ---------- */

.remix-grid-wrapper .reset-btn,
.Related-version-table #single-version-reset {
    color: var(--bl-table-td) !important;
    border-color: var(--bl-pag-border) !important;
    background: var(--bl-pag-bg) !important;
}

.remix-grid-wrapper .reset-btn:hover,
.remix-grid-wrapper .reset-btn:focus-visible,
.Related-version-table #single-version-reset:hover {
    color: var(--bl-pag-hover-text) !important;
    background: var(--bl-pag-hover-bg) !important;
    border-color: var(--bl-pag-hover-border) !important;
}

.remix-grid-wrapper .remix-search-count {
    color: var(--bl-table-td) !important;
    border-color: var(--bl-table-divider) !important;
    background: var(--bl-pag-bg) !important;
}

/* ---------- Botones compra ---------- */

.remix-grid-wrapper .purchase-cell .edd-add-to-cart,
.remix-grid-wrapper .purchase-cell .edd_go_to_checkout,
.remix-grid-wrapper .purchase-cell .edd-submit,
.dj-container .dj-purchase-cell .edd-add-to-cart,
.dj-container .dj-purchase-cell .edd_go_to_checkout,
.dj-container .dj-purchase-cell .edd-submit,
.Related-version-table #dj-remix-table td:last-child .edd-add-to-cart,
.Related-version-table #dj-remix-table td:last-child .edd_go_to_checkout,
.Related-version-table #dj-remix-table td:last-child .edd-submit {
    color: var(--bl-buy-text) !important;
    background: var(--bl-buy-bg) !important;
    border-color: var(--bl-buy-border) !important;
}

.remix-grid-wrapper .purchase-cell .edd-add-to-cart:hover,
.remix-grid-wrapper .purchase-cell .edd_go_to_checkout:hover,
.remix-grid-wrapper .purchase-cell .edd-submit:hover,
.dj-container .dj-purchase-cell .edd-add-to-cart:hover,
.dj-container .dj-purchase-cell .edd_go_to_checkout:hover,
.dj-container .dj-purchase-cell .edd-submit:hover,
.Related-version-table #dj-remix-table td:last-child .edd-add-to-cart:hover,
.Related-version-table #dj-remix-table td:last-child .edd_go_to_checkout:hover,
.Related-version-table #dj-remix-table td:last-child .edd-submit:hover {
    color: var(--bl-buy-hover-text) !important;
    background: var(--bl-buy-hover-bg) !important;
    border-color: var(--bl-buy-hover-border) !important;
}

.remix-grid-wrapper .purchase-cell .edd-cart-added-alert,
.dj-container .dj-purchase-cell .edd-cart-added-alert,
.Related-version-table #dj-remix-table td:last-child .edd-cart-added-alert {
    color: var(--bl-table-artist) !important;
}

/* ---------- Tabla DJ — color base ---------- */

.dj-container #dj-remix-table {
    color: var(--bl-table-td) !important;
}

/* ---------- Filtros búsqueda en tablas ---------- */

.remix-grid-wrapper .remix-search,
.remix-grid-wrapper .remix-select,
.Related-version-table #single-version-search {
    color: var(--bl-input-text) !important;
    background: var(--bl-input-bg) !important;
    border-color: var(--bl-input-border) !important;
}

.remix-grid-wrapper .remix-search::placeholder,
.Related-version-table #single-version-search::placeholder {
    color: var(--bl-input-placeholder) !important;
}

.remix-grid-wrapper .remix-search:focus,
.remix-grid-wrapper .remix-select:focus,
.Related-version-table #single-version-search:focus {
    border-color: var(--bl-border-strong) !important;
    background: var(--bl-input-bg) !important;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.04) !important;
}

[data-theme="dark"] .remix-grid-wrapper .remix-search:focus,
[data-theme="dark"] .remix-grid-wrapper .remix-select:focus {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.05) !important;
}

.Related-version-table .single-pag-ellipsis {
    color: var(--bl-pag-text) !important;
    background: transparent !important;
    border-color: transparent !important;
}

.dj-container .dj-purchase-cell .bl-dj-purchase-button {
    color: var(--bl-buy-text) !important;
    background: var(--bl-buy-bg) !important;
    border-color: var(--bl-buy-border) !important;
}

.dj-container .dj-purchase-cell .bl-dj-purchase-button:hover {
    color: var(--bl-buy-hover-text) !important;
    background: var(--bl-buy-hover-bg) !important;
    border-color: var(--bl-buy-hover-border) !important;
}

/* Anula barra blanca now-playing en single remix (modo claro) */
[data-theme="light"] .single-remix-system .remix-row.now-playing,
[data-theme="light"] .Related-version-table .remix-row.now-playing {
    box-shadow: none !important;
}

[data-theme="light"] .single-remix-system .remix-row.now-playing td:first-child,
[data-theme="light"] .Related-version-table .remix-row.now-playing td:first-child {
    box-shadow: inset 3px 0 0 var(--bl-table-active-bar) !important;
}

[data-theme="light"] .bl-dj-catalog #dj-remix-table .remix-row.now-playing td:first-child,
[data-theme="light"] .bl-dj-catalog.dj-container #dj-remix-table .remix-row.now-playing td:first-child {
    box-shadow: none !important;
}

/* ==========================================================================
   TIPOGRAFÍA GLOBAL TABLAS — Inter (tokens --bl-table-*)
   ========================================================================== */

.remix-grid-wrapper .remix-table th,
.dj-container #dj-remix-table th,
.Related-version-table #dj-remix-table th,
.single-remix-system #dj-remix-table th {
    font-family: var(--bl-font) !important;
    font-size: var(--bl-table-th-size) !important;
    font-weight: var(--bl-table-th-weight) !important;
    line-height: var(--bl-table-th-lh) !important;
    letter-spacing: 0.06em !important;
}

.remix-grid-wrapper .remix-table td,
.dj-container #dj-remix-table td,
.Related-version-table #dj-remix-table td,
.single-remix-system #dj-remix-table td {
    font-family: var(--bl-font) !important;
    font-size: var(--bl-table-cell-size) !important;
    font-weight: var(--bl-table-cell-weight) !important;
    line-height: var(--bl-table-cell-lh) !important;
}

.remix-grid-wrapper .remix-title-main,
.remix-grid-wrapper .remix-title-link,
.dj-container #dj-remix-table .remix-title-main,
.dj-container #dj-remix-table .remix-title-link,
.Related-version-table .remix-title-main,
.Related-version-table .remix-title-link,
.single-remix-system .remix-title-main {
    font-family: var(--bl-font) !important;
    font-size: var(--bl-table-title-size) !important;
    font-weight: var(--bl-table-title-weight) !important;
    line-height: var(--bl-table-title-lh) !important;
    color: var(--bl-table-title) !important;
}

.remix-grid-wrapper .remix-title-artist,
.dj-container #dj-remix-table .remix-title-artist,
.Related-version-table .remix-title-artist,
.single-remix-system .remix-title-artist,
.bl-search-result__artist {
    font-family: var(--bl-font) !important;
    font-size: var(--bl-table-artist-size) !important;
    font-weight: var(--bl-table-artist-weight) !important;
    line-height: var(--bl-table-artist-lh) !important;
    color: var(--bl-table-artist) !important;
}

/* Home "Nuevos Remix" — tipografía Apple Music (no tokens de tabla) */
.bl-home-featured .bl-home-featured-item__title,
.bl-home-featured .bl-search-result__title {
    font-family: var(--bl-font) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 18px !important;
    color: var(--bl-system-primary, hsla(0, 0%, 100%, 0.92)) !important;
}

.bl-home-featured .bl-home-featured-item__artist,
.bl-home-featured .bl-search-result__artist {
    font-family: var(--bl-font) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 16px !important;
    color: var(--bl-system-secondary, hsla(0, 0%, 100%, 0.64)) !important;
}

[data-theme="light"] .bl-home-featured .bl-home-featured-item__title,
[data-theme="light"] .bl-home-featured .bl-search-result__title {
    color: var(--bl-system-primary, rgba(0, 0, 0, 0.88)) !important;
}

[data-theme="light"] .bl-home-featured .bl-home-featured-item__artist,
[data-theme="light"] .bl-home-featured .bl-search-result__artist {
    color: var(--bl-system-secondary, rgba(0, 0, 0, 0.56)) !important;
}

.remix-grid-wrapper .remixer-link,
.dj-container #dj-remix-table .remixer-link,
.Related-version-table .remixer-link,
.single-remix-system .remixer-link {
    font-size: var(--bl-table-cell-size) !important;
    font-weight: var(--bl-table-cell-weight) !important;
    line-height: var(--bl-table-cell-lh) !important;
}

.remix-grid-wrapper .cell-version-highlight,
.dj-container #dj-remix-table .cell-version-highlight,
.Related-version-table .cell-version-highlight,
.single-remix-system .cell-version-highlight {
    font-size: var(--bl-table-cell-size) !important;
    font-weight: var(--bl-table-cell-weight) !important;
    line-height: var(--bl-table-cell-lh) !important;
}

/* ==========================================================================
   CARÁTULAS / PLAY — unificado en todo el sitio
   ========================================================================== */

.dj-preview-container,
.dj-container .dj-preview-container,
.single-remix-system .dj-preview-container,
.remix-grid-wrapper .dj-preview-container,
.Related-version-table .dj-preview-container {
    width: var(--bl-art-size) !important;
    height: var(--bl-art-size) !important;
    min-width: var(--bl-art-size) !important;
    min-height: var(--bl-art-size) !important;
    border-radius: var(--bl-art-radius) !important;
    background: var(--bl-art-bg) !important;
    border: 1px solid var(--bl-border-strong) !important;
    box-shadow: var(--bl-art-shadow) !important;
    overflow: hidden !important;
}

.dj-album-art,
.dj-album-art-placeholder,
.bl-global-search .bl-search-result .bl-mixes-row__art,
.bl-global-search .bl-search-result .bl-mixes-row__art--placeholder,
.bl-search-result__play .dj-album-art,
.bl-search-result__play .dj-album-art-placeholder,
.remix-grid-wrapper .dj-album-art,
.remix-grid-wrapper .dj-album-art-placeholder,
.dj-container .dj-album-art,
.dj-container .dj-album-art-placeholder,
.single-remix-system .dj-album-art,
.single-remix-system .dj-album-art-placeholder,
.Related-version-table .dj-album-art,
.Related-version-table .dj-album-art-placeholder {
    border-radius: var(--bl-art-radius) !important;
    background: var(--bl-art-bg) !important;
}

[data-theme="light"] .dj-preview-container,
[data-theme="light"] .bl-search-result__play,
[data-theme="light"] .dj-container .dj-preview-container,
[data-theme="light"] .single-remix-system .dj-preview-container,
[data-theme="light"] .remix-grid-wrapper .dj-preview-container,
[data-theme="light"] .Related-version-table .dj-preview-container,
[data-theme="light"] .dj-album-art-placeholder,
[data-theme="light"] .dj-album-art,
[data-theme="light"] .dj-avatar-interactive,
[data-theme="light"] .avatar-placeholder-single {
    background: rgb(4 4 4 / 60%) !important;
}

[data-theme="light"] .bl-global-search .bl-search-result .bl-mixes-row__play,
[data-theme="light"] .bl-global-search .bl-search-result .bl-mixes-row__art,
[data-theme="light"] .bl-global-search .bl-search-result .bl-mixes-row__art--placeholder {
    --bl-featured-photo-bg: #e6e6ea;
    background: var(--bl-featured-photo-bg, #e6e6ea) !important;
}

[data-theme="light"] .player-cover-link,
[data-theme="light"] .player-cover,
[data-theme="light"] .player-cover-fallback {
    background: #e6e6ea !important;
    box-shadow: none !important;
    border: none !important;
}

[data-theme="light"] .bl-search-result__play .dj-album-art,
[data-theme="light"] .remix-grid-wrapper .dj-album-art,
[data-theme="light"] .dj-container .dj-album-art,
[data-theme="light"] .single-remix-system .dj-album-art {
    background: rgb(4 4 4 / 60%) !important;
}

/* Hover play — sin fondo claro que rompa la carátula */
.dj-preview-container:hover,
.dj-preview-container:focus-visible,
.remix-grid-wrapper .dj-preview-container:hover,
.dj-container .dj-preview-container:hover,
.single-remix-system .dj-preview-container:hover,
.Related-version-table .dj-preview-container:hover {
    background: var(--bl-art-bg) !important;
}

[data-theme="light"] .dj-preview-container:hover,
[data-theme="light"] .dj-preview-container:focus-visible {
    background: rgb(4 4 4 / 60%) !important;
}
