body {
    background-color: #121212 !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

#player-bar {
    backdrop-filter: blur(10px);
    background-color: rgba(18, 18, 18, 0.95) !important;
    z-index: 1050;
}

.card {
    background-color: #181818;
    border: none;
    transition: transform 0.2s ease-in-out;
}

.card:hover {
    transform: translateY(-5px);
    background-color: #222222;
}

.card-title, .card-text {
    color: #ffffff;
}
/* Corrección de contraste para los selects y inputs en modo oscuro */
select.form-select, input.form-control, textarea.form-control {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
    border: 1px solid #444444 !important;
}

select.form-select option {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
    padding: 10px;
}

/* Placeholder visible */
::placeholder {
    color: #999999 !important;
    opacity: 1;
}

/* --- Corrección Global de Contraste y Legibilidad --- */

/* Forzar que los textos secundarios (text-muted) sean de un gris claro legible */
.text-muted {
    color: #b0b3b8 !important;
}

/* Mejorar el contraste en los textos secundarios de las tarjetas y contenedores */
p.text-secondary, small.text-secondary, .card small {
    color: #c9d1d9 !important;
}

/* Asegurar que los placeholders en los inputs sean visibles */
::placeholder {
    color: #8c959f !important;
    opacity: 1 !important;
}

/* Mejorar la legibilidad de los textos descriptivos generales */
body {
    color: #f0f6fc;
}