/* ---------- Selector de país (topbar) ---------- */
.rl-pais-switch { flex-shrink: 0; }
.rl-pais-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 10px; font-weight: 600; }
.rl-pais-menu { width: min(560px, 92vw); padding: 8px; border-radius: 14px; border-color: var(--rl-border); background: var(--rl-surface); }
.rl-pais-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 2px; }
.rl-pais-grid .dropdown-item, .rl-pais-menu > .dropdown-item { display: flex; align-items: center; gap: 8px; border-radius: 8px; padding: 7px 10px; font-size: .92rem; }
.rl-pais-menu .dropdown-item.active, .rl-pais-menu .dropdown-item:active { background: rgba(var(--bs-primary-rgb), .12); color: var(--bs-primary); }
.rl-side-pais { display: flex; align-items: center; gap: 12px; padding: 10px 12px; margin-bottom: 8px; border-radius: 12px; background: rgba(var(--bs-primary-rgb), .08); color: var(--bs-body-color); text-decoration: none; }
.rl-side-pais.active { background: rgba(var(--bs-primary-rgb), .14); }
.rl-side-pais span { display: flex; flex-direction: column; line-height: 1.2; }
.rl-side-pais small { color: var(--rl-muted); font-size: .75rem; }
.rl-flag-xl { width: 64px; height: 48px; border-radius: 8px; }
.rl-hero-pais { display: flex; align-items: center; gap: 22px; padding: 22px 26px; border-radius: 18px; background: var(--rl-surface); border: 1px solid var(--rl-border); margin-bottom: 8px; }
.rl-hero-pais .rl-chips { margin-bottom: 0; }
@media (max-width: 767.98px) { .rl-hero-pais { flex-direction: column; align-items: flex-start; gap: 12px; padding: 16px; } }
.rl-sidebar { top: 66px; max-height: calc(100vh - 66px - var(--rl-player-h)); }
.rl-pais-sugerido { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 12px 16px; margin-bottom: 16px; border-radius: 12px; background: rgba(var(--bs-primary-rgb), .08); border: 1px solid rgba(var(--bs-primary-rgb), .25); }

/* ---------- Buscador desplegable ---------- */
.rl-search-panel { border-top: 1px solid var(--rl-border); background: var(--rl-surface); padding: 14px 24px 16px; box-shadow: 0 14px 30px rgba(0,0,0,.08); }
.rl-search-panel[hidden] { display: none; }
.rl-search-panel .rl-search { max-width: 900px; }
.rl-search-panel .rl-search input { height: 56px; font-size: 1.1rem; padding-right: 52px; }
.rl-search-close { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; width: 40px; height: 40px; border-radius: 50%; color: var(--rl-muted); }
.rl-search-close:hover { background: rgba(var(--bs-primary-rgb), .1); color: var(--bs-primary); }
.rl-search-hint { max-width: 900px; margin: 8px auto 0; font-size: .82rem; color: var(--rl-muted); }
.rl-suggest { max-width: 900px; margin: 10px auto 0; display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; }
.rl-suggest[hidden] { display: none; }
@media (max-width: 767.98px) { .rl-suggest { grid-template-columns: 1fr; } .rl-search-panel { padding: 10px 14px 14px; } }
.rl-suggest-title { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--rl-muted); margin: 4px 0 6px; }
.rl-suggest-item { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; text-decoration: none; color: var(--bs-body-color); }
.rl-suggest-item:hover { background: rgba(var(--bs-primary-rgb), .08); color: var(--bs-primary); }
.rl-suggest-item img { width: 38px; height: 38px; border-radius: 8px; object-fit: cover; }
.rl-suggest-item small { color: var(--rl-muted); display: block; }
.rl-suggest-all { display: inline-block; margin-top: 8px; font-weight: 700; text-decoration: none; }

/* ---------- Filtros compactos (explorar) ---------- */
.rl-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 14px; }
.rl-filters .form-select { width: auto; min-width: 170px; border-radius: 10px; font-weight: 600; }
@media (max-width: 767.98px) { .rl-filters .form-select { flex: 1 1 45%; min-width: 0; } }

/* ---------- Topbar: nada se parte en dos líneas ---------- */
.rl-header-row { flex-wrap: nowrap; }
.rl-nav a, .rl-header-actions .btn, .rl-pais-btn { white-space: nowrap; }
.rl-nav { gap: 2px; min-width: 0; overflow: hidden; }
.rl-nav a { padding: 8px 10px; }
.rl-header-actions { gap: 6px; flex-shrink: 0; }
.rl-brand-text { white-space: nowrap; }
@media (max-width: 1399.98px) { .rl-brand-text { font-size: 1.25rem; } .rl-nav a { font-size: .92rem; padding: 8px 8px; } }
@media (max-width: 1199.98px) {
  .rl-btn-add, .rl-btn-login { width: 40px; height: 40px; padding: 0; justify-content: center; border-radius: 50%; }
  .rl-pais-btn { padding: 6px 10px; }
  .rl-avatar-btn { padding: 4px; }
}
@media (max-width: 991.98px) { .rl-brand-text { display: none; } }

/* ---------- Portada de país compacta ---------- */
.rl-hero-compact { padding: 16px 20px; gap: 16px; margin-bottom: 4px; }
.rl-hero-compact h1 { font-size: 1.6rem; margin-bottom: 2px; }
.rl-hero-compact .rl-flag-xl { width: 54px; height: 40px; }
.rl-scroll-chips { display: flex; gap: 8px; overflow-x: auto; padding: 4px 0 8px; margin-bottom: 4px; scrollbar-width: none; }
.rl-scroll-chips::-webkit-scrollbar { display: none; }
.rl-scroll-chips .rl-chip { flex-shrink: 0; }