body { background:#111; color:white; padding-bottom:150px; }
.song-item { cursor:pointer; padding:10px; }
.song-item:hover { background:#222; }

.in-queue { background:rgba(255,140,0,0.25) !important; }
.played { background:rgba(0,200,0,0.25) !important; }

.player-desktop { position:sticky; top:20px; }

.player-mobile {
    width: 100%;
    background: #000;
    padding: 10px;
    border-top: 1px solid #333;
    z-index: 9999;
    transition: all 0.4s ease;
}

.player-mobile.fixed-bottom {
    position: fixed;
    bottom: 0;
    margin-bottom: 50px;
}
.player-mobile.static-top {
    position: relative;
    top: 50;
}

.queue-item {
    display:flex;
    align-items:center;
    padding:8px;
    user-select: none;
}

.drag-handle {
    cursor: grab;
    color: #aaa;
    margin-right: 10px;
    font-size: 18px;
    touch-action: none;
}
.drag-handle:active { cursor: grabbing; }

.queue-item span.title { flex-grow: 1; cursor:pointer; }

.btn-success, .btn-success:hover, .btn-danger, .btn-danger:hover { background:#FFF; }

.now-playing {
    background: #000;
    border: 1px solid #333;
    padding: 6px 10px;
    overflow: hidden;
    white-space: nowrap;
}

.scrolling-text span {
    display:inline-block;
    padding-left:100%;
    animation: scrollText 12s linear infinite;
    color: #ffa500;
    font-weight:bold;
}

#libraryContainer {
    transition: max-height 0.4s ease, opacity 0.4s ease;
    overflow: hidden;
}

#mobileQueueBox {
    display: none;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* scroll fluido iPhone */
    transition: height 0.3s ease; /* transizione fluida */
}

#queueDesktop { max-height: 300px; overflow-y:auto; }

.toastMessage {
    position:fixed; 
    top:50%; 
    margin-left: 15%; 
    width: 70%; 
    text-align: center;
    background:green; 
    color:#F; 
    padding:10px 20px; 
    border-radius:5px;
    display:none;
    z-index:10000; 
    font-weight:bold; 
    opacity:0;
    transition:opacity 0.4s;
}

.mobile-nav{
    position: fixed;
    bottom:0;
    width:100%;
    height:60px;
    background:#000;
    border-top:1px solid #333;
    display:flex;
    justify-content:space-around;
    align-items:center;
    z-index:9998;
}

.mobile-nav button{
    background:none;
    border:none;
    color:#ccc;
    display:flex;
    flex-direction:column;
    align-items:center;
    font-size:12px;
}

.mobile-nav i{
    font-size:22px;
}

.mobile-nav button:hover{
    color:#ffa500;
}

@keyframes scrollText {
    0% { transform: translateX(0%); }
    100% { transform: translateX(-100%); }
}

@media (max-width:768px){ .player-desktop{display:none;} }
@media (min-width:769px){ .player-mobile{display:none;} }

.current-song{
    background:rgba(255,165,0,0.35) !important;
}

.in-queue{
    background:rgba(255,140,0,0.35) !important;
}

#searchResults .song-item{
    border-bottom:1px solid #333;
    padding:10px;
    cursor:pointer;
}

#searchResults .song-item:hover{
    background:#222;
}