/* styles.css */

/* Fondo oscuro tipo Spotify */
body{
    background:#071021;
    color:#E6EEF8;
}

/* Navbar permanece igual */
.navbar-brand{font-weight:700}

/* Cards más claras y legibles */
.card{
    background:#ffffff !important;
    color:#071021 !important;
    border-radius:10px;
    border:0;
}

/* Botón verde Spotify */
.btn-primary{
    background:#1db954;
    border-color:#1db954;
}
.btn-primary:hover{
    background:#1ed760;
}

/* Botón play amarillo */
.btn-play{
    background:#ffca28;
    color:#000;
}

/* Items de lista */
.list-group-item{
    background:#ffffff !important;
    color:#071021 !important;
    border:1px solid #ddd;
}

/* Texto secundario */
.small.text-muted{
    color:rgba(230,238,248,0.6);
}

/* Fondo plateado brilloso tipo metal */
.sidebar,
.menu-vertical,
#sidebar,
.nav.flex-column,
.offcanvas,
.offcanvas-body {
    background: linear-gradient(135deg, #d9d9d9, #f2f2f2, #bfbfbf) !important;
    color:#1a1a1a !important;
    border-right: 1px solid #c6c6c6;
}

/* Links dentro */
.sidebar a,
.menu-vertical a,
#sidebar a,
.nav.flex-column .nav-link {
    color:#1a1a1a !important;
    font-weight: 500;
}

/* Hover metal pulido */
.sidebar a:hover,
.menu-vertical a:hover,
#sidebar a:hover,
.nav.flex-column .nav-link:hover {
    background: linear-gradient(135deg, #ececec, #ffffff, #d4d4d4) !important;
    color:#000 !important;
    border-radius: 5px;
}

/* Navbar estilo plateado brilloso */
.navbar {
    background: linear-gradient(135deg, #d9d9d9, #f2f2f2, #c4c4c4) !important;
    border-bottom: 1px solid #b1b1b1;
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar .btn {
    color:#1a1a1a !important;
}

.navbar .btn-outline-light {
    border-color:#4d4d4d !important;
    color:#1a1a1a !important;
}

.navbar .btn-outline-light:hover {
    background:#ffffff !important;
    color:#000 !important;
    border-color:#000 !important;
}