/* --- Integrated Game List --- */
#gameList { 
    display: flex; 
    flex-direction: column; 
    gap: 10px; 
}

.game-item {
    display: flex; 
    align-items: center; 
    justify-content: space-between;
    padding: 12px 20px;
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    transition: 0.2s ease;
    text-decoration: none;
    /* Keeps favorites at the top if using the 'is-fav' class */
    order: 2; 
}

.game-item:hover {
    background: var(--glass-highlight);
    border-color: var(--accent-cyan);
    transform: translateX(8px);
}

/* Fixes the logic for favorited games */
.game-item.is-fav { 
    order: 1; 
    border-color: var(--accent-pink); 
    background: rgba(255, 0, 127, 0.02); 
}

/* Link wrapper inside the item */
.game-link { 
    display: flex; 
    align-items: center; 
    gap: 15px; 
    flex: 1; 
    color: inherit; 
    text-decoration: none;
}

/* The Emoji/Icon Box */
.game-icon {
    width: 38px; 
    height: 38px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    display: flex; 
    align-items: center; 
    justify-content: center;
    font-size: 1.2rem;
    transition: transform 0.2s;
}

.game-item:hover .game-icon { 
    transform: scale(1.1); 
}

/* The Game Title */
.game-title { 
    color: var(--text-main); 
    font-size: 1rem; 
    font-weight: 700; /* Locked at 700 */
}

/* The Favorite Button (Star) */
.fav-btn {
    background: none; 
    border: none; 
    color: var(--text-dim) !important;
    cursor: pointer; 
    font-size: 1.4rem; 
    transition: 0.2s;
    padding: 5px; 
    line-height: 1;
}

.fav-btn:hover { 
    transform: scale(1.2); 
    color: white !important; 
}

.fav-btn.active { 
    color: var(--accent-pink) !important; 
    text-shadow: 0 0 10px var(--accent-pink); 
}